Add loading indicator while joining
This commit is contained in:
@@ -17,13 +17,18 @@
|
||||
|
||||
const participants = deriveVoiceParticipants(url, h)
|
||||
const isActive = $derived($currentVoiceSession?.url === url && $currentVoiceSession?.h === h)
|
||||
let isJoining = $state(false)
|
||||
|
||||
const handleClick = async () => {
|
||||
if (isJoining) return
|
||||
isJoining = true
|
||||
try {
|
||||
await joinVoiceRoom(url, h)
|
||||
} catch (e) {
|
||||
const message = e instanceof Error ? e.message : String(e)
|
||||
pushToast({theme: "error", message: `Failed to join voice room: ${message}`})
|
||||
} finally {
|
||||
isJoining = false
|
||||
}
|
||||
}
|
||||
|
||||
@@ -35,8 +40,15 @@
|
||||
</script>
|
||||
|
||||
<div>
|
||||
<SecondaryNavItem onclick={handleClick} class={isActive ? "!bg-base-100 !text-base-content" : ""}>
|
||||
<Icon icon={Volume} size={4} class="opacity-70" />
|
||||
<SecondaryNavItem
|
||||
onclick={handleClick}
|
||||
disabled={isJoining}
|
||||
class={isActive ? "!bg-base-100 !text-base-content" : ""}>
|
||||
{#if isJoining}
|
||||
<span class="loading loading-spinner loading-sm"></span>
|
||||
{:else}
|
||||
<Icon icon={Volume} size={4} class="opacity-70" />
|
||||
{/if}
|
||||
<RoomName {url} {h} />
|
||||
</SecondaryNavItem>
|
||||
{#if $participants.length > 0}
|
||||
|
||||
Reference in New Issue
Block a user