"use client";

import type React from "react";
import { createContext, useCallback, useContext, useState } from "react";

interface AudioContextType {
	isGlobalMuted: boolean;
	activeVideoId: string | null;
	toggleGlobalMute: () => void;
	setActiveVideo: (id: string | null) => void;
}

const AudioContext = createContext<AudioContextType | undefined>(undefined);

export function AudioProvider({ children }: { children: React.ReactNode }) {
	const [isGlobalMuted, setIsGlobalMuted] = useState(true);
	const [activeVideoId, setActiveVideoId] = useState<string | null>(null);

	const toggleGlobalMute = useCallback(() => {
		setIsGlobalMuted((prev) => !prev);
	}, []);

	const setActiveVideo = useCallback((id: string | null) => {
		setActiveVideoId(id);
		if (id !== null) {
			setIsGlobalMuted(false);
		}
	}, []);

	return (
		<AudioContext.Provider
			value={{ isGlobalMuted, activeVideoId, toggleGlobalMute, setActiveVideo }}
		>
			{children}
		</AudioContext.Provider>
	);
}

export function useAudio() {
	const context = useContext(AudioContext);
	if (context === undefined) {
		throw new Error("useAudio must be used within an AudioProvider");
	}
	return context;
}