mirror of
https://github.com/purrgrammer/grimoire.git
synced 2026-04-09 15:07:10 +02:00
* 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>
118 lines
3.6 KiB
JSON
118 lines
3.6 KiB
JSON
{
|
|
"name": "grimoire",
|
|
"private": true,
|
|
"version": "0.1.0",
|
|
"type": "module",
|
|
"license": "MIT",
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"build": "tsc -b && vite build",
|
|
"lint": "eslint .",
|
|
"lint:fix": "eslint . --fix",
|
|
"format": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,css}\"",
|
|
"format:check": "prettier --check \"src/**/*.{ts,tsx,js,jsx,json,css}\"",
|
|
"preview": "vite preview",
|
|
"test": "vitest",
|
|
"test:ui": "vitest --ui",
|
|
"test:run": "vitest run"
|
|
},
|
|
"dependencies": {
|
|
"@radix-ui/react-accordion": "^1.2.12",
|
|
"@radix-ui/react-avatar": "^1.1.11",
|
|
"@radix-ui/react-checkbox": "^1.3.3",
|
|
"@radix-ui/react-collapsible": "^1.1.12",
|
|
"@radix-ui/react-context-menu": "^2.2.16",
|
|
"@radix-ui/react-dialog": "^1.1.15",
|
|
"@radix-ui/react-dropdown-menu": "^2.1.16",
|
|
"@radix-ui/react-hover-card": "^1.1.15",
|
|
"@radix-ui/react-popover": "^1.1.15",
|
|
"@radix-ui/react-progress": "^1.1.8",
|
|
"@radix-ui/react-scroll-area": "^1.2.10",
|
|
"@radix-ui/react-slider": "^1.3.6",
|
|
"@radix-ui/react-slot": "^1.2.4",
|
|
"@radix-ui/react-tabs": "^1.1.13",
|
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
"@tiptap/core": "^3.15.3",
|
|
"@tiptap/extension-mention": "^3.15.3",
|
|
"@tiptap/extension-placeholder": "^3.15.3",
|
|
"@tiptap/pm": "^3.15.3",
|
|
"@tiptap/react": "^3.15.3",
|
|
"@tiptap/starter-kit": "^3.15.3",
|
|
"@tiptap/suggestion": "^3.15.3",
|
|
"@types/qrcode": "^1.5.6",
|
|
"applesauce-accounts": "^5.0.0",
|
|
"applesauce-actions": "^5.0.0",
|
|
"applesauce-common": "^5.0.0",
|
|
"applesauce-content": "^5.0.0",
|
|
"applesauce-core": "^5.0.0",
|
|
"applesauce-loaders": "^5.0.0",
|
|
"applesauce-react": "^5.0.1",
|
|
"applesauce-relay": "^5.0.0",
|
|
"applesauce-signers": "^5.0.0",
|
|
"blossom-client-sdk": "^4.1.0",
|
|
"class-variance-authority": "^0.7.1",
|
|
"clsx": "^2.1.1",
|
|
"cmdk": "^1.1.1",
|
|
"date-fns": "^4.1.0",
|
|
"dexie": "^4.2.1",
|
|
"dexie-react-hooks": "^4.2.0",
|
|
"flexsearch": "^0.8.212",
|
|
"framer-motion": "^12.23.26",
|
|
"hash-sum": "^2.0.0",
|
|
"hls-video-element": "^1.5.10",
|
|
"hls.js": "^1.6.15",
|
|
"jotai": "^2.15.2",
|
|
"js-yaml": "^4.1.1",
|
|
"lucide-react": "latest",
|
|
"media-chrome": "^4.17.2",
|
|
"prismjs": "^1.30.0",
|
|
"qrcode": "^1.5.4",
|
|
"react": "^19.2.1",
|
|
"react-dom": "^19.2.1",
|
|
"react-markdown": "^10.1.0",
|
|
"react-medium-image-zoom": "^5.4.0",
|
|
"react-mosaic-component": "^6.1.1",
|
|
"react-router": "^7.1.0",
|
|
"react-virtuoso": "^4.17.0",
|
|
"remark-gfm": "^4.0.1",
|
|
"rxjs": "^7.8.1",
|
|
"shell-quote": "^1.8.3",
|
|
"sonner": "^2.0.7",
|
|
"tailwind-merge": "^2.5.5",
|
|
"tippy.js": "^6.3.7"
|
|
},
|
|
"devDependencies": {
|
|
"@eslint/js": "^9.17.0",
|
|
"@react-router/dev": "^7.1.0",
|
|
"@testing-library/dom": "^10.4.1",
|
|
"@testing-library/react": "^16.3.1",
|
|
"@types/js-yaml": "^4.0.9",
|
|
"@types/node": "^24.10.1",
|
|
"@types/prismjs": "^1.26.5",
|
|
"@types/react": "^19.2.7",
|
|
"@types/react-dom": "^19.2.3",
|
|
"@types/shell-quote": "^1.7.5",
|
|
"@types/uuid": "^10.0.0",
|
|
"@types/ws": "^8.18.1",
|
|
"@vitejs/plugin-react": "^4.3.4",
|
|
"@vitest/ui": "^4.0.15",
|
|
"autoprefixer": "^10.4.20",
|
|
"eslint": "^9.17.0",
|
|
"eslint-config-prettier": "^10.1.8",
|
|
"eslint-plugin-prettier": "^5.5.4",
|
|
"eslint-plugin-react-hooks": "^5.1.0",
|
|
"eslint-plugin-react-refresh": "^0.4.16",
|
|
"fake-indexeddb": "^6.2.5",
|
|
"globals": "^15.14.0",
|
|
"happy-dom": "^20.0.11",
|
|
"jsdom": "^27.4.0",
|
|
"postcss": "^8.4.49",
|
|
"prettier": "^3.7.4",
|
|
"tailwindcss": "^3.4.17",
|
|
"typescript": "~5.6.2",
|
|
"typescript-eslint": "^8.18.2",
|
|
"vite": "^6.0.5",
|
|
"vitest": "^4.0.15"
|
|
}
|
|
}
|