From dbd670756d376ff3c50884c12461d98bd0264697 Mon Sep 17 00:00:00 2001
From: Linder Hassinger <linder@peppermint.pe>
Date: Fri, 12 Apr 2024 20:06:54 -0500
Subject: [PATCH] =?UTF-8?q?=E2=9E=95=20feat:=20create=20taks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 semana-9/todolist/src/App.jsx                 | 20 +++++++++----------
 .../src/components/InputTask/index.jsx        |  6 +++---
 semana-9/todolist/src/services/httpAPI.js     | 12 +++++++++++
 3 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/semana-9/todolist/src/App.jsx b/semana-9/todolist/src/App.jsx
index 5af81eb..b1dc313 100644
--- 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
index 841d9d0..eba958f 100644
--- 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
index b419c55..0efc70b 100644
--- 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;
+}