diff --git a/geneit_app/src/api/MemberApi.ts b/geneit_app/src/api/MemberApi.ts index 744671e..e29c670 100644 --- a/geneit_app/src/api/MemberApi.ts +++ b/geneit_app/src/api/MemberApi.ts @@ -199,6 +199,16 @@ export class MemberApi { }); } + /** + * Remove the photo of a member + */ + static async RemoveMemberPhoto(m: Member): Promise { + await APIClient.exec({ + uri: `/family/${m.family_id}/member/${m.id}/photo`, + method: "DELETE", + }); + } + /** * Delete a family member */ diff --git a/geneit_app/src/routes/family/FamilyMemberRoute.tsx b/geneit_app/src/routes/family/FamilyMemberRoute.tsx index 72014b0..1ca40ad 100644 --- a/geneit_app/src/routes/family/FamilyMemberRoute.tsx +++ b/geneit_app/src/routes/family/FamilyMemberRoute.tsx @@ -4,6 +4,7 @@ import EditIcon from "@mui/icons-material/Edit"; import SaveIcon from "@mui/icons-material/Save"; import { Button, Grid, Stack } from "@mui/material"; import React from "react"; +import FileDownloadIcon from "@mui/icons-material/FileDownload"; import { useNavigate, useParams } from "react-router-dom"; import { Member, MemberApi } from "../../api/MemberApi"; import { ServerApi } from "../../api/ServerApi"; @@ -21,6 +22,7 @@ import { PropEdit } from "../../widgets/forms/PropEdit"; import { SexSelection } from "../../widgets/forms/SexSelection"; import { UploadPhotoButton } from "../../widgets/forms/UploadPhotoButton"; import { MemberPhoto } from "../../widgets/MemberPhoto"; +import { RouterLink } from "../../widgets/RouterLink"; /** * Create a new member route @@ -238,6 +240,20 @@ export function MemberPage(p: { p.onForceReload?.(); }; + const deletePhoto = async () => { + try { + if (!(await confirm("Voulez-vous supprimer cette photo ?"))) return; + + await MemberApi.RemoveMemberPhoto(member); + + snackbar("La photo du membre a été supprimée avec succès !"); + p.onForceReload?.(); + } catch (e) { + console.error(e); + alert("Échec de la suppresion de la photo !"); + } + }; + return (
- {/* Contact */} - - TODO - - {/* Photo */} @@ -429,19 +440,40 @@ export function MemberPage(p: { ) : ( <> + />{" "} + {member.hasPhoto && ( + + + + )}{" "} + {member.hasPhoto && ( + + )} )}{" "}
+ {/* Contact */} + + TODO + + {/* Bio */} TODO diff --git a/geneit_app/src/widgets/RouterLink.tsx b/geneit_app/src/widgets/RouterLink.tsx index 3f8cb10..108d105 100644 --- a/geneit_app/src/widgets/RouterLink.tsx +++ b/geneit_app/src/widgets/RouterLink.tsx @@ -2,10 +2,14 @@ import { PropsWithChildren } from "react"; import { Link } from "react-router-dom"; export function RouterLink( - p: PropsWithChildren<{ to: string }> + p: PropsWithChildren<{ to: string; target?: React.HTMLAttributeAnchorTarget }> ): React.ReactElement { return ( - + {p.children} ); diff --git a/geneit_app/src/widgets/forms/UploadPhotoButton.tsx b/geneit_app/src/widgets/forms/UploadPhotoButton.tsx index 34a5945..953353c 100644 --- a/geneit_app/src/widgets/forms/UploadPhotoButton.tsx +++ b/geneit_app/src/widgets/forms/UploadPhotoButton.tsx @@ -6,6 +6,7 @@ import { ImageCropperDialog } from "../../dialogs/ImageCropperDialog"; import { useAlert } from "../../hooks/context_providers/AlertDialogProvider"; import { Area } from "react-easy-crop"; import getCroppedImg from "../../utils/crop_image"; +import UploadIcon from "@mui/icons-material/Upload"; export function UploadPhotoButton(p: { label: string; @@ -82,7 +83,13 @@ export function UploadPhotoButton(p: { return ( <> {/* Upload button */} - + {/* Crop image dialog */} {imageURL && (