refactored system settings

src/hooks/useCameraConfig.ts

@@ -1,10 +1,11 @@
 // Used to fetch and load the configs for the camera side
 
 import { useMutation, useQuery } from "@tanstack/react-query";
+import { toast } from "sonner";
 
 const base_url = import.meta.env.VITE_OUTSIDE_BASEURL;
 
-const fetchCameraSideConfig = async ({ queryKey }) => {
+const fetchCameraSideConfig = async ({ queryKey }: { queryKey: string[] }) => {
   const [, cameraSide] = queryKey;
   const fetchUrl = `${base_url}/fetch-config?id=${cameraSide}`;
   const response = await fetch(fetchUrl);
@@ -12,7 +13,10 @@ const fetchCameraSideConfig = async ({ queryKey }) => {
   return response.json();
 };
 
-const updateCamerasideConfig = async (data) => {
+const updateCamerasideConfig = async (data: {
+  id: string;
+  friendlyName: string;
+}) => {
   const updateUrl = `${base_url}/update-config?id=${data.id}`;
 
   const updateConfigPayload = {
@@ -24,7 +28,6 @@ const updateCamerasideConfig = async (data) => {
       },
     ],
   };
-  console.log(updateConfigPayload);
   const response = await fetch(updateUrl, {
     method: "POST",
     body: JSON.stringify(updateConfigPayload),
@@ -41,6 +44,8 @@ export const useFetchCameraConfig = (cameraSide: string) => {
   const updateConfigMutation = useMutation({
     mutationKey: ["cameraSideConfigUpdate"],
     mutationFn: updateCamerasideConfig,
+    onError: (error) => toast.error(error.message),
+    onSuccess: () => toast("Settings Successfully saved"),
   });
 
   return {
@@ -48,5 +53,6 @@ export const useFetchCameraConfig = (cameraSide: string) => {
     isPending: fetchedConfigQuery.isPending,
     isError: fetchedConfigQuery.isError,
     updateCameraConfig: updateConfigMutation.mutate,
+    updateCameraConfigError: updateConfigMutation.error,
   };
 };