import { useEffect } from 'react';
import { useSocket } from '../context/SocketContext';
import toast from 'react-hot-toast';

export const useSocketEvent = (event, handler) => {
  const { socket } = useSocket();

  useEffect(() => {
    if (socket) {
      socket.on(event, handler);
      return () => {
        socket.off(event, handler);
      };
    }
  }, [socket, event, handler]);
};

export const useTaskNotifications = () => {
  const { socket } = useSocket();

  useEffect(() => {
    if (socket) {
      const handleTaskUpdate = (data) => {
        toast.success(`Task "${data.title}" has been updated`);
      };

      const handleNewTask = (data) => {
        toast.success(`New task "${data.title}" assigned to you`);
      };

      const handleTaskComment = (data) => {
        toast(`${data.user} commented on "${data.taskTitle}"`);
      };

      socket.on('task:update', handleTaskUpdate);
      socket.on('task:new', handleNewTask);
      socket.on('task:comment', handleTaskComment);

      return () => {
        socket.off('task:update', handleTaskUpdate);
        socket.off('task:new', handleNewTask);
        socket.off('task:comment', handleTaskComment);
      };
    }
  }, [socket]);
};