Ajout de la suppression d'un objet

Back-end/src/main/java/com/example/starter/MainVerticle.java

@@ -52,6 +52,7 @@ public class MainVerticle extends AbstractVerticle {
         router.post("/addObject").handler(setObjects::newObject);
         router.get("/getRange").handler(queryWeather::getRangeData);
         router.post("/modifRangeData").handler(setWeatherData::setRangeData);
+        router.post("/deleteObject").handler(setObjects::deleteObject);
 
         // Routes d'authentification
         router.post("/signup").handler(authHandler::handleSignup);

Back-end/src/main/java/com/example/starter/QueryObjects.java

@@ -78,7 +78,8 @@ public class QueryObjects {
           .put("last_update", row.getLocalDateTime("last_update").format(formatter))
           .put("status", row.getString("status"))
           .put("batterie",row.getInteger("batterie"))
-          .put("type_batterie",row.getString("type_batterie"));
+          .put("type_batterie",row.getString("type_batterie"))
+          .put("proprio",row.getString("proprio"));
       objects.add(object);
     }
     return objects;

Back-end/src/main/java/com/example/starter/SetObjects.java

@@ -48,7 +48,38 @@ public class SetObjects {
                     return;
                 });
     }
+    public void deleteObject(RoutingContext context){
+        JsonObject body = context.body().asJsonObject();
+        if(body== null){
+            context.response()
+                .setStatusCode(400)
+                .end(new JsonObject().put("error","Corps de la requête manquant").encode());
+            return;
+        }
+        String id = body.getString("id");
+        databaseService.pool
+            .preparedQuery("DELETE FROM weather_objects WHERE id=?")
+            .execute(Tuple.of(Integer.parseInt(id)))
+            .onFailure(e->{
+                System.err.println("Erreur de récupération de la BDD :"+e.getMessage());
+                context.response()
+                    .setStatusCode(500) 
+                    .end(new JsonObject().put("error","Erreur de récupération de la BDD").encode());
+            })
+            .onSuccess(rows -> {
+                if(rows.rowCount()==0){
+                    context.response()
+                                .setStatusCode(404)
+                                .end(new JsonObject().put("error", "Objet non trouvé").encode());
+                        return;
+                }
+                context.response()
+                    .putHeader("content-type","application/json: charset=UTF-8")
+                    .end(new JsonObject().put("success", "L'objet à bien été supprimé").encode());
+                return;
+            });
 
+    }
     public void newObject(RoutingContext context){
         JsonObject body = context.body().asJsonObject();
         if(body== null){
@@ -62,9 +93,11 @@ public class SetObjects {
         String type = body.getString("type");
         String location = body.getString("location");
         String status = body.getString("status");
+        String batterieType = body.getString("batterieType");
+        String proprio = body.getString("proprio");
         databaseService.pool
-            .preparedQuery("INSERT INTO weather_objects (name,description,type,location,status) VALUES (?,?,?,?,?)")
+            .preparedQuery("INSERT INTO weather_objects (name,description,type,location,status,type_batterie,proprio) VALUES (?,?,?,?,?,?,?)")
-            .execute(Tuple.of(name,description,type,location,status))
+            .execute(Tuple.of(name,description,type,location,status,batterieType,proprio))
             .onFailure(e->{
                 System.err.println("Erreur de récupération de la BDD :"+e.getMessage());
                 context.response()

Front-end/src/App.jsx

@@ -18,8 +18,6 @@ import AdminObjet from "./pages/Admin/AdminObjet.jsx";
 function App() {
   return (
     <AuthProvider>
-      {" "}
-      {/* Enveloppe l'application avec AuthProvider */}
       <Router>
         <div>
           <Header />

Front-end/src/components/FormNewObject.jsx

@@ -0,0 +1,257 @@
+import React, { useState } from "react";
+import { BadgePlus } from "lucide-react";
+import axios from "axios";
+import { API_BASE_URL } from "../config";
+
+function FormNewObject({ isAdmin }) {
+  const [description, setDescription] = useState("");
+  const [type, setType] = useState("");
+  const [location, setLocalisation] = useState("");
+  const [proprio,setProprio] = useState("");
+  const [batterieType,setBatterieType] = useState("");
+  /*TODO*/
+  /*Definir proprio avec le nom de l'user qui ajoute*/
+  const [status, setStatus] = useState("active");
+  const [nom, setNom] = useState("");
+  const [Response, setResponse] = useState(null);
+  const [isActive, setActive] = useState(true);
+  const [verif, setVerif] = useState(false);
+  const [enregistre, setEnregistre] = useState(false);
+  const [messRequete, setMessRequete] = useState("");
+  function handleSubmit(event) {
+    event.preventDefault();
+
+    if (verif) {
+      console.log("Envoi requete");
+      axios
+        .post(`${API_BASE_URL}/addObject`, {
+          nom,
+          description,
+          type,
+          location,
+          status,
+          batterieType,
+          proprio
+        })
+        .then((response) => {
+          setMessRequete("Votre objet à bien été enregistré !");
+          setEnregistre(true);
+          console.log("Ajout de l'objet réussit :", response.data);
+        })
+        .catch((error) => {
+          setMessRequete("Il y a eu une erreur dans l'ajout de votre objet !");
+          console.error("Erreur lors de l'ajout de l'objet :", error);
+        });
+      setVerif(false);
+      resetForm();
+    } else {
+      setVerif(true);
+    }
+  }
+  function resetForm() {
+    setNom("");
+    setStatus("active");
+    setDescription("");
+    setType("");
+    setLocalisation("");
+    setBatterieType("");
+    if(isAdmin)setProprio("");
+    setActive(true);
+  }
+  function handleCancel() {
+    if (verif) {
+      setVerif(false);
+    } else {
+      resetForm();
+    }
+  }
+  function handleStatusChange() {
+    setActive((prevIsActive) => {
+      const newIsActive = !prevIsActive;
+      setStatus(newIsActive ? "active" : "inactive");
+      return newIsActive;
+    });
+  }
+
+  return (
+    <form onSubmit={handleSubmit} className="bg-white p-6 rounded-xl min-w-5xl">
+      <div className="flex align-items gap-9">
+        {isAdmin ? (
+          <h2 className="text-2xl font-semibold mb-3">
+            Ajouter un nouvel objet
+          </h2>
+        ) : (
+          <>
+            <div className="w-12 h-12 bg-indigo-100 rounded-lg flex items-center justify-center mb-4">
+              <BadgePlus className="text-indigo-600" size={24} />
+            </div>
+            <h1 className="text-black text-2xl font-bold mb-1">
+              {!verif
+                ? "Entrez les données de votre nouvel objet"
+                : "Êtes-vous sûr de ces données ?"}
+            </h1>
+          </>
+        )}
+      </div>
+      <div className="mb-5">
+        <label
+          htmlFor="nom"
+          className="block mb-2 text-sm font-medium text-gray-900"
+        >
+          Nom :
+        </label>
+        <input
+          id="nom"
+          className="text-gray-600 border rounded-lg p-2 w-full"
+          type="text"
+          value={nom}
+          onChange={(e) => setNom(e.target.value)}
+          required
+          disabled={verif}
+        />
+      </div>
+      <div className="mb-5">
+        <label
+          htmlFor="description"
+          className="block mb-2 text-sm font-medium text-gray-900"
+        >
+          Description :
+        </label>
+        <input
+          id="description"
+          className="text-gray-600 border rounded-lg p-2 w-full"
+          type="text"
+          value={description}
+          onChange={(e) => setDescription(e.target.value)}
+          required
+          disabled={verif}
+        />
+      </div>
+
+      <div className="mb-5">
+        <label
+          htmlFor="type"
+          className="block mb-2 text-sm font-medium text-gray-900"
+        >
+          Type :
+        </label>
+        <input
+          id="type"
+          className="text-gray-600 border rounded-lg p-2 w-full"
+          type="text"
+          value={type}
+          onChange={(e) => setType(e.target.value)}
+          required
+          disabled={verif}
+        />
+      </div>
+
+      <div className="mb-5">
+        <label
+          htmlFor="location"
+          className="block mb-2 text-sm font-medium text-gray-900"
+        >
+          Localisation :
+        </label>
+        <input
+          id="location"
+          className="text-gray-600 border rounded-lg p-2 w-full"
+          type="text"
+          value={location}
+          onChange={(e) => setLocalisation(e.target.value)}
+          required
+          disabled={verif}
+        />
+      </div>
+      <div className="mb-5">
+        <label
+          htmlFor="batterieType"
+          className="block mb-2 text-sm font-medium text-gray-900"
+        >
+          Type de batterie :
+        </label>
+        <input
+          id="batterieType"
+          className="text-gray-600 border rounded-lg p-2 w-full"
+          type="text"
+          value={batterieType}
+          onChange={(e) => setBatterieType(e.target.value)}
+          required
+          disabled={verif}
+        />
+      </div>
+      <div className="mb-5">
+        <label
+          htmlFor="proprio"
+          className="block mb-2 text-sm font-medium text-gray-900"
+        >
+          Propriétaire :
+        </label>
+        <input
+          id="proprio"
+          className="text-gray-600 border rounded-lg p-2 w-full"
+          type="text"
+          value={proprio}
+          onChange={(e) => setProprio(e.target.value)}
+          required
+          disabled={verif||!isAdmin}
+        />
+      </div>
+
+      <div className="mb-5">
+        <label className="block mb-2 text-sm font-medium text-gray-900">
+          Status :
+        </label>
+        <div className="inline-flex items-center gap-2">
+          <label
+            htmlFor="switch-component-on"
+            className="text-slate-600 text-sm cursor-pointer"
+          >
+            Inactive
+          </label>
+          <div className="relative inline-block w-11 h-5">
+            <input
+              id="switch-component-on"
+              type="checkbox"
+              checked={isActive}
+              onChange={handleStatusChange}
+              className="peer appearance-none w-11 h-5 bg-slate-100 rounded-full checked:bg-slate-800 cursor-pointer transition-colors duration-300"
+              disabled={verif}
+            />
+            <label
+              htmlFor="switch-component-on"
+              className="absolute top-0 left-0 w-5 h-5 bg-white rounded-full border border-slate-300 shadow-sm transition-transform duration-300 peer-checked:translate-x-6 peer-checked:border-slate-800 cursor-pointer"
+            ></label>
+          </div>
+          <label
+            htmlFor="switch-component-on"
+            className="text-slate-600 text-sm cursor-pointer"
+          >
+            Active
+          </label>
+        </div>
+      </div>
+
+      <div className="flex flex-col mb-5 ">
+        <button
+          type={"submit"}
+          className="text-blue-500 hover:cursor-pointer hover:underline mb-2"
+        >
+          {!verif ? "Confirmer les informations" : "Oui je suis sûr !"}
+        </button>
+        <button
+          type="button"
+          className="text-red-500 hover:cursor-pointer hover:underline"
+          onClick={handleCancel}
+        >
+          {!verif ? "Supprimer les informations" : "Non je veux changer !"}
+        </button>
+      </div>
+      <p className={enregistre ? "text-green-700" : "text-red-700"}>
+        {messRequete}
+      </p>
+    </form>
+  );
+}
+
+export default FormNewObject;

Front-end/src/components/Header.jsx

@@ -8,7 +8,7 @@ function Header() {
   const [isMenuOpen, setIsMenuOpen] = useState(false);
 
   return (
-    <header className="bg-white shadow-sm">
+    <header className="bg-white shadow-md sticky">
       <div className="mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center ">
         <Link to="/" className="text-2xl font-bold text-indigo-600">VigiMétéo</Link>
         <button
@@ -31,7 +31,7 @@ function Header() {
             </li>
             <li>
               <Link to="/about" className="text-gray-600 hover:text-indigo-600">
-                A propos
+                À propos
               </Link>
             </li>
             <li>

Front-end/src/pages/Admin/AdminObjet.jsx

@@ -1,10 +1,20 @@
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import Sidebar from "./sidebar.jsx";
+import axios from "axios";
+import { API_BASE_URL } from "../../config";
+import AddObject from "../Gestion/AddObject.jsx";
+import FormNewObject from "../../components/FormNewObject.jsx";
 
 function AdminObjet() {
-  // Gestion des catégories
   const [categories, setCategories] = useState(["Catégorie 1", "Catégorie 2"]);
   const [newCategory, setNewCategory] = useState("");
+  const [objects, setObjects] = useState([]);
+
+  useEffect(() => {
+    axios.get(`${API_BASE_URL}/objets`).then((response) => {
+      setObjects(response.data);
+    });
+  }, []);
 
   const handleAddCategory = () => {
     const trimmed = newCategory.trim();
@@ -13,23 +23,16 @@ function AdminObjet() {
       setNewCategory("");
     }
   };
-
   const handleDeleteCategory = (categoryToDelete) => {
     setCategories(categories.filter((cat) => cat !== categoryToDelete));
   };
 
-  // Gestion des objets et outils/services
+  const [name, setName] = useState("");
-  // On ajoute maintenant le champ "propriétaire"
-  const [objects, setObjects] = useState([]);
-
-  // Champs du formulaire d'ajout d'objet (inspiré de AddObject.jsx)
-  const [nom, setNom] = useState("");
   const [description, setDescription] = useState("");
   const [type, setType] = useState("");
-  const [localisation, setLocalisation] = useState("");
+  const [location, setLocation] = useState("");
   const [proprietaire, setProprietaire] = useState("");
   const [status, setStatus] = useState("active");
-  const [isActive, setIsActive] = useState(true);
   const [verif, setVerif] = useState(false);
   const [enregistre, setEnregistre] = useState(false);
   const [messRequete, setMessRequete] = useState("");
@@ -39,10 +42,10 @@ function AdminObjet() {
     if (verif) {
       const newObj = {
         id: Date.now(),
-        nom: nom.trim(),
+        name: name.trim(),
         description: description.trim(),
         type: type.trim(),
-        localisation: localisation.trim(),
+        location: location.trim(),
         proprietaire: proprietaire.trim(),
         status: status,
       };
@@ -51,42 +54,29 @@ function AdminObjet() {
       setEnregistre(true);
       setVerif(false);
       resetForm();
+      window.location.reload();
     } else {
       setVerif(true);
     }
   };
-
+  const handleDeleteObject = (id) => {
-  const resetForm = () => {
+    axios
-    setNom("");
+      .post(`${API_BASE_URL}/deleteObject`, {
-    setDescription("");
+        id,
-    setType("");
+      })
-    setLocalisation("");
+      .then((response) => {
-    setProprietaire("");
+        setMessRequete("Votre objet à bien été supprimé !");
-    setStatus("active");
+        console.log("Votre objet à été supprimé :", response.data);
-    setIsActive(true);
+        window.location.reload();
-  };
+      })
-
+      .catch((error) => {
-  const handleCancel = () => {
+        setMessRequete(
-    if (verif) {
+          "Il y a eu une erreur dans la suppression de votre objet !"
-      setVerif(false);
+        );
-    } else {
+        console.error("Erreur lors de la suppression de l'objet :", error);
-      resetForm();
-    }
-  };
-
-  const handleStatusChange = () => {
-    setIsActive((prev) => {
-      const newIsActive = !prev;
-      setStatus(newIsActive ? "active" : "inactive");
-      return newIsActive;
       });
   };
 
-  const handleDeleteObject = (id) => {
-    setObjects(objects.filter((obj) => obj.id !== id));
-  };
-
-  // Tri des objets en fonction d'une catégorie sélectionnée
   const [sortCriteria, setSortCriteria] = useState("");
 
   const sortedObjects = [...objects].sort((a, b) => {
@@ -96,7 +86,6 @@ function AdminObjet() {
     return fieldA.localeCompare(fieldB);
   });
 
-  // Règles globales
   const [energyPriority, setPriority] = useState("");
   const [alertSettings, setAlertSettings] = useState("");
 
@@ -154,163 +143,11 @@ function AdminObjet() {
               ))}
             </ul>
           </section>
-
           {/*Formulaire d'ajout d'objet*/}
-          <section className="bg-white p-6 rounded-xl shadow-md mb-12">
+          <FormNewObject isAdmin={true} />
-            <div className="flex items-center gap-4 mb-5">
-              <div className="w-12 h-12 bg-indigo-100 rounded-lg flex items-center justify-center">
-                <span className="text-indigo-600 text-xl">+</span>
-              </div>
-              <h2 className="text-2xl font-bold text-gray-900">
-                {!verif
-                  ? "Entrez les données de votre nouvel objet"
-                  : "Êtes-vous sûr de ces données ?"}
-              </h2>
-            </div>
-            <form onSubmit={handleSubmit} className="space-y-5">
-              <div>
-                <label
-                  htmlFor="nom"
-                  className="block mb-2 text-sm font-medium text-gray-900"
-                >
-                  Nom :
-                </label>
-                <input
-                  id="nom"
-                  type="text"
-                  value={nom}
-                  onChange={(e) => setNom(e.target.value)}
-                  required
-                  disabled={verif}
-                  className="w-full p-2 border border-gray-300 rounded-lg text-gray-600"
-                />
-              </div>
-              <div>
-                <label
-                  htmlFor="description"
-                  className="block mb-2 text-sm font-medium text-gray-900"
-                >
-                  Description :
-                </label>
-                <input
-                  id="description"
-                  type="text"
-                  value={description}
-                  onChange={(e) => setDescription(e.target.value)}
-                  required
-                  disabled={verif}
-                  className="w-full p-2 border border-gray-300 rounded-lg text-gray-600"
-                />
-              </div>
-              <div>
-                <label
-                  htmlFor="type"
-                  className="block mb-2 text-sm font-medium text-gray-900"
-                >
-                  Type :
-                </label>
-                <input
-                  id="type"
-                  type="text"
-                  value={type}
-                  onChange={(e) => setType(e.target.value)}
-                  required
-                  disabled={verif}
-                  className="w-full p-2 border border-gray-300 rounded-lg text-gray-600"
-                />
-              </div>
-              <div>
-                <label
-                  htmlFor="localisation"
-                  className="block mb-2 text-sm font-medium text-gray-900"
-                >
-                  Localisation :
-                </label>
-                <input
-                  id="localisation"
-                  type="text"
-                  value={localisation}
-                  onChange={(e) => setLocalisation(e.target.value)}
-                  required
-                  disabled={verif}
-                  className="w-full p-2 border border-gray-300 rounded-lg text-gray-600"
-                />
-              </div>
-              <div>
-                <label
-                  htmlFor="proprietaire"
-                  className="block mb-2 text-sm font-medium text-gray-900"
-                >
-                  Propriétaire :
-                </label>
-                <input
-                  id="proprietaire"
-                  type="text"
-                  value={proprietaire}
-                  onChange={(e) => setProprietaire(e.target.value)}
-                  required
-                  disabled={verif}
-                  className="w-full p-2 border border-gray-300 rounded-lg text-gray-600"
-                />
-              </div>
-              <div>
-                <label className="block mb-2 text-sm font-medium text-gray-900">
-                  Status :
-                </label>
-                <div className="flex items-center gap-2">
-                  <label
-                    htmlFor="switch-component-on"
-                    className="text-slate-600 text-sm cursor-pointer"
-                  >
-                    Inactive
-                  </label>
-                  <div className="relative inline-block w-11 h-5">
-                    <input
-                      id="switch-component-on"
-                      type="checkbox"
-                      checked={isActive}
-                      onChange={handleStatusChange}
-                      disabled={verif}
-                      className="peer appearance-none w-11 h-5 bg-slate-100 rounded-full cursor-pointer transition-colors duration-300"
-                    />
-                    <label
-                      htmlFor="switch-component-on"
-                      className="absolute top-0 left-0 w-5 h-5 bg-white rounded-full border border-slate-300 shadow-sm transition-transform duration-300 peer-checked:translate-x-6 peer-checked:border-slate-800 cursor-pointer"
-                    ></label>
-                  </div>
-                  <label
-                    htmlFor="switch-component-on"
-                    className="text-slate-600 text-sm cursor-pointer"
-                  >
-                    Active
-                  </label>
-                </div>
-              </div>
-              <div className="flex flex-col">
-                <button
-                  type="submit"
-                  className="text-blue-500 hover:underline mb-2"
-                >
-                  {!verif ? "Confirmer les informations" : "Oui je suis sûr !"}
-                </button>
-                <button
-                  type="button"
-                  onClick={handleCancel}
-                  className="text-red-500 hover:underline"
-                >
-                  {!verif
-                    ? "Supprimer les informations"
-                    : "Non je veux changer !"}
-                </button>
-              </div>
-              <p className={enregistre ? "text-green-700" : "text-red-700"}>
-                {messRequete}
-              </p>
-            </form>
-          </section>
 
           {/* Tri des objets */}
-          <section className="bg-white p-6 rounded-xl shadow-md mb-12">
+          <section className="bg-white p-6 rounded-xl shadow-md mt-12 mb-12">
             <div className="flex items-center justify-between mb-4">
               <h2 className="text-2xl font-semibold">
                 Liste des Objets et Outils/Services
@@ -322,7 +159,7 @@ function AdminObjet() {
               >
                 <option value="">-- Trier par --</option>
                 <option value="proprietaire">Propriétaire</option>
-                <option value="localisation">Lieux</option>
+                <option value="location">Lieux</option>
                 <option value="type">Type</option>
                 <option value="status">Status</option>
               </select>
@@ -356,7 +193,7 @@ function AdminObjet() {
                   {sortedObjects.map((obj) => (
                     <tr key={obj.id}>
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
-                        {obj.nom}
+                        {obj.name}
                       </td>
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                         {obj.description}
@@ -365,10 +202,10 @@ function AdminObjet() {
                         {obj.type}
                       </td>
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
-                        {obj.localisation}
+                        {obj.location}
                       </td>
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
-                        {obj.proprietaire}
+                        {obj.proprio}
                       </td>
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                         {obj.status}

Front-end/src/pages/Admin/sidebar.jsx

@@ -11,12 +11,12 @@ function Sidebar() {
               className="text-white no-underline hover:underline"
               href="/dashboard"
             >
-              Dashboard
+              Tableau de bord
             </a>
           </li>
           <li className="mb-3">
             <a className="text-white no-underline hover:underline" href="/user">
-              Users
+              Utilisateurs
             </a>
           </li>
           <li className="mb-3">
@@ -24,17 +24,17 @@ function Sidebar() {
               className="text-white no-underline hover:underline"
               href="/adminobjet"
             >
-              AdminObjet
+              Gestion des objets
             </a>
           </li>
           <li className="mb-3">
             <a className="text-white no-underline hover:underline" href="#">
-              Settings
+              Paramètres
             </a>
           </li>
           <li className="mb-3">
             <a className="text-white no-underline hover:underline" href="#">
-              Reports
+              Rapports
             </a>
           </li>
         </ul>

Front-end/src/pages/Gestion/AddObject.jsx

@@ -1,71 +1,7 @@
 import React, { useState } from "react";
-import { BadgePlus } from "lucide-react";
+import FormNewObject from "../../components/FormNewObject";
-import axios from "axios";
-import { API_BASE_URL } from "../../config";
 
 function AddObject() {
-  const [description, setDescription] = useState("");
-  const [type, setType] = useState("");
-  const [location, setLocalisation] = useState("");
-  const [status, setStatus] = useState("active");
-  const [nom, setNom] = useState("");
-  const [Response, setResponse] = useState(null);
-  const [isActive, setActive] = useState(true);
-  const [verif, setVerif] = useState(false);
-  const [enregistre, setEnregistre] = useState(false);
-  const [messRequete, setMessRequete] = useState("");
-  function handleSubmit(event) {
-    event.preventDefault();
-
-    if (verif) {
-      console.log("Envoi requete");
-        axios
-          .post(`${API_BASE_URL}/addObject`, {
-            nom,
-            description,
-            type,
-            location,
-            status,
-          })
-          .then((response) => {
-            setMessRequete("Votre objet à bien été enregistré !");
-            setEnregistre(true);
-            console.log("Ajout de l'objet réussit :", response.data);
-          })
-          .catch((error) => {
-            setMessRequete("Il y a eu une erreur dans l'ajout de votre objet !");
-            console.error("Erreur lors de l'ajout de l'objet :", error);
-          });
-      setVerif(false);
-      resetForm();
-    } else {
-      setVerif(true);
-    }
-  }
-  function resetForm() {
-    setNom("");
-    setStatus("");
-    setDescription("");
-    setType("");
-    setLocalisation("");
-    setActive(true);
-  }
-  function handleCancel() {
-    if (verif) {
-      setVerif(false);
-    } else {
-      resetForm();
-    }
-  }
-
-  function handleStatusChange() {
-    setActive((prevIsActive) => {
-      const newIsActive = !prevIsActive;
-      setStatus(newIsActive ? "active" : "inactive");
-      return newIsActive;
-    });
-  }
-
   return (
     <div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-50">
       <div className=" max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
@@ -74,144 +10,7 @@ function AddObject() {
             Nouvel objet
           </h2>
         </div>
-        <form
+        <FormNewObject />
-          onSubmit={handleSubmit}
-          className="bg-white p-6 rounded-xl min-w-5xl"
-        >
-          <div className="flex align-items gap-9">
-            <div className="w-12 h-12 bg-indigo-100 rounded-lg flex items-center justify-center mb-4">
-              <BadgePlus className="text-indigo-600" size={24} />
-            </div>
-            <h1 className="text-black text-2xl font-bold mb-1">
-              {!verif
-                ? "Entrez les données de votre nouvel objet"
-                : "Êtes-vous sûr de ces données ?"}
-            </h1>
-          </div>
-          <div className="mb-5">
-            <label
-              htmlFor="nom"
-              className="block mb-2 text-sm font-medium text-gray-900"
-            >
-              Nom :
-            </label>
-            <input
-              id="nom"
-              className="text-gray-600 border rounded-lg p-2 w-full"
-              type="text"
-              value={nom}
-              onChange={(e) => setNom(e.target.value)}
-              required
-              disabled={verif}
-            />
-          </div>
-          <div className="mb-5">
-            <label
-              htmlFor="description"
-              className="block mb-2 text-sm font-medium text-gray-900"
-            >
-              Description :
-            </label>
-            <input
-              id="description"
-              className="text-gray-600 border rounded-lg p-2 w-full"
-              type="text"
-              value={description}
-              onChange={(e) => setDescription(e.target.value)}
-              required
-              disabled={verif}
-            />
-          </div>
-
-          <div className="mb-5">
-            <label
-              htmlFor="type"
-              className="block mb-2 text-sm font-medium text-gray-900"
-            >
-              Type :
-            </label>
-            <input
-              id="type"
-              className="text-gray-600 border rounded-lg p-2 w-full"
-              type="text"
-              value={type}
-              onChange={(e) => setType(e.target.value)}
-              required
-              disabled={verif}
-            />
-          </div>
-
-          <div className="mb-5">
-            <label
-              htmlFor="location"
-              className="block mb-2 text-sm font-medium text-gray-900"
-            >
-              Localisation :
-            </label>
-            <input
-              id="location"
-              className="text-gray-600 border rounded-lg p-2 w-full"
-              type="text"
-              value={location}
-              onChange={(e) => setLocalisation(e.target.value)}
-              required
-              disabled={verif}
-            />
-          </div>
-
-          <div className="mb-5">
-            <label className="block mb-2 text-sm font-medium text-gray-900">
-              Status :
-            </label>
-            <div className="inline-flex items-center gap-2">
-              <label
-                htmlFor="switch-component-on"
-                className="text-slate-600 text-sm cursor-pointer"
-              >
-                Inactive
-              </label>
-              <div className="relative inline-block w-11 h-5">
-                <input
-                  id="switch-component-on"
-                  type="checkbox"
-                  checked={isActive}
-                  onChange={handleStatusChange}
-                  className="peer appearance-none w-11 h-5 bg-slate-100 rounded-full checked:bg-slate-800 cursor-pointer transition-colors duration-300"
-                  disabled={verif}
-                />
-                <label
-                  htmlFor="switch-component-on"
-                  className="absolute top-0 left-0 w-5 h-5 bg-white rounded-full border border-slate-300 shadow-sm transition-transform duration-300 peer-checked:translate-x-6 peer-checked:border-slate-800 cursor-pointer"
-                ></label>
-              </div>
-              <label
-                htmlFor="switch-component-on"
-                className="text-slate-600 text-sm cursor-pointer"
-              >
-                Active
-              </label>
-            </div>
-          </div>
-
-          <div className="flex flex-col mb-5 ">
-            <button
-              type={"submit"}
-              className="text-blue-500 hover:cursor-pointer hover:underline mb-2"
-            >
-              {!verif ? "Confirmer les informations" : "Oui je suis sûr !"}
-            </button>
-            <button
-              type="button"
-              className="text-red-500 hover:cursor-pointer hover:underline"
-              onClick={handleCancel}
-            >
-              {!verif ? "Supprimer les informations" : "Non je veux changer !"}
-            </button>
-          </div>
-            <p className={(enregistre)?("text-green-700"):("text-red-700")}>
-              {messRequete}
-            </p>
-        </form>
       </div>
     </div>
   );