Laravel Livewire 3 dispatch not working with laravel echo private

Question

I am building notification for new messages and want to broadcast these notifications to client side, instantly. My code can broadcast a new message notification, but the problem is listening to data and refresh message list.

Code for send notification

class NewMessage extends Notification implements ShouldQueue
{
    use Queueable;

    private Message $message; 
    private User $sender;

    public function __construct($mes)
    {
        $this->message=$mes;
        $this->sender=User::find($mes->from_id);
    }

    /**
     * Get the notification's delivery channels.
     *
     * @return array<int, string>
     */
    public function via(object $notifiable): array
    {
        return['database','broadcast'];
        // return ['mail', 'database','broadcast'];
    }
    /**
     * Get the mail representation of the notification.
     */
    public function toMail(object $notifiable): MailMessage
    {
        $url = url('/moncompte/mesmessages/'.$this->message->from_id);
        return (new MailMessage)
                    ->subject('New Message')
                    ->line('You have receiveid a new message.')
                    ->action('View Message', $url)
                    ->line($this->message->body);
    }

    /**
     * Get the array representation of the notification.
     *
     * @return array<string, mixed>
     */
    public function toDatabase(object $notifiable): array
    {
        return [
            'id' => $this->message->id,
            'from_id' => $this->sender->id,
            'name' =>   $this->sender->name,
            'content' => ' send you a message'
        ];
    }
    
    public function toBroadcast(object $notifiable): BroadcastMessage
    {
        return new BroadcastMessage([
            'id' => $this->message->id,
            'from_id' => $this->sender->id,
            'name' =>   $this->sender->name,
            'content' => ' send you a message'
        ]);
    }

    

}

Code for listen to notification channel and dispacth a new listen for refresh data

window.Echo.private(`App.Models.User.${userId}`)
    .notification((notification) => {
        console.log(notification.type);
        Livewire.dispatch('refreshData');
    });

Code for listen to refresh data

#[On('echo-private:App.Models.User.{user.id}')] 
    public function refreshData2()
    {
        dd('refresh2');
        $this->notifications=$this->user->notifications->where('type','!=','App\Notifications\NewMessage');
        $this->messages=$this->user->notifications->where('type','==','App\Notifications\NewMessage');
    }
    #[On('refreshData')] 
    public function refreshData()
    {
        dd('refresh');
        $this->notifications=$this->user->notifications->where('type','!=','App\Notifications\NewMessage');
        $this->messages=$this->user->notifications->where('type','==','App\Notifications\NewMessage');
    }

But it doesn't work, and getting that error in console

Uncaught TypeError: Cannot read properties of undefined (reading 'charAt')
    at e.value (app-c7bad5b3.js:5:10126)
    at n.value (app-c7bad5b3.js:5:10732)
    at livewire.js?id=8a199ab2:8657:46
    at Array.forEach (<anonymous>)
    at Array.<anonymous> (livewire.js?id=8a199ab2:8634:16)
    at trigger (livewire.js?id=8a199ab2:433:34)
    at Component.processEffects (livewire.js?id=8a199ab2:4371:7)
    at new Component (livewire.js?id=8a199ab2:4340:12)
    at initComponent (livewire.js?id=8a199ab2:4400:21)
    at livewire.js?id=8a199ab2:8267:26

Answer 1

For anyone who has the same problem, the solution is here. This save the entirely day. I resolved by listen to echo notification event that is Illuminate\Notifications\Events\BroadcastNotificationCreated events like this

#[On('echo:private-App.Models.User.{user.id},.Illuminate\Notifications\Events\BroadcastNotificationCreated')] 
    public function refreshData()
    {
        $this->notifications=$this->user->unreadNotifications->where('type','!=','App\Notifications\NewMessage');
        $this->messages=$this->user->unreadNotifications->where('type','==','App\Notifications\NewMessage');
    }