Client Side Event not working with larvavel websockets

Question

Hi I have an issue when i tried to use Laravel Webscokets and laravel Echo When i fire my event i can see it inside Websocket server side but i didn't get any response in client side how can i fix please Laravel Version : 10

composer.json file

    "name": "laravel/laravel",
    "type": "project",
    "description": "The Laravel Framework.",
    "keywords": ["framework", "laravel"],
    "license": "MIT",
    "require": {
        "php": "^8.1",
        "beyondcode/laravel-websockets": "^1.14",
        "guzzlehttp/guzzle": "^7.2",
        "joisarjignesh/bigbluebutton": "^2.6",
        "laravel/framework": "^10.0",
        "laravel/sanctum": "^3.2",
        "laravel/tinker": "^2.8",
        "laravel/ui": "^4.2",
        "pusher/pusher-php-server": "^7.2",
        "react/promise": "2.7",
        "spatie/browsershot": "^3.57",
        "tymon/jwt-auth": "^2.0"
    },
    "require-dev": {
        "fakerphp/faker": "^1.9.1",
        "laravel/pint": "^1.0",
        "laravel/sail": "^1.18",
        "mockery/mockery": "^1.4.4",
        "nunomaduro/collision": "^7.0",
        "phpunit/phpunit": "^10.0",
        "spatie/laravel-ignition": "^2.0"
    },

Event File
<?php

namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;

class openShiftNotification implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;
    
    public $message;
    
    /**
     * Create a new event instance.
     */
    public function __construct($message)
    {
        $this->message = $message;
    }

    /**
     * Get the channels the event should broadcast on.
     *
     * @return array<int, \Illuminate\Broadcasting\Channel>
     */
    public function broadcastOn()
    {
        return new Channel('openShift');
    }
    
    public function broadcastAs()
    {
        return 'newOpenShiftNotification';
    }
    
}

broadcating.php file
'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' => 6001,
                'scheme' => 'http'
            ],
            'client_options' => [
                // Guzzle client options: https://docs.guzzlephp.org/en/stable/request-options.html
            ],
        ],

websockets.php
'apps' => [
        [
            'id' => env('PUSHER_APP_ID'),
            'name' => env('APP_NAME'),
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'path' => env('PUSHER_APP_PATH'),
            'capacity' => null,
            'enable_client_messages' => true,
            'enable_statistics' => true,
        ],
    ],

bootsrap.js file
import Echo from 'laravel-echo';

import Pusher from 'pusher-js';
 window.Pusher = Pusher;
 

 window.Echo = new Echo({
     broadcaster: 'pusher',
     key: import.meta.env.VITE_PUSHER_APP_KEY,
     cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER ?? 'mt1',
     wsHost: import.meta.env.VITE_PUSHER_HOST ?? `ws-${import.meta.env.VITE_PUSHER_APP_CLUSTER}.pusher.com`,
     wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
     wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
//     forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
     forceTLS: false,
     encrypted: false,
     enabledTransports: ['ws', 'wss'],
 });

app.blade.php file
@vite(['resources/js/app.js'])
        <script>
            window.onload=function(){
                const channel = Echo.channel('openShift');
                channel.subscribed( () => {
                    console.log('Test');
                }).listen('.newOpenShiftNotification', (event) => {
                    console.log(event);
                });
            };
        </script>

WebSokets - http://127.0.0.1:8000/laravel-websockets inspect

I don't know where is the problem, Can anyone help me to fix? Thank you

laravel-web-sockets pusher-js laravel-10 laravel-pusher laravel-echo laravel