From baf7c347241d18ab374c20f7c85231b3c7844f25 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Tue, 11 Feb 2025 05:29:13 +0530 Subject: [PATCH 01/10] Fix User Avatar Delete Workflow --- src/components/Common/AvatarEditModal.tsx | 13 +++++++++---- src/components/Users/UserAvatar.tsx | 13 +++++++++---- 2 files changed, 18 insertions(+), 8 deletions(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index 31d0f772a60..d0e1a3432bd 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -22,7 +22,7 @@ interface Props { open: boolean; imageUrl?: string; handleUpload: (file: File, onError: () => void) => Promise; - handleDelete: (onError: () => void) => Promise; + handleDelete: (onSuccess: () => void, onError: () => void) => Promise; onClose?: () => void; hint?: React.ReactNode; } @@ -139,9 +139,14 @@ const AvatarEditModal = ({ const deleteAvatar = async () => { setIsProcessing(true); - await handleDelete(() => { - setIsProcessing(false); - }); + await handleDelete( + () => { + setIsProcessing(false); + setPreview(undefined); + setPreviewImage(null); + }, + () => setIsProcessing(false), + ); }; const dragProps = useDragAndDrop(); diff --git a/src/components/Users/UserAvatar.tsx b/src/components/Users/UserAvatar.tsx index 1d16f4ba8bd..682808737f4 100644 --- a/src/components/Users/UserAvatar.tsx +++ b/src/components/Users/UserAvatar.tsx @@ -27,7 +27,7 @@ export default function UserAvatar({ username }: { username: string }) { const authUser = useAuthUser(); const queryClient = useQueryClient(); - const { mutate: mutateAvatarDelete } = useMutation({ + const { mutateAsync: mutateAvatarDelete } = useMutation({ mutationFn: mutate(routes.deleteProfilePicture, { pathParams: { username }, }), @@ -82,13 +82,18 @@ export default function UserAvatar({ username }: { username: string }) { ); }; - const handleAvatarDelete = async (onError: () => void) => { + const handleAvatarDelete = async ( + onSuccess: () => void, + onError: () => void, + ) => { try { - mutateAvatarDelete(); - } catch { + await mutateAvatarDelete(); + onSuccess(); + } catch (error) { onError(); } }; + return ( <> Date: Tue, 11 Feb 2025 05:34:59 +0530 Subject: [PATCH 02/10] Fix Lint --- src/components/Users/UserAvatar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Users/UserAvatar.tsx b/src/components/Users/UserAvatar.tsx index 682808737f4..2bf8fa4d230 100644 --- a/src/components/Users/UserAvatar.tsx +++ b/src/components/Users/UserAvatar.tsx @@ -89,7 +89,7 @@ export default function UserAvatar({ username }: { username: string }) { try { await mutateAvatarDelete(); onSuccess(); - } catch (error) { + } catch { onError(); } }; From b4a21bbc2f514563e9ffcca9a96cd3b34b923287 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Tue, 11 Feb 2025 11:03:42 +0530 Subject: [PATCH 03/10] Disable `Save` button after upading/uploading cover facility cover photo --- src/components/Common/AvatarEditModal.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index d0e1a3432bd..7a866b07eb4 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -134,6 +134,7 @@ const AvatarEditModal = ({ } finally { setIsCaptureImgBeingUploaded(false); setIsProcessing(false); + setSelectedFile(undefined); } }; @@ -194,11 +195,11 @@ const AvatarEditModal = ({
{!isCameraOpen ? ( <> - {preview || imageUrl ? ( + {imageUrl || preview ? ( <>
cover-photo From a794120ba1632e876b07b9c2360fa68b2537e009 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Tue, 11 Feb 2025 11:04:26 +0530 Subject: [PATCH 04/10] fix `Uplaoding` not showing on clicking save button --- src/components/Facility/FacilityHome.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 547d1b209d6..df9049d6272 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -136,7 +136,7 @@ export const FacilityHome = ({ facilityId }: Props) => { formData.append("cover_image", file); const url = `${careConfig.apiUrl}/api/v1/facility/${facilityId}/cover_image/`; - uploadFile( + await uploadFile( url, formData, "POST", From d94134def676d0631d52f7b13e689b2bc6e303d3 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Tue, 11 Feb 2025 11:05:06 +0530 Subject: [PATCH 05/10] fix uplaoding button glitch after deleting facility avatar --- src/components/Facility/FacilityHome.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index df9049d6272..a88684146d4 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -159,9 +159,13 @@ export const FacilityHome = ({ facilityId }: Props) => { }, ); }; - const handleCoverImageDelete = async (onError: () => void) => { + const handleCoverImageDelete = async ( + onSuccess: () => void, + onError: () => void, + ) => { try { await deleteAvatar(); + onSuccess(); } catch { onError(); } From ffd91d903fe3da2f4d3812a42c656e36b919bf37 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Thu, 13 Feb 2025 14:24:58 +0530 Subject: [PATCH 06/10] fix preview not showing --- src/components/Common/AvatarEditModal.tsx | 31 +++++++++++++++-------- src/components/Facility/FacilityHome.tsx | 7 ++++- src/components/Users/UserAvatar.tsx | 8 ++++-- 3 files changed, 33 insertions(+), 13 deletions(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index 7a866b07eb4..bfdd996f59b 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -21,7 +21,11 @@ interface Props { title: string; open: boolean; imageUrl?: string; - handleUpload: (file: File, onError: () => void) => Promise; + handleUpload: ( + file: File, + onSuccess: () => void, + onError: () => void, + ) => Promise; handleDelete: (onSuccess: () => void, onError: () => void) => Promise; onClose?: () => void; hint?: React.ReactNode; @@ -124,14 +128,20 @@ const AvatarEditModal = ({ setIsProcessing(true); setIsCaptureImgBeingUploaded(true); - await handleUpload(selectedFile, () => { - setSelectedFile(undefined); - setPreview(undefined); - setPreviewImage(null); - setIsCaptureImgBeingUploaded(false); - setIsProcessing(false); - }); + await handleUpload( + selectedFile, + () => { + setPreview(undefined), onClose?.(); + }, + () => { + setPreview(undefined); + setPreviewImage(null); + setIsCaptureImgBeingUploaded(false); + setIsProcessing(false); + }, + ); } finally { + setPreview(undefined); setIsCaptureImgBeingUploaded(false); setIsProcessing(false); setSelectedFile(undefined); @@ -183,6 +193,7 @@ const AvatarEditModal = ({ ); const hintMessage = hint || defaultHint; + console.log(preview, imageUrl); return ( {!isCameraOpen ? ( <> - {imageUrl || preview ? ( + {preview || imageUrl ? ( <>
cover-photo diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index a88684146d4..54e1b02bbac 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -131,7 +131,11 @@ export const FacilityHome = ({ facilityId }: Props) => { }, }); - const handleCoverImageUpload = async (file: File, onError: () => void) => { + const handleCoverImageUpload = async ( + file: File, + onSuccess: () => void, + onError: () => void, + ) => { const formData = new FormData(); formData.append("cover_image", file); const url = `${careConfig.apiUrl}/api/v1/facility/${facilityId}/cover_image/`; @@ -149,6 +153,7 @@ export const FacilityHome = ({ facilityId }: Props) => { }); toast.success(t("cover_image_updated")); setEditCoverImage(false); + onSuccess(); } else { onError(); } diff --git a/src/components/Users/UserAvatar.tsx b/src/components/Users/UserAvatar.tsx index 2bf8fa4d230..6573d215ec3 100644 --- a/src/components/Users/UserAvatar.tsx +++ b/src/components/Users/UserAvatar.tsx @@ -52,7 +52,11 @@ export default function UserAvatar({ username }: { username: string }) { return ; } - const handleAvatarUpload = async (file: File, onError: () => void) => { + const handleAvatarUpload = async ( + file: File, + onSuccess: () => void, + onError: () => void, + ) => { const formData = new FormData(); formData.append("profile_picture", file); const url = `${careConfig.apiUrl}/api/v1/users/${userData.username}/profile_picture/`; @@ -64,6 +68,7 @@ export default function UserAvatar({ username }: { username: string }) { { Authorization: getAuthorizationHeader() }, async (xhr: XMLHttpRequest) => { if (xhr.status === 200) { + setEditAvatar(false); await sleep(1000); queryClient.invalidateQueries({ queryKey: ["getUserDetails", username], @@ -72,7 +77,6 @@ export default function UserAvatar({ username }: { username: string }) { queryClient.invalidateQueries({ queryKey: ["currentUser"] }); } toast.success(t("avatar_updated_success")); - setEditAvatar(false); } }, null, From c0ecfc5fc3bda70e541ad1d839b5b895ddb59e60 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Thu, 13 Feb 2025 14:28:25 +0530 Subject: [PATCH 07/10] fix preview not showing in FacilityAvatar --- src/components/Facility/FacilityHome.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 54e1b02bbac..b7c4164e4cf 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -147,12 +147,12 @@ export const FacilityHome = ({ facilityId }: Props) => { { Authorization: getAuthorizationHeader() }, async (xhr: XMLHttpRequest) => { if (xhr.status === 200) { + setEditCoverImage(false); await sleep(1000); queryClient.invalidateQueries({ queryKey: ["facility", facilityId], }); toast.success(t("cover_image_updated")); - setEditCoverImage(false); onSuccess(); } else { onError(); From bd87f6f2c8a636f268cfdd46d38773c9d6355a02 Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Thu, 13 Feb 2025 14:34:47 +0530 Subject: [PATCH 08/10] fix lint --- src/components/Common/AvatarEditModal.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index bfdd996f59b..63046a62c7e 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -131,7 +131,8 @@ const AvatarEditModal = ({ await handleUpload( selectedFile, () => { - setPreview(undefined), onClose?.(); + setPreview(undefined); + onClose?.(); }, () => { setPreview(undefined); From 85c872aa6aa5c312d3520a3c3a82f80b594b4b0d Mon Sep 17 00:00:00 2001 From: rajku-dev Date: Thu, 13 Feb 2025 14:47:22 +0530 Subject: [PATCH 09/10] remove console log --- src/components/Common/AvatarEditModal.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index 63046a62c7e..34fd788028d 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -194,7 +194,6 @@ const AvatarEditModal = ({ ); const hintMessage = hint || defaultHint; - console.log(preview, imageUrl); return ( Date: Thu, 13 Feb 2025 18:01:22 +0530 Subject: [PATCH 10/10] fix merge conflict errors --- src/components/Common/AvatarEditModal.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index ece9ab086c1..06cf5d8dda7 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -136,7 +136,6 @@ const AvatarEditModal = ({ selectedFile, () => { setPreview(undefined); - onClose?.(); }, () => { setPreview(undefined);