Home > Enterprise >  Pusher Laravel Broadcast Leave Room Notification
Pusher Laravel Broadcast Leave Room Notification

Time:09-28

I am going to post all my methods inside my app just to keep this clear for me to read. Here is the goal. When a user enters a room, a message is added "USER HAS ENTERED THE ROOM" - that works fine. Now, what I want to do is when a user LEAVES a room, I want it to say "USER HAS LEFT THE ROOM" - the notification works, but it is showing the wrong username (it shows the username of the person SEEING the message.

What is it I a missing or not grasping

    methods: {
        connect() {
            if (this.currentRoom?.id) {
                let vm = this;
                this.getMessages();
                Echo.join("chat."   this.currentRoom.id)
                    .here(users => {
                        this.sendUserActivityNotification(this.$page.props.user, true)
                        this.users = users
                        this.usersCount = users.length
                    })
                    .joining(user => {
                        this.users.push(user)
                        this.usersCount = this.usersCount 1
                    })
                    .leaving(user => { 
                        this.sendUserActivityNotification(this.$page.props.user, false)
                        this.users = this.users.filter(({id}) => (id !== user.id))
                        this.usersCount = this.usersCount-1
                    })
                    .listen('NewChatMessage', (e) => {
                        vm.getMessages();
                    });
            }
        },
        setRoom(room) {
            this.currentRoom = room;
        },
        getMessages() {
            axios.get('/chat/room/'   this.currentRoom.id   '/messages')
                .then(response => {
                    this.messages = response.data;
                })
                .catch(error => {
                    console.log(error);
                })
        },
        sendUserActivityNotification(user, joining) {
            const message = `${user.name} has ${joining === true ? 'entered' : 'left'} the room.`
            return axios.post(`/chat/room/${this.currentRoom.id}/notifications`, {message}).then(() => this.getMessages())
            .catch(console.error)
        },
        leaveRoom({id}) {
            this.$store.dispatch(RoomTypes.LEAVE_ROOM, id)
        }
    },

CodePudding user response:

I haven't used Laravel Echo, but after reading your code I think on the leaving method call, you are passing current user instead of what you are receiving from the event when you call the sendUserActivityNotification method.

Your implementation looks like this:

    ...
    .leaving(user => { 
        this.sendUserActivityNotification(this.$page.props.user, false)
        this.users = this.users.filter(({id}) => (id !== user.id))
        this.usersCount = this.usersCount-1
    })
    ....

You are passing this.$page.props.user to this.sendUserActivityNotification method instead of passing user.

You must change that call to this.sendUserActivityNotification(user, false)

  • Related