diff --git a/src/components/nostr/kinds/Kind1111Renderer.tsx b/src/components/nostr/kinds/Kind1111Renderer.tsx index 5011ed5..15c96c6 100644 --- a/src/components/nostr/kinds/Kind1111Renderer.tsx +++ b/src/components/nostr/kinds/Kind1111Renderer.tsx @@ -9,17 +9,15 @@ import { } from "applesauce-common/helpers/comment"; import { useNostrEvent } from "@/hooks/useNostrEvent"; import { UserName } from "../UserName"; -import { Reply, type LucideIcon } from "lucide-react"; +import { ExternalLink, Reply } from "lucide-react"; import { useGrimoire } from "@/core/state"; import { InlineReplySkeleton } from "@/components/ui/skeleton"; import { KindBadge } from "@/components/KindBadge"; -import { getKindInfo } from "@/constants/kinds"; import { getEventDisplayTitle } from "@/lib/event-title"; import type { NostrEvent } from "@/types/nostr"; import { getCommentRootScope, isTopLevelComment, - getExternalIdentifierIcon, getExternalIdentifierLabel, type CommentRootScope, type CommentScope, @@ -54,8 +52,6 @@ function convertCommentPointer( /** * Convert a CommentScope to a useNostrEvent-compatible pointer. - * Event and address scopes already carry EventPointer/AddressPointer fields - * from applesauce helpers, so we just strip the discriminant. */ function scopeToPointer( scope: CommentScope, @@ -74,38 +70,20 @@ function scopeToPointer( return undefined; } -function getKindIcon(kind: number): LucideIcon { - const info = getKindInfo(kind); - return info?.icon || Reply; -} - /** - * Uniform inline scope row — icon + label text. - * Used for both root scope and parent reply, regardless of Nostr event or external identifier. + * Inline scope row — children are direct flex items. + * Renders as a plain div, clickable div, or anchor depending on props. */ function ScopeRow({ - icon: Icon, - label, + children, onClick, href, }: { - icon: LucideIcon; - label: ReactNode; + children: ReactNode; onClick?: () => void; href?: string; }) { - const className = - "flex items-center gap-1.5 text-xs text-muted-foreground overflow-hidden min-w-0" + - (onClick - ? " cursor-crosshair hover:text-foreground transition-colors" - : ""); - - const inner = ( - <> - - {label} - - ); + const base = "flex items-center gap-1.5 text-xs overflow-hidden min-w-0"; if (href) { return ( @@ -113,32 +91,35 @@ function ScopeRow({ href={href} target="_blank" rel="noopener noreferrer" - className={className + " hover:text-foreground transition-colors"} + className={`${base} text-accent hover:underline hover:decoration-dotted`} > - {inner} + {children} ); } - return ( -
- {inner} -
- ); + if (onClick) { + return ( +
+ {children} +
+ ); + } + + return
{children}
; } /** - * Builds the label ReactNode for a loaded Nostr event scope row. + * Inline content for a loaded Nostr event: KindBadge + UserName + title preview. */ -function NostrEventLabel({ nostrEvent }: { nostrEvent: NostrEvent }) { +function NostrEventContent({ nostrEvent }: { nostrEvent: NostrEvent }) { const title = getEventDisplayTitle(nostrEvent, false); return ( <> - + + + + {label} + ); } @@ -187,11 +171,9 @@ function RootScopeDisplay({ } return ( - } - onClick={() => addWindow("open", { pointer })} - /> + addWindow("open", { pointer })}> + + ); } @@ -219,17 +201,23 @@ export function Kind1111Renderer({ event, depth = 0 }: BaseEventProps) { {/* Root scope — what this comment thread is about */} {root && } - {/* Parent reply — only shown for nested comments (reply to another comment) */} + {/* Parent reply — only shown for nested comments */} {!topLevel && replyPointer && !replyEvent && ( } /> )} {!topLevel && replyPointer && replyEvent && ( - } - onClick={handleReplyClick} - /> + + + + + {getEventDisplayTitle(replyEvent, false) || + replyEvent.content.slice(0, 80)} + + )}