From 0a04c1e50b259f947e496a2cc710297de480ad62 Mon Sep 17 00:00:00 2001 From: Supasate Choochaisri Date: Sun, 6 Jan 2019 15:20:14 +0700 Subject: [PATCH] Refactor examples to use configureStore --- examples/basic/src/configureStore.js | 29 ++++++++++++++++++++++ examples/basic/src/index.js | 23 ++--------------- examples/immutable/src/configureStore.js | 29 ++++++++++++++++++++++ examples/immutable/src/index.js | 24 ++---------------- examples/typescript/src/configureStore.tsx | 29 ++++++++++++++++++++++ examples/typescript/src/index.tsx | 22 +--------------- 6 files changed, 92 insertions(+), 64 deletions(-) create mode 100644 examples/basic/src/configureStore.js create mode 100644 examples/immutable/src/configureStore.js create mode 100644 examples/typescript/src/configureStore.tsx diff --git a/examples/basic/src/configureStore.js b/examples/basic/src/configureStore.js new file mode 100644 index 00000000..3172ace7 --- /dev/null +++ b/examples/basic/src/configureStore.js @@ -0,0 +1,29 @@ +import { createBrowserHistory } from 'history' +import { applyMiddleware, compose, createStore } from 'redux' +import { routerMiddleware } from 'connected-react-router' +import createRootReducer from './reducers' + +export const history = createBrowserHistory() + +export default function configureStore(preloadedState) { + const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose + const store = createStore( + createRootReducer(history), + preloadedState, + composeEnhancer( + applyMiddleware( + routerMiddleware(history), + ), + ), + ) + + // Hot reloading + if (module.hot) { + // Enable Webpack hot module replacement for reducers + module.hot.accept('./reducers', () => { + store.replaceReducer(createRootReducer(history)); + }); + } + + return store +} diff --git a/examples/basic/src/index.js b/examples/basic/src/index.js index 57d6142e..1fbeb87a 100644 --- a/examples/basic/src/index.js +++ b/examples/basic/src/index.js @@ -1,25 +1,11 @@ import { AppContainer } from 'react-hot-loader' -import { applyMiddleware, compose, createStore } from 'redux' -import { createBrowserHistory } from 'history' -import { routerMiddleware } from 'connected-react-router' import { Provider } from 'react-redux' import React from 'react' import ReactDOM from 'react-dom' import App from './App' -import rootReducer from './reducers' - -const history = createBrowserHistory() - -const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose -const store = createStore( - rootReducer(history), - composeEnhancer( - applyMiddleware( - routerMiddleware(history), - ), - ), -) +import configureStore, { history } from './configureStore' +const store = configureStore() const render = () => { ReactDOM.render( @@ -39,9 +25,4 @@ if (module.hot) { module.hot.accept('./App', () => { render() }) - - // Reload reducers - module.hot.accept('./reducers', () => { - store.replaceReducer(rootReducer(history)) - }) } diff --git a/examples/immutable/src/configureStore.js b/examples/immutable/src/configureStore.js new file mode 100644 index 00000000..3172ace7 --- /dev/null +++ b/examples/immutable/src/configureStore.js @@ -0,0 +1,29 @@ +import { createBrowserHistory } from 'history' +import { applyMiddleware, compose, createStore } from 'redux' +import { routerMiddleware } from 'connected-react-router' +import createRootReducer from './reducers' + +export const history = createBrowserHistory() + +export default function configureStore(preloadedState) { + const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose + const store = createStore( + createRootReducer(history), + preloadedState, + composeEnhancer( + applyMiddleware( + routerMiddleware(history), + ), + ), + ) + + // Hot reloading + if (module.hot) { + // Enable Webpack hot module replacement for reducers + module.hot.accept('./reducers', () => { + store.replaceReducer(createRootReducer(history)); + }); + } + + return store +} diff --git a/examples/immutable/src/index.js b/examples/immutable/src/index.js index e746c27e..b4e78b84 100644 --- a/examples/immutable/src/index.js +++ b/examples/immutable/src/index.js @@ -1,28 +1,13 @@ import { AppContainer } from 'react-hot-loader' -import { applyMiddleware, compose, createStore } from 'redux' -import { createBrowserHistory } from 'history' -import { routerMiddleware } from 'connected-react-router/immutable' import { Provider } from 'react-redux' import Immutable from 'immutable' import React from 'react' import ReactDOM from 'react-dom' import App from './App' -import rootReducer from './reducers' - -const history = createBrowserHistory() +import configureStore, { history } from './configureStore' const initialState = Immutable.Map() -const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose -const store = createStore( - rootReducer(history), - initialState, - composeEnhancer( - applyMiddleware( - routerMiddleware(history), - ), - ), -) - +const store = configureStore(initialState) const render = () => { ReactDOM.render( @@ -42,9 +27,4 @@ if (module.hot) { module.hot.accept('./App', () => { render() }) - - // Reload reducers - module.hot.accept('./reducers', () => { - store.replaceReducer(rootReducer(history)) - }) } diff --git a/examples/typescript/src/configureStore.tsx b/examples/typescript/src/configureStore.tsx new file mode 100644 index 00000000..242e2b52 --- /dev/null +++ b/examples/typescript/src/configureStore.tsx @@ -0,0 +1,29 @@ +import { createBrowserHistory } from 'history' +import { applyMiddleware, compose, createStore } from 'redux' +import { routerMiddleware } from 'connected-react-router' +import createRootReducer from './reducers' + +export const history = createBrowserHistory() + +export default function configureStore(preloadedState) { + const composeEnhancer: typeof compose = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose + const store = createStore( + createRootReducer(history), + preloadedState, + composeEnhancer( + applyMiddleware( + routerMiddleware(history), + ), + ), + ) + + // Hot reloading + if (module.hot) { + // Enable Webpack hot module replacement for reducers + module.hot.accept('./reducers', () => { + store.replaceReducer(createRootReducer(history)); + }); + } + + return store +} diff --git a/examples/typescript/src/index.tsx b/examples/typescript/src/index.tsx index 7a9f0ab2..60392fa7 100644 --- a/examples/typescript/src/index.tsx +++ b/examples/typescript/src/index.tsx @@ -1,24 +1,9 @@ import { AppContainer } from 'react-hot-loader' -import { applyMiddleware, compose, createStore } from 'redux' -import { createBrowserHistory } from 'history' -import { routerMiddleware } from 'connected-react-router' import { Provider } from 'react-redux' import React from 'react' import ReactDOM from 'react-dom' import App from './App' -import rootReducer from './reducers' - -const history = createBrowserHistory() - -const composeEnhancer: typeof compose = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose -const store = createStore( - rootReducer(history), - composeEnhancer( - applyMiddleware( - routerMiddleware(history), - ), - ), -) +import configureStore, { history } from './configureStore' const render = () => { ReactDOM.render( @@ -39,9 +24,4 @@ if (module.hot) { module.hot.accept('./App', () => { render() }) - - // Reload reducers - module.hot.accept('./reducers', () => { - store.replaceReducer(rootReducer(history)) - }) }