From b0e0240c3744d0acf8e5438438bb017d9d2a3933 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 23 Jan 2026 14:35:15 +0000
Subject: [PATCH] fix: add defaultValue to Tabs components in all viewers

The Radix UI Tabs component requires a defaultValue prop to indicate
which tab should be active by default. Without it, no tab content is
rendered because the Tabs component doesn't know which content to show.

Added defaultValue={spells[0]?.id} to:
- ProfileViewer (pubkeySpells)
- EventDetailViewer (eventSpells)
- RelayViewer (relaySpells)

This ensures the first spell tab is selected and visible when the
viewer loads with available spells.
---
 src/components/EventDetailViewer.tsx | 5 ++++-
 src/components/ProfileViewer.tsx     | 5 ++++-
 src/components/RelayViewer.tsx       | 5 ++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/EventDetailViewer.tsx b/src/components/EventDetailViewer.tsx
index 5ca5f03..c995a2c 100644
--- a/src/components/EventDetailViewer.tsx
+++ b/src/components/EventDetailViewer.tsx
@@ -428,7 +428,10 @@ export function EventDetailViewer({ pointer }: EventDetailViewerProps) {
       {/* Spell Tabs */}
       <div className="border-t border-border flex-1 overflow-hidden flex flex-col min-h-0">
         {eventSpells.length > 0 ? (
-          <Tabs className="flex flex-col h-full">
+          <Tabs
+            defaultValue={eventSpells[0]?.id}
+            className="flex flex-col h-full"
+          >
             <div className="flex items-center border-b">
               <Button
                 variant="ghost"
diff --git a/src/components/ProfileViewer.tsx b/src/components/ProfileViewer.tsx
index fdec649..814daa3 100644
--- a/src/components/ProfileViewer.tsx
+++ b/src/components/ProfileViewer.tsx
@@ -805,7 +805,10 @@ export function ProfileViewer({ pubkey }: ProfileViewerProps) {
       {/* Spell Tabs */}
       <div className="border-t border-border flex-1 overflow-hidden flex flex-col min-h-0">
         {pubkeySpells.length > 0 ? (
-          <Tabs className="flex flex-col h-full">
+          <Tabs
+            defaultValue={pubkeySpells[0]?.id}
+            className="flex flex-col h-full"
+          >
             <div className="flex items-center border-b">
               <Button
                 variant="ghost"
diff --git a/src/components/RelayViewer.tsx b/src/components/RelayViewer.tsx
index 2bfdcc0..2479934 100644
--- a/src/components/RelayViewer.tsx
+++ b/src/components/RelayViewer.tsx
@@ -323,7 +323,10 @@ export function RelayViewer({ url }: RelayViewerProps) {
       {/* Spell Tabs */}
       <div className="border-t border-border flex-1 overflow-hidden flex flex-col min-h-0">
         {relaySpells.length > 0 ? (
-          <Tabs className="flex flex-col h-full">
+          <Tabs
+            defaultValue={relaySpells[0]?.id}
+            className="flex flex-col h-full"
+          >
             <div className="flex items-center border-b">
               <Button
                 variant="ghost"