2023-02-03 21:38:14 +00:00
|
|
|
import "./Zap.css";
|
2023-02-04 10:28:13 +00:00
|
|
|
import { useMemo } from "react";
|
2023-02-18 22:42:47 +00:00
|
|
|
import { FormattedMessage, useIntl } from "react-intl";
|
2023-02-03 23:45:04 +00:00
|
|
|
import { useSelector } from "react-redux";
|
2023-03-02 15:23:53 +00:00
|
|
|
import { Event, HexKey, TaggedRawEvent } from "@snort/nostr";
|
|
|
|
|
|
|
|
import { decodeInvoice, sha256, unwrap } from "Util";
|
2023-02-03 21:38:14 +00:00
|
|
|
import { formatShort } from "Number";
|
|
|
|
import Text from "Element/Text";
|
|
|
|
import ProfileImage from "Element/ProfileImage";
|
2023-02-03 23:45:04 +00:00
|
|
|
import { RootState } from "State/Store";
|
2023-03-05 15:36:12 +00:00
|
|
|
import { ZapperSpam } from "Const";
|
2023-02-03 21:38:14 +00:00
|
|
|
|
2023-02-08 21:10:26 +00:00
|
|
|
import messages from "./messages";
|
|
|
|
|
2023-02-03 21:38:14 +00:00
|
|
|
function findTag(e: TaggedRawEvent, tag: string) {
|
2023-02-09 12:26:54 +00:00
|
|
|
const maybeTag = e.tags.find(evTag => {
|
2023-02-07 20:04:50 +00:00
|
|
|
return evTag[0] === tag;
|
|
|
|
});
|
|
|
|
return maybeTag && maybeTag[1];
|
2023-02-03 21:38:14 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function getInvoice(zap: TaggedRawEvent) {
|
2023-02-07 20:04:50 +00:00
|
|
|
const bolt11 = findTag(zap, "bolt11");
|
2023-02-16 21:53:44 +00:00
|
|
|
if (!bolt11) {
|
|
|
|
console.debug("Invalid zap: ", zap);
|
|
|
|
return {};
|
|
|
|
}
|
2023-03-02 15:23:53 +00:00
|
|
|
const decoded = decodeInvoice(bolt11);
|
|
|
|
if (decoded) {
|
|
|
|
return { amount: decoded?.amount, hash: decoded?.descriptionHash };
|
2023-02-19 14:46:07 +00:00
|
|
|
}
|
|
|
|
return {};
|
2023-02-03 21:38:14 +00:00
|
|
|
}
|
|
|
|
|
2023-02-04 13:30:05 +00:00
|
|
|
interface Zapper {
|
2023-02-07 20:04:50 +00:00
|
|
|
pubkey?: HexKey;
|
|
|
|
isValid: boolean;
|
2023-02-18 21:27:06 +00:00
|
|
|
isAnon: boolean;
|
2023-02-19 16:39:20 +00:00
|
|
|
content: string;
|
2023-02-04 13:30:05 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function getZapper(zap: TaggedRawEvent, dhash: string): Zapper {
|
2023-02-14 14:53:00 +00:00
|
|
|
let zapRequest = findTag(zap, "description");
|
2023-02-03 21:38:14 +00:00
|
|
|
if (zapRequest) {
|
2023-02-14 14:53:00 +00:00
|
|
|
try {
|
|
|
|
if (zapRequest.startsWith("%")) {
|
|
|
|
zapRequest = decodeURIComponent(zapRequest);
|
|
|
|
}
|
|
|
|
const rawEvent: TaggedRawEvent = JSON.parse(zapRequest);
|
|
|
|
if (Array.isArray(rawEvent)) {
|
|
|
|
// old format, ignored
|
2023-02-19 16:39:20 +00:00
|
|
|
return { isValid: false, isAnon: false, content: "" };
|
2023-02-14 14:53:00 +00:00
|
|
|
}
|
2023-02-18 21:27:06 +00:00
|
|
|
const anonZap = rawEvent.tags.some(a => a[0] === "anon");
|
2023-02-14 14:53:00 +00:00
|
|
|
const metaHash = sha256(zapRequest);
|
|
|
|
const ev = new Event(rawEvent);
|
2023-03-05 15:36:12 +00:00
|
|
|
const zapperIgnored = ZapperSpam.includes(zap.pubkey);
|
|
|
|
return {
|
|
|
|
pubkey: ev.PubKey,
|
|
|
|
isValid: dhash === metaHash && !zapperIgnored,
|
|
|
|
isAnon: anonZap,
|
|
|
|
content: rawEvent.content,
|
|
|
|
};
|
2023-02-14 14:53:00 +00:00
|
|
|
} catch (e) {
|
|
|
|
console.warn("Invalid zap", zapRequest);
|
2023-02-03 21:38:14 +00:00
|
|
|
}
|
|
|
|
}
|
2023-02-19 16:39:20 +00:00
|
|
|
return { isValid: false, isAnon: false, content: "" };
|
2023-02-03 21:38:14 +00:00
|
|
|
}
|
|
|
|
|
2023-02-08 21:10:26 +00:00
|
|
|
export interface ParsedZap {
|
2023-02-07 20:04:50 +00:00
|
|
|
id: HexKey;
|
|
|
|
e?: HexKey;
|
|
|
|
p: HexKey;
|
|
|
|
amount: number;
|
|
|
|
content: string;
|
|
|
|
zapper?: HexKey;
|
|
|
|
valid: boolean;
|
2023-02-16 21:53:44 +00:00
|
|
|
zapService: HexKey;
|
2023-02-18 21:27:06 +00:00
|
|
|
anonZap: boolean;
|
2023-02-03 21:38:14 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export function parseZap(zap: TaggedRawEvent): ParsedZap {
|
2023-02-07 20:04:50 +00:00
|
|
|
const { amount, hash } = getInvoice(zap);
|
2023-02-19 16:39:20 +00:00
|
|
|
const zapper = hash ? getZapper(zap, hash) : ({ isValid: false, content: "" } as Zapper);
|
2023-02-07 20:04:50 +00:00
|
|
|
const e = findTag(zap, "e");
|
2023-02-07 19:47:57 +00:00
|
|
|
const p = unwrap(findTag(zap, "p"));
|
2023-02-03 21:38:14 +00:00
|
|
|
return {
|
|
|
|
id: zap.id,
|
|
|
|
e,
|
|
|
|
p,
|
|
|
|
amount: Number(amount) / 1000,
|
2023-02-04 13:30:05 +00:00
|
|
|
zapper: zapper.pubkey,
|
2023-02-19 16:39:20 +00:00
|
|
|
content: zapper.content,
|
2023-02-04 13:30:05 +00:00
|
|
|
valid: zapper.isValid,
|
2023-02-16 21:53:44 +00:00
|
|
|
zapService: zap.pubkey,
|
2023-02-18 21:27:06 +00:00
|
|
|
anonZap: zapper.isAnon,
|
2023-02-07 20:04:50 +00:00
|
|
|
};
|
2023-02-03 21:38:14 +00:00
|
|
|
}
|
|
|
|
|
2023-02-09 12:26:54 +00:00
|
|
|
const Zap = ({ zap, showZapped = true }: { zap: ParsedZap; showZapped?: boolean }) => {
|
2023-02-07 20:04:50 +00:00
|
|
|
const { amount, content, zapper, valid, p } = zap;
|
|
|
|
const pubKey = useSelector((s: RootState) => s.login.publicKey);
|
2023-02-03 21:38:14 +00:00
|
|
|
|
2023-02-08 21:10:26 +00:00
|
|
|
return valid && zapper ? (
|
2023-02-03 23:35:57 +00:00
|
|
|
<div className="zap note card">
|
|
|
|
<div className="header">
|
2023-02-12 22:12:26 +00:00
|
|
|
<ProfileImage autoWidth={false} pubkey={zapper} />
|
|
|
|
{p !== pubKey && showZapped && <ProfileImage autoWidth={false} pubkey={p} />}
|
2023-02-03 21:38:14 +00:00
|
|
|
<div className="amount">
|
2023-02-08 21:10:26 +00:00
|
|
|
<span className="amount-number">
|
2023-02-09 12:26:54 +00:00
|
|
|
<FormattedMessage {...messages.Sats} values={{ n: formatShort(amount) }} />
|
2023-02-08 21:10:26 +00:00
|
|
|
</span>
|
2023-02-03 21:38:14 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
2023-02-08 21:10:26 +00:00
|
|
|
{content.length > 0 && zapper && (
|
|
|
|
<div className="body">
|
2023-03-03 14:30:31 +00:00
|
|
|
<Text creator={zapper} content={content} tags={[]} />
|
2023-02-08 21:10:26 +00:00
|
|
|
</div>
|
|
|
|
)}
|
2023-02-03 21:38:14 +00:00
|
|
|
</div>
|
2023-02-07 20:04:50 +00:00
|
|
|
) : null;
|
|
|
|
};
|
2023-02-03 21:38:14 +00:00
|
|
|
|
2023-02-07 20:04:50 +00:00
|
|
|
interface ZapsSummaryProps {
|
|
|
|
zaps: ParsedZap[];
|
|
|
|
}
|
2023-02-03 21:38:14 +00:00
|
|
|
|
|
|
|
export const ZapsSummary = ({ zaps }: ZapsSummaryProps) => {
|
2023-02-18 22:42:47 +00:00
|
|
|
const { formatMessage } = useIntl();
|
2023-02-04 10:28:13 +00:00
|
|
|
const sortedZaps = useMemo(() => {
|
2023-02-09 12:26:54 +00:00
|
|
|
const pub = [...zaps.filter(z => z.zapper && z.valid)];
|
|
|
|
const priv = [...zaps.filter(z => !z.zapper && z.valid)];
|
2023-02-07 20:04:50 +00:00
|
|
|
pub.sort((a, b) => b.amount - a.amount);
|
|
|
|
return pub.concat(priv);
|
|
|
|
}, [zaps]);
|
2023-02-04 10:28:13 +00:00
|
|
|
|
|
|
|
if (zaps.length === 0) {
|
2023-02-07 20:04:50 +00:00
|
|
|
return null;
|
2023-02-04 10:28:13 +00:00
|
|
|
}
|
|
|
|
|
2023-02-07 20:04:50 +00:00
|
|
|
const [topZap, ...restZaps] = sortedZaps;
|
2023-02-18 22:42:47 +00:00
|
|
|
const { zapper, amount, anonZap } = topZap;
|
2023-02-03 21:38:14 +00:00
|
|
|
|
|
|
|
return (
|
|
|
|
<div className="zaps-summary">
|
2023-02-04 10:28:13 +00:00
|
|
|
{amount && (
|
2023-02-03 21:38:14 +00:00
|
|
|
<div className={`top-zap`}>
|
|
|
|
<div className="summary">
|
2023-02-18 22:42:47 +00:00
|
|
|
{zapper && (
|
|
|
|
<ProfileImage
|
|
|
|
autoWidth={false}
|
|
|
|
pubkey={anonZap ? "" : zapper}
|
|
|
|
overrideUsername={anonZap ? formatMessage({ defaultMessage: "Anonymous" }) : undefined}
|
|
|
|
/>
|
|
|
|
)}
|
2023-02-09 12:26:54 +00:00
|
|
|
{restZaps.length > 0 && <FormattedMessage {...messages.Others} values={{ n: restZaps.length }} />}{" "}
|
|
|
|
<FormattedMessage {...messages.OthersZapped} values={{ n: restZaps.length }} />
|
2023-02-03 21:38:14 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
</div>
|
2023-02-07 20:04:50 +00:00
|
|
|
);
|
|
|
|
};
|
2023-02-03 21:38:14 +00:00
|
|
|
|
2023-02-07 20:04:50 +00:00
|
|
|
export default Zap;
|