import React from "react";
import { TextInputDialog } from "./TextInputDialog";
import { ServerApi } from "../api/ServerApi";
import { FamilyApi, JoinFamilyResult } from "../api/FamilyApi";
import { useAlert } from "../context_providers/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("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}
    />
  );
}