diff --git a/src/app/planning/page.jsx b/src/app/planning/page.jsx
index f8c140aac292a7b396a1cac50663c1b3cc2272f3..cf842ea397e093f607af4fdaeddcdcf58b72963a 100644
--- a/src/app/planning/page.jsx
+++ b/src/app/planning/page.jsx
@@ -131,7 +131,7 @@ const PlanningPage = () => {
     const handleUpdate = async () => {
         setLoading(true);
         const requestBody = {id_project: selectedProject, planning_data: planningData.planning_data};
-        const {isSuccess, errors} = await fetchRequest(`/plannings/`, {
+        const {isSuccess, errors} = await fetchRequest(`/plannings/${planningData.id}/`, {
             method: 'PUT',
             body: JSON.stringify(requestBody)
         });
diff --git a/src/app/projects/page.jsx b/src/app/projects/page.jsx
index 69aef4b04fd79649804b1c0a65b901e3f7b0bcff..3a3a521583413a7d3d48fdab3f7d121ea8e2d135 100644
--- a/src/app/projects/page.jsx
+++ b/src/app/projects/page.jsx
@@ -11,10 +11,10 @@ const Projects = () => {
     const [pageUrl, setPageUrl] = useState('/projects/');
     const [projects, setProjects] = useState([]);
     const [editingProject, setEditingProject] = useState(null);
-    {/*    errors from request*/ }
     const [errors, setErrors] = useState();
     const [loading, setLoading] = useState(false);
-    const { toggleNotification } = useNotification()
+    const [isFormOpen, setIsFormOpen] = useState(false); // State for accordion
+    const { toggleNotification } = useNotification();
 
     const fetchProjects = async () => {
         const { isSuccess, errors, data } = await fetchRequest(pageUrl);
@@ -23,20 +23,15 @@ const Projects = () => {
             setErrors(null);
         } else {
             console.error("Failed to fetch projects");
-            setErrors(errors)
+            setErrors(errors);
         }
     };
-    useEffect(() => {
 
+    useEffect(() => {
         fetchProjects();
     }, [pageUrl]);
 
-    // pageURL
-
     const handleAddProject = async (project) => {
-        console.log("proj",project)
-        console.log("proj strinjify",JSON.stringify(project))
-
         setLoading(true);
         const { isSuccess, errors, data } = await fetchRequest('/projects/', {
             method: 'POST',
@@ -48,14 +43,14 @@ const Projects = () => {
                 visible: true,
                 message: `${project.nom} a été ajouté avec succès`,
                 type: "success"
-            })
+            });
             setProjects([...projects, data]);
             setEditingProject(null);
             setErrors(null);
+            setIsFormOpen(false); // Close the form on success
         } else {
-            console.log(errors);
             console.error("Failed to add project");
-            setErrors(errors)
+            setErrors(errors);
         }
         setLoading(false);
     };
@@ -72,27 +67,28 @@ const Projects = () => {
                 visible: true,
                 message: `${updatedProject.nom} a été modifié avec succès`,
                 type: "success"
-            })
+            });
             const updatedProjects = projects.map((project) =>
                 project.id === id ? data : project
             );
             setProjects(updatedProjects);
             setEditingProject(null);
             setErrors(null);
+            setIsFormOpen(false); // Close the form on success
         } else {
             console.error("Failed to edit project");
-            setErrors(errors)
+            setErrors(errors);
         }
         setLoading(false);
     };
 
     const handleEditClick = (project) => {
-        console.log(project)
         setEditingProject(project);
+        setIsFormOpen(true); // Open the form for editing
     };
 
     const handleDeleteProject = async (project) => {
-        setLoading(true)
+        setLoading(true);
         const { isSuccess, errors } = await fetchRequest(`/projects/${project.id}/`, {
             method: 'DELETE',
         });
@@ -102,18 +98,21 @@ const Projects = () => {
                 visible: true,
                 message: `${project.nom} a été supprimé avec succès`,
                 type: "success"
-            })
-            // setProjects(projects.filter((p) => p.id !== project.id));
+            });
             await fetchProjects();
             setEditingProject(null);
             setErrors(null);
         } else {
             console.error("Failed to delete project");
-            setErrors(errors)
+            setErrors(errors);
         }
         setLoading(false);
     };
 
+    const toggleForm = () => {
+        setIsFormOpen(!isFormOpen); // Toggle the form visibility
+    };
+
     return (
         <div className="md:grid md:grid-cols-10">
             <div className="hidden md:block col-span-2">
@@ -122,15 +121,28 @@ const Projects = () => {
 
             <div className="md:col-span-8 flex flex-row gap-4 md:m-8 m-2">
                 <div className="flex-1 md:p-6 md:mx-8">
+                    <div className="flex justify-between ">
                     <h1 className="text-2xl font-bold mb-4">Projets
                         {loading ? <span className="animate-pulse">...</span> : null}</h1>
-                    <ProjectForm
-                        onAddProject={handleAddProject}
-                        onEditProject={handleEditProject}
-                        editingProject={editingProject}
-                        setEditingProject={setEditingProject}
-                    />
-                    {/*errors from request*/}
+                    {/* Accordion Toggle Button */}
+                    <button
+                        className={`text-sm md:text-base mb-2 p-2 md:mb-4 md:px-4 md:py-2 ${isFormOpen ? 'bg-chicago-300' : 'bg-sushi-500'}  text-white rounded-md`}
+                        onClick={toggleForm}
+                    >
+                        {isFormOpen ? 'Cancel' : 'Add Project'}
+                    </button>
+                    </div>
+                    {/* Accordion Content */}
+                    {isFormOpen && (
+                        <ProjectForm
+                            onAddProject={handleAddProject}
+                            onEditProject={handleEditProject}
+                            editingProject={editingProject}
+                            setEditingProject={setEditingProject}
+                        />
+                    )}
+
+                    {/* Errors from request */}
                     {errors && errors.detail && Object.keys(errors.detail).map((key) => (
                         <div role="alert" className="rounded border-s-4 border-red-500 bg-red-50 p-4" key={key}>
                             <div className="flex items-center gap-2 text-red-800">
@@ -159,6 +171,6 @@ const Projects = () => {
             </div>
         </div>
     );
-}
-export default Projects;
+};
 
+export default Projects;