CODEWITHSUNDEEP
javascriptreduxredux-saganext.js
Andrej Lacko
Andrej Lacko

Reputation: 329

Nextjs with redux redux-saga initialize store

js like this

import {createStore, applyMiddleware, combineReducers} from 'redux'
import {composeWithDevTools} from 'redux-devtools-extension'
import withRedux from 'next-redux-wrapper'
import nextReduxSaga from 'next-redux-saga'
import createSagaMiddleware from 'redux-saga'

import {initialState} from './initialState'
import globalSaga from '../sagas/global'

const sagaMiddleware = createSagaMiddleware()

export function configureStore (reducers,initialState) {
  console.log(initialState)

  let states = {}
  Object.keys(reducers).map((key) => {
    states[key] = initialState[key]
  })

  console.log(reducers)
  console.log(states)
  const store = createStore(
    combineReducers({reducers}),
    states,
    composeWithDevTools(applyMiddleware(sagaMiddleware))
  )
  store.sagaTask = sagaMiddleware.run(globalSaga)
  return store
}

export function withReduxSaga (BaseComponent, reducers) {
  return withRedux(configureStore(reducers,initialState))(nextReduxSaga(BaseComponent))
}

export default function configureWithReduxSaga(component,reducers){
  return withReduxSaga(component,reducers)
}

and the error is 

Store does not have a valid reducer. Make sure the argument passed to

makeStore is not a function

What might be wrong, basically I would like to write function that adds reducers and store.global with specific sagas into nextjs component without much code, best would be something like this:

configureWithReduxSaga(
{reducer1, reducer2},
{saga1, saga2}
)

is it possible? I can create root reducer and root saga and pass it to every component, that is not hard to code, but is it performant?

Upvotes: 1

Views: 1584

Answers (1)

Vladislav Ihost
Vladislav Ihost

Reputation: 2187

combineReducers({reducers}),

Most likely that you have dictionary of reducers, but provide them wrapped into redundant object. Use rest spread operator combineReducers({...reducers}) or simple object passing combineReducers(reducers) in that case. See original documentation for it: https://redux.js.org/docs/api/combineReducers.html#arguments

If reducers is array, you should iterate over it and give own name to each reducer.

Upvotes: 1

Related Questions