React_on_rails: Uncaught TypeError: storeGenerator is not a function

Created on 4 Nov 2016  路  3Comments  路  Source: shakacode/react_on_rails

I'm trying to register a redux store with ReactOnRails. I'm getting a console error of Uncaught TypeError: storeGenerator is not a function in clientStartup.js. The relevant lines of that file are

function initializeStore(el, railsContext) { var name = el.getAttribute('data-store-name'); var props = JSON.parse(el.getAttribute('data-props')); var storeGenerator = ReactOnRails.getStoreGenerator(name); var store = storeGenerator(props, railsContext); ReactOnRails.setStore(name, store); }

Here's my store.js:

````
import ReactOnRails from 'react-on-rails';
import { combineReducers, compose, createStore, applyMiddleware } from 'redux';
import { reduxReactRouter, routerStateReducer } from 'redux-router';
import { createHistory } from 'history';
import thunk from 'redux-thunk';
import { apiMiddleware } from 'redux-api-middleware';
import { loadingBarMiddleware, loadingBarReducer } from 'react-redux-loading-bar'
import requisitions from 'reducers/requisitions/requisitions';
import routes from 'routes/routes';

const reducer = combineReducers({
router: routerStateReducer,
requisitions,
});

const store = compose(
applyMiddleware(thunk,
apiMiddleware,
loadingBarMiddleware({
promiseTypeSuffixes: ['REQUEST', 'SUCCESS', 'FAILURE'],
})),
reduxReactRouter({
routes,
loadingBar: loadingBarReducer,
createHistory,
})
)(createStore)(reducer);

ReactOnRails.registerStore({ 'appStore': store });

const getStore = () => ReactOnRails.getStore('appStore');
export default getStore;
````

My controller:

````
before_action :setup_redux_store

def setup_redux_store
  redux_store('appStore', props: {})
end

````

At the bottom of the layout slim file

= redux_store_hydration_data

A sample component using the store

````
import React from 'react';
import { Provider } from 'react-redux';
import LoadingBar from 'react-redux-loading-bar';
import getStore from 'store';

const LoadingBarProvided = () => (


);

export default LoadingBarProvided;
````

And my entry point:

````
import 'babel-polyfill';
import ReactOnRails from 'react-on-rails';
import LoadingBar from 'containers/LoadingBar/LoadingBar';

require('es6-promise').polyfill();

ReactOnRails.register({ LoadingBar });
````

Any idea what could be causing this error?

Most helpful comment

In case anybody had the same problem, the gist of it is: ReactOnRails.registerStore() expects the value in the passed object to be a function that returns a store, not the store itself.

All 3 comments

If it helps, storeGenerator is an object:

Object {transitionManager: Object, history: Object}

Nvm, needed to change store file to look like this

import ReactOnRails from 'react-on-rails';
import { combineReducers, compose, createStore, applyMiddleware } from 'redux';
import { reduxReactRouter, routerStateReducer } from 'redux-router';
import { createHistory } from 'history';
import thunk from 'redux-thunk';
import { apiMiddleware } from 'redux-api-middleware';
import { loadingBarMiddleware, loadingBarReducer } from 'react-redux-loading-bar'
import requisitions from 'reducers/requisitions/requisitions';
import routes from 'routes/routes';

const reducer = combineReducers({
  router: routerStateReducer,
  loadingBar: loadingBarReducer,
  requisitions,
});

const reactOnRailsStore = (props, railsContext) => {
  props.railsContext = railsContext;

  return compose(
    applyMiddleware(thunk,
      apiMiddleware,
      loadingBarMiddleware({
        promiseTypeSuffixes: ['REQUEST', 'SUCCESS', 'FAILURE'],
      })),
    reduxReactRouter({
      routes,
      createHistory,
    })
  )(createStore)(reducer, props);
};

ReactOnRails.registerStore({ appStore: reactOnRailsStore });

const getStore = () => ReactOnRails.getStore('appStore');
export default getStore;

In case anybody had the same problem, the gist of it is: ReactOnRails.registerStore() expects the value in the passed object to be a function that returns a store, not the store itself.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

robwise picture robwise  路  3Comments

hoenth picture hoenth  路  4Comments

cubadomingo picture cubadomingo  路  6Comments

stereodenis picture stereodenis  路  9Comments

chintanparikh picture chintanparikh  路  5Comments