diff --git a/src/App.tsx b/src/App.tsx
index 896f138..3ac51d5 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -22,14 +22,6 @@ function App() {
setText("");
}
- const handleToggleTodo = (id: number) => {
- dispatch({ type: TOGGLE_TODO, payload: id});
- }
-
- const handleDeleteTodo = (id: number) => {
- dispatch({ type: DELETE_TODO, payload: id});
- }
-
return (
Todo List
@@ -46,8 +38,6 @@ function App() {
id={todo.id}
text={todo.text}
completed={todo.completed}
- onToggle={handleToggleTodo}
- onDelete={handleDeleteTodo}
/>
))}
diff --git a/src/Todo.tsx b/src/Todo.tsx
index 757976d..f7a02b1 100644
--- a/src/Todo.tsx
+++ b/src/Todo.tsx
@@ -1,20 +1,21 @@
import React from "react";
+import {useDispatch} from "react-redux";
+import {DELETE_TODO, TOGGLE_TODO} from "./reducers";
interface TodoProps {
id: number;
text: string;
completed: boolean;
- onToggle: (id: number) => void;
- onDelete: (id: number) => void;
}
-const Todo = ( { id, text, completed, onToggle, onDelete }: TodoProps) => {
+const Todo = ( { id, text, completed }: TodoProps) => {
+ const dispatch = useDispatch();
const handleToggle = () => {
- onToggle(id);
+ dispatch({ type: TOGGLE_TODO, payload: id });
};
const handleDelete = () => {
- onDelete(id);
+ dispatch({ type: DELETE_TODO, payload: id });
};
return (