WIP genealogy refactoring
This commit is contained in:
parent
f686d3fcbf
commit
7594913c26
@ -37,6 +37,7 @@ import { FamilyCouplesListRoute } from "./routes/family/genealogy/FamilyCouplesL
|
|||||||
import { FamilyTreeRoute } from "./routes/family/genealogy/FamilyTreeRoute";
|
import { FamilyTreeRoute } from "./routes/family/genealogy/FamilyTreeRoute";
|
||||||
import { FamilyMemberTreeRoute } from "./routes/family/genealogy/FamilyMemberTreeRoute";
|
import { FamilyMemberTreeRoute } from "./routes/family/genealogy/FamilyMemberTreeRoute";
|
||||||
import { GenealogyHomeRoute } from "./routes/family/genealogy/GenealogyHomeRoute";
|
import { GenealogyHomeRoute } from "./routes/family/genealogy/GenealogyHomeRoute";
|
||||||
|
import { BaseGenealogyRoute } from "./widgets/genealogy/BaseGenealogyRoute";
|
||||||
|
|
||||||
interface AuthContext {
|
interface AuthContext {
|
||||||
signedIn: boolean;
|
signedIn: boolean;
|
||||||
@ -68,7 +69,7 @@ export function App(): React.ReactElement {
|
|||||||
<Route path="family/:familyId/*" element={<BaseFamilyRoute />}>
|
<Route path="family/:familyId/*" element={<BaseFamilyRoute />}>
|
||||||
<Route path="" element={<FamilyHomeRoute />} />
|
<Route path="" element={<FamilyHomeRoute />} />
|
||||||
|
|
||||||
<Route path="genealogy/*">
|
<Route path="genealogy/*" element={<BaseGenealogyRoute />}>
|
||||||
<Route path="" element={<GenealogyHomeRoute />} />
|
<Route path="" element={<GenealogyHomeRoute />} />
|
||||||
|
|
||||||
<Route path="members" element={<FamilyMembersListRoute />} />
|
<Route path="members" element={<FamilyMembersListRoute />} />
|
||||||
|
73
geneit_app/src/widgets/genealogy/BaseGenealogyRoute.tsx
Normal file
73
geneit_app/src/widgets/genealogy/BaseGenealogyRoute.tsx
Normal file
@ -0,0 +1,73 @@
|
|||||||
|
import React from "react";
|
||||||
|
import { Outlet } from "react-router-dom";
|
||||||
|
import { CoupleApi, CouplesList } from "../../api/genealogy/CoupleApi";
|
||||||
|
import { MemberApi, MembersList } from "../../api/genealogy/MemberApi";
|
||||||
|
import { AsyncWidget } from "../AsyncWidget";
|
||||||
|
import { useFamily } from "../BaseFamilyRoute";
|
||||||
|
|
||||||
|
interface FamilyContext {
|
||||||
|
members: MembersList;
|
||||||
|
couples: CouplesList;
|
||||||
|
reloadMembersList: () => Promise<void>;
|
||||||
|
reloadCouplesList: () => Promise<void>;
|
||||||
|
}
|
||||||
|
|
||||||
|
const GenealogyContextK = React.createContext<FamilyContext | null>(null);
|
||||||
|
|
||||||
|
export function BaseGenealogyRoute(): React.ReactElement {
|
||||||
|
const family = useFamily();
|
||||||
|
|
||||||
|
const [members, setMembers] = React.useState<null | MembersList>(null);
|
||||||
|
const [couples, setCouples] = React.useState<null | CouplesList>(null);
|
||||||
|
|
||||||
|
const loadKey = React.useRef(1);
|
||||||
|
|
||||||
|
const loadPromise = React.useRef<() => void>();
|
||||||
|
|
||||||
|
const load = async () => {
|
||||||
|
setMembers(await MemberApi.GetEntireList(family.familyId));
|
||||||
|
setCouples(await CoupleApi.GetEntireList(family.familyId));
|
||||||
|
};
|
||||||
|
|
||||||
|
const onReload = async () => {
|
||||||
|
loadKey.current += 1;
|
||||||
|
setMembers(null);
|
||||||
|
setCouples(null);
|
||||||
|
|
||||||
|
return new Promise<void>((res, _rej) => {
|
||||||
|
loadPromise.current = () => res();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<AsyncWidget
|
||||||
|
ready={family !== null && members !== null}
|
||||||
|
loadKey={`${family.familyId}-${loadKey.current}`}
|
||||||
|
load={load}
|
||||||
|
errMsg="Échec du chargement des informations de généalogie de la famille !"
|
||||||
|
build={() => {
|
||||||
|
if (loadPromise.current != null) {
|
||||||
|
loadPromise.current?.();
|
||||||
|
loadPromise.current = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<GenealogyContextK.Provider
|
||||||
|
value={{
|
||||||
|
members: members!,
|
||||||
|
couples: couples!,
|
||||||
|
reloadMembersList: onReload,
|
||||||
|
reloadCouplesList: onReload,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Outlet />
|
||||||
|
</GenealogyContextK.Provider>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGenealogy(): FamilyContext {
|
||||||
|
return React.useContext(GenealogyContextK)!;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user