Files
grimoire/package.json
Alejandro 14c73c07a3 feat: Add NIP-58 Badge Definition renderers (#123)
* 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>
2026-01-17 20:30:32 +01:00

3.6 KiB