- uploaded files seems to work on desktop version

This commit is contained in:
2025-10-28 13:53:11 +00:00
parent 907555cb0d
commit c8eed55801
5 changed files with 68 additions and 81 deletions

View File

@@ -1,14 +1,14 @@
import { useEffect, useMemo, useRef, useState } from "react";
import { useEffect, useRef, useState } from "react";
import { useDebouncedCallback } from "use-debounce";
import { Query, useQuery } from "@tanstack/react-query";
import type { SightingType } from "../types/types";
import { useSound } from "react-sounds";
import { useSoundContext } from "../context/SoundContext";
import { checkIsHotListHit, getNPEDCategory, getSoundFileURL } from "../utils/utils";
import { checkIsHotListHit, getNPEDCategory } from "../utils/utils";
import switchSound from "../assets/sounds/ui/switch.mp3";
import notification from "../assets/sounds/ui/notification.mp3";
import popup from "../assets/sounds/ui/popup_open.mp3";
import { useFileUpload } from "./useFileUpload";
import { useCachedSoundSrc } from "./usecachedSoundSrc";
async function fetchSighting(url: string | undefined, ref: number): Promise<SightingType> {
const res = await fetch(`${url}${ref}`, {
@@ -19,53 +19,15 @@ async function fetchSighting(url: string | undefined, ref: number): Promise<Sigh
}
export function useSightingFeed(url: string | undefined) {
const { state, audioArmed, dispatch } = useSoundContext();
const { state, audioArmed } = useSoundContext();
const [sightings, setSightings] = useState<SightingType[]>([]);
const [selectedRef, setSelectedRef] = useState<number | null>(null);
const [sessionStarted, setSessionStarted] = useState(false);
const [selectedSighting, setSelectedSighting] = useState<SightingType | null>(null);
const isUploaded = state?.sightingSound?.endsWith(".mp3") || state?.sightingSound?.endsWith(".wav");
const fileName = isUploaded ? state.sightingSound : switchSound;
const { query: fileQuery } = useFileUpload({
queryKey: fileName ? [fileName] : undefined,
});
const objUrlRef = useRef<string | null>(null);
const soundSrcHotlist = useMemo(() => {
if (state?.hotlistSound?.includes(".mp3") || state.hotlistSound?.includes(".wav")) {
const file = state.soundOptions?.find((item) => item.name === state.hotlistSound);
return file?.soundUrl ?? notification;
}
return getSoundFileURL(state?.hotlistSound) ?? notification;
}, [state.hotlistSound, state.soundOptions]);
const soundSrcNped = useMemo(() => {
if (state?.NPEDsound?.includes(".mp3") || state.NPEDsound?.includes(".wav")) {
const file = state.soundOptions?.find((item) => item.name === state.NPEDsound);
return file?.soundUrl ?? popup;
}
return getSoundFileURL(state.NPEDsound) ?? popup;
}, [state.NPEDsound, state.soundOptions]);
const soundSrc = useMemo(() => {
if (isUploaded && fileQuery?.data instanceof Blob) {
if (objUrlRef.current) URL.revokeObjectURL(objUrlRef.current);
objUrlRef.current = URL.createObjectURL(fileQuery.data);
console.log(fileQuery.data);
return objUrlRef.current;
}
return getSoundFileURL(state?.sightingSound) ?? switchSound;
}, [isUploaded, fileQuery?.data, state?.sightingSound]);
useEffect(() => {
return () => {
if (objUrlRef.current) URL.revokeObjectURL(objUrlRef.current);
};
}, []);
const { src: soundSrc } = useCachedSoundSrc(state?.sightingSound, switchSound);
const { src: soundSrcHotlist } = useCachedSoundSrc(state?.hotlistSound, notification);
const { src: soundSrcNped } = useCachedSoundSrc(state?.NPEDsound, popup);
const { play: hotlistsound } = useSound(soundSrcHotlist, { volume: state.hotlistSoundVolume });
const { play: npedSound } = useSound(soundSrcNped, { volume: state.NPEDsoundVolume });