- updated backoffice setup

- need to add async loading state

src/hooks/useCameraOutput.ts

@@ -2,7 +2,7 @@ import { useMutation, useQuery } from "@tanstack/react-query";
 import { CAM_BASE } from "../utils/config";
 import { useEffect } from "react";
 import { toast } from "sonner";
-import type { BearerTypeFieldType } from "../types/types";
+import type { BearerTypeFieldType, InitialValuesForm } from "../types/types";
 
 const getDispatcherConfig = async () => {
   const response = await fetch(`${CAM_BASE}/api/fetch-config?id=Dispatcher`);
@@ -18,14 +18,13 @@ const updateDispatcherConfig = async (data: BearerTypeFieldType) => {
         property: "propEnabled",
         value: data.enabled,
       },
-      //   Todo: figure out how to add verbose
+      //   Todo: figure out how to add verbose conditionally
       {
         property: "propFormat",
         value: data.format,
       },
     ],
   };
-
   const response = await fetch(`${CAM_BASE}/api/update-config?id=Dispatcher`, {
     method: "POST",
     body: JSON.stringify(updateConfigPayload),
@@ -34,12 +33,62 @@ const updateDispatcherConfig = async (data: BearerTypeFieldType) => {
   return response.json();
 };
 
+const getBackOfficeConfig = async () => {
+  const response = await fetch(
+    `${CAM_BASE}/api/fetch-config?id=Dispatcher-json`
+  );
+  if (!response.ok) throw new Error("Cannot get Back Office configuration");
+  return response.json();
+};
+
+const updateBackOfficeConfig = async (data: InitialValuesForm) => {
+  const updateConfigPayload = {
+    id: "Dispatcher-json",
+    fields: [
+      {
+        property: "propBackofficeURL",
+        value: data.backOfficeURL,
+      },
+      {
+        property: "propConnectTimeoutSeconds",
+        value: data.connectTimeoutSeconds,
+      },
+      {
+        property: "propPassword",
+        value: data.password,
+      },
+      {
+        property: "propReadTimeoutSeconds",
+        value: data.readTimeoutSeconds,
+      },
+      {
+        property: "propUsername",
+        value: data.username,
+      },
+    ],
+  };
+  const response = await fetch(
+    `${CAM_BASE}/api/update-config?id=Dispatcher-json`,
+    {
+      method: "POST",
+      body: JSON.stringify(updateConfigPayload),
+    }
+  );
+  if (!response.ok) throw new Error("Cannot update Back Office configuration");
+  return response.json();
+};
+
 export const useCameraOutput = () => {
   const dispatcherQuery = useQuery({
     queryKey: ["dispatcher"],
     queryFn: getDispatcherConfig,
   });
 
+  const backOfficeQuery = useQuery({
+    queryKey: ["backoffice"],
+    queryFn: getBackOfficeConfig,
+  });
+
   const dispatcherMutation = useMutation({
     mutationFn: updateDispatcherConfig,
     mutationKey: ["dispatcherUpdate"],
@@ -51,9 +100,29 @@ export const useCameraOutput = () => {
     },
   });
 
+  const backOfficeMutation = useMutation({
+    mutationKey: ["backOfficeUpdate"],
+    mutationFn: updateBackOfficeConfig,
+    onError: (error) => toast.error(error.message),
+    onSuccess: (data) => {
+      if (data) {
+        toast.success("Settings successfully updated");
+      }
+    },
+  });
+
   useEffect(() => {
     if (dispatcherQuery.isError) toast.error(dispatcherQuery.error.message);
   }, [dispatcherQuery?.error?.message, dispatcherQuery.isError]);
 
-  return { dispatcherQuery, dispatcherMutation };
+  useEffect(() => {
+    if (backOfficeQuery.isError) toast.error(backOfficeQuery.error.message);
+  }, [backOfficeQuery?.error?.message, backOfficeQuery.isError]);
+
+  return {
+    dispatcherQuery,
+    dispatcherMutation,
+    backOfficeQuery,
+    backOfficeMutation,
+  };
 };