Integrate new PageBar behavior

src/app/components/SpaceMenuRoomItem.svelte

@@ -27,7 +27,7 @@
 </script>
 
 {#if roomType === RoomType.Voice}
-  <VoiceRoomItem {url} {h} />
+  <VoiceRoomItem {url} {h} {replaceState} />
 {:else}
   <SecondaryNavItem
     href={path}

src/app/components/VoiceRoomItem.svelte

@@ -6,6 +6,7 @@
   import RoomImage from "@app/components/RoomImage.svelte"
   import RoomName from "@app/components/RoomName.svelte"
   import {pushToast} from "@app/util/toast"
+  import {makeRoomPath} from "@app/util/routes"
   import {
     deriveVoiceParticipants,
     joinVoiceRoom,
@@ -19,9 +20,10 @@
   interface Props {
     url: string
     h: string
+    replaceState?: boolean
   }
 
-  const {url, h}: Props = $props()
+  const {url, h, replaceState = false}: Props = $props()
 
   const participants = deriveVoiceParticipants(url, h)
   const isActive = $derived($currentVoiceSession?.url === url && $currentVoiceSession?.h === h)
@@ -55,6 +57,8 @@
 </script>
 
 <SecondaryNavItem
+  href={makeRoomPath(url, h)}
+  {replaceState}
   onclick={handleClick}
   class={cx("!items-start", isActive && "!bg-base-100 !text-base-content")}>
   <div class="flex w-full min-w-0 flex-col gap-2">