From 03c5e7fd6edbe78966418e058326f8b662be1676 Mon Sep 17 00:00:00 2001
From: Coracle-Bot <npub1klq6260@nostr.local>
Date: Tue, 8 Sep 2026 23:21:23 +0000
Subject: [PATCH] Add a home button to the mobile bottom nav

---
 e2e/USER_STORIES.md                  |  1 +
 e2e/specs/notifications.spec.ts      | 13 +++++++++++++
 src/app/components/PrimaryNav.svelte |  5 ++++-
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/e2e/USER_STORIES.md b/e2e/USER_STORIES.md
index 30063227..4ec2bc82 100644
--- a/e2e/USER_STORIES.md
+++ b/e2e/USER_STORIES.md
@@ -1537,6 +1537,7 @@ Acceptance:
 - With none configured, it shows a welcome screen offering "Add a space" and
   "Start a conversation".
 - Those options navigate to the spaces directory and the chat view respectively.
+- On a phone, the bottom bar carries a link home from wherever she is.
 
 ### US-106 — Share text into the app
 
diff --git a/e2e/specs/notifications.spec.ts b/e2e/specs/notifications.spec.ts
index c5a988d0..e7e0d7fd 100644
--- a/e2e/specs/notifications.spec.ts
+++ b/e2e/specs/notifications.spec.ts
@@ -45,6 +45,10 @@ const spaceNavItem = (page: Page, name: string) =>
 // since the menu is always on screen there.
 const spaceMenuNavItem = (page: Page) => page.getByRole("button", {name: "Open space menu"})
 
+// The link home, which the desktop rail and the phone's bottom bar both carry. Its accessible name
+// is the platform logo's alt text, and the rail is display:none below tailwind's md breakpoint.
+const homeNavItem = (page: Page) => page.getByRole("link", {name: "Home"})
+
 // The space menu's header, the one button in the secondary nav carrying the relay's address.
 const spaceMenu = (page: Page, url: string) =>
   page.locator(".secondary-nav").getByRole("button", {name: pattern(displayRelayUrl(url))})
@@ -305,6 +309,15 @@ test("US-105 land on the home page", async ({seed, as}) => {
   await startConversation.click()
 
   await expect(page).toHaveURL(/\/chat$/)
+
+  // On a phone the bottom bar is the whole of the navigation on screen, so the way back is there
+  const phone = await as(users.alice, "/chat", {
+    context: {viewport: {width: 390, height: 844}, hasTouch: true},
+  })
+
+  await homeNavItem(phone).click()
+
+  await expect(phone).toHaveURL(/\/home$/)
 })
 
 test("US-106 share text into the app", async ({seed, as}) => {
diff --git a/src/app/components/PrimaryNav.svelte b/src/app/components/PrimaryNav.svelte
index 036d8798..40fc7833 100644
--- a/src/app/components/PrimaryNav.svelte
+++ b/src/app/components/PrimaryNav.svelte
@@ -15,7 +15,7 @@
   import PrimaryNavSpaces from "@app/components/PrimaryNavSpaces.svelte"
   import Search from "@app/components/Search.svelte"
   import SpaceMenuDrawer from "@app/components/SpaceMenuDrawer.svelte"
-  import {PLATFORM_RELAYS} from "@app/env"
+  import {PLATFORM_LOGO, PLATFORM_RELAYS} from "@app/env"
   import {modal, popModal, pushDrawer, pushModal} from "@app/modal"
   import {notifications} from "@app/notifications"
   import {userSpaceUrls} from "@app/rooms"
@@ -100,6 +100,9 @@
       {#if PLATFORM_RELAYS.length === 1}
         <PrimaryNavItemSpace url={PLATFORM_RELAYS[0]} />
       {:else}
+        <PrimaryNavItem title="Home" href="/home">
+          <ImageIcon alt="Home" src={PLATFORM_LOGO} class="rounded-full" size={10} />
+        </PrimaryNavItem>
         <PrimaryNavItem onclick={showSearch}>
           <ImageIcon alt="Search" src={Magnifier} size={8} />
         </PrimaryNavItem>