Can delete a family

geneit_app/src/api/FamilyApi.ts

@@ -202,4 +202,14 @@ export class FamilyApi {
       },
     });
   }
+
+  /**
+   * Delete a family
+   */
+  static async DeleteFamily(family: Family) {
+    await APIClient.exec({
+      method: "DELETE",
+      uri: `/family/${family.family_id}`,
+    });
+  }
 }

geneit_app/src/routes/family/FamilySettingsRoute.tsx

@@ -9,15 +9,20 @@ import {
   Typography,
 } from "@mui/material";
 import React from "react";
+import { useNavigate } from "react-router-dom";
 import { FamilyApi } from "../../api/FamilyApi";
 import { ServerApi } from "../../api/ServerApi";
 import { useAlert } from "../../context_providers/AlertDialogProvider";
+import { useConfirm } from "../../context_providers/ConfirmDialogProvider";
 import { useFamily } from "../../widgets/BaseFamilyRoute";
 import { formatDate } from "../../widgets/TimeWidget";
 
 export function FamilySettingsRoute(): React.ReactElement {
-  const family = useFamily();
   const alert = useAlert();
+  const confirm = useConfirm();
+  const navigate = useNavigate();
+
+  const family = useFamily();
 
   const [newName, setNewName] = React.useState(family.family.name);
 
@@ -45,6 +50,26 @@ export function FamilySettingsRoute(): React.ReactElement {
     }
   };
 
+  const deleteFamily = async () => {
+    try {
+      if (
+        !(await confirm(
+          "Voulez-vous vraiment supprimer cette famille, et toute les données qui s'y rattachent ? Cette opération est absolument irréversible !"
+        ))
+      )
+        return;
+
+      await FamilyApi.DeleteFamily(family.family);
+
+      await alert("La famille a été supprimée avec succès !");
+
+      navigate("/");
+    } catch (e) {
+      console.error(e);
+      alert("Echec de la suppression de la famille !");
+    }
+  };
+
   return (
     <>
       <Card style={{ margin: "10px auto", maxWidth: "450px" }}>
@@ -100,6 +125,17 @@ export function FamilySettingsRoute(): React.ReactElement {
           </Button>
         </CardActions>
       </Card>
+
+      <div style={{ textAlign: "center", marginTop: "50px" }}>
+        <Button
+          size="small"
+          color="error"
+          onClick={deleteFamily}
+          disabled={!family.family.is_admin}
+        >
+          Supprimer la famille
+        </Button>
+      </div>
     </>
   );
 }