Files
lume/src/app/note/components/metadata/zap.tsx
2023-05-16 11:10:08 +07:00

25 lines
632 B
TypeScript

import ZapIcon from "@shared/icons/zap";
import { compactNumber } from "@utils/number";
import { useEffect, useState } from "react";
export default function NoteZap({ zaps }: { zaps: number }) {
const [count, setCount] = useState(0);
useEffect(() => {
setCount(zaps);
}, [zaps]);
return (
<button type="button" className="group inline-flex items-center gap-1.5">
<ZapIcon
width={16}
height={16}
className="text-zinc-400 group-hover:text-orange-400"
/>
<span className="text-sm leading-none text-zinc-400 group-hover:text-zinc-200">
{compactNumber.format(count)} sats
</span>
</button>
);
}