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)