- added validation endpoint

src/components/SettingForms/SettingForms/SettingForms.tsx

@@ -10,14 +10,14 @@ import type {
 } from "../../../types/types";
 import { useQueryClient } from "@tanstack/react-query";
 import { useUpdateBackOfficeConfig } from "../../../hooks/useBackOfficeConfig";
-import { useState } from "react";
+import { useFormVaidate } from "../../../hooks/useFormValidate";
 
 const SettingForms = () => {
   const qc = useQueryClient();
-  const [formErrors, setFormErrors] = useState<InitialValuesFormErrors | null>(null);
   const { dispatcherQuery, dispatcherMutation, backOfficeDispatcherMutation } = useCameraOutput();
   const { backOfficeMutation } = useUpdateBackOfficeConfig();
   const { bof2ConstantsQuery } = useGetDispatcherConfig();
+  const { validateMutation } = useFormVaidate();
 
   const format = dispatcherQuery?.data?.propFormat?.value;
   const enabled = dispatcherQuery?.data?.propEnabled?.value;
@@ -69,14 +69,13 @@ const SettingForms = () => {
     } else if (connect < 0) {
       errors.connectTimeoutSeconds = "Must be ≥ 0";
     }
-    setFormErrors(errors);
     return errors;
   };
 
   const handleSubmit = async (values: BearerTypeFieldType & InitialValuesForm & OptionalBOF2Constants) => {
-    if (formErrors && Object.entries(formErrors).length > 0) {
+    // if (formErrors && Object.entries(formErrors).length > 0) {
-      return;
+    //   return;
-    }
+    // }
     const dispatcherData = {
       format: values.format,
       enabled: values.enabled,
@@ -86,7 +85,12 @@ const SettingForms = () => {
     if (result?.id) {
       qc.invalidateQueries({ queryKey: ["dispatcher"] });
       qc.invalidateQueries({ queryKey: ["backoffice", values.format] });
-      await backOfficeMutation.mutateAsync(values);
+      const validResponse = await validateMutation.mutateAsync(values);
+      if (validResponse?.reason === "OK") {
+        await backOfficeMutation.mutateAsync(values);
+      } else {
+        return;
+      }
     }
 
     if (values.format.toLowerCase() === "bof2") {

src/hooks/useFormValidate.ts

@@ -0,0 +1,46 @@
+import { useMutation } from "@tanstack/react-query";
+import { CAM_BASE } from "../utils/config";
+import type { InitialValuesForm } from "../types/types";
+
+const sendToValidate = async (data: InitialValuesForm) => {
+  const updateConfigPayload = {
+    id: `Dispatcher-${data.format.toLowerCase()}`,
+    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-isvalid`, {
+    method: "post",
+    body: JSON.stringify(updateConfigPayload),
+  });
+  if (!response.ok) throw new Error("Cannot send to validate");
+  return response.json();
+};
+
+export const useFormVaidate = () => {
+  const validateMutation = useMutation({
+    mutationKey: ["sendToValidate"],
+    mutationFn: sendToValidate,
+  });
+
+  return { validateMutation };
+};