Allow clicking voice widget to go back to call

This commit is contained in:
mplorentz
2026-04-03 10:41:05 -04:00
parent f7fd557d96
commit 9eeb6a45a6
+35 -21
View File
@@ -76,6 +76,14 @@
pushModal(VoiceRoomJoinDialog, {url: targetRoom.url, h: targetRoom.h})
}
const goToRoom = () => {
if (!targetRoom) return
const path = makeRoomPath(targetRoom.url, targetRoom.h)
if ($page.url.pathname !== path) {
void goto(path)
}
}
const openCallSettings = () => {
pushModal(VoiceCallAudioSettingsDialog)
}
@@ -138,27 +146,33 @@
in:fly={{y: 60, duration: 350}}
out:fly={{y: 60, duration: 250}}
class="flex flex-col gap-2 rounded-box bg-base-100 p-3">
<div class="flex flex-col gap-0.5">
<div class="flex items-center justify-between gap-2">
{#if $voiceState === VoiceState.Joining}
<span class="text-sm font-semibold text-warning">Joining...</span>
{:else if $voiceState === VoiceState.Connected}
<span class="text-sm font-semibold text-success">Voice Connected</span>
{:else}
<span class="text-sm font-semibold text-neutral-content">Disconnected</span>
{/if}
{#if showVoiceLayoutToggle}
<Button
data-tip="Toggle full-screen chat ↔ video (mobile) or split view (desktop)"
class={cx(mediaToggleClass, "shrink-0", layoutToggleActive && "text-primary")}
onclick={onLayoutToggle}>
<Icon icon={ChatRound} size={4} />
</Button>
{/if}
</div>
<span class="ellipsize text-xs opacity-70">
{roomName} / {spaceName}
</span>
<div class="flex items-start justify-between gap-2">
<button
type="button"
class="min-w-0 flex-1 rounded-lg px-1 py-0.5 text-left outline-none hover:bg-base-200/60 focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-base-100"
onclick={goToRoom}
aria-label="Open room {roomName}">
<div class="flex flex-col gap-0.5">
{#if $voiceState === VoiceState.Joining}
<span class="text-sm font-semibold text-warning">Joining...</span>
{:else if $voiceState === VoiceState.Connected}
<span class="text-sm font-semibold text-success">Voice Connected</span>
{:else}
<span class="text-sm font-semibold text-neutral-content">Disconnected</span>
{/if}
<span class="ellipsize text-xs opacity-70">
{roomName} / {spaceName}
</span>
</div>
</button>
{#if showVoiceLayoutToggle}
<Button
data-tip="Toggle full-screen chat ↔ video (mobile) or split view (desktop)"
class={cx(mediaToggleClass, "shrink-0", layoutToggleActive && "text-primary")}
onclick={onLayoutToggle}>
<Icon icon={ChatRound} size={4} />
</Button>
{/if}
</div>
<div class="flex flex-wrap items-center gap-2">
{#if $voiceState === VoiceState.Joining}