highperfocused/zelo-news
1
0
Fork 0
mirror of https://github.com/mroxso/zelo-news.git synced 2026-06-04 17:41:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: refactor zap splits rendering into separate ZapSplitEntry component for improved readability

Browse Source
This commit is contained in:
highperfocused
2025-10-29 21:45:55 +01:00
parent 8c0078d2a1
commit 897438ca7a
1 changed files with 20 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/ArticleView.tsx
View File

@@ -222,10 +222,7 @@ export function ArticleView({ post }: ArticleViewProps) {
<div className="text-sm text-muted-foreground mb-2">Zap revenue splits</div>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-2">
{zapSplits.map((s, i) => (
<Link key={i} to={`/${nip19.npubEncode(s.pubkey)}`} className="flex items-center justify-between rounded-md border p-3 hover:bg-accent">
<div className="truncate mr-4">{genUserName(s.pubkey)}</div>
<Badge variant="secondary">{s.weight}%</Badge>
</Link>
<ZapSplitEntry key={`${s.pubkey}-${i}`} pubkey={s.pubkey} weight={s.weight} />
))}
</div>
</div>
@@ -320,3 +317,22 @@ export function ArticleView({ post }: ArticleViewProps) {
</div>
);
}
function ZapSplitEntry({ pubkey, weight }: { pubkey: string; weight: number }) {
const author = useAuthor(pubkey);
const metadata = author.data?.metadata;
const displayName = metadata?.display_name || metadata?.name || genUserName(pubkey);
return (
<Link to={`/${nip19.npubEncode(pubkey)}`} className="flex items-center justify-between rounded-md border p-3 hover:bg-accent">
<div className="flex items-center gap-3 min-w-0">
<Avatar className="h-8 w-8">
<AvatarImage src={metadata?.picture} alt={displayName} />
<AvatarFallback>{displayName[0]?.toUpperCase()}</AvatarFallback>
</Avatar>
<div className="truncate">{displayName}</div>
</div>
<Badge variant="secondary">{weight}%</Badge>
</Link>
);
}