import { FamilyPageTitle } from "../../../widgets/FamilyPageTitle";
import { useGenealogy } from "../../../widgets/genealogy/BaseGenealogyRoute";

export function GenealogyHomeRoute(): React.ReactElement {
  const genealogy = useGenealogy();
  return (
    <>
      <FamilyPageTitle title="Généalogie de votre famille" />
      <div style={{ margin: "20px" }}>
        <p>
          Depuis cette section de l'application, vous pouvez afficher et
          compléter l'abre généalogique de votre famille.
        </p>
        <p>&nbsp;</p>
        <p>Nombre de fiches de membres: {genealogy.members.size}</p>
        <p>Nombre de fiches de couples: {genealogy.couples.size}</p>
      </div>
    </>
  );
}