55 lines
1.3 KiB
TypeScript
55 lines
1.3 KiB
TypeScript
|
import { Outlet, useParams } from "react-router-dom";
|
||
|
|
import { Family, FamilyApi } from "../api/FamilyApi";
|
||
|
|
import React from "react";
|
||
|
|
import { AsyncWidget } from "./AsyncWidget";
|
||
|
|
|
||
|
|
interface FamilyContext {
|
||
|
|
family: Family;
|
||
|
|
reloadFamilyInfo: () => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
const FamilyContextK = React.createContext<FamilyContext | null>(null);
|
||
|
|
|
||
|
|
export function BaseFamilyRoute(): React.ReactElement {
|
||
|
|
const { familyId } = useParams();
|
||
|
|
|
||
|
|
const [family, setFamily] = React.useState<null | Family>(null);
|
||
|
|
|
||
|
|
const loadKey = React.useRef(1);
|
||
|
|
|
||
|
|
const load = async () => {
|
||
|
|
setFamily(await FamilyApi.GetSingle(Number(familyId)));
|
||
|
|
};
|
||
|
|
|
||
|
|
const onReload = () => {
|
||
|
|
loadKey.current += 1;
|
||
|
|
setFamily(null);
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<AsyncWidget
|
||
|
|
ready={family != null}
|
||
|
|
loadKey={`${familyId}-${loadKey}`}
|
||
|
|
load={load}
|
||
|
|
errMsg="Échec du chargement des informations de la famille !"
|
||
|
|
build={() => (
|
||
|
|
<FamilyContextK.Provider
|
||
|
|
value={{
|
||
|
|
family: family!,
|
||
|
|
reloadFamilyInfo: onReload,
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<div>
|
||
|
|
<p>base family route</p>
|
||
|
|
<Outlet />
|
||
|
|
</div>
|
||
|
|
</FamilyContextK.Provider>
|
||
|
|
)}
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export function useFamily(): FamilyContext {
|
||
|
|
return React.useContext(FamilyContextK)!;
|
||
|
|
}
|