redux ducks

src/store/actionTypes.ts

@@ -1,9 +0,0 @@
-enum ActionTypes {
-    SET_USER = 'SET_USER',
-    LOGOUT = 'LOGOUT',
-    ADD_NOTIFICATION = 'ADD_NOTIFICATION',
-    SET_MODAL = 'SET_MODAL',
-    HIDE_MODAL = 'HIDE_MODAL'
-}
-
-export default ActionTypes;

src/store/actions.ts

@@ -1,27 +0,0 @@
-import ActionTypes from "./actionTypes";
-import React from "react";
-
-const setUser = (userData: UserType) => ({
-    type: ActionTypes.SET_USER,
-    userData
-});
-const logout = () => ({
-    type: ActionTypes.LOGOUT
-});
-
-const addNotification = (notification: React.ReactNode) => ({
-    type: ActionTypes.ADD_NOTIFICATION,
-    notification
-});
-
-const setModal = (modal: React.ReactNode | null) => ({
-    type: ActionTypes.SET_MODAL,
-    modal
-});
-const hideModal = () => ({
-    type: ActionTypes.HIDE_MODAL
-})
-
-export { setUser, logout,
-         addNotification,
-         setModal, hideModal };

src/store/ducks/currentUser.ts

@@ -1,23 +1,22 @@
-import ActionTypes from "../actionTypes";
+const SET_USER = 'unmei/currentUser/SET_USER';
+const LOGOUT = 'unmei/currentUser/LOGOUT';
 
 const initialState = {
     authorized: false
 };
-
 type Action = {
     type: string
     userData: UserType
-}
-
-export default (state = initialState, action: Action) => {
+};
+const reducer = (state = initialState, action: Action) => {
     switch (action.type) {
-        case ActionTypes.SET_USER:
+        case SET_USER:
             if(action.userData) {
                 state = Object.assign({}, state, action.userData);
                 state.authorized = true;
             }
             return state;
-        case ActionTypes.LOGOUT:
+        case LOGOUT:
             state = {
                 authorized: false
             };
@@ -25,4 +24,15 @@ export default (state = initialState, action: Action) => {
         default:
             return state
     }
-}
+}
+
+const setUser = (userData: UserType) => ({
+    type: SET_USER,
+    userData
+});
+const logout = () => ({
+    type: LOGOUT
+});
+
+export default reducer;
+export { setUser, logout }

src/store/ducks/index.ts

@@ -0,0 +1,6 @@
+import {combineReducers} from "redux";
+import currentUser from './currentUser'
+import modal from "./modal";
+import notifications from './notifications'
+
+export default combineReducers({ currentUser, modal, notifications })

src/store/ducks/modal.ts

@@ -0,0 +1,36 @@
+import React from "react";
+
+// Actions
+const SET_MODAL = 'unmei/modal/SET_MODAL';
+const HIDE_MODAL = 'unmei/modal/HIDE_MODAL';
+
+// Reducer
+const initialState: React.ReactNode | null = null;
+type Action = {
+    type: string
+    modal: React.ReactNode | null
+}
+const reducer = (state=initialState, action: Action) => {
+    switch (action.type) {
+        case SET_MODAL: {
+            return action.modal;
+        }
+        case HIDE_MODAL: {
+            return null;
+        }
+        default: return state;
+    }
+}
+
+// Action creators
+const setModal = (modal: React.ReactNode | null) => ({
+    type: SET_MODAL,
+    modal
+});
+
+const hideModal = () => ({
+    type: HIDE_MODAL
+});
+
+export default reducer;
+export { setModal, hideModal }

src/store/ducks/notifications.ts

@@ -1,20 +1,30 @@
 import React from "react";
-import ActionTypes from "../actionTypes";
 
+// Actions
+const ADD_NOTIFICATION = 'unmei/notifications/ADD_NOTIFICATION';
+
+// Reducer
 const initialState: React.ReactNode[] = [];
-
 type Action = {
     type: string
     notification: React.ReactNode
-}
-
-export default (state = initialState, action: Action) => {
+};
+const reducer = (state = initialState, action: Action) => {
     switch (action.type) {
-        case ActionTypes.ADD_NOTIFICATION: {
+        case ADD_NOTIFICATION: {
             if(state.length === 3)
                 return [...state.slice(1), action.notification];
             return [...state, action.notification];
         }
         default: return state;
     }
-}
+}
+
+// Actions creator
+const addNotification = (notification: React.ReactNode) => ({
+    type: ADD_NOTIFICATION,
+    notification
+});
+
+export default reducer;
+export { addNotification };

src/store/reducers/modal.ts

@@ -1,21 +0,0 @@
-import React from "react";
-import ActionTypes from "../actionTypes";
-
-const initialState: React.ReactNode | null = null;
-
-type Action = {
-    type: string
-    modal: React.ReactNode | null
-}
-
-export default (state=initialState, action: Action) => {
-    switch (action.type) {
-        case ActionTypes.SET_MODAL: {
-            return action.modal;
-        }
-        case ActionTypes.HIDE_MODAL: {
-            return null;
-        }
-        default: return state;
-    }
-}

src/store/reducers/reducers.ts

@@ -1,6 +0,0 @@
-import {combineReducers} from "redux";
-import currentUser from "./currentUser";
-import notifications from "./notifications";
-import modal from "./modal";
-
-export default combineReducers({ currentUser, notifications, modal })

src/store/store.ts

@@ -1,6 +1,6 @@
 import {createStore} from "redux";
 import {composeWithDevTools} from "redux-devtools-extension";
-import reducers from "./reducers/reducers";
+import reducers from "./ducks/index";
 
 const composeEnhancers = composeWithDevTools({
     trace: true