majorly overhauled 2.8

step2-08/exercise/src/reducers/pureFunctions.ts

@@ -1,22 +1,17 @@
 import { Store, FilterTypes } from '../store';
 
-import produce from 'immer';
-
-export function addTodo(state: Store['todos'], id: string, label: string): Store['todos'] {
+// TODO: for all the "todos" functions here, rewrite with mutable state
+// 1. !!!IMPORTANT!!! change the signature of every function here to:
+//      function xyzAction(state: Store['todos'], action: any) { ... }
+//
+// 2. make sure NOT to return anything, just modify the "state" arg
+export function addTodo(state: Store['todos'], id: string, label: string) {
+  // hint: state[action.id] = ...
   return { ...state, [id]: { label, completed: false } };
 }
 
-/* For the bonus exercise
-
-export function addTodo(state: Store['todos'], id: string, label: string): Store['todos'] {
-  return produce(state, draft => {
-    // TODO: implement a simple obj key assignment here
-  });
-}
-
-*/
-
 export function remove(state: Store['todos'], id: string) {
+  // hint: delete state[action.id]
   const newTodos = { ...state };
 
   delete newTodos[id];
@@ -25,6 +20,7 @@ export function remove(state: Store['todos'], id: string) {
 }
 
 export function complete(state: Store['todos'], id: string) {
+  // hint: state[action.id].completed = ...
   const newTodos = { ...state };
   newTodos[id].completed = !newTodos[id].completed;
 
@@ -32,6 +28,7 @@ export function complete(state: Store['todos'], id: string) {
 }
 
 export function clear(state: Store['todos']) {
+  // hint: it's almost like the remove case above
   const newTodos = { ...state };
 
   Object.keys(state).forEach(key => {
@@ -43,6 +40,10 @@ export function clear(state: Store['todos']) {
   return newTodos;
 }
 
+// TODO: change the setFilter() to the new immer way
+// 1. change the signature of every function here to:
+//      function xyzAction(state: Store['todos'], action: any) { ... }
+// 2. make sure to return action.filter without modifying state in this case
 export function setFilter(state: Store['filter'], filter: FilterTypes) {
   return filter;
 }