permissions review

src/components/SettingsModal/SettingsModal.jsx

@@ -6,6 +6,7 @@ import ThemeSwitcher from "../ui/themeSwitcher/ThemeSwitcher.jsx";
 import { AuthContext } from "../../contexts/auth/AuthContext.js";
 import TextInput from "../ui/input/input.jsx";
 import updateUser from "../../utils/users/updateUser.js";
+import deleteUser from "../../utils/users/deleteUser.js";
 
 
 export default function SettingsModal() {
@@ -13,6 +14,7 @@ export default function SettingsModal() {
     const { user, logout, update } = useContext(AuthContext);
 
     const [open, setOpen] = useState(false);
+    const [isDelete, setIsDelete] = useState(false);
 
     const [name, setName] = useState(user?.name);
     const [lastname, setLastName] = useState(user?.lastname);
@@ -27,6 +29,11 @@ export default function SettingsModal() {
         update();
     }
 
+    const handleDelete = async () => {
+        await deleteUser();
+        update();
+    }
+
     return (
         <>
             <Button variant={"transparent"} onClick={() => setOpen(!open)}>
@@ -39,6 +46,7 @@ export default function SettingsModal() {
                     <div className={styles.section}>
                         <h3>Compte</h3>
                         <Button variant={"danger"} onClick={handleLogout}> Déconnexion </Button>
+                        <Button variant={"danger"} onClick={() => setIsDelete(true)}> Supprimer le compte </Button>
 
                         <div className={styles.section}>
                             <h4>Changer de Prénom</h4>
@@ -65,6 +73,14 @@ export default function SettingsModal() {
                     </div>
                 </div>
             </Modal>
+
+
+            <Modal title={"Validation"} open={isDelete} onClose={() => setIsDelete(false)}>
+                <div className={styles.section}>
+                    <p className={styles.alignText}> Êtes vous vraiment sûr de vouloir supprimer votre compte ?</p>
+                    <Button variant={"danger"} className={styles.submitBtn} onClick={handleDelete}>Confirmer</Button>
+                </div>
+            </Modal>
         </>
     )
 }