82 lines
2.5 KiB
TypeScript
82 lines
2.5 KiB
TypeScript
import { Menu, MenuItem } from "@szhsin/react-menu";
|
|
import * as Dialog from "@radix-ui/react-dialog";
|
|
import { unwrap } from "@snort/shared";
|
|
import { NostrEvent, NostrPrefix, encodeTLV } from "@snort/system";
|
|
|
|
import { Icon } from "./icon";
|
|
import { useState } from "react";
|
|
import { Textarea } from "./textarea";
|
|
import { findTag } from "utils";
|
|
import AsyncButton from "./async-button";
|
|
import { useLogin } from "hooks/login";
|
|
import { System } from "index";
|
|
import { FormattedMessage } from "react-intl";
|
|
|
|
type ShareOn = "nostr" | "twitter";
|
|
|
|
export function ShareMenu({ ev }: { ev: NostrEvent }) {
|
|
const [share, setShare] = useState<ShareOn>();
|
|
const [message, setMessage] = useState("");
|
|
const login = useLogin();
|
|
|
|
const naddr = encodeTLV(NostrPrefix.Address, unwrap(findTag(ev, "d")), undefined, ev.kind, ev.pubkey);
|
|
const link = `https://zap.stream/${naddr}`;
|
|
|
|
async function sendMessage() {
|
|
const pub = login?.publisher();
|
|
if (pub) {
|
|
const ev = await pub.note(message);
|
|
console.debug(ev);
|
|
System.BroadcastEvent(ev);
|
|
setShare(undefined);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Menu
|
|
align="end"
|
|
gap={5}
|
|
menuClassName="ctx-menu"
|
|
menuButton={
|
|
<button type="button" className="btn btn-secondary">
|
|
<FormattedMessage defaultMessage="Share" />
|
|
</button>
|
|
}>
|
|
<MenuItem
|
|
onClick={() => {
|
|
setMessage(`Come check out my stream on zap.stream!\n\n${link}\n\nnostr:${naddr}`);
|
|
setShare("nostr");
|
|
}}>
|
|
<Icon name="nostrich" size={24} />
|
|
<FormattedMessage defaultMessage="Broadcast on Nostr" />
|
|
</MenuItem>
|
|
</Menu>
|
|
<Dialog.Root open={Boolean(share)} onOpenChange={() => setShare(undefined)}>
|
|
<Dialog.Portal>
|
|
<Dialog.Overlay className="dialog-overlay" />
|
|
<Dialog.Content className="dialog-content">
|
|
<h2>
|
|
<FormattedMessage defaultMessage="Share" />
|
|
</h2>
|
|
<div className="paper">
|
|
<Textarea
|
|
emojis={[]}
|
|
value={message}
|
|
onChange={e => setMessage(e.target.value)}
|
|
onKeyDown={() => {
|
|
//noop
|
|
}}
|
|
rows={15}
|
|
/>
|
|
</div>
|
|
<AsyncButton className="btn btn-primary" onClick={sendMessage}>
|
|
<FormattedMessage defaultMessage="Send" />
|
|
</AsyncButton>
|
|
</Dialog.Content>
|
|
</Dialog.Portal>
|
|
</Dialog.Root>
|
|
</>
|
|
);
|
|
}
|