From 52d0d8e41b1a81e2f2fb3c9f1667826e398ebaf7 Mon Sep 17 00:00:00 2001 From: jero Date: Sat, 21 Sep 2019 22:02:48 +0300 Subject: [PATCH] refactor(store): separate enhancers into its own file import enhancer on configureStore improves #32 --- src/app/store/config/configureStore.js | 23 ++----- src/app/store/config/dynoStore/dynoStore.js | 64 ------------------- src/app/store/config/dynoStore/index.js | 4 -- .../store/config/dynoStore/reduceReducers.js | 13 ---- .../{enhancers/index.js => enhancer.js} | 13 ++-- 5 files changed, 11 insertions(+), 106 deletions(-) delete mode 100644 src/app/store/config/dynoStore/dynoStore.js delete mode 100644 src/app/store/config/dynoStore/index.js delete mode 100644 src/app/store/config/dynoStore/reduceReducers.js rename src/app/store/config/{enhancers/index.js => enhancer.js} (52%) diff --git a/src/app/store/config/configureStore.js b/src/app/store/config/configureStore.js index fe047df5..f23ee4ae 100644 --- a/src/app/store/config/configureStore.js +++ b/src/app/store/config/configureStore.js @@ -1,39 +1,26 @@ // @flow strict -import { createStore, applyMiddleware, compose } from 'redux'; -import type { Dispatch, StoreEnhancer } from 'redux'; +import { createStore } from 'redux'; +import type { Dispatch } from 'redux'; -import type { State } from '@/store/types/State'; import type { Actions } from '@/store/types/Actions'; // import throttle from 'lodash.throttle'; -// Middleware is the suggested way to extend Redux with custom functionality. -import middlewares from '@/store/config/middlewares'; - // import all reducers import reducer from '@/store/reducers'; +import enhancer from '@/store/config/enhancer'; + // import { saveState, loadState } from './storage'; // Get the state from localStorage // const persistedState = loadState(); -/* eslint-disable */ -const devtools = - typeof window !== 'undefined' && - typeof window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ === 'function' && - // eslint-disable-next-line no-underscore-dangle - window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ actionsBlacklist: [] }); - /* eslint-enable */ -// $FlowFixMe -const composeEnhancers: StoreEnhancer> = devtools || compose; - function configureStore() { const store = createStore<{}, Actions, Dispatch>( reducer, // persistedState, - // $FlowFixMe - composeEnhancers(applyMiddleware(...middlewares)), // third parameter is called an 'enhancer' + enhancer, // third parameter is called an 'enhancer' ); /* // Save the state any time the store state changes store.subscribe(throttle(() => { diff --git a/src/app/store/config/dynoStore/dynoStore.js b/src/app/store/config/dynoStore/dynoStore.js deleted file mode 100644 index d3682e96..00000000 --- a/src/app/store/config/dynoStore/dynoStore.js +++ /dev/null @@ -1,64 +0,0 @@ -/* eslint-disable implicit-arrow-linebreak */ -// @flow strict -import { - createStore as createReduxStore, - combineReducers, -} from 'redux'; -import type { Dispatch } from 'redux'; - -// import type { State } from '@/store/types/State'; -import type { Actions } from '@/store/types/Actions'; - -import reduceReducers from './reduceReducers'; - -let store = {}; -const reducerMap = {}; - -// $FlowFixMe -const injectReducers = (_reducerMap): void => { - Object.entries(_reducerMap).forEach(([name, reducer]) => { - if (!reducerMap[name]) { - reducerMap[name] = []; - } - reducerMap[name].push(reducer); - }); -}; - -const createRootReducer = () => ( - // $FlowFixMe - combineReducers(Object.keys(reducerMap).reduce((result, key) => ({ - ...result, - [key]: reduceReducers(reducerMap[key]), - }), {})) -); - -// $FlowFixMe -const createStore = (...args) => { - store = createReduxStore<{}, Actions, Dispatch>(createRootReducer(), ...args); - return store; -}; - -const reloadStore = (): void => { - store.replaceReducer(createRootReducer()); - // store.dispatch({ type: '@@replace-reducer' }); -}; - -export const dynoStore = { - injectReducers, - createRootReducer, - createStore, - reloadStore, -}; - -export const withReloadStore = (importPromise: *): Promise<*> => ( - importPromise - .then((module) => { - dynoStore.reloadStore(); - return module; - }, - (error) => { - throw error; - }) -); - -export default dynoStore; diff --git a/src/app/store/config/dynoStore/index.js b/src/app/store/config/dynoStore/index.js deleted file mode 100644 index 0b39c280..00000000 --- a/src/app/store/config/dynoStore/index.js +++ /dev/null @@ -1,4 +0,0 @@ -// @flow strict - -// eslint-disable-next-line import/prefer-default-export -export { default as dynoStore } from './dynoStore'; diff --git a/src/app/store/config/dynoStore/reduceReducers.js b/src/app/store/config/dynoStore/reduceReducers.js deleted file mode 100644 index 7b1eea9b..00000000 --- a/src/app/store/config/dynoStore/reduceReducers.js +++ /dev/null @@ -1,13 +0,0 @@ -// @flow strict -import type { State } from '@/store/types/State'; -import type { Actions } from '@/store/types/Actions'; - -type ReducersType = Array<($Shape, Actions) => {}>; - -const reduceReducers = (reducers: ReducersType) => (state: State, action: Actions) => ( - reducers.reduce((result, reducer) => ( - reducer(result, action) - ), state) -); - -export default reduceReducers; diff --git a/src/app/store/config/enhancers/index.js b/src/app/store/config/enhancer.js similarity index 52% rename from src/app/store/config/enhancers/index.js rename to src/app/store/config/enhancer.js index 5b933e70..a8bb17d8 100644 --- a/src/app/store/config/enhancers/index.js +++ b/src/app/store/config/enhancer.js @@ -1,21 +1,20 @@ // @flow strict -import { compose, applyMiddleware } from 'redux'; -import type { Dispatch, StoreEnhancer } from 'redux'; +import { applyMiddleware, compose } from 'redux'; +import type { StoreEnhancer } from 'redux'; import middlewares from '@/store/config/middlewares'; import type { State } from '@/store/types/State'; import type { Actions } from '@/store/types/Actions'; -type EnhancersType = StoreEnhancer> /* eslint-disable */ const devtools = typeof window !== 'undefined' && typeof window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ === 'function' && + // eslint-disable-next-line no-underscore-dangle window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ actionsBlacklist: [] }); /* eslint-enable */ -const composeEnhancers = devtools || compose; -// eslint-disable-next-line no-underscore-dangle -const enhancer: EnhancersType = composeEnhancers(applyMiddleware(...middlewares)); +// $FlowFixMe +const composeEnhancers: StoreEnhancer = devtools || compose; -export default enhancer; +export default composeEnhancers(applyMiddleware(...middlewares));