From b021ac0663e1071f7059e3540ab59674877519c9 Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Sat, 4 Jan 2025 11:11:42 +0530 Subject: [PATCH 01/11] error message clarify the exact issue --- src/components/Facility/FacilityHome.tsx | 79 +++++++++++++++++------- 1 file changed, 56 insertions(+), 23 deletions(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 615952be3ba..9b539599ed7 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -134,30 +134,63 @@ export const FacilityHome = ({ facilityId }: Props) => { }; const handleCoverImageUpload = async (file: File, onError: () => void) => { - const formData = new FormData(); - formData.append("cover_image", file); - const url = `${careConfig.apiUrl}/api/v1/facility/${facilityId}/cover_image/`; - - uploadFile( - url, - formData, - "POST", - { Authorization: getAuthorizationHeader() }, - async (xhr: XMLHttpRequest) => { - if (xhr.status === 200) { - await sleep(1000); - facilityFetch(); - Notification.Success({ msg: "Cover image updated." }); - setEditCoverImage(false); - } else { - onError(); - } - }, - null, - () => { + const allowedFormats = ["image/jpg", "image/jpeg", "image/png"]; + const maxSizeInBytes = 1 * 1024 * 1024; // 1MB + + if (file.size > maxSizeInBytes) { + Notification.Error({ msg: "Max size for image uploaded should be 1MB." }); + onError(); + return; + } + + const img = new Image(); + img.src = URL.createObjectURL(file); + + img.onload = async () => { + if (!allowedFormats.includes(file.type)) { + Notification.Error({ msg: "Allowed formats are jpg, png, jpeg." }); onError(); - }, - ); + return; + } + + if (img.width !== img.height) { + Notification.Error({ + msg: "Aspect ratio for the image should be 1:1.", + }); + onError(); + return; + } + + const formData = new FormData(); + formData.append("cover_image", file); + const url = `${careConfig.apiUrl}/api/v1/facility/${facilityId}/cover_image/`; + + uploadFile( + url, + formData, + "POST", + { Authorization: getAuthorizationHeader() }, + async (xhr: XMLHttpRequest) => { + if (xhr.status === 200) { + await sleep(1000); + facilityFetch(); + Notification.Success({ msg: "Cover image updated." }); + setEditCoverImage(false); + } else { + onError(); + } + }, + null, + () => { + onError(); + }, + ); + }; + + img.onerror = () => { + Notification.Error({ msg: "Invalid image file." }); + onError(); + }; }; const handleCoverImageDelete = async (onError: () => void) => { From 428fae3214a1463bdf076dd973d3d356a1616d4e Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Sat, 4 Jan 2025 22:05:50 +0530 Subject: [PATCH 02/11] error message showed --- src/components/Facility/FacilityHome.tsx | 85 ++++++++---------------- 1 file changed, 29 insertions(+), 56 deletions(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 9b539599ed7..6b0af379b7d 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -134,63 +134,36 @@ export const FacilityHome = ({ facilityId }: Props) => { }; const handleCoverImageUpload = async (file: File, onError: () => void) => { - const allowedFormats = ["image/jpg", "image/jpeg", "image/png"]; - const maxSizeInBytes = 1 * 1024 * 1024; // 1MB - - if (file.size > maxSizeInBytes) { - Notification.Error({ msg: "Max size for image uploaded should be 1MB." }); - onError(); - return; - } - - const img = new Image(); - img.src = URL.createObjectURL(file); - - img.onload = async () => { - if (!allowedFormats.includes(file.type)) { - Notification.Error({ msg: "Allowed formats are jpg, png, jpeg." }); - onError(); - return; - } - - if (img.width !== img.height) { - Notification.Error({ - msg: "Aspect ratio for the image should be 1:1.", - }); - onError(); - return; - } - - const formData = new FormData(); - formData.append("cover_image", file); - const url = `${careConfig.apiUrl}/api/v1/facility/${facilityId}/cover_image/`; - - uploadFile( - url, - formData, - "POST", - { Authorization: getAuthorizationHeader() }, - async (xhr: XMLHttpRequest) => { - if (xhr.status === 200) { - await sleep(1000); - facilityFetch(); - Notification.Success({ msg: "Cover image updated." }); - setEditCoverImage(false); - } else { - onError(); + const formData = new FormData(); + formData.append("cover_image", file); + const url = `${careConfig.apiUrl}/api/v1/facility/${facilityId}/cover_image/`; + + uploadFile( + url, + formData, + "POST", + { Authorization: getAuthorizationHeader() }, + async (xhr: XMLHttpRequest) => { + if (xhr.status === 200) { + await sleep(1000); + facilityFetch(); + Notification.Success({ msg: "Cover image updated." }); + setEditCoverImage(false); + } else { + const response = JSON.parse(xhr.responseText); + + if (response.errors[0]?.msg?.cover_image) { + response.errors[0]?.msg?.cover_image.forEach((error: string) => { + Notification.Error({ msg: error }); + }); } - }, - null, - () => { - onError(); - }, - ); - }; - - img.onerror = () => { - Notification.Error({ msg: "Invalid image file." }); - onError(); - }; + } + }, + null, + () => { + onError(); + }, + ); }; const handleCoverImageDelete = async (onError: () => void) => { From 8d56a8dee214fa84c5f31a77919af94beddde250 Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Sun, 5 Jan 2025 16:23:15 +0530 Subject: [PATCH 03/11] updated --- src/components/Facility/FacilityHome.tsx | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 6b0af379b7d..019e832a4f3 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -4,6 +4,7 @@ import { Hospital, MapPin, MoreVertical, Settings, Trash2 } from "lucide-react"; import { navigate } from "raviger"; import { useState } from "react"; import { useTranslation } from "react-i18next"; +import { toast } from "sonner"; import { Badge } from "@/components/ui/badge"; import { Button } from "@/components/ui/button"; @@ -147,16 +148,18 @@ export const FacilityHome = ({ facilityId }: Props) => { if (xhr.status === 200) { await sleep(1000); facilityFetch(); - Notification.Success({ msg: "Cover image updated." }); + toast.success("Cover image updated."); setEditCoverImage(false); } else { const response = JSON.parse(xhr.responseText); - if (response.errors[0]?.msg?.cover_image) { - response.errors[0]?.msg?.cover_image.forEach((error: string) => { - Notification.Error({ msg: error }); - }); - } + response.errors.forEach((error: any) => { + if (error?.msg?.cover_image) { + error.msg.cover_image.forEach((errorMsg: string) => { + toast.error(errorMsg); + }); + } + }); } }, null, From 5cf957e048ae774a6dc8957c0441408a37c9fc9c Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Sun, 5 Jan 2025 19:19:29 +0530 Subject: [PATCH 04/11] toast notification added --- src/components/Facility/FacilityHome.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 019e832a4f3..e83d91a5e63 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -152,7 +152,6 @@ export const FacilityHome = ({ facilityId }: Props) => { setEditCoverImage(false); } else { const response = JSON.parse(xhr.responseText); - response.errors.forEach((error: any) => { if (error?.msg?.cover_image) { error.msg.cover_image.forEach((errorMsg: string) => { From b7c6123d6226bac228aa3ebf321136beb245736f Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Fri, 10 Jan 2025 20:29:33 +0530 Subject: [PATCH 05/11] toast code updated --- 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 5237ec886ea..bc9f733d6d3 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -146,7 +146,7 @@ export const FacilityHome = ({ facilityId }: Props) => { if (xhr.status === 200) { await sleep(1000); facilityFetch(); - toast.success("Cover image updated."); + toast.success(t("cover_image_updated")); setEditCoverImage(false); } else { const response = JSON.parse(xhr.responseText); From 8e04a68a0a14e4087f36e870df9b497c207c0e03 Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Tue, 14 Jan 2025 19:30:54 +0530 Subject: [PATCH 06/11] errorhandler updated --- src/Utils/request/errorHandler.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/Utils/request/errorHandler.ts b/src/Utils/request/errorHandler.ts index e83973cfeeb..3a15ae78593 100644 --- a/src/Utils/request/errorHandler.ts +++ b/src/Utils/request/errorHandler.ts @@ -85,7 +85,11 @@ function isStructuredError(err: HTTPError["cause"]): err is StructuredError { return typeof err === "object" && !Array.isArray(err); } -function handleStructuredErrors(cause: StructuredError) { +export function handleStructuredErrors(cause: StructuredError | Error) { + if (cause instanceof Error) { + toast.error(cause.message); + return; + } for (const value of Object.values(cause)) { if (Array.isArray(value)) { value.forEach((err) => toast.error(err)); From 108f3e4e0e7872562f19749f09f937f639926ca0 Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Tue, 14 Jan 2025 19:32:35 +0530 Subject: [PATCH 07/11] handleStructuredErrors function called --- src/components/Facility/FacilityHome.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 54c9a2fc52e..4d0729e850d 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -26,6 +26,7 @@ import Loading from "@/components/Common/Loading"; import { FACILITY_FEATURE_TYPES } from "@/common/constants"; import routes from "@/Utils/request/api"; +import { handleStructuredErrors } from "@/Utils/request/errorHandler"; import query from "@/Utils/request/query"; import request from "@/Utils/request/request"; import uploadFile from "@/Utils/request/uploadFile"; @@ -140,7 +141,7 @@ export const FacilityHome = ({ facilityId }: Props) => { response.errors.forEach((error: any) => { if (error?.msg?.cover_image) { error.msg.cover_image.forEach((errorMsg: string) => { - toast.error(errorMsg); + handleStructuredErrors(new Error(errorMsg)); }); } }); From b5ab30dbbd5f32208a45505adaaaa4809ea76c98 Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Tue, 14 Jan 2025 19:44:16 +0530 Subject: [PATCH 08/11] removed latest added code --- src/Utils/request/errorHandler.ts | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/Utils/request/errorHandler.ts b/src/Utils/request/errorHandler.ts index 3a15ae78593..df5689e4704 100644 --- a/src/Utils/request/errorHandler.ts +++ b/src/Utils/request/errorHandler.ts @@ -85,11 +85,7 @@ function isStructuredError(err: HTTPError["cause"]): err is StructuredError { return typeof err === "object" && !Array.isArray(err); } -export function handleStructuredErrors(cause: StructuredError | Error) { - if (cause instanceof Error) { - toast.error(cause.message); - return; - } +export function handleStructuredErrors(cause: StructuredError) { for (const value of Object.values(cause)) { if (Array.isArray(value)) { value.forEach((err) => toast.error(err)); From c8021e8c6f79fa954617df54a60eab143eae53b8 Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Tue, 14 Jan 2025 19:45:07 +0530 Subject: [PATCH 09/11] reduced the function calling code --- src/components/Facility/FacilityHome.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx index 4d0729e850d..674eaa599af 100644 --- a/src/components/Facility/FacilityHome.tsx +++ b/src/components/Facility/FacilityHome.tsx @@ -140,9 +140,7 @@ export const FacilityHome = ({ facilityId }: Props) => { const response = JSON.parse(xhr.responseText); response.errors.forEach((error: any) => { if (error?.msg?.cover_image) { - error.msg.cover_image.forEach((errorMsg: string) => { - handleStructuredErrors(new Error(errorMsg)); - }); + handleStructuredErrors(error?.msg?.cover_image); } }); } From b23acb9fcf6a4633c25927084367387ec663eb6f Mon Sep 17 00:00:00 2001 From: Mohamed amaan Date: Tue, 14 Jan 2025 19:53:33 +0530 Subject: [PATCH 10/11] button width updated --- src/components/Common/AvatarEditModal.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/Common/AvatarEditModal.tsx b/src/components/Common/AvatarEditModal.tsx index d5044c66533..364e242bcd6 100644 --- a/src/components/Common/AvatarEditModal.tsx +++ b/src/components/Common/AvatarEditModal.tsx @@ -253,7 +253,12 @@ const AvatarEditModal = ({
-