Replace notification with toast

public/locale/en.json

@@ -1149,6 +1149,7 @@
   "location": "Location",
   "location_beds_empty": "No beds available in this location",
   "location_management": "Location Management",
+  "location_updated_successfully": "Location updated successfully",
   "log_lab_results": "Log Lab Results",
   "log_report": "Log Report",
   "log_update": "Log Update",

src/Utils/Notifications.ts

@@ -19,7 +19,7 @@ const formatKey = (key: string) => {
     .join(" ");
 };
 
-const notifyError = (error: any) => {
+export const notifyError = (error: any) => {
   let errorMsg = "";
   if (typeof error === "string" || !error) {
     errorMsg =
@@ -43,30 +43,6 @@ const notifyError = (error: any) => {
   toast.error(errorMsg);
 };
 
-/**
- * Success message handler
- * @deprecated Use `toast.success` instead
- */
-export const Success = ({ msg }: { msg: string }) => {
-  toast.success(msg);
-};
-
-/**
- * Error message handler
- * @deprecated Use `toast.error` instead
- */
-export const Error = ({ msg }: { msg: any }) => {
-  notifyError(msg);
-};
-
-/**
- * Warning message handler
- * @deprecated Use `toast.warning` instead
- */
-export const Warn = ({ msg }: { msg: string }) => {
-  toast.warning(msg);
-};
-
 /**
  * 400 Bad Request handler
  * @deprecated TODO: add a better error handler

src/Utils/request/errorHandler.ts

@@ -10,7 +10,7 @@ export function handleHttpError(error: Error) {
   }
 
   if (!(error instanceof HTTPError)) {
-    Notifications.Error({ msg: error.message || "Something went wrong!" });
+    toast.error(error.message || "Something went wrong!");
     return;
   }
 
@@ -40,7 +40,7 @@ export function handleHttpError(error: Error) {
     return;
   }
 
-  Notifications.Error({
+  Notifications.notifyError({
     msg: cause?.detail || "Something went wrong...!",
   });
 }

src/Utils/request/handleResponse.ts

@@ -15,7 +15,7 @@ export default function handleResponse(
 
   // 404 Not Found
   if (res.status === 404) {
-    notify?.Error({ msg: "Not Found" });
+    notify?.notifyError({ msg: "Not Found" });
     return;
   }
 
@@ -39,7 +39,7 @@ export default function handleResponse(
       return;
     }
 
-    notify?.Error({ msg: error?.detail || "Something went wrong...!" });
+    notify?.notifyError({ msg: error?.detail || "Something went wrong...!" });
     return;
   }
 }

src/Utils/request/uploadFile.ts

@@ -1,4 +1,5 @@
 import { Dispatch, SetStateAction } from "react";
+import { toast } from "sonner";
 
 import * as Notification from "@/Utils/Notifications";
 import { handleUploadPercentage } from "@/Utils/request/utils";
@@ -44,9 +45,7 @@ const uploadFile = async (
     }
 
     xhr.onerror = () => {
-      Notification.Error({
-        msg: "Network Failure. Please check your internet connectivity.",
-      });
+      toast.error("Network Failure. Please check your internet connectivity.");
       onError();
       reject(new Error("Network error"));
     };

src/Utils/request/utils.ts

@@ -1,8 +1,8 @@
 import { Dispatch, SetStateAction } from "react";
+import { toast } from "sonner";
 
 import { LocalStorageKeys } from "@/common/constants";
 
-import * as Notification from "@/Utils/Notifications";
 import { QueryParams, RequestOptions } from "@/Utils/request/types";
 
 export function makeUrl(
@@ -50,7 +50,7 @@ const ensurePathNotMissingReplacements = (path: string) => {
     const msg = `Missing path params: ${missingParams.join(
       ", ",
     )}. Path: ${path}`;
-    Notification.Error({ msg });
+    toast.error(msg);
     throw new Error(msg);
   }
 };

src/Utils/useSegmentedRecorder.ts

@@ -1,7 +1,6 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-
-import * as Notify from "@/Utils/Notifications";
+import { toast } from "sonner";
 
 const useSegmentedRecording = () => {
   const [isRecording, setIsRecording] = useState(false);
@@ -32,9 +31,7 @@ const useSegmentedRecording = () => {
             }
           },
           () => {
-            Notify.Error({
-              msg: t("audio__permission_message"),
-            });
+            toast.error(t("audio__permission_message"));
             setIsRecording(false);
             setMicrophoneAccess(false); // Set access to false on failure
           },

src/Utils/useVoiceRecorder.ts

@@ -1,6 +1,5 @@
 import { useEffect, useState } from "react";
-
-import * as Notify from "./Notifications";
+import { toast } from "sonner";
 
 const useVoiceRecorder = (handleMicPermission: (allowed: boolean) => void) => {
   const [audioURL, setAudioURL] = useState("");
@@ -30,9 +29,7 @@ const useVoiceRecorder = (handleMicPermission: (allowed: boolean) => void) => {
           error instanceof Error
             ? error.message
             : "Please grant microphone permission to record audio.";
-        Notify.Error({
-          msg: errorMessage,
-        });
+        toast.error(errorMessage);
         setIsRecording(false);
         handleMicPermission(false);
       }

src/Utils/utils.ts

@@ -1,10 +1,10 @@
 import { differenceInMinutes, format } from "date-fns";
 import html2canvas from "html2canvas";
+import { toast } from "sonner";
 
 import { AREACODES, IN_LANDLINE_AREA_CODES } from "@/common/constants";
 import phoneCodesJson from "@/common/static/countryPhoneAndFlags.json";
 
-import * as Notification from "@/Utils/Notifications";
 import dayjs from "@/Utils/dayjs";
 import { Time } from "@/Utils/types";
 import { DoseRange, Timing } from "@/types/emr/medicationRequest";
@@ -644,9 +644,9 @@ export const saveElementAsImage = async (id: string, filename: string) => {
 export const copyToClipboard = async (content: string) => {
   try {
     await navigator.clipboard.writeText(content);
-    Notification.Success({ msg: "Copied to clipboard" });
+    toast.success("Copied to clipboard");
   } catch (err) {
-    Notification.Error({ msg: "Copying is not allowed" });
+    toast.error("Copying is not allowed");
   }
 };
 

src/components/Auth/Login.tsx

@@ -29,7 +29,6 @@ import BrowserWarning from "@/components/ErrorPages/BrowserWarning";
 import { useAuthContext } from "@/hooks/useAuthUser";
 
 import FiltersCache from "@/Utils/FiltersCache";
-import * as Notification from "@/Utils/Notifications";
 import routes from "@/Utils/request/api";
 import mutate from "@/Utils/request/mutate";
 import request from "@/Utils/request/request";
@@ -170,7 +169,7 @@ const Login = (props: LoginProps) => {
         errorMessage = error.message;
       }
       setOtpValidationError(errorMessage);
-      Notification.Error({ msg: errorMessage });
+      toast.error(errorMessage);
     },
   });
 

src/components/Auth/ResetPassword.tsx

@@ -1,6 +1,7 @@
 import { navigate } from "raviger";
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { toast } from "sonner";
 
 import { Button } from "@/components/ui/button";
 
@@ -10,7 +11,6 @@ import { validateRule } from "@/components/Users/UserFormValidations";
 import { LocalStorageKeys } from "@/common/constants";
 import { validatePassword } from "@/common/validation";
 
-import * as Notification from "@/Utils/Notifications";
 import routes from "@/Utils/request/api";
 import request from "@/Utils/request/request";
 
@@ -82,9 +82,7 @@ const ResetPassword = (props: ResetPasswordProps) => {
       });
       if (res?.ok) {
         localStorage.removeItem(LocalStorageKeys.accessToken);
-        Notification.Success({
-          msg: t("password_reset_success"),
-        });
+        toast.success(t("password_reset_success"));
         navigate("/login");
       } else if (res && error) {
         setErrors(error);

src/components/Common/AvatarEditModal.tsx

@@ -7,6 +7,7 @@ import React, {
 } from "react";
 import { useTranslation } from "react-i18next";
 import Webcam from "react-webcam";
+import { toast } from "sonner";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
@@ -16,8 +17,6 @@ import DialogModal from "@/components/Common/Dialog";
 
 import useDragAndDrop from "@/hooks/useDragAndDrop";
 
-import { Warn } from "@/Utils/Notifications";
-
 interface Props {
   title: string;
   open: boolean;
@@ -108,7 +107,7 @@ const AvatarEditModal = ({
       return;
     }
     if (!isImageFile(e.target.files[0])) {
-      Warn({ msg: "Please upload an image file!" });
+      toast.warning("Please upload an image file!");
       return;
     }
     setSelectedFile(e.target.files[0]);
@@ -340,7 +339,7 @@ const AvatarEditModal = ({
                       videoConstraints={constraint}
                       onUserMediaError={(_e) => {
                         setIsCameraOpen(false);
-                        Warn({ msg: t("camera_permission_denied") });
+                        toast.warning(t("camera_permission_denied"));
                       }}
                     />
                   </>

src/components/Common/DateInputV2.tsx

@@ -1,12 +1,12 @@
 import { Popover, PopoverButton, PopoverPanel } from "@headlessui/react";
 import { t } from "i18next";
 import { MutableRefObject, useEffect, useRef, useState } from "react";
+import { toast } from "sonner";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
 import DateTextInput from "@/components/Common/DateTextInput";
 
-import * as Notification from "@/Utils/Notifications";
 import dayjs from "@/Utils/dayjs";
 import { useValueInjectionObserver } from "@/Utils/useValueInjectionObserver";
 import { classNames } from "@/Utils/utils";
@@ -149,9 +149,9 @@ const DateInputV2: React.FC<Props> = ({
             setIsOpen?.(false);
           }
         })()
-      : Notification.Error({
-          msg: outOfLimitsErrorMessage ?? "Cannot select date out of range",
-        });
+      : toast.error(
+          outOfLimitsErrorMessage ?? "Cannot select date out of range",
+        );
   };
 
   const handleTimeChange = (options: {
@@ -265,9 +265,9 @@ const DateInputV2: React.FC<Props> = ({
       );
       setType("date");
     } else {
-      Notification.Error({
-        msg: outOfLimitsErrorMessage ?? "Cannot select month out of range",
-      });
+      toast.error(
+        outOfLimitsErrorMessage ?? "Cannot select month out of range",
+      );
     }
   };
   //min and max setting for year
@@ -291,9 +291,7 @@ const DateInputV2: React.FC<Props> = ({
       }
       setType("date");
     } else {
-      Notification.Error({
-        msg: outOfLimitsErrorMessage ?? "Cannot select year out of range",
-      });
+      toast.error("Cannot select year out of range");
     }
   };
 

src/components/Common/ExcelFIleDragAndDrop.tsx

@@ -1,5 +1,6 @@
 import { useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { toast } from "sonner";
 import * as XLSX from "xlsx";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
@@ -16,8 +17,6 @@ import schemaParser, {
   SchemaType,
 } from "@/common/schemaParser";
 
-import * as Notification from "@/Utils/Notifications";
-
 interface Props {
   handleSubmit: (data: any) => void;
   loading: boolean;
@@ -83,9 +82,7 @@ export default function ExcelFileDragAndDrop({
 
       reader.readAsBinaryString(file);
     } catch (e: any) {
-      Notification.Error({
-        msg: e.message,
-      });
+      toast.error(e.message);
     }
   };