devsyncwrld/backspace
1
0
Fork 0
Code Issues Pull Requests Actions 26 Packages Projects Releases Wiki Activity

fix: send voice_leave WS message from mobile disconnect handlers

Browse Source 
MobileVoiceFullScreen and MobileVoiceMiniBar were missing voice_leave
(and dm_call_end) WS messages in their disconnect handlers, leaving
the server showing stale voice state. Now matches VoiceControls pattern.
This commit is contained in:
Jannis Braun
2026-03-23 21:18:34 +01:00
parent 0b7206487e
commit 7693cc737e
2 changed files with 24 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/src/components/layout/MobileVoiceFullScreen.tsx
+10 -2
View File
@@ -6,6 +6,8 @@ import { useAuthStore } from '../../stores/authStore';
import { Avatar } from '../ui/Avatar'; import { Avatar } from '../ui/Avatar';
import { useContextMenuStore, type ContextMenuItem } from '../../stores/contextMenuStore'; import { useContextMenuStore, type ContextMenuItem } from '../../stores/contextMenuStore';
import { buildVoiceModMenuItems, VolumeSliderItem } from '../voice/voiceMenuItems'; import { buildVoiceModMenuItems, VolumeSliderItem } from '../voice/voiceMenuItems';
import { wsSend } from '../../hooks/useWebSocket';
import { getChannelOrigin } from '../../stores/spaceStore';
export function MobileVoiceFullScreen() { export function MobileVoiceFullScreen() {
const popMobileScreen = useUIStore((s) => s.popMobileScreen); const popMobileScreen = useUIStore((s) => s.popMobileScreen);
@@ -96,8 +98,14 @@ export function MobileVoiceFullScreen() {
}; };
const handleDisconnect = () => { const handleDisconnect = () => {
leaveVoice(); const { activeDmCall, disconnectFn } = useVoiceStore.getState();
const disconnectFn = useVoiceStore.getState().disconnectFn; if (activeDmCall) {
wsSend({ type: 'dm_call_end', dmChannelId: activeDmCall.dmChannelId }, getChannelOrigin(activeDmCall.dmChannelId));
useVoiceStore.getState().setActiveDmCall(null);
} else if (currentVoiceChannelId) {
wsSend({ type: 'voice_leave' }, getChannelOrigin(currentVoiceChannelId));
leaveVoice();
}
if (disconnectFn) disconnectFn(); if (disconnectFn) disconnectFn();
popMobileScreen(); popMobileScreen();
}; };
packages/web/src/components/layout/MobileVoiceMiniBar.tsx
+14 -2
View File
@@ -1,7 +1,8 @@
import React from 'react'; import React from 'react';
import { useUIStore } from '../../stores/uiStore'; import { useUIStore } from '../../stores/uiStore';
import { useVoiceStore } from '../../stores/voiceStore'; import { useVoiceStore } from '../../stores/voiceStore';
import { useSpaceStore } from '../../stores/spaceStore'; import { useSpaceStore, getChannelOrigin } from '../../stores/spaceStore';
import { wsSend } from '../../hooks/useWebSocket';
export function MobileVoiceMiniBar() { export function MobileVoiceMiniBar() {
const pushMobileScreen = useUIStore((s) => s.pushMobileScreen); const pushMobileScreen = useUIStore((s) => s.pushMobileScreen);
@@ -92,7 +93,18 @@ export function MobileVoiceMiniBar() {
</button> </button>
<button <button
onClick={(e) => { e.stopPropagation(); leaveVoice(); const df = useVoiceStore.getState().disconnectFn; if (df) df(); }} onClick={(e) => {
e.stopPropagation();
const { activeDmCall, disconnectFn } = useVoiceStore.getState();
if (activeDmCall) {
wsSend({ type: 'dm_call_end', dmChannelId: activeDmCall.dmChannelId }, getChannelOrigin(activeDmCall.dmChannelId));
useVoiceStore.getState().setActiveDmCall(null);
} else if (currentVoiceChannelId) {
wsSend({ type: 'voice_leave' }, getChannelOrigin(currentVoiceChannelId));
leaveVoice();
}
if (disconnectFn) disconnectFn();
}}
className="w-8 h-8 rounded-full flex items-center justify-center bg-accent-rose/20 text-accent-rose hover:bg-accent-rose/30 transition-colors" className="w-8 h-8 rounded-full flex items-center justify-center bg-accent-rose/20 text-accent-rose hover:bg-accent-rose/30 transition-colors"
> >
<svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}> <svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>