diff --git a/src/App.js b/src/App.js
index 432e4ac..cbeb5a1 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,17 +1,10 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
-import produce from 'immer';
-import { useState } from 'react';
+import React from "react";
+import logo from "./logo.svg";
+import "./App.css";
+import produce from "immer";
+import { useState } from "react";
-
-
-
-
-
-
-
- /*const Notes = props => props.data.map(note =>
{note.text}
);
+/*const Notes = props => props.data.map(note => {note.text}
);
const initialData = [{ text: 'Hey' }, { text: 'There' }];
const [data, setData] = useState(initialData);
@@ -34,51 +27,63 @@ import { useState } from 'react';
);
}*/
function App() {
- const [input, setInput] = useState("");
- const [list, setList] = useState([]);
- const [visible, setVisible] = useState(true);
- const addToList = e => {
- setList([ ...list,{ title: input, visible: true } ]);
- setInput("");
- };
+ const [input, setInput] = useState("");
+ const [list, setList] = useState([]);
- const deleteList = id => e => {
- setList(list.filter((item, index) => index !== id));
- };
+ const addToList = e => {
+ setList([...list, { title: input, completed: false }]);
+ setInput("");
+ };
- const hideMe = id => e => {
- setVisible(list.map((item, index) => index === id
- ? {
- title: item.title,
- visible: false
- }
- : item));
- }
+ const deleteList = id => e => {
+ setList(list.filter((item, index) => index !== id));
+ };
- let style = { textDecoration: "none" };
- if (!visible) style.textDecoration = "line-through";
+ const toggleCompleted = id => e => {
+ setList(
+ list.map((item, index) =>
+ index === id
+ ? {
+ title: item.title,
+ completed: !item.completed,
+ }
+ : item,
+ ),
+ );
+ };
+ return (
+
+
setInput(e.target.value)}
+ />
+
+
+ {list.map((item, index) => (
+ -
+ {item.title}
+
+
+
+ ))}
+
+
+ );
+}
- return(
-
-
-
setInput(e.target.value)} />
-
-
- {list.map((item,index) =>
- -
- {item}
-
-
-
)}
-
-
-
-
- );
- }
-
-
-
-
export default App;