pierre/GeneIT
1
0
Fork 0
Code Issues Pull Requests 3 Packages Projects Releases Wiki Activity

Make members information globally available

Browse Source
This commit is contained in:
Pierre HUBERT
2023-08-09 08:55:37 +02:00
parent 1128b5ebd4
commit 359dd2f9ee
3 changed files with 143 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
geneit_app/src/widgets/BaseFamilyRoute.tsx
View File

@ -30,11 +30,14 @@ import { RouterLink } from "./RouterLink";
import { useSnackbar } from "../hooks/context_providers/SnackbarProvider";
import { useConfirm } from "../hooks/context_providers/ConfirmDialogProvider";
import { useAlert } from "../hooks/context_providers/AlertDialogProvider";
import { Member, MemberApi, MembersList } from "../api/MemberApi";
interface FamilyContext {
family: Family;
members: MembersList;
familyId: number;
reloadFamilyInfo: () => void;
reloadMembersList: () => Promise<void>;
}
const FamilyContextK = React.createContext<FamilyContext | null>(null);
@ -46,16 +49,26 @@ export function BaseFamilyRoute(): React.ReactElement {
const confirm = useConfirm();
const [family, setFamily] = React.useState<null | Family>(null);
const [members, setMembers] = React.useState<null | MembersList>(null);
const loadKey = React.useRef(1);
const loadPromise = React.useRef<() => void>();
const load = async () => {
setFamily(await FamilyApi.GetSingle(Number(familyId)));
const familyID = Number(familyId);
setFamily(await FamilyApi.GetSingle(familyID));
setMembers(await MemberApi.GetEntireList(familyID));
};
const onReload = () => {
const onReload = async () => {
loadKey.current += 1;
setFamily(null);
setMembers(null);
return new Promise<void>((res, _rej) => {
loadPromise.current = () => res();
});
};
const copyInvitationCode = async () => {
@ -85,113 +98,122 @@ export function BaseFamilyRoute(): React.ReactElement {
return (
<AsyncWidget
ready={family != null}
ready={family !== null && members !== null}
loadKey={`${familyId}-${loadKey.current}`}
load={load}
errMsg="Échec du chargement des informations de la famille !"
build={() => (
<FamilyContextK.Provider
value={{
family: family!,
familyId: family!.family_id,
reloadFamilyInfo: onReload,
}}
>
<Box
sx={{
display: "flex",
flex: "2",
build={() => {
if (loadPromise.current != null) {
loadPromise.current?.();
loadPromise.current = undefined;
}
return (
<FamilyContextK.Provider
value={{
family: family!,
members: members!,
familyId: family!.family_id,
reloadFamilyInfo: onReload,
reloadMembersList: onReload,
}}
>
<List
component="nav"
<Box
sx={{
minWidth: "280px",
backgroundColor: "background.paper",
display: "flex",
flex: "2",
}}
>
<FamilyLink icon={<HomeIcon />} label="Accueil" uri="" />
<List
component="nav"
sx={{
minWidth: "280px",
backgroundColor: "background.paper",
}}
>
<FamilyLink icon={<HomeIcon />} label="Accueil" uri="" />
<FamilyLink
icon={<Icon path={mdiCrowd} size={1} />}
label="Membres"
uri="members"
/>
<FamilyLink
icon={<Icon path={mdiCrowd} size={1} />}
label="Membres"
uri="members"
/>
<FamilyLink
icon={<Icon path={mdiHumanMaleFemale} size={1} />}
label="Couples"
uri="couples"
/>
<FamilyLink
icon={<Icon path={mdiHumanMaleFemale} size={1} />}
label="Couples"
uri="couples"
/>
<FamilyLink
icon={<Icon path={mdiFamilyTree} size={1} />}
label="Arbre"
uri="tree"
/>
<FamilyLink
icon={<Icon path={mdiFamilyTree} size={1} />}
label="Arbre"
uri="tree"
/>
<Divider sx={{ my: 1 }} />
<ListSubheader component="div">Administration</ListSubheader>
<Divider sx={{ my: 1 }} />
<ListSubheader component="div">Administration</ListSubheader>
<FamilyLink
icon={<Icon path={mdiAccountMultiple} size={1} />}
label="Utilisateurs"
uri="users"
/>
<FamilyLink
icon={<Icon path={mdiAccountMultiple} size={1} />}
label="Utilisateurs"
uri="users"
/>
<FamilyLink
icon={<Icon path={mdiCog} size={1} />}
label="Paramètres"
uri="settings"
/>
<FamilyLink
icon={<Icon path={mdiCog} size={1} />}
label="Paramètres"
uri="settings"
/>
{/* Invitation code */}
{/* Invitation code */}
<ListItem
dense
secondaryAction={
<span>
<Tooltip title="Copier le code d'invitation dans le presse papier">
<IconButton onClick={copyInvitationCode}>
<Icon path={mdiContentCopy} size={0.75} />
</IconButton>
</Tooltip>
{family!.is_admin && (
<Tooltip title="Changer le code d'activation">
<IconButton onClick={changeInvitationCode}>
<Icon path={mdiRefresh} size={0.75} />
<ListItem
dense
secondaryAction={
<span>
<Tooltip title="Copier le code d'invitation dans le presse papier">
<IconButton onClick={copyInvitationCode}>
<Icon path={mdiContentCopy} size={0.75} />
</IconButton>
</Tooltip>
)}
</span>
}
>
<ListItemIcon>
<Icon path={mdiLockCheck} size={1} />
</ListItemIcon>
<ListItemText
primary="Code d'invitation"
secondary={family?.invitation_code}
/>
</ListItem>
</List>
<Box
component="main"
sx={{
flexGrow: 1,
overflow: "auto",
padding: "20px",
display: "flex",
flexDirection: "column",
}}
>
<Outlet />
{family!.is_admin && (
<Tooltip title="Changer le code d'activation">
<IconButton onClick={changeInvitationCode}>
<Icon path={mdiRefresh} size={0.75} />
</IconButton>
</Tooltip>
)}
</span>
}
>
<ListItemIcon>
<Icon path={mdiLockCheck} size={1} />
</ListItemIcon>
<ListItemText
primary="Code d'invitation"
secondary={family?.invitation_code}
/>
</ListItem>
</List>
<Box
component="main"
sx={{
flexGrow: 1,
overflow: "auto",
padding: "20px",
display: "flex",
flexDirection: "column",
}}
>
<Outlet />
</Box>
</Box>
</Box>
</FamilyContextK.Provider>
)}
</FamilyContextK.Provider>
);
}}
/>
);
}