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

Start to show the list of families

Browse Source
This commit is contained in:
Pierre HUBERT 2023-07-04 19:05:36 +02:00
parent 1a4a7985e0
commit 947a3ad274
2 changed files with 44 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
geneit_app/src/api/FamilyApi.ts
View File

@ -46,4 +46,14 @@ export class FamilyApi {
return JoinFamilyResult.Error; return JoinFamilyResult.Error;
} }
} }
}
/**
* Get the list of families
*/
static async GetList():Promise<Family[]> {
return (await APIClient.exec({
method: "GET",
uri: "/family/list",
})).data
}}

41
geneit_app/src/routes/FamiliesListRoute.tsx
View File

@ -1,9 +1,11 @@
import AddIcon from "@mui/icons-material/Add";
import ConfirmationNumberIcon from "@mui/icons-material/ConfirmationNumber";
import { Button, IconButton, Tooltip, Typography } from "@mui/material";
import React from "react"; import React from "react";
import { AsyncWidget } from "../widgets/AsyncWidget"; import { Family, FamilyApi } from "../api/FamilyApi";
import { Family } from "../api/FamilyApi";
import { Button, Typography } from "@mui/material";
import { CreateFamilyDialog } from "../dialogs/CreateFamilyDialog"; import { CreateFamilyDialog } from "../dialogs/CreateFamilyDialog";
import { JoinFamilyDialog } from "../dialogs/JoinFamilyDialog"; import { JoinFamilyDialog } from "../dialogs/JoinFamilyDialog";
import { AsyncWidget } from "../widgets/AsyncWidget";
export function FamiliesListRoute(): React.ReactElement { export function FamiliesListRoute(): React.ReactElement {
const loadKey = React.useRef(1); const loadKey = React.useRef(1);
@ -14,8 +16,7 @@ export function FamiliesListRoute(): React.ReactElement {
const [joinFamily, setJoinFamily] = React.useState(false); const [joinFamily, setJoinFamily] = React.useState(false);
const load = async () => { const load = async () => {
// TODO : implement setFamilies(await FamilyApi.GetList());
setFamilies([]);
}; };
const reload = () => { const reload = () => {
@ -44,7 +45,11 @@ export function FamiliesListRoute(): React.ReactElement {
onRequestJoinFamily={onRequestJoinFamily} onRequestJoinFamily={onRequestJoinFamily}
/> />
) : ( ) : (
<HasFamilysWidget onReload={reload} families={families!} /> <HasFamilysWidget
onRequestCreateFamily={onRequestCreateFamily}
onRequestJoinFamily={onRequestJoinFamily}
families={families!}
/>
)} )}
{/** Create family dialog anchor */} {/** Create family dialog anchor */}
@ -122,7 +127,27 @@ function NoFamilyButton(p: {
function HasFamilysWidget(p: { function HasFamilysWidget(p: {
families: Family[]; families: Family[];
onReload: () => void; onRequestCreateFamily: () => void;
onRequestJoinFamily: () => void;
}): React.ReactElement { }): React.ReactElement {
return <p>todo has families</p>; return (
<div style={{ width: "100%", maxWidth: "800px", margin: "20px auto" }}>
<div style={{ display: "flex", justifyContent: "space-between" }}>
<Typography variant="h4">Mes familles</Typography>
<div>
<IconButton aria-label="create" onClick={p.onRequestCreateFamily}>
<Tooltip title="Créer une nouvelle famille">
<AddIcon />
</Tooltip>
</IconButton>
<IconButton aria-label="create" onClick={p.onRequestJoinFamily}>
<Tooltip title="Rejoindre une famille">
<ConfirmationNumberIcon />
</Tooltip>
</IconButton>
</div>
</div>
TODO list of families
</div>
);
} }