highperfocused/grimoire
1
0
Fork 0
mirror of https://github.com/purrgrammer/grimoire.git synced 2026-06-04 09:41:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

docs: expand shared components section in CLAUDE.md

Browse Source 
Add BaseEventContainer, ClickableEventTitle, RichText, QuotedEvent,
and CustomEmoji to the shared components reference. These are the
core building blocks used across all kind renderers — documenting
them prevents re-implementation and ensures consistent patterns.

https://claude.ai/code/session_01XjwLaShFSVPR5gNA7iUjuB
This commit is contained in:
Claude
2026-02-19 22:26:39 +00:00
parent 2740f98c8c
commit a00315e13f
1 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
CLAUDE.md
View File

@@ -340,9 +340,13 @@ This allows `applyTheme()` to switch themes at runtime.
- Example: `formatTimestamp(event.created_at, "long")` instead of manual `toLocaleDateString()`
- **File Organization**: By domain (`nostr/`, `ui/`, `services/`, `hooks/`, `lib/`)
- **State Logic**: All UI state mutations go through `src/core/logic.ts` pure functions
- **Shared Components**:
- **`RelayLink`** (`src/components/nostr/RelayLink.tsx`): Always use this when displaying relay URLs. It shows the relay favicon, handles insecure `ws://` warnings, and opens the relay detail window on click. Never render raw relay URL strings — use `<RelayLink url={relayUrl} />` instead.
- **`UserName`** (`src/components/nostr/UserName.tsx`): Always use this for displaying user pubkeys. Accepts optional `relayHints` prop for fetching profiles from specific relays.
- **Shared Components** — Use these instead of rolling your own:
- **`UserName`** (`src/components/nostr/UserName.tsx`): Always use for displaying user pubkeys. Shows display name, Grimoire member badge, supporter flame. Clicking opens profile. Accepts optional `relayHints` prop for fetching profiles from specific relays.
- **`RelayLink`** (`src/components/nostr/RelayLink.tsx`): Always use for displaying relay URLs. Shows relay favicon, insecure `ws://` warnings, read/write badges, and opens relay detail window on click. Never render raw relay URL strings.
- **`BaseEventContainer`** / **`ClickableEventTitle`** (`src/components/nostr/kinds/BaseEventRenderer.tsx`): Foundation for all feed renderers. `BaseEventContainer` wraps an event with author header, timestamp, context menu, and emoji reactions. `ClickableEventTitle` makes a title open the event detail view. Also exports `BaseEventProps` (the standard prop interface) and `EventAuthor`.
- **`RichText`** (`src/components/nostr/RichText.tsx`): Universal Nostr content renderer. Parses mentions, hashtags, custom emoji, media embeds, and nostr: references. Use for any event body text — never render `event.content` as a raw string.
- **`QuotedEvent`** (`src/components/nostr/QuotedEvent.tsx`): Renders referenced/quoted events with depth-aware collapsing. Handles both `EventPointer` and `AddressPointer` with relay hints.
- **`CustomEmoji`** (`src/components/nostr/CustomEmoji.tsx`): Renders NIP-30 custom emoji images inline. Shows shortcode tooltip, handles load errors gracefully.
## Important Patterns