- added new sound files

- new functionality to upload files
- need to get and locatate uploaded files

src/components/SettingForms/Sound/SoundUpload.tsx

@@ -4,10 +4,12 @@ import type { SoundUploadValue } from "../../../types/types";
 import { useSoundContext } from "../../../context/SoundContext";
 import { toast } from "sonner";
 import { useCameraBlackboard } from "../../../hooks/useCameraBlackboard";
+import { useFileUpload } from "../../../hooks/useFileUpload";
 
 const SoundUpload = () => {
   const { state, dispatch } = useSoundContext();
   const { mutation } = useCameraBlackboard();
+  const { mutation: fileMutation } = useFileUpload();
 
   const initialValues: SoundUploadValue = {
     name: "",
@@ -37,10 +39,10 @@ const SoundUpload = () => {
       path: "soundSettings",
       value: updatedValues,
     });
+    const responsee = await fileMutation.mutateAsync(values.soundFile);
+    console.log(responsee);
     if (result.reason !== "OK") {
       toast.error("Cannot update sound settings");
-    } else {
-      toast.success(`${values.name} file added`);
     }
 
     dispatch({ type: "ADD", payload: values });

src/components/SettingForms/System/Upload.ts

@@ -10,10 +10,7 @@ type BlobFileUpload = {
   };
 };
 
-export async function sendBlobFileUpload({
+export async function sendBlobFileUpload({ file, opts }: BlobFileUpload): Promise<string> {
-  file,
-  opts,
-}: BlobFileUpload): Promise<string> {
   if (!file) throw new Error("No file supplied");
   if (!opts?.uploadUrl) throw new Error("No URL supplied");
 
@@ -42,9 +39,7 @@ export async function sendBlobFileUpload({
     const bodyText = await resp.text();
 
     if (!resp.ok) {
-      throw new Error(
+      throw new Error(`Upload failed (${resp.status} ${resp.statusText}) from ${opts.uploadUrl} — ${bodyText}`);
-        `Upload failed (${resp.status} ${resp.statusText}) from ${opts.uploadUrl} — ${bodyText}`
-      );
     }
 
     return bodyText;
@@ -54,9 +49,7 @@ export async function sendBlobFileUpload({
     }
     // In browsers, fetch throws TypeError on network-level failures
     if (err instanceof TypeError) {
-      throw new Error(
+      throw new Error(`HTTP error uploading to ${opts.uploadUrl}: ${err.message}`);
-        `HTTP error uploading to ${opts.uploadUrl}: ${err.message}`
-      );
     }
     // Todo: fix error message response
     return `Hotlist Load OK`;

src/context/reducers/SoundContextReducer.ts

@@ -13,6 +13,7 @@ export const initialState: SoundState = {
     { name: "Ding", soundFileName: "ding" },
     { name: "Shutter", soundFileName: "shutter" },
     { name: "Warning (voice)", soundFileName: "warning" },
+    { name: "Attention (voice)", soundFileName: "attention" },
   ],
   sightingVolume: 1,
   NPEDsoundVolume: 1,

src/hooks/useFileUpload.ts

@@ -0,0 +1,41 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { CAM_BASE } from "../utils/config";
+import { toast } from "sonner";
+const camBase = import.meta.env.MODE !== "development" ? CAM_BASE : CAM_BASE;
+
+const uploadFile = async (file: File) => {
+  const form = new FormData();
+  form.append("upload", file, file.name);
+  const response = await fetch(`${camBase}/upload/file-upload/3`, {
+    method: "POST",
+    body: form,
+  });
+  if (!response.ok) {
+    throw new Error("Cannot reach upload file endpoint");
+  }
+  return response.text();
+};
+
+const getUploadFiles = async () => {
+  const response = await fetch(`${camBase}/upload/file-upload/3`);
+  if (!response.ok) {
+    throw new Error("Cannot reach upload file endpoint");
+  }
+  return response.json();
+};
+
+export const useFileUpload = () => {
+  const query = useQuery({
+    queryKey: ["getUploadFiles"],
+    queryFn: getUploadFiles,
+  });
+
+  const mutation = useMutation({
+    mutationFn: (file: File) => uploadFile(file),
+    mutationKey: ["uploadFile"],
+    onError: (err) => console.log(err),
+    onSuccess: (msg) => toast.success(msg),
+  });
+
+  return { query, mutation };
+};

src/utils/utils.ts

@@ -5,6 +5,7 @@ import beep from "../assets/sounds/ui/Beep.wav";
 import warning from "../assets/sounds/ui/Warning.wav";
 import ding from "../assets/sounds/ui/Ding.wav";
 import shutter from "../assets/sounds/ui/shutter.mp3";
+import attention from "../assets/sounds/ui/Attention.wav";
 
 import type { HotlistMatches, SightingType } from "../types/types";
 
@@ -17,6 +18,7 @@ export function getSoundFileURL(name: string) {
     warning: warning,
     ding: ding,
     shutter: shutter,
+    attention: attention,
   };
   return sounds[name] ?? null;
 }