Can request account deletion

geneit_app/src/routes/ProfileRoute.tsx

@@ -16,6 +16,8 @@ import { ReplacePasswordResponse, User, UserApi } from "../api/UserApi";
 import { AsyncWidget } from "../widgets/AsyncWidget";
 import { PasswordInput } from "../widgets/PasswordInput";
 import { formatDate } from "../widgets/TimeWidget";
+import { useConfirm } from "../widgets/ConfirmDialogProvider";
+import { useAlert } from "../widgets/AlertDialogProvider";
 
 export function ProfileRoute(): React.ReactElement {
   const [user, setUser] = React.useState<null | User>(null);
@@ -41,6 +43,7 @@ export function ProfileRoute(): React.ReactElement {
             onUpdate={() => (counter.current += 1)}
           />
           {user?.has_password && <ChangePasswordCard />}
+          <DeleteAccountButton />
         </div>
       )}
     />
@@ -258,3 +261,37 @@ function ChangePasswordCard(): React.ReactElement {
     </>
   );
 }
+
+function DeleteAccountButton(): React.ReactElement {
+  const alert = useAlert();
+  const confirm = useConfirm();
+
+  const requestDelete = async () => {
+    try {
+      if (
+        !(await confirm.confirm(
+          "Voulez-vous initier la suppression de votre compte ?",
+          "Suppression de compte"
+        ))
+      )
+        return;
+
+      await UserApi.RequestAccountDeletion();
+
+      await alert.alert(
+        "Demande de suppression de compte enregistrée avec succès. Veuillez consulter votre boîte mail."
+      );
+    } catch (e) {
+      console.error(e);
+      alert.alert("Echec de la demande de suppression de compte !");
+    }
+  };
+
+  return (
+    <div style={{ textAlign: "center" }}>
+      <Button onClick={requestDelete} color="error">
+        Supprimer mon compte
+      </Button>
+    </div>
+  );
+}