➕ feat: create taks

linder3hs · Apr 13, 2024 · dbd6707 · dbd6707
1 parent c507c84
commit dbd6707
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 13 deletions.
diff --git a/semana-9/todolist/src/App.jsx b/semana-9/todolist/src/App.jsx
@@ -6,8 +6,7 @@ import {
   UpdateForm,
   CheckForm,
 } from "./components";
-import { v4 as uuidv4 } from "uuid";
-import { getTasks } from "./services/httpAPI";
+import { getTasks, createTask } from "./services/httpAPI";
 
 export default function App() {
   const [listTasks, setListTask] = useState([]);
@@ -33,8 +32,9 @@ export default function App() {
     setTask(event.target.value);
   };
 
-  const handleListTask = (task) => {
-    task.id = uuidv4();
+  const handleListTask = async (task) => {
+    await createTask(task);
+
     const newTasks = [...listTasks, task];
     setListTask(newTasks);
     setTask("");
@@ -72,17 +72,17 @@ export default function App() {
 
   const handleDeleteTask = (task) => {
     const filteredTasks = listTasks.filter((element) => element.id !== task.id);
-
     setListTask(filteredTasks);
     handleOpen("delete");
   };
 
+  const fetchTasks = async () => {
+    const response = await getTasks();
+    setListTask(response);
+  };
+
   useEffect(function () {
-    const fetchTask = async () => {
-      const response = await getTasks();
-      setListTask(response);
-    };
-    fetchTask();
+    fetchTasks();
   }, []);
 
   return (

diff --git a/semana-9/todolist/src/components/InputTask/index.jsx b/semana-9/todolist/src/components/InputTask/index.jsx
@@ -1,16 +1,16 @@
 /* eslint-disable react/prop-types */
 export default function InputTask(props) {
   // dentro de un componente puedo crear funciones
-  const handleFormSubmit = (event) => {
+  const handleFormSubmit = async (event) => {
     event.preventDefault();
 
     const task = {
       text: props.task,
       status: 1,
-      created_at: new Date(),
+      createdAt: Date.now(),
     };
 
-    props.handleListTask(task);
+    await props.handleListTask(task);
   };
 
   return (

diff --git a/semana-9/todolist/src/services/httpAPI.js b/semana-9/todolist/src/services/httpAPI.js
@@ -6,3 +6,15 @@ export async function getTasks() {
 
   return tasks;
 }
+
+export async function createTask(task) {
+  const response = await fetch(BASE_URL, {
+    method: "POST",
+    body: JSON.stringify(task),
+    headers: {
+      "Content-Type": "application/json",
+    },
+  });
+  const data = response.json();
+  return data;
+}