Dynamic redux reducer injection. Allows you to reduce the size of your bundle by dynamically loading and registering reducers on your Redux store. It is compatible with Redux Toolkit.
Statements | Branches | Functions | Lines |
---|---|---|---|
import { ReducerManager } from "dynux";
import { createStore, Reducer } from "redux";
const someReducer: Reducer = (state = null) => state;
const initialReducers = {
someReducer,
};
const configureStore = () => {
// Optionally initialize with static reducers
const reducerManager = new ReducerManager(initialReducers);
// Create a store with the root reducer
const store = createStore(reducerManager.reduce);
// Bind the store to the manager
reducerManager.bindStore(store);
// Optionally put the reducer manager on the store so it is easily accessible
store.reducerManager = reducerManager;
};
import { ReducerManager } from "dynux";
import { Reducer } from "redux";
import { configureStore } from "@reduxjs/toolkit";
const someReducer: Reducer = (state = null) => state;
const initialReducers = {
someReducer,
};
const configureStore = () => {
// Optionally initialize with static reducers
const reducerManager = new ReducerManager(initialReducers);
// Create a store with the root reducer
const store = configureStore({ reducer: reducerManager.reduce });
// Bind the store to the manager
reducerManager.bindStore(store);
// Optionally put the reducer manager on the store so it is easily accessible
store.reducerManager = reducerManager;
};
The ReducerManager
instance can be bound to your Redux store
for easy access. If you are using TypeScript, include the
dynux/augmentation
file, which extends the store object with
a reducerManager property.
import {} from "dynux/dist/types/augmentation";
import { ReducerManager } from "dynux";
import { setupStore } from "redux";
const reducerManager = new ReducerManager();
const store = setupStore(reducerManager.reduce);
reducerManager.bindStore(store);
// ts should not complain about this
store.reducerManager = reducerManager;
The exported ReducerManager
class optionally accepts static reducers
as a constructor argument. These reducers are always present on your store.
Binds a Redux store to a ReducerManager
instance.
const manager = new ReducerManager();
manager.bindStore(createStore(manager.reduce));
A different store can be rebound at any time, and all active reducers will be registered on the new store.
const newStore = createStore(manager.reduce);
manager.bindStore(newStore);
Returns the reducers that are currently registered on the store.
Checks if a reducer is registered on the store.
manager.hasReducer("reducerKey");
Returns the combined reducers. Pass this to configureStore
or setupStore
.
Asynchronously adds a new reducer to the store. The reducer is identified by a unique key, which helps avoid duplicate reducers and provides a unique identification for each reducer.
manager.add("reducerKey", reducerImpl);
Asynchronously removes a reducer from the store. You would rarely need to use this method unless you have a very large number of dynamic reducers.
manager.remove("reducerKey");