From a3d9106a435ae857aa4ccc350e8d92f839f6620c Mon Sep 17 00:00:00 2001
From: Coracle-Bot <npub1klq6260@nostr.local>
Date: Tue, 8 Sep 2026 23:33:37 +0000
Subject: [PATCH] Show the home hosting section whether or not the user hosts a
 space

---
 e2e/USER_STORIES.md                   |  2 ++
 e2e/specs/notifications.spec.ts       |  3 +++
 src/app/components/HomeHosting.svelte | 30 ++++++++++++++++-----------
 3 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/e2e/USER_STORIES.md b/e2e/USER_STORIES.md
index e9848180..0012d48c 100644
--- a/e2e/USER_STORIES.md
+++ b/e2e/USER_STORIES.md
@@ -1570,6 +1570,8 @@ Acceptance:
 - Selecting a conversation opens it, and it stays in the inbox once read.
 - Relay health checks are listed alongside the inbox, with the recommendation
   each one applies.
+- Hosting is offered whether or not she hosts a space: a shortcut to the hosting
+  panel when she has one, an invitation to start one when she doesn't.
 
 ### US-106 — Share text into the app
 
diff --git a/e2e/specs/notifications.spec.ts b/e2e/specs/notifications.spec.ts
index 2f745f9c..9dfa4929 100644
--- a/e2e/specs/notifications.spec.ts
+++ b/e2e/specs/notifications.spec.ts
@@ -381,6 +381,9 @@ test("US-116 read the home dashboard", async ({seed, as}) => {
   // Relay health checks had no mount point at all before the dashboard
   await expect(page.getByText("Health checks")).toBeVisible()
 
+  // Hosting shows even though alice hosts nothing, as an invitation to start a space
+  await expect(page.getByRole("button", {name: "Start a space"})).toBeVisible()
+
   await page.getByRole("button", {name: "Mark all read"}).click()
 
   await expect(unreadDot(conversation)).toHaveCount(0)
diff --git a/src/app/components/HomeHosting.svelte b/src/app/components/HomeHosting.svelte
index 6661070d..18a5a2ad 100644
--- a/src/app/components/HomeHosting.svelte
+++ b/src/app/components/HomeHosting.svelte
@@ -5,6 +5,7 @@
   import Icon from "@lib/components/Icon.svelte"
   import Link from "@lib/components/Link.svelte"
   import Button from "@lib/components/Button.svelte"
+  import Spinner from "@lib/components/Spinner.svelte"
   import HomeSection from "@app/components/HomeSection.svelte"
   import RelayListItem from "@app/components/hosting/RelayListItem.svelte"
   import RelayCreate from "@app/components/hosting/RelayCreate.svelte"
@@ -13,31 +14,36 @@
   import {HostingError, listTenantRelays, type HostedRelay} from "@app/hosting"
 
   let relays = $state<HostedRelay[]>([])
-  let loaded = $state(false)
+  let loading = $state(true)
 
   const openCreate = () => pushModal(RelayCreate)
 
   // A pubkey with no tenant yet answers with a HostingError, which is the ordinary case for
-  // anyone who has never hosted a space. The panel stays out of the way rather than reporting it.
+  // anyone who has never hosted a space.
   onMount(async () => {
     try {
       relays = await listTenantRelays($user.pubkey)
-      loaded = true
     } catch (e) {
       if (!(e instanceof HostingError)) {
         console.error(e)
       }
+    } finally {
+      loading = false
     }
   })
 </script>
 
-{#if loaded}
-  <HomeSection title="Hosting" icon={Server}>
-    {#snippet action()}
-      {#if relays.length > 0}
-        <Link href="/settings/hosting" class="button button-neutral button-xs">Manage</Link>
-      {/if}
-    {/snippet}
+<HomeSection title="Hosting" icon={Server}>
+  {#snippet action()}
+    {#if relays.length > 0}
+      <Link href="/settings/hosting" class="button button-neutral button-xs">Manage</Link>
+    {/if}
+  {/snippet}
+  {#if loading}
+    <div class="flex justify-center px-4 pb-8">
+      <Spinner>Checking your hosted spaces…</Spinner>
+    </div>
+  {:else}
     {#if relays.length > 0}
       <div class="flex flex-col divide-y divide-line border-y border-line">
         {#each relays as relay (relay.id)}
@@ -59,5 +65,5 @@
         {relays.length > 0 ? "Add another space" : "Start a space"}
       </Button>
     </div>
-  </HomeSection>
-{/if}
+  {/if}
+</HomeSection>