From c2d08895d8e842ebf333ed3161d39c88cb5b2617 Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Tue, 28 Jul 2026 19:40:55 +0530 Subject: [PATCH 1/3] stop audio player when message is deleted --- .../MediaPlayerProvider.tsx | 57 ++++++++++++++++++- 1 file changed, 56 insertions(+), 1 deletion(-) diff --git a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx index ac0c843dc94e8..5a7b63c904982 100644 --- a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx +++ b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx @@ -1,10 +1,12 @@ import { useMergedRefs, useStableCallback } from '@rocket.chat/fuselage-hooks'; +import { useStream } from '@rocket.chat/ui-contexts'; import type { ReactNode } from 'react'; -import { useCallback, useMemo, useRef, useState } from 'react'; +import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import type { MediaPlayerContextValue, PersistentAudioTrack } from './MediaPlayerContext'; import { MediaPlayerContext } from './MediaPlayerContext'; import { useReloadOnError } from '../../components/message/content/attachments/file/hooks/useReloadOnError'; +import { Messages } from '../../stores'; const PLAYBACK_RATES = [1, 1.5, 2] as const; @@ -101,6 +103,59 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { }); const isActive = useCallback((id: string) => trackRef.current?.id === id, []); + const subscribeToNotifyRoom = useStream('notify-room'); + + //For hard message delete, when Message Message_ShowDeletedStatus is off + useEffect(() => { + if (!track || !playing) { + return; + } + + const { rid, mid } = track; + + if (!rid || !mid) { + return; + } + + const unsubscribeFromDeleteMessage = subscribeToNotifyRoom(`${rid}/deleteMessage`, ({ _id }) => { + if (_id === mid) { + close(); + } + }); + + const unsubscribeFromDeleteMessageBulk = subscribeToNotifyRoom(`${rid}/deleteMessageBulk`, ({ ids }) => { + if (ids?.includes(mid)) { + close(); + } + }); + + return () => { + unsubscribeFromDeleteMessage(); + unsubscribeFromDeleteMessageBulk(); + }; + }, [track, subscribeToNotifyRoom, close, playing]); + + //For soft message delete, when Message_ShowDeletedStatus is on and server updates message.t to rm + useEffect(() => { + if (!track || !playing) { + return; + } + + const unsub = Messages.use.subscribe((state, prevState) => { + const { mid } = track; + if (!mid) { + return; + } + + const message = state.records.get(mid); + + if (message && message !== prevState.records.get(mid) && message.t === 'rm') { + close(); + } + }); + + return unsub; + }, [track, close, playing]); const value = useMemo( () => ({ track, playing, currentTime, duration, playbackRate, play, toggle, seek, cyclePlaybackRate, close, isActive }), From a8ae3ea3fc900c22bb5471c6a7a592bf9ff2c31d Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Tue, 28 Jul 2026 20:13:38 +0530 Subject: [PATCH 2/3] stop audio when user is no longer part of the room --- .../MediaPlayerProvider.tsx | 22 ++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx index 5a7b63c904982..7451e0730e3da 100644 --- a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx +++ b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx @@ -1,5 +1,5 @@ import { useMergedRefs, useStableCallback } from '@rocket.chat/fuselage-hooks'; -import { useStream } from '@rocket.chat/ui-contexts'; +import { useStream, useUserId } from '@rocket.chat/ui-contexts'; import type { ReactNode } from 'react'; import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; @@ -29,6 +29,7 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { const [currentTime, setCurrentTime] = useState(0); const [duration, setDuration] = useState(0); const [playbackRate, setPlaybackRate] = useState(1); + const userId = useUserId(); const trackRef = useRef(null); trackRef.current = track; @@ -104,6 +105,7 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { const isActive = useCallback((id: string) => trackRef.current?.id === id, []); const subscribeToNotifyRoom = useStream('notify-room'); + const subscribeToNotifyUser = useStream('notify-user'); //For hard message delete, when Message Message_ShowDeletedStatus is off useEffect(() => { @@ -157,6 +159,24 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { return unsub; }, [track, close, playing]); + useEffect(() => { + if (!track || !playing || !userId) { + return; + } + + const { rid } = track; + + if (!rid) { + return; + } + + return subscribeToNotifyUser(`${userId}/subscriptions-changed`, (event, subscription) => { + if (event === 'removed' && subscription.rid === rid) { + close(); + } + }); + }, [userId, subscribeToNotifyUser, track, playing, close]); + const value = useMemo( () => ({ track, playing, currentTime, duration, playbackRate, play, toggle, seek, cyclePlaybackRate, close, isActive }), [track, playing, currentTime, duration, playbackRate, play, toggle, seek, cyclePlaybackRate, close, isActive], From 28db67fe781c6fd403cf0438680f72ab0c2a50f4 Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Tue, 28 Jul 2026 21:00:03 +0530 Subject: [PATCH 3/3] fix edge case of pausing audio message --- .../MediaPlayerProvider/MediaPlayerProvider.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx index 7451e0730e3da..5a931a1ce7c4d 100644 --- a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx +++ b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx @@ -109,7 +109,7 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { //For hard message delete, when Message Message_ShowDeletedStatus is off useEffect(() => { - if (!track || !playing) { + if (!track) { return; } @@ -135,11 +135,11 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { unsubscribeFromDeleteMessage(); unsubscribeFromDeleteMessageBulk(); }; - }, [track, subscribeToNotifyRoom, close, playing]); + }, [track, subscribeToNotifyRoom, close]); //For soft message delete, when Message_ShowDeletedStatus is on and server updates message.t to rm useEffect(() => { - if (!track || !playing) { + if (!track) { return; } @@ -157,10 +157,10 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { }); return unsub; - }, [track, close, playing]); + }, [track, close]); useEffect(() => { - if (!track || !playing || !userId) { + if (!track || !userId) { return; } @@ -175,7 +175,7 @@ const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => { close(); } }); - }, [userId, subscribeToNotifyUser, track, playing, close]); + }, [userId, subscribeToNotifyUser, track, close]); const value = useMemo( () => ({ track, playing, currentTime, duration, playbackRate, play, toggle, seek, cyclePlaybackRate, close, isActive }),