Reverb chat with polling fallback

<?php

namespace App\Events;

use App\Models\Message;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;

class MessageSent implements ShouldBroadcast
{
    use Dispatchable;

    public function __construct(public Message $message) {}

    public function broadcastOn(): array
    {
        return [new PrivateChannel('conversation.'.$this->message->conversation_id)];
    }

    public function broadcastAs(): string
    {
        return 'message.sent';
    }

    // Send a minimal payload, never the whole model with hidden relations.
    public function broadcastWith(): array
    {
        return $this->message->only(['id', 'body', 'sender', 'created_at']);
    }
}

// routes/api.php: the polling endpoint returns anything newer than the client's last id.
// Route::get('/conversations/{c}/messages', fn (Conversation $c, Request $r) =>
//     $c->messages()->where('id', '>', (int) $r->query('after', 0))->orderBy('id')->limit(50)->get(['id','body','sender','created_at']));

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

window.Pusher = Pusher;

export function connectChat(conversationId, render) {
    let lastId = 0;
    let timer = null;

    // De-duplicate: the same message can arrive by socket and by poll.
    const accept = (m) => {
        if (m.id <= lastId) return;
        lastId = m.id;
        render(m);
    };

    const poll = async () => {
        const res = await fetch(`/api/conversations/${conversationId}/messages?after=${lastId}`);
        if (res.ok) (await res.json()).forEach(accept);
    };

    const startPolling = () => {
        if (!timer) timer = setInterval(poll, 4000);
    };
    const stopPolling = () => {
        clearInterval(timer);
        timer = null;
    };

    const echo = new Echo({
        broadcaster: 'reverb',
        key: import.meta.env.VITE_REVERB_APP_KEY,
        wsHost: import.meta.env.VITE_REVERB_HOST,
        wsPort: import.meta.env.VITE_REVERB_PORT ?? 8080,
        forceTLS: location.protocol === 'https:',
        enabledTransports: ['ws', 'wss'],
    });

    echo.private(`conversation.${conversationId}`).listen('.message.sent', accept);

    // Socket state drives the fallback; catch up once on every reconnect.
    echo.connector.pusher.connection.bind('state_change', ({ current }) => {
        if (current === 'connected') { stopPolling(); poll(); }
        else if (['unavailable', 'failed', 'disconnected'].includes(current)) startPolling();
    });

    poll();
    return () => { stopPolling(); echo.leave(`conversation.${conversationId}`); };
}