import { useEffect, useRef, useState } from "react";
import { io, Socket } from "socket.io-client";

interface UseDraftSocketReturn {
  socket: Socket | null;
  isConnected: boolean;
  on: (event: string, callback: (...args: any[]) => void) => void;
  off: (event: string, callback?: (...args: any[]) => void) => void;
}

export function useDraftSocket(seasonId: string): UseDraftSocketReturn {
  const socketRef = useRef<Socket | null>(null);
  const [isConnected, setIsConnected] = useState(false);

  useEffect(() => {
    // Connect to Socket.IO server
    const socket = io({
      path: "/socket.io",
      transports: ["websocket", "polling"],
    });

    socketRef.current = socket;

    socket.on("connect", () => {
      console.log("Connected to Socket.IO:", socket.id);
      setIsConnected(true);
      // Join the draft room
      socket.emit("join-draft", seasonId);
    });

    socket.on("disconnect", () => {
      console.log("Disconnected from Socket.IO");
      setIsConnected(false);
    });

    socket.on("connect_error", (error) => {
      console.error("Socket.IO connection error:", error);
    });

    // Cleanup on unmount
    return () => {
      if (socket) {
        console.log("Leaving draft room:", seasonId);
        socket.emit("leave-draft", seasonId);
        socket.disconnect();
      }
    };
  }, [seasonId]);

  // Helper to subscribe to events
  const on = (event: string, callback: (...args: any[]) => void) => {
    socketRef.current?.on(event, callback);
  };

  // Helper to unsubscribe from events
  const off = (event: string, callback?: (...args: any[]) => void) => {
    socketRef.current?.off(event, callback);
  };

  return { socket: socketRef.current, isConnected, on, off };
}