Can join a family

geneit_app/src/dialogs/CreateFamilyDialog.tsx

@@ -39,7 +39,7 @@ export function CreateFamilyDialog(p: {
   return (
     <TextInputDialog
       open={p.open}
-      title="Creation d'une famille"
+      title="Création d'une famille"
       text="Veuillez définir le nom que vous souhaitez donner à la famille créée :"
       label="Nom de la famille"
       minLen={ServerApi.Config.constraints.family_name_len.min}

geneit_app/src/dialogs/JoinFamilyDialog.tsx

@@ -0,0 +1,81 @@
+import React from "react";
+import { TextInputDialog } from "./TextInputDialog";
+import { ServerApi } from "../api/ServerApi";
+import { FamilyApi, JoinFamilyResult } from "../api/FamilyApi";
+import { useAlert } from "../widgets/AlertDialogProvider";
+
+export function JoinFamilyDialog(p: {
+  open: boolean;
+  onClose: () => void;
+  onJoined: () => void;
+}): React.ReactElement {
+  const [code, setCode] = React.useState("");
+  const [joining, setJoining] = React.useState(false);
+  const [error, setError] = React.useState<string>();
+
+  const alert = useAlert();
+
+  const cancel = () => {
+    setCode("");
+    setJoining(false);
+    setError(undefined);
+    p.onClose();
+  };
+
+  const joinFamily = async () => {
+    setJoining(true);
+    setError(undefined);
+    try {
+      const res = await FamilyApi.JoinFamily(code);
+
+      switch (res) {
+        case JoinFamilyResult.Success:
+          setCode("");
+          p.onJoined();
+          await alert.alert("La famille a été rejointe avec succès !");
+          break;
+
+        case JoinFamilyResult.TooManyRequests:
+          setError("Trop de tentatives, veuillez réessayer ultérieurement...");
+          break;
+
+        case JoinFamilyResult.InvalidCode:
+          setError("Le code spécifié est invalide !");
+          break;
+
+        case JoinFamilyResult.AlreadyMember:
+          setError("Vous êtes déjà membre de cette famille !");
+          break;
+
+        case JoinFamilyResult.Error:
+          setError("Erreur lors de la tentative de jonction à la famille !");
+          break;
+      }
+    } catch (e) {
+      console.error(e);
+      setError("Echec de l'appel au serveur !");
+    }
+    setJoining(false);
+  };
+
+  return (
+    <TextInputDialog
+      open={p.open}
+      title="Rejoindre une famille"
+      text="Veuillez spécifier le code d'invitation de la famille :"
+      label="Code de la famille"
+      minLen={ServerApi.Config.constraints.invitation_code_len.min}
+      maxLen={ServerApi.Config.constraints.invitation_code_len.max}
+      onClose={cancel}
+      onCancel={cancel}
+      submitButton="Rejoindre la famille"
+      value={code}
+      onValueChange={setCode}
+      isChecking={joining}
+      checkingMessage="Jointure en cours..."
+      errorIsBlocking={false}
+      error={error}
+      onSubmit={joinFamily}
+    />
+  );
+}