Implement new relay handler, rough out relay list/detail

frontend/src/pages/Login.tsx

@@ -68,7 +68,6 @@ export default function Login() {
     try {
       await completeLogin(await ExtensionAccount.fromExtension())
     } catch (e) {
-      console.error("NIP-07 login failed", e)
       setError(e instanceof Error ? e.message : "Failed to login with extension")
     } finally {
       setLoading(false)

frontend/src/pages/relays/RelayDetail.tsx

@@ -1,14 +1,37 @@
 import { useParams, A } from "@solidjs/router"
+import { createResource, Show } from "solid-js"
+import { getTenantRelay } from "../../lib/api"
 
 export default function RelayDetail() {
   const params = useParams()
+  const [relay] = createResource(() => params.id, getTenantRelay)
 
   return (
     <div class="max-w-4xl mx-auto px-4 py-8">
       <div class="flex items-center gap-2 mb-6">
         <A href="/relays" class="text-gray-500 hover:text-gray-700">← Relays</A>
       </div>
-      <h1 class="text-2xl font-bold text-gray-900 mb-4">Relay {params.id}</h1>
+
+      <Show when={relay.loading}>
+        <p class="text-gray-500 mb-4">Loading relay...</p>
+      </Show>
+
+      <Show when={relay.error && !relay.loading}>
+        <p class="text-red-600 mb-4">Failed to load relay.</p>
+      </Show>
+
+      <Show when={relay()}>
+        {(loadedRelay) => (
+          <div class="mb-6">
+            <h1 class="text-2xl font-bold text-gray-900">{loadedRelay().name}</h1>
+            <p class="mt-1 text-sm text-gray-500">https://{loadedRelay().subdomain}.spaces.coracle.social</p>
+            <Show when={loadedRelay().description.trim()}>
+              <p class="mt-3 text-gray-700">{loadedRelay().description}</p>
+            </Show>
+          </div>
+        )}
+      </Show>
+
       <div class="flex gap-3">
         <A
           href={`/relays/${params.id}/edit`}

frontend/src/pages/relays/RelayList.tsx

@@ -1,6 +1,10 @@
 import { A } from "@solidjs/router"
+import { createResource, For, Show } from "solid-js"
+import { listTenantRelays } from "../../lib/api"
 
 export default function RelayList() {
+  const [relays] = createResource(listTenantRelays)
+
   return (
     <div class="max-w-4xl mx-auto px-4 py-8">
       <div class="flex items-center justify-between mb-6">
@@ -12,7 +16,37 @@ export default function RelayList() {
           Add Relay
         </A>
       </div>
-      <p class="text-gray-500">No relays yet. Create one to get started.</p>
+
+      <Show when={relays.loading}>
+        <p class="text-gray-500">Loading relays...</p>
+      </Show>
+
+      <Show when={relays.error && !relays.loading}>
+        <p class="text-red-600">Failed to load relays.</p>
+      </Show>
+
+      <Show when={(relays()?.length ?? 0) > 0} fallback={<p class="text-gray-500">No relays yet. Create one to get started.</p>}>
+        <ul class="space-y-3">
+          <For each={relays()}>
+            {(relay) => (
+              <li>
+                <A
+                  href={`/relays/${relay.id}`}
+                  class="block rounded-lg border border-gray-200 bg-white p-4 hover:border-gray-300"
+                >
+                  <div class="flex items-center justify-between">
+                    <div>
+                      <p class="font-medium text-gray-900">{relay.name}</p>
+                      <p class="text-sm text-gray-500">{relay.subdomain}</p>
+                    </div>
+                    <p class="text-xs uppercase tracking-wide text-gray-500">{relay.status}</p>
+                  </div>
+                </A>
+              </li>
+            )}
+          </For>
+        </ul>
+      </Show>
     </div>
   )
 }

frontend/src/pages/relays/RelayNew.tsx

@@ -1,5 +1,6 @@
 import { createSignal } from "solid-js"
 import { useNavigate } from "@solidjs/router"
+import { createTenantRelay, listTenantRelays } from "../../lib/api"
 
 const PLANS = [
   { id: "free", label: "Free", price: 0, members: "Up to 10", blossom: false, livekit: false },
@@ -26,22 +27,54 @@ export default function RelayNew() {
   const [icon, setIcon] = createSignal("")
   const [description, setDescription] = createSignal("")
   const [plan, setPlan] = createSignal<PlanId>("free")
+  const [submitting, setSubmitting] = createSignal(false)
+  const [error, setError] = createSignal("")
 
   function handleNameInput(value: string) {
     setName(value)
     setSubdomain(slugify(value))
   }
 
-  function handleSubmit(e: Event) {
+  async function handleSubmit(e: Event) {
     e.preventDefault()
-    // TODO: submit to backend, handle invoice flow
-    navigate("/relays")
+
+    setError("")
+    setSubmitting(true)
+
+    try {
+      const normalizedSubdomain = slugify(subdomain())
+      const existingRelays = await listTenantRelays()
+      const hasDuplicate = existingRelays.some(relay => relay.subdomain.toLowerCase() === normalizedSubdomain.toLowerCase())
+
+      if (hasDuplicate) {
+        throw new Error("You already have a relay with this subdomain")
+      }
+
+      const relay = await createTenantRelay({
+        name: name().trim(),
+        subdomain: normalizedSubdomain,
+        icon: icon().trim(),
+        description: description().trim(),
+        plan: plan(),
+      })
+      navigate(`/relays/${relay.id}`)
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to create relay")
+    } finally {
+      setSubmitting(false)
+    }
   }
 
   return (
     <div class="max-w-2xl mx-auto px-4 py-8">
       <h1 class="text-2xl font-bold text-gray-900 mb-6">New Relay</h1>
       <form onSubmit={handleSubmit} class="space-y-6">
+        {error() && (
+          <div class="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
+            {error()}
+          </div>
+        )}
+
         <div>
           <label class="block text-sm font-medium text-gray-700 mb-1">Relay Name</label>
           <input
@@ -118,9 +151,10 @@ export default function RelayNew() {
 
         <button
           type="submit"
+          disabled={submitting()}
           class="w-full py-3 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 transition-colors"
         >
-          Create Relay
+          {submitting() ? "Creating..." : "Create Relay"}
         </button>
       </form>
     </div>