Add funtion fetch tasks by ID and all tags

frontend/src/api/AuthenticationApi.jsx

@@ -1,61 +1,59 @@
-import axios from 'axios';
-import axiosInstance from './configs/AxiosConfig';
+import axios from "axios";
+import axiosInstance from "./configs/AxiosConfig";
 
 // Function for user login
-const apiUserLogin = (data) => {
+const apiUserLogin = data => {
   return axiosInstance
-        .post('token/obtain/', data)
-        .then((response) => {
+    .post("token/obtain/", data)
+    .then(response => {
       console.log(response.statusText);
       return response;
-        }).catch(error => {
-            console.log('apiUserLogin error: ', error);
+    })
+    .catch(error => {
+      console.log("apiUserLogin error: ", error);
       return error;
     });
 };
 
 // Function for user logout
 const apiUserLogout = () => {
-    axiosInstance.defaults.headers['Authorization'] = ""; // Clear authorization header
-    localStorage.removeItem('access_token'); // Remove access token
-    localStorage.removeItem('refresh_token'); // Remove refresh token
-}
+  axiosInstance.defaults.headers["Authorization"] = ""; // Clear authorization header
+  localStorage.removeItem("access_token"); // Remove access token
+  localStorage.removeItem("refresh_token"); // Remove refresh token
+};
 
 // Function for Google login
-const googleLogin = async (token) => {
-    axios.defaults.withCredentials = true
-    let res = await axios.post(
-        "http://localhost:8000/api/auth/google/",
-        {
+const googleLogin = async token => {
+  axios.defaults.withCredentials = true;
+  let res = await axios.post("http://localhost:8000/api/auth/google/", {
     code: token,
-        }
-    );
+  });
   // console.log('service google login res: ', res);
   return await res;
 };
 
-
 // Function to get 'hello' data
 const getGreeting = () => {
   return axiosInstance
-        .get('hello')
-        .then((response) => {
+    .get("hello")
+    .then(response => {
       return response;
-        }).catch(error => {
+    })
+    .catch(error => {
       return error;
     });
-}
+};
 
 const config = {
   headers: {
-        "Content-Type": "application/json"
-    }
+    "Content-Type": "application/json",
+  },
 };
 
 // Function to register
-const createUser = async (formData) => {
+const createUser = async formData => {
   try {
-    axios.defaults.withCredentials = true
+    axios.defaults.withCredentials = true;
     const resposne = axios.post("http://localhost:8000/api/user/create/", formData);
     // const response = await axiosInstance.post('/user/create/', formData);
     return response.data;
@@ -64,13 +62,11 @@ const createUser = async (formData) => {
   }
 };
 
-
 // Export the functions and Axios instance
 export default {
-    axiosInstance,
   apiUserLogin,
   apiUserLogout,
   getGreeting: getGreeting,
   googleLogin,
-    createUser
+  createUser,
 };

frontend/src/api/TagApi.jsx

@@ -0,0 +1,12 @@
+import axiosInstance from "./configs/AxiosConfig";
+
+export const fetchTags = () => {
+  return axiosInstance
+    .get("tags/")
+    .then(response => {
+      return response.data;
+    })
+    .catch(error => {
+      throw error;
+    });
+};

frontend/src/api/TaskApi.jsx

@@ -1,10 +1,20 @@
-import axios from 'axios';
-import axiosInstance from './configs/AxiosConfig';
+import axiosInstance from "./configs/AxiosConfig";
 
 export const fetchTodoTasks = () => {
   return axiosInstance
-        .get('todo/')
-        .then((response) => {
+    .get("todo/")
+    .then(response => {
+      return response.data;
+    })
+    .catch(error => {
+      throw error;
+    });
+};
+
+export const fetchTodoTasksID = id => {
+  return axiosInstance
+    .get(`todo/${id}/`)
+    .then(response => {
       return response.data;
     })
     .catch(error => {