Привязать уведомления в реальном времени в Laravel Blade как предупреждение

В моем веб-приложении я хочу уведомить некоторых конкретных пользователей, когда какая-либо задача создается от администратора. Это должно быть в реальном времени. Поэтому я использовал толкатель laravel. Но это не имеет никакого смысла. Я хочу это исправить.

Мой контроллер:

        public function add(Request $request){
            $data = $request->all();
            $tasks = Todo::create($data);

            //send notofications 
            $notifyTo = User::whereHas('roles', function($q){$q->whereIn('slug', [ 'manager'   ]);})->get();
            foreach ($notifyTo as $notifyUser) {
                $notifyUser->notify(new TaskCreated($tasks));
            }
        }

Мой класс уведомлений TaskCreated

public function via($notifiable)
   {
      return ['broadcast'];
   }

public function toBroadcast($notifiable)
{
    return [
        'title' => $this->tasks->task
    ];
}

Моя консоль отладки Pusher

Это мой boostrap.js

/**
 * Echo exposes an expressive API for subscribing to channels and listening
 * for events that are broadcast by Laravel. Echo and event broadcasting
 * allows your team to easily build robust real-time web applications.
 */

import Echo from 'laravel-echo'

window.Pusher = require('pusher-js');

window.Echo = new Echo({
    broadcaster: 'pusher',
    key:'bf6e79cce8gfggf548fb2c5e9',
    cluster: 'ap2',
    forceTLS: true
});

а это моя передняя часть

<script>
  var userId = $('meta[name="userId"]').attr('content');
    Echo.private('App.User.' + userId)
    .notification((notification) => {
        console.log(notification.type);
    });

  </script>

Конфиг/broadcasting.php

<?php

return [

    /*
    |--------------------------------------------------------------------------
    | Default Broadcaster
    |--------------------------------------------------------------------------
    |
    | This option controls the default broadcaster that will be used by the
    | framework when an event needs to be broadcast. You may set this to
    | any of the connections defined in the "connections" array below.
    |
    | Supported: "pusher", "redis", "log", "null"
    |
    */

    'default' => env('BROADCAST_DRIVER', 'null'),

    /*
    |--------------------------------------------------------------------------
    | Broadcast Connections
    |--------------------------------------------------------------------------
    |
    | Here you may define all of the broadcast connections that will be used
    | to broadcast events to other systems or over websockets. Samples of
    | each available type of connection are provided inside this array.
    |
    */

    'connections' => [

        'pusher' => [
            'driver' => 'pusher',
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'app_id' => env('PUSHER_APP_ID'),
            //'options' => [
                //'cluster' => env('PUSHER_APP_CLUSTER'),
                //'encrypted' => true,
               // 'host' => '127.0.0.1',
               // 'port' => 6004,
               // 'scheme' => 'http'
            //],

            'options' => [
                'cluster' => 'ap2',
                'useTLS' => true
            ],
        ],

        'redis' => [
            'driver' => 'redis',
            'connection' => 'default',
        ],

        'log' => [
            'driver' => 'log',
        ],

        'null' => [
            'driver' => 'null',
        ],

    ],

];

Я хочу предупредить заголовок уведомления в моем веб-приложении laravel. Как это возможно? Пожалуйста, предложите решение для фронтенда.