my commit

src/App.jsx

-import React, { useEffect, useState } from "react";
-import Todo from "./pages/Todo";
-
-
+import Todo from "./pages/Todo/Todo";
 function App() {
   return (
   <Todo/>

src/component/TodoForm/TodoForm.jsx

-import React from "react";
 import styles from "./TodoForm.module.css";
-
 const TodoForm = ({ input, error, handleInputChange, handleSubmit }) => {
   return (
    

src/component/TodoItem/TodoItem.jsx

-import React, { useState, useEffect } from "react";
+import  { useState, useEffect } from "react";
 import { TiDelete } from "react-icons/ti";
 import styles from "./TodoItem.module.css";
 

src/component/TodoList/TodoList.jsx

-import React from "react";
 import TodoItem from "../TodoItem/TodoItem";
 import styles from "./TodoList.module.css";
 

src/db.json

@@ -39,51 +39,6 @@
       "id": "6838",
       "text": "gnfgn",
       "completed": false
-    },
-    {
-      "id": "fe38",
-      "text": "gngfn",
-      "completed": false
-    },
-    {
-      "id": "02d1",
-      "text": "ngfng",
-      "completed": false
-    },
-    {
-      "id": "78c1",
-      "text": "gngfn",
-      "completed": false
-    },
-    {
-      "id": "7a0c",
-      "text": "gngfn",
-      "completed": false
-    },
-    {
-      "id": "0698",
-      "text": "gngn",
-      "completed": false
-    },
-    {
-      "id": "81af",
-      "text": "fgnfgn",
-      "completed": false
-    },
-    {
-      "id": "9219",
-      "text": "gngn",
-      "completed": false
-    },
-    {
-      "id": "24d0",
-      "text": "gngn",
-      "completed": false
-    },
-    {
-      "id": "8053",
-      "text": "ngn",
-      "completed": false
     }
   ]
 }
\ No newline at end of file

src/pages/Todo.jsx → src/pages/Todo/Todo.jsx

-import React, { useEffect, useState } from "react";
-import {getTodos,addTodo,deleteTodo,updateTodo} from "../api/todo"; 
-import TodoList from "../component/TodoList/TodoList.jsx";
-import TodoForm from "../component/TodoForm/TodoForm.jsx";
+import { useEffect, useState } from "react";
+import {getTodos,addTodo,deleteTodo,updateTodo} from "../../api/todo.js"; 
+import TodoList from "../../component/TodoList/TodoList.jsx";
+import TodoForm from "../../component/TodoForm/TodoForm.jsx";
 import styles from "./Todo.module.css";
 
 function Todo() {

src/pages/Todo.module.css → src/pages/Todo/Todo.module.css

@@ -18,7 +18,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    width: 90%;
+    width: 100%;
     box-sizing: border-box;
   }
 .container {