mirror of
https://github.com/purrgrammer/grimoire.git
synced 2026-04-09 23:16:50 +02:00
14c73c07a3
* feat: Add NIP-58 Badge Definition renderers
Implement feed and detail renderers for kind 30009 Badge Definition events.
- Add nip58-helpers.ts with badge metadata extraction functions
- Create BadgeDefinitionRenderer for compact feed view
- Create BadgeDefinitionDetailRenderer with award statistics
- Register both renderers in kinds registry
Badge definitions display:
- Badge image or Award icon fallback
- Badge name, description, and identifier
- In detail view: issuer, award count, recipients, image variants
- Automatically queries for badge awards (kind 8) to show stats
Follows existing renderer patterns (ZapstoreApp, EmojiSet) with
reactive queries using useLiveTimeline and cached helpers.
* refactor: Simplify badge renderers
Simplify NIP-58 badge renderers based on feedback:
- Rename "badge definition" to "badge" in comments and docs
- Remove image and ID from feed view (show only name + description)
- Remove award statistics fetching/display from detail view
- Remove badge address section from detail view
Feed view now shows minimal info (name, description) while detail
view focuses on badge metadata and image variants without external queries.
* feat: Add NIP-58 Badge Award renderers (kind 8)
Implement feed and detail renderers for Badge Award events that:
- Fetch and display badge metadata (thumbnail, name)
- Show recipient count in feed view ("Awarded to n people")
- Display full recipient list with usernames in detail view
- Link badge thumbnail and name to the badge event (kind 30009)
- Support award comments in detail view
Technical details:
- Parse badge address from "a" tag (30009:pubkey:identifier format)
- Fetch badge event reactively using eventStore.replaceable
- Use AddressPointer from nostr-tools/nip19 for type safety
- Register kind 8 in both feed and detail renderer registries
Also updates all "badge definition" terminology to just "badge"
in code comments for consistency with user-facing strings.
* refactor: Make badge award feed view more compact
Change BadgeAwardRenderer to display inline compact format:
- Small thumbnail (size-6) inline with text
- Badge name linked to badge event
- "awarded to n people" linked to award event (clickable)
- All elements in single line with flex-wrap for overflow
Layout: [thumbnail] badge-name awarded to n people
* feat: Show username when badge awarded to single person
Update BadgeAwardRenderer to display the recipient's username
when only 1 person is awarded the badge, instead of "1 person".
- Single recipient: "awarded to @username"
- Multiple recipients: "awarded to n people"
Uses UserName component for proper profile name resolution.
* feat: Add NIP-58 Profile Badges renderer (kind 30008)
- Add ProfileBadgesRenderer for feed view showing first 4 badges with count
- Add ProfileBadgesDetailRenderer for detail view showing all badges in grid
- Add getProfileBadgePairs helper to extract badge pairs from events
- Adjust BadgeAwardRenderer icon size from 6 to 5 and spacing to gap-1.5
- Register kind 30008 in both feed and detail renderer registries
Completes NIP-58 implementation with all three event types:
- Kind 8: Badge Awards
- Kind 30009: Badge Definitions
- Kind 30008: Profile Badges (this commit)
* refactor: Improve Profile Badges UX
Feed view:
- Show all badge thumbnails (removed 4-badge limit)
- Entire feed item is clickable to open detail view
- Badge count displayed inline
Detail view:
- Change from grid to vertical list layout
- Show one badge per row with horizontal layout
- Display: awarded by author, badge image, name, and description
- Better readability for badge information
* refactor: Improve Profile Badges layout and hierarchy
Feed view:
- Badge count now appears as clickable title
- Thumbnails displayed below title in separate row
- Better visual hierarchy and clearer affordance
Detail view:
- Increase badge images from size-16 to size-24
- Remove "Awarded by" label, show issuer directly
- Cleaner, more prominent badge presentation
* feat: Add Badge Awards (kind 8) to chat as system messages
Implemented NIP-58 badge award rendering in chat adapters:
Chat types (src/types/chat.ts):
- Add kind 8 to CHAT_KINDS array
- Add badgeAddress and awardedPubkeys to MessageMetadata
NIP-29 adapter (src/lib/chat/adapters/nip-29-adapter.ts):
- Include kind 8 in message filters
- Convert badge awards to system messages
- Extract badge metadata (address, recipients)
ChatViewer (src/components/ChatViewer.tsx):
- Add BadgeAwardSystemMessage component
- Parse badge address and fetch badge definition
- Render: "* username awarded 🏅 badge-name to username(s)"
- Show badge icon/image inline with badge name
Badge awards now appear as system messages showing issuer, badge
icon, badge name, and recipients in a clean horizontal layout.
* feat: Add Badge Awards (kind 8) to NIP-53 live chat
Extended badge award system messages to NIP-53 live streaming chats:
NIP-53 adapter (src/lib/chat/adapters/nip-53-adapter.ts):
- Import getAwardedPubkeys and getTagValues helpers
- Add kind 8 to message filters (loadMessages and loadMoreMessages)
- Add badge award handler in eventToMessage
- Convert to system messages with badge metadata
Badge awards from stream hosts now appear in live chat as system
messages, showing issuer, badge icon, and recipients in real-time.
* Revert "feat: Add Badge Awards to chat"
This reverts commits:
- 1686a94 feat: Add Badge Awards (kind 8) to NIP-53 live chat
- 909359f feat: Add Badge Awards (kind 8) to chat as system messages
Badge award rendering in chat will be implemented later.
This keeps the PR focused on Profile Badges (kind 30008) implementation.
---------
Co-authored-by: Claude <noreply@anthropic.com>
Grimoire
A Nostr protocol explorer and developer tool with a tiling window manager interface.
Features
- Tiling Windows - Each window is a Nostr "app" (profile viewer, event feed, NIP docs, etc.)
- Command Palette - Unix-style commands via
Cmd+Kto open apps and navigate - Multi-workspace - Virtual desktops with independent layouts
- Real-time - Reactive event subscriptions with automatic updates
Stack
React 19, TypeScript, Vite, TailwindCSS, Jotai, Dexie, Applesauce
Getting Started
npm install
npm run dev
Scripts
| Command | Description |
|---|---|
npm run dev |
Start dev server |
npm run build |
Build for production |
npm test |
Run tests in watch mode |
npm run lint |
Lint code |
npm run format |
Format code |
License
MIT