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

fix: speaking indicator layout shift — use box-shadow ring instead of container growth

Browse Source
This commit is contained in:
Jannis Braun
2026-03-13 01:43:35 +01:00
parent cea18b19b5
commit 5f5433eb67
1 changed files with 2 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/src/components/voice/VoiceChannel.tsx
+2
View File
@@ -36,6 +36,7 @@ export function VoiceChannel({ channelId, channelName, onClick, locked, dragStat
const permissionMutedUserIds = useVoiceStore((s) => s.permissionMutedUserIds); const permissionMutedUserIds = useVoiceStore((s) => s.permissionMutedUserIds);
const participantMutes = useVoiceStore((s) => s.participantMutes); const participantMutes = useVoiceStore((s) => s.participantMutes);
const unwatchedCameras = useVoiceStore((s) => s.unwatchedCameras); const unwatchedCameras = useVoiceStore((s) => s.unwatchedCameras);
const speakingUserIds = useVoiceStore((s) => s.speakingUserIds);
const currentUserId = useVoiceStore((s) => { const currentUserId = useVoiceStore((s) => {
const local = s.participants.find(p => p.isLocal); const local = s.participants.find(p => p.isLocal);
return local?.userId ?? null; return local?.userId ?? null;
@@ -177,6 +178,7 @@ export function VoiceChannel({ channelId, channelName, onClick, locked, dragStat
status={status} status={status}
userId={member?.user.homeUserId ?? userId} userId={member?.user.homeUserId ?? userId}
user={member?.user} user={member?.user}
className={speakingUserIds.has(userId) ? 'rounded-full ring-2 ring-status-online' : ''}
/> />
<span className="text-[13px] text-txt-secondary truncate flex-1 min-w-0">{displayName}</span> <span className="text-[13px] text-txt-secondary truncate flex-1 min-w-0">{displayName}</span>
{/* Status badges */} {/* Status badges */}