diff --git a/components/TodoListItem.js b/components/TodoListItem.js
index 5b45bd0..8883e01 100644
--- a/components/TodoListItem.js
+++ b/components/TodoListItem.js
@@ -1,54 +1,126 @@
/* eslint-disable @next/next/no-img-element */
+import axios from "axios";
+import { useState } from "react";
+import { useAuth } from "../context/auth";
+// import router from "next/router";
+import { toast } from 'react-toastify';
+import { API_URL } from "../utils/constants";
+
+export default function TodoListItem(props) {
+
+ const [Edit, setEdit] = useState(true);
+ const { token } = useAuth();
+ const [text, setText] = useState("")
-export default function TodoListItem() {
const editTask = (id) => {
/**
* @todo Complete this function.
* @todo 1. Update the dom accordingly
*/
+ setEdit(!Edit);
+
};
- const deleteTask = (id) => {
+ const deleteTask = async (id) => {
/**
* @todo Complete this function.
* @todo 1. Send the request to delete the task to the backend server.
* @todo 2. Remove the task from the dom.
*/
+
+ axios({
+ headers: {
+ Authorization: "Token " + token,
+ },
+ url: API_URL + `todo/${id}/`,
+ method: "delete",
+ })
+ .then(() => {
+ toast.success('Deletion was successfull!!');
+ })
+ .catch((err) => {
+ console.log(err);
+ toast.error("Error encountered during deletion ;((");
+ });
+
+
};
- const updateTask = (id) => {
+ const updateTask = async (id) => {
/**
* @todo Complete this function.
* @todo 1. Send the request to update the task to the backend server.
* @todo 2. Update the task in the dom.
*/
+
+
+ setEdit(!Edit);
+
+
+
+
+ axios({
+ headers: {
+ Authorization: "Token " + token,
+ },
+ url: API_URL + `todo/${id}/`,
+ method: "patch",
+ data: { title: text }
+ })
+ .then(() => {
+ setText("");
+ toast.success('Item has beeeeeeen updated successfully!')
+ // setEdit(false);
+ })
+ .catch((err) => {
+ toast.error("Error updating:(( ");
+ console.log(err)
+ });
+
+
+
+ // axios.put(`todo/${id}/`, { title: text }, {
+ // headers: {
+ // 'Authorization': 'Token ' + token,
+ // // 'Content-Type': 'application/json',
+ // }
+ // })
+ // .then(() => {
+ // setText("");
+ // toast.success("Item has beeeeeeen updated successfully!");
+ // })
+ // .catch((err) => {
+ // toast.error("Error updating:(( ");
+ // console.log(err)});
};
return (
<>
-
-
+ setText(e.target.value)}
/>
-
-
- Sample Task 1
+
+ {props.title}
-
+