Skip to content
Permalink
Browse files

dispatch with context for todo

  • Loading branch information...
rwieruch committed Apr 6, 2019
1 parent d024a24 commit 95806796700fc2ca5cd204dd2f4542ad6f08e7ee
Showing with 20 additions and 9 deletions.
  1. +20 −9 src/App.js
@@ -1,6 +1,13 @@
import React, { useState, useReducer } from 'react';
import React, {
useState,
useReducer,
useContext,
createContext,
} from 'react';
import uuid from 'uuid/v4';

const TodoContext = createContext(null);

const initalTodos = [
{
id: uuid(),
@@ -82,11 +89,11 @@ const App = () => {
});

return (
<div>
<TodoContext.Provider value={dispatchTodos}>
<Filter dispatch={dispatchFilter} />
<TodoList dispatch={dispatchTodos} todos={filteredTodos} />
<AddTodo dispatch={dispatchTodos} />
</div>
<TodoList todos={filteredTodos} />
<AddTodo />
</TodoContext.Provider>
);
};

@@ -118,15 +125,17 @@ const Filter = ({ dispatch }) => {
);
};

const TodoList = ({ dispatch, todos }) => (
const TodoList = ({ todos }) => (
<ul>
{todos.map(todo => (
<TodoItem key={todo.id} dispatch={dispatch} todo={todo} />
<TodoItem key={todo.id} todo={todo} />
))}
</ul>
);

const TodoItem = ({ dispatch, todo }) => {
const TodoItem = ({ todo }) => {
const dispatch = useContext(TodoContext);

const handleChange = () =>
dispatch({
type: todo.complete ? 'UNDO_TODO' : 'DO_TODO',
@@ -147,7 +156,9 @@ const TodoItem = ({ dispatch, todo }) => {
);
};

const AddTodo = ({ dispatch }) => {
const AddTodo = () => {
const dispatch = useContext(TodoContext);

const [task, setTask] = useState('');

const handleSubmit = event => {

0 comments on commit 9580679

Please sign in to comment.
You can’t perform that action at this time.