import { useEffect } from "react"
import CreatorSocket from "../utils/socket"
import { DEV_MODE } from "../utils/constants"

interface NotificationListenerProps {
  notificationId: string
  onNotification: (data: any) => void
}

const socketClient = new CreatorSocket(DEV_MODE ? "http://localhost:3000" : "")

const NotificationListener: React.FC<NotificationListenerProps> = ({
  notificationId,
  onNotification,
}) => {
  useEffect(() => {
    if (!notificationId) return

    socketClient.connect()
    socketClient.on(notificationId, onNotification)
    socketClient.emit("registerNotification", { notificationId })

    return () => {
      socketClient.off(notificationId, onNotification)
      socketClient.disconnect()
    }
  }, [notificationId, onNotification])

  return null
}

export default NotificationListener
