Add a home button to the mobile bottom nav

This commit is contained in:
Coracle-Bot 2026-09-08 23:21:23 +00:00
parent 6b324b3232
commit 03c5e7fd6e
3 changed files with 18 additions and 1 deletions

View file

@ -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

View file

@ -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}) => {

View file

@ -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>