import Echo from 'laravel-echo'
import Pusher from 'pusher-js'

declare global {
  interface Window {
    Pusher: typeof Pusher
  }
}

window.Pusher = Pusher

export default defineNuxtPlugin(() => {
  const runtimeConfig = useRuntimeConfig()
  const echo = new Echo({
    broadcaster: runtimeConfig.public.echo.broadcaster,
    key: runtimeConfig.public.echo.key,
    cluster: 'mt1',
    wsHost: runtimeConfig.public.echo.wsHost,
    wsPort: runtimeConfig.public.echo.wsPort,
    wssPort: runtimeConfig.public.echo.wsPort,
    forceTLS: false,
    encrypted: runtimeConfig.public.echo.encrypted,
    disableStats: runtimeConfig.public.echo.disableStats,
    enabledTransports: ['ws', 'wss'],
    authorizer: (channel: { name: any }) => {
      return {
        authorize: async (socketId: string, callback: (error: any, respnse?: any) => void) => {
          try {
            const response = await $larafetch(`/broadcasting/auth`, {
              method: 'POST',
              body: {
                socket_id: socketId,
                channel_name: channel.name,
              },
            })

            callback(null, response)
          }
          catch (error) {
            callback(error)
          }
        },
      }
    },
  })

  // Make Echo instance available through the Nuxt app
  return {
    provide: {
      echo,
    },
  }
})