Laravel Echo cannot listening in ReactJS

I am trying to create real time notification using socket.io, redis, and laravel-echo-server.. My laravel-echo-server working just fine, the output of every refresh page in my web app is something like this :

[2023-06-25T04:15:30.117Z] - xvGR5sWQuYpxJw5JAAAR joined channel: change-channel

means it connected. And the console of these command is working too :

  useEffect(() => {
    window.Echo = new Echo({
      client: socketio,
      broadcaster: "socket.io",
      host: "http://127.0.0.1:6001",
    })

    window.Echo.connector.socket.on("connect", function () {
      console.log("connect success")
    })

    window.Echo.connector.socket.on("disconnect", function () {
      console.log("disconnected")
    })

But this one

    window.Echo.channel("change-channel").listen("change-event", (event) => {
      console.log("ChangeEvent received:", event)
    })

is not working. here's my event :

class ChangeEvent implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    /**
     * Create a new event instance.
     */
    public function __construct()
    {
        //
    }

    /**
     * Get the channels the event should broadcast on.
     *
     * @return array<int, \Illuminate\Broadcasting\Channel>
     */
    public function broadcastOn(): array
    {
        return [
            new Channel('change-channel'),
        ];
    }

    public function broadcastAs()
    {
        return 'change-event';
    }

It catched the event in my laravel-echo-server cli like this

Channel: laravel_database_change-channel
Event: change-event

I have tried to change the name like the output of the cli. And also add dot in front of event. name but its still not working. Am i missing something? Thanks in advance!

Turns out i need to combine both of solutions

    window.Echo.channel("laravel_database_change-channel").listen(".change-event", (event) => {
      console.log("ChangeEvent received:", event)
    })