diff --git a/src/app/components/PrimaryNav.svelte b/src/app/components/PrimaryNav.svelte
index e0f9d5a5..081d9829 100644
--- a/src/app/components/PrimaryNav.svelte
+++ b/src/app/components/PrimaryNav.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
   import type {Snippet} from "svelte"
   import {goto} from "$app/navigation"
+  import {splitAt} from "@welshman/lib"
   import {userProfile, shouldUnwrap} from "@welshman/app"
   import Widget from "@assets/icons/widget.svg?dataurl"
   import Compass from "@assets/icons/compass.svg?dataurl"
@@ -35,9 +36,9 @@
   const itemHeight = 56
   const navPadding = 8 * itemHeight
   const itemLimit = $derived((windowHeight - navPadding) / itemHeight)
-  const primarySpaceUrls = $derived($userSpaceUrls.slice(0, itemLimit))
+  const [primarySpaceUrls, secondarySpaceUrls] = $derived(splitAt(itemLimit, $userSpaceUrls))
   const anySpaceNotifications = $derived($userSpaceUrls.some(p => $notifications.has(p)))
-  const otherSpaceNotifications = $derived($userSpaceUrls.some(p => $notifications.has(p)))
+  const otherSpaceNotifications = $derived(secondarySpaceUrls.some(p => $notifications.has(p)))
 </script>
 
 <svelte:window bind:innerHeight={windowHeight} />