96 lines
2.8 KiB
JavaScript
96 lines
2.8 KiB
JavaScript
import { createStore, applyMiddleware, combineReducers } from "redux";
|
|
import { createWrapper, HYDRATE } from "next-redux-wrapper";
|
|
import thunkMiddleware from "redux-thunk";
|
|
import progress from "./progress/reducer";
|
|
import { reducer as formReducer } from "redux-form";
|
|
import autoMergeLevel2 from "redux-persist/lib/stateReconciler/autoMergeLevel2";
|
|
|
|
//COMBINING ALL REDUCERS
|
|
const combinedReducer = combineReducers({
|
|
progress,
|
|
});
|
|
|
|
const reducer = (state = { progress: "{}" }, action) => {
|
|
switch (action.type) {
|
|
case HYDRATE:
|
|
//if (action.payload.progress === '{}') delete action.payload.progress;
|
|
return { ...state, ...action.payload };
|
|
case "SERVER_ACTION":
|
|
return {
|
|
...state,
|
|
server: {
|
|
...state.server,
|
|
progress: action.payload,
|
|
},
|
|
};
|
|
case "CLIENT_ACTION":
|
|
return {
|
|
...state,
|
|
client: {
|
|
...state.client,
|
|
progress: action.payload,
|
|
},
|
|
};
|
|
case "GET_ITEMS":
|
|
return {
|
|
...state,
|
|
items: action.payload,
|
|
loading: false,
|
|
};
|
|
case "SET_ITEMS":
|
|
return {
|
|
...state,
|
|
items: action.payload,
|
|
loading: false,
|
|
};
|
|
default:
|
|
return combinedReducer(state, action);
|
|
}
|
|
};
|
|
|
|
// BINDING MIDDLEWARE
|
|
const bindMiddleware = (middleware) => {
|
|
if (process.env.NODE_ENV !== "production") {
|
|
const { composeWithDevTools } = require("redux-devtools-extension");
|
|
return composeWithDevTools(applyMiddleware(...middleware));
|
|
}
|
|
return applyMiddleware(...middleware);
|
|
};
|
|
|
|
const makeStore = ({ isServer }) => {
|
|
if (isServer) {
|
|
//If it's on server side, create a store
|
|
return createStore(reducer, bindMiddleware([thunkMiddleware]));
|
|
} else {
|
|
//If it's on client side, create a store which will persist
|
|
const { persistStore, persistReducer } = require("redux-persist");
|
|
const storage = require("redux-persist/lib/storage").default;
|
|
|
|
const persistConfig = {
|
|
key: "nextjs",
|
|
whitelist: [
|
|
"progress"
|
|
],
|
|
storage,
|
|
stateReconciler: autoMergeLevel2, // if needed, use a safer storage
|
|
};
|
|
|
|
const persistedReducer = persistReducer(persistConfig, reducer); // Create a new reducer with our existing reducer
|
|
|
|
const store = createStore(
|
|
persistedReducer,
|
|
bindMiddleware([thunkMiddleware])
|
|
); // Creating the store again
|
|
|
|
store.__persistor = persistStore(store); // This creates a persistor object & push that persisted object to .__persistor, so that we can avail the persistability feature
|
|
|
|
return store;
|
|
}
|
|
};
|
|
export const setClientState = (clientState) => ({
|
|
type: SET_CLIENT_STATE,
|
|
payload: clientState,
|
|
});
|
|
// Export the wrapper & wrap the pages/_app.js with this wrapper only
|
|
export const wrapper = createWrapper(makeStore);
|