36 lines
1.2 KiB
TypeScript
36 lines
1.2 KiB
TypeScript
import { User } from "@lume/ark";
|
|
import { compactNumber } from "@lume/utils";
|
|
import { NDKEvent, zapInvoiceFromEvent } from "@nostr-dev-kit/ndk";
|
|
import { useTranslation } from "react-i18next";
|
|
import { Link } from "react-router-dom";
|
|
|
|
export function ActivityZap({ event }: { event: NDKEvent }) {
|
|
const { t } = useTranslation();
|
|
const invoice = zapInvoiceFromEvent(event);
|
|
|
|
return (
|
|
<Link
|
|
to={`/activity/${event.id}`}
|
|
className="block px-5 py-4 border-b border-black/5 dark:border-white/5 hover:bg-black/10 dark:hover:bg-white/10"
|
|
>
|
|
<User.Provider pubkey={event.pubkey}>
|
|
<User.Root className="flex items-center justify-between">
|
|
<div className="flex items-center gap-2">
|
|
<User.Avatar className="size-8 rounded-lg shrink-0" />
|
|
<div className="inline-flex items-center gap-1.5">
|
|
<User.Name className="max-w-[8rem] font-semibold text-neutral-950 dark:text-neutral-50" />
|
|
<p className="shrink-0">
|
|
{t("activity.zap")} {compactNumber.format(invoice.amount)} sats
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<User.Time
|
|
time={event.created_at}
|
|
className="text-neutral-500 dark:text-neutral-400"
|
|
/>
|
|
</User.Root>
|
|
</User.Provider>
|
|
</Link>
|
|
);
|
|
}
|