added demo code to step 5

This commit is contained in:
Ken
2019-03-02 21:44:19 -08:00
parent 15bee6892b
commit 1f4baa2ca4
13 changed files with 128 additions and 154 deletions

View File

@@ -1,16 +1,43 @@
import { Store } from '../store';
import { addTodo, remove, complete } from './pureFunctions';
import { combineReducers } from 'redux';
import { createReducer } from 'redux-starter-kit';
export function reducer(state: Store['todos'], payload: any): Store['todos'] {
switch (payload.type) {
case 'addTodo':
return addTodo(state, payload.id, payload.label);
export const todosReducer = createReducer<Store['todos']>(
{},
{
addTodo(state, action) {
state[action.id] = { label: action.label, completed: false };
},
// Fill in the blanks here for:
// - remove
// - complete
// - clear
remove(state, action) {
delete state[action.id];
},
clear(state, action) {
state[action.id].completed = !state[action.id].completed;
},
complete(state, action) {
Object.keys(state).forEach(key => {
if (state[key].completed) {
delete state[key];
}
});
},
edit(state, action) {
state[action.id].label = action.label;
}
}
);
return state;
}
export const filterReducer = createReducer<Store['filter']>('all', {
setFilter(state, action) {
return action.filter;
}
});
export const reducer = combineReducers({
todos: todosReducer,
filter: filterReducer
});

View File

@@ -1,25 +0,0 @@
import { addTodo } from './pureFunctions';
import { Store } from '../store';
describe('TodoApp reducers', () => {
it('can add an item', () => {
const state = <Store['todos']>{};
const newState = addTodo(state, '0', 'item1');
const keys = Object.keys(newState);
// make sure that adding an item would not result in the same instance of state
// TODO: uncomment the below to get started
/*
expect(newState).not.toBe(state);
expect(keys.length).toBe(1);
expect(newState[keys[0]].label).toBe('item1');
expect(newState[keys[0]].completed).toBeFalsy();
*/
});
// TODO: add a test for remove()
});

View File

@@ -1,39 +0,0 @@
import { Store, FilterTypes } from '../store';
export function addTodo(state: Store['todos'], id: string, label: string): Store['todos'] {
// Write code to clone the state object while inserting a new TodoItem inside
// - the new object must be of the type TodoItem
// - the new state should be cloned using the spread syntax
// - return the new state
return state;
}
export function remove(state: Store['todos'], id: string) {
// Write code:
// - to clone the state object into new state object
// - remove and item from the new state by using the "delete" keyword
// - return the new state
return state;
}
export function complete(state: Store['todos'], id: string) {
// Clone the todo, overriding
const newTodo = { ...state[id], completed: !state[id].completed };
return { ...state, [id]: newTodo };
}
export function clear(state: Store['todos']) {
// Clone the todos
const newTodos = { ...state };
// Delete all todos based on the completed flag, looping over the keys of the todos
Object.keys(state).forEach(key => {
if (state[key].completed) {
delete newTodos[key];
}
});
return newTodos;
}