Updated loading states and error states accross app

src/components/SettingForms/NPED/NPEDFields.tsx

@@ -32,7 +32,6 @@ const NPEDFields = () => {
       ...values,
     };
     signIn(valuesToSend);
-    toast.success("Signed into NPED Successfully");
   };
 
   const validateValues = (values: NPEDFieldType) => {

src/components/SettingForms/System/SettingSaveRecall.tsx

@@ -1,3 +1,4 @@
+import { toast } from "sonner";
 import type { SystemValues } from "../../../types/types";
 import { CAM_BASE } from "../../../utils/config";
 
@@ -35,7 +36,13 @@ export async function handleSystemSave(values: SystemValues) {
       );
     }
   } catch (err) {
-    console.error(err);
+    if (err instanceof Error) {
+      toast.error(`Failed to save system settings: ${err.message}`);
+      console.error(err);
+    } else {
+      toast.error("An unexpected error occurred while saving.");
+      console.error("Unknown error:", err);
+    }
   }
 }
 
@@ -79,7 +86,12 @@ export async function handleSystemRecall() {
 
     return { deviceName, sntpServer, sntpInterval, timeZone };
   } catch (err) {
-    console.error(err);
+    if (err instanceof Error) {
+      toast.error(`Error: ${err.message}`);
+    } else {
+      toast.error("An unexpected error occurred");
+    }
+
     return null;
   } finally {
     clearTimeout(timeoutId);

src/components/SettingForms/System/SystemConfigFields.tsx

@@ -7,7 +7,8 @@ import type { SystemValues, SystemValuesErrors } from "../../../types/types";
 import { useSystemConfig } from "../../../hooks/useSystemConfig";
 
 const SystemConfigFields = () => {
-  const { saveSystemSettings, systemSettingsData } = useSystemConfig();
+  const { saveSystemSettings, systemSettingsData, saveSystemSettingsLoading } =
+    useSystemConfig();
   const initialvalues: SystemValues = {
     deviceName: systemSettingsData?.deviceName ?? "",
     timeZone: systemSettingsData?.timeZone ?? "",
@@ -37,7 +38,7 @@ const SystemConfigFields = () => {
       validateOnChange
       validateOnBlur
     >
-      {({ values, errors, touched }) => (
+      {({ values, errors, touched, isSubmitting }) => (
         <Form className="flex flex-col space-y-5 px-2">
           <FormGroup>
             <label
@@ -131,8 +132,9 @@ const SystemConfigFields = () => {
           <button
             type="submit"
             className="bg-[#26B170] text-white px-4 py-2 rounded hover:bg-green-700 transition w-full md:w-[50%]"
+            disabled={isSubmitting}
           >
-            Save System Settings
+            {saveSystemSettingsLoading ? "Saving..." : "Save System Settings"}
           </button>
           <SystemFileUpload
             name={"softwareUpdate"}

src/components/SettingForms/WiFi&Modem/ModemSettings.tsx

@@ -4,7 +4,6 @@ import type { ModemSettingsType } from "../../../types/types";
 import { useWifiAndModem } from "../../../hooks/useCameraWifiandModem";
 import { useEffect, useState } from "react";
 import ModemToggle from "./ModemToggle";
-import { toast } from "sonner";
 
 const ModemSettings = () => {
   const [showSettings, setShowSettings] = useState(false);
@@ -50,11 +49,6 @@ const ModemSettings = () => {
       ],
     };
     modemMutation.mutate(modemConfig);
-    if (modemMutation.error) {
-      toast.error("Failed to update modem settings");
-      return;
-    }
-    toast.success("Modem settings updated");
   };
 
   return (

src/components/SettingForms/WiFi&Modem/WiFiSettingsForm.tsx

@@ -2,7 +2,6 @@ import { Field, Form, Formik } from "formik";
 import FormGroup from "../components/FormGroup";
 import type { WifiSettingValues } from "../../../types/types";
 import { useWifiAndModem } from "../../../hooks/useCameraWifiandModem";
-import { toast } from "sonner";
 import { useState } from "react";
 import { faEyeSlash, faEye } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -36,12 +35,6 @@ const WiFiSettingsForm = () => {
     };
 
     wifiMutation.mutate(wifiConfig);
-
-    if (wifiMutation.error) {
-      toast.error("Failed to update WiFi settings");
-      return;
-    }
-    toast.success("WiFi settings updated");
   };
   return (
     <Formik