"use client";
import { usePilotConnectionStore } from "_store/pilot/connectionStore";
import { useDmeStore } from "_store/pilot/dmeStore";
import { useEffect, useRef } from "react";

export const useSounds = () => {
	const { page, setPage } = useDmeStore((state) => state);
	const mission = usePilotConnectionStore((state) => state.activeMission);

	const newMissionSound = useRef<HTMLAudioElement | null>(null);

	useEffect(() => {
		if (typeof window !== "undefined") {
			newMissionSound.current = new Audio("/sounds/Melder3.wav");
		}
	}, []);

	useEffect(() => {
		const timeouts: NodeJS.Timeout[] = [];

		if (page === "new-mission" && newMissionSound.current) {
			console.log("new-mission", mission);
			newMissionSound.current.currentTime = 0;
			newMissionSound.current.volume = 0.3;
			newMissionSound.current.play();
			if (mission) {
				timeouts.push(
					setTimeout(() => setPage({ page: "mission", mission }), 500),
				);
			}
		} else if (page === "acknowledge") {
			newMissionSound.current?.pause();
			if (mission) {
				timeouts.push(
					setTimeout(() => setPage({ page: "mission", mission }), 500),
				);
			} else {
				timeouts.push(
					setTimeout(
						() => setPage({ page: "error", error: "Einsatz nicht gebunden" }),
						500,
					),
				);
			}
		}
		return () => {
			timeouts.forEach((t) => {
				clearTimeout(t);
			});
		};
	}, [page, setPage, mission]);
};