@everymatrix/ufe-core

EM-CORE

This is the core component which handles most of the bootstrap actions needed for the app to run. It's main roles are:

• Initializing websockets connection through autobahn
• Initializing store and registering reducers, which can be passed in an array at init step or added dynamically at runtime
• Initializing auth module

Registering reducers

Reducers are registered when core initializes through coreInit method that accepts an array of reducers as argument. The reducerList is extended first with all reducers existent in core and with the router reducers.

The main idea is that the core has no way of knowing what modules are installed for each project and they have to be passed at coreInit. Another important thing to notice is that in order the newly added reducers to work properly a bit of configuration is necessary.

• Necessary configs:

When creating a new store the module has to have a public constant named STORE_ID which is identical with the reducer export function name like so:

export const userConst = {
    STORE_ID: 'user',
};
export function user(state = defaultState, action = []) {}

The reason for this is that the combineReducers method registers the corespondent reducer with the function name and when connected to a component through connect method in order to access values on the store.

Another important thing to note is that each em-module needs to export each own reducers in order to be included easily through core init method. So in each entry point for every module we need to have something like so:

import user from './store/user-store';
import register from './store/register-store';
import deposit from './store/deposit-store';
const userReducers = {
    user,
    register,
    deposit,
};
export userReducers;

And then in src we will have a module that imports all reducers from em-* installed modules like so:

import { userReducers } from 'em-user';
import { casinoReducers } from 'em-casino';

const reducersList = {
    ...userReducers,
    ...casinoReducers,
};

export default reducersList;

The reducers list will be used when calling coreInit method like so:

import { reducersList } from './config';
coreInit(reducersList);

** Important Note:** em-core exposes an addReducer method that makes possible to add new reducers on the fly when necessary. However it is best to restrict the use of this method as much as possible for performance/ stability/ maintenance reasons.