- updated endpoint

src/components/SettingForms/Sound/SoundUpload.tsx

@@ -5,13 +5,13 @@ import { useSoundContext } from "../../../context/SoundContext";
 import { toast } from "sonner";
 import { useCameraBlackboard } from "../../../hooks/useCameraBlackboard";
 import { useFileUpload } from "../../../hooks/useFileUpload";
+import { useEffect, useRef } from "react";
 
 const SoundUpload = () => {
   const { state, dispatch } = useSoundContext();
   const { mutation } = useCameraBlackboard();
-  const { mutation: fileMutation } = useFileUpload({
-    queryKey: state.sightingSound ? [state.sightingSound] : undefined,
-  });
+  const currentUrlRef = useRef<string | null>(null);
+  const { mutation: fileMutation } = useFileUpload();
 
   const initialValues: SoundUploadValue = {
     name: "",
@@ -43,6 +43,10 @@ const SoundUpload = () => {
       value: updatedValues,
     });
     await fileMutation.mutateAsync(values.soundFile);
+    if (currentUrlRef.current) {
+      URL.revokeObjectURL(currentUrlRef.current);
+      currentUrlRef.current = null;
+    }
     if (result.reason !== "OK") {
       toast.error("Cannot update sound settings");
     }
@@ -54,6 +58,14 @@ const SoundUpload = () => {
     dispatch({ type: "ADD", payload: values });
   };
 
+  useEffect(() => {
+    return () => {
+      if (currentUrlRef.current) {
+        URL.revokeObjectURL(currentUrlRef.current);
+      }
+    };
+  }, []);
+
   return (
     <Formik initialValues={initialValues} onSubmit={handleSubmit} enableReinitialize>
       {({ setFieldValue, errors, setFieldError }) => (
@@ -69,8 +81,12 @@ const SoundUpload = () => {
               accept="audio/mpeg"
               className="mt-4 w-full flex flex-col items-center justify-center rounded-2xl border border-slate-800 bg-slate-900/40 p-10 text-center file:px-3 file:border file:border-gray-500 file:rounded-lg file:bg-blue-800 file:mr-5"
               onChange={(e) => {
+                if (currentUrlRef.current) {
+                  URL.revokeObjectURL(currentUrlRef.current);
+                }
                 if (e.target?.files && e.target?.files[0]?.type === "audio/mpeg") {
-                  const url = URL.createObjectURL(e.target.files[0]);
+                  currentUrlRef.current = URL.createObjectURL(e.target.files[0]);
+                  const url = currentUrlRef.current;
                   setFieldValue("soundUrl", url);
                   setFieldValue("name", e.target.files[0].name);
                   setFieldValue("soundFileName", e.target.files[0].name);