redux-register-module
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.6 • Public • Published

    redux-register-module

    Installation

    yarn install redux-register-module
    

    See https://www.npmjs.com/package/redux-register-module

    Usage

    If you try to split your code in different modules who handle their own reducer, own action and own components, you need to add your reducer, your saga handler in the app.

    |- src
    |  - modules
    |    - my-module1
    |      - components
    |      - actions.js
    |      - reducer.js
    |      - saga.js
    |      - ...
    |    - my-module2
    |      - components
    |      - actions.js
    |      - reducer.js
    |      - saga.js
    |      - ...
    |  - store.js
    |  - reducers.js
    |  - ...
    

    This package allows you to register reducer and saga handler from your module. With this, your module stay a standalone package.

    Examples

    Reducer

    Basic implementation for a reducer registered from your module, and injected in your store automatically node_modules/mymodule/reducer.js

    import { registerModuleReducer } from 'redux-register-module';
     
    const initialState = {
      list: [],
    };
     
    const reducer = (state = initialState, action) => {
      switch (action.type) {
        default:
          return state;
      }
    };
     
    export default () => registerModuleReducer('myModule', reducer);

    src/reducers.js

    import { combineReducers } from 'redux';
     
    import { getModuleReducerKey, getReducers } from 'redux-register-module';
    import initMyModule from 'mymodule/reducer';
     
    initMyModule();
     
    // getModuleReducerKey will return the name of where your store module reducers. By default, it will be 'module', you can change it via setModuleReducerKey('myKey')
    const rootReducer = combineReducers({
      [getModuleReducerKey()]: combineReducers(getReducers()),
    });

    If you want to read data, you can use the function getModuleState as follow:

    import { getModuleState } from 'redux-register-module';
     
    const mapStateToProps = state => ({
      list: getModuleState('myModule', state).list,
      total: getModuleState('myModule', state).total,
      otherModuleList: getModuleState('otherModule', state).list,
    });

    Of course, if you prefer use reselect, do it:

    const myModuleSelector = state => getModuleState('myModule', state).list;
    const otherModuleSelector = state => getModuleState('otherModule', state).list;
     
    export const mySelector = createSelector(
      myModuleSelector,
      otherModuleSelector,
      (list1, list2) => (
        ...
      )
    );

    Saga

    Basic implementation for a saga registered from your module, and injected in your middleware node_modules/mymodule/saga.js

    import { registerModuleSaga } from 'redux-register-module';
     
    const saga = function* saga() {
      yield takeLatest('GET_LIST', function*() {});
    };
     
    registerModuleSaga(saga);

    Changelog

    1.0.5

    • Use native types of redux and redux-saga.

    1.0.1 to 1.0.4

    • Fix various bug on TypeScript.

    1.0.0

    • redux-register-module is typed with TypeScript.
    • getModuleState is not curried anymore to preserve type, this is a breaking change.

    Install

    npm i redux-register-module

    DownloadsWeekly Downloads

    610

    Version

    1.0.6

    License

    MIT

    Unpacked Size

    14.5 kB

    Total Files

    9

    Last publish

    Collaborators

    • birdy