From cef1a51ad1747493c0c91d6d261daef9d1dc6342 Mon Sep 17 00:00:00 2001 From: Piotr Witek Date: Sun, 21 Apr 2019 04:31:57 +0200 Subject: [PATCH] Refactored sandbox reducer to createReducer APi --- codesandbox/src/features/todos/reducer.ts | 65 +++++++-------------- codesandbox/src/features/todos/selectors.ts | 4 +- codesandbox/src/store/types.d.ts | 4 ++ 3 files changed, 28 insertions(+), 45 deletions(-) diff --git a/codesandbox/src/features/todos/reducer.ts b/codesandbox/src/features/todos/reducer.ts index 29c7fbc..37bad7a 100644 --- a/codesandbox/src/features/todos/reducer.ts +++ b/codesandbox/src/features/todos/reducer.ts @@ -1,50 +1,29 @@ -import { RootAction } from 'MyTypes'; import { Todo } from 'MyModels'; import { combineReducers } from 'redux'; -import { getType } from 'typesafe-actions'; +import { createReducer } from 'typesafe-actions'; -import * as actions from './actions'; +import { loadTodosAsync, addTodo, removeTodo } from './actions'; -export type SandboxState = Readonly<{ - isLoadingTodos: boolean; - todos: Todo[]; -}>; +export const isLoadingTodos = createReducer(false as boolean) + .addHandler([loadTodosAsync.request], (state, action) => true) + .addHandler( + [loadTodosAsync.success, loadTodosAsync.failure], + (state, action) => false + ); -export default combineReducers({ - isLoadingTodos: (state = false, action) => { - switch (action.type) { - case getType(actions.loadTodosAsync.request): - return true; - - case getType(actions.loadTodosAsync.success): - case getType(actions.loadTodosAsync.failure): - return false; - - default: - return state; - } - }, - todos: ( - state = [ - { - id: '0', - title: 'You can add new todos using the form or load saved snapshot...', - }, - ], - action - ) => { - switch (action.type) { - case getType(actions.addTodo): - return [...state, action.payload]; - - case getType(actions.removeTodo): - return state.filter(i => i.id !== action.payload); - - case getType(actions.loadTodosAsync.success): - return action.payload; - - default: - return state; - } +export const todos = createReducer([ + { + id: '0', + title: 'You can add new todos using the form or load saved snapshot...', }, +] as readonly Todo[]) + .addHandler(loadTodosAsync.success, (state, action) => action.payload) + .addHandler(addTodo, (state, action) => [...state, action.payload]) + .addHandler(removeTodo, (state, action) => + state.filter(i => i.id !== action.payload) + ); + +export default combineReducers({ + isLoadingTodos, + todos, }); diff --git a/codesandbox/src/features/todos/selectors.ts b/codesandbox/src/features/todos/selectors.ts index 2d1bb02..995096d 100644 --- a/codesandbox/src/features/todos/selectors.ts +++ b/codesandbox/src/features/todos/selectors.ts @@ -1,5 +1,5 @@ // import { createSelector } from 'reselect'; -import { SandboxState } from './reducer'; +import { TodosState } from './reducer'; -export const getTodos = (state: SandboxState) => state.todos; +export const getTodos = (state: TodosState) => state.todos; diff --git a/codesandbox/src/store/types.d.ts b/codesandbox/src/store/types.d.ts index bce3c5a..2af1985 100644 --- a/codesandbox/src/store/types.d.ts +++ b/codesandbox/src/store/types.d.ts @@ -5,3 +5,7 @@ declare module 'MyTypes' { export type RootAction = ActionType; export type RootState = StateType; } + +declare module 'typesafe-actions' { + export type RootAction = ActionType; +}