rename SendSats -> ZapModal

2024-01-11 23:45:28 +02:00 · 2024-01-11 23:45:28 +02:00 · 69d6dfd5d6
commit 69d6dfd5d6
parent c8dae9fae6
17 changed files with 49 additions and 54 deletions
--- a/packages/app/src/Components/Embed/Invoice.tsx
+++ b/packages/app/src/Components/Embed/Invoice.tsx
@ -7,7 +7,7 @@ import { useMemo } from "react";
 import { FormattedMessage, useIntl } from "react-intl";

 import Icon from "@/Components/Icons/Icon";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import { useWallet } from "@/Wallet";

 import messages from "../messages";
@ -36,7 +36,7 @@ export default function Invoice(props: InvoiceProps) {
          <FormattedMessage {...messages.Invoice} />
        </h4>
        <Icon name="zapCircle" className="zap-circle" />
-        <SendSats
+        <ZapModal
          title={formatMessage(messages.PayInvoice)}
          invoice={invoice}
          show={showInvoice}
--- a/packages/app/src/Components/Event/Note/NoteFooter/FooterZapButton.tsx
+++ b/packages/app/src/Components/Event/Note/NoteFooter/FooterZapButton.tsx
@ -8,7 +8,7 @@ import { useLongPress } from "use-long-press";
 import { AsyncFooterIcon } from "@/Components/Event/Note/NoteFooter/AsyncFooterIcon";
 import { ZapperQueue } from "@/Components/Event/Note/NoteFooter/ZapperQueue";
 import { ZapsSummary } from "@/Components/Event/ZapsSummary";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import { useInteractionCache } from "@/Hooks/useInteractionCache";
 import useLogin from "@/Hooks/useLogin";
@ -38,14 +38,14 @@ export const FooterZapButton = ({ ev, zaps }: ZapIconProps) => {
  const link = NostrLink.fromEvent(ev);
  const zapTotal = zaps.reduce((acc, z) => acc + z.amount, 0);
  const didZap = interactionCache.data.zapped || zaps.some(a => a.sender === publicKey);
-  const [tip, setTip] = useState(false);
+  const [showZapModal, setShowZapModal] = useState(false);
  const { formatMessage } = useIntl();
  const [zapping, setZapping] = useState(false);
  const { publisher, system } = useEventPublisher();
  const author = useUserProfile(ev.pubkey);
  const isMine = ev.pubkey === publicKey;

-  const longPress = useLongPress(() => setTip(true), { captureEvent: true });
+  const longPress = useLongPress(() => setShowZapModal(true), { captureEvent: true });

  const getZapTarget = (): Array<ZapTarget> | undefined => {
    if (ev.tags.some(v => v[0] === "zap")) {
@ -80,13 +80,13 @@ export const FooterZapButton = ({ ev, zaps }: ZapIconProps) => {
      } catch (e) {
        console.warn("Fast zap failed", e);
        if (!(e instanceof Error) || e.message !== "User rejected") {
-          setTip(true);
+          setShowZapModal(true);
        }
      } finally {
        setZapping(false);
      }
    } else {
-      setTip(true);
+      setShowZapModal(true);
    }
  };

@ -144,13 +144,15 @@ export const FooterZapButton = ({ ev, zaps }: ZapIconProps) => {
            />
            <ZapsSummary zaps={zaps} />
          </div>
-          <SendSats
+          {showZapModal && (
+            <ZapModal
              targets={getZapTarget()}
-            onClose={() => setTip(false)}
-            show={tip}
+              onClose={() => setShowZapModal(false)}
              note={ev.id}
+              show={true}
              allocatePool={true}
            />
+          )}
        </>
      )}
    </>
--- a/packages/app/src/Components/Event/Poll.tsx
+++ b/packages/app/src/Components/Event/Poll.tsx
@ -5,7 +5,7 @@ import { useState } from "react";
 import { FormattedMessage, FormattedNumber, useIntl } from "react-intl";

 import Spinner from "@/Components/Icons/Spinner";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import useLogin from "@/Hooks/useLogin";
 import { unwrap } from "@/Utils";
@ -172,7 +172,7 @@ export default function Poll(props: PollProps) {
        {error && <b className="error">{error}</b>}
      </div>

-      <SendSats show={invoice !== ""} onClose={() => setInvoice("")} invoice={invoice} />
+      <ZapModal show={invoice !== ""} onClose={() => setInvoice("")} invoice={invoice} />
    </>
  );
 }
--- a/packages/app/src/Components/Event/ZapButton.tsx
+++ b/packages/app/src/Components/Event/ZapButton.tsx
@ -5,7 +5,7 @@ import { useUserProfile } from "@snort/system-react";
 import { useState } from "react";

 import Icon from "@/Components/Icons/Icon";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import { ZapTarget } from "@/Utils/Zapper";

 const ZapButton = ({
@ -30,7 +30,7 @@ const ZapButton = ({
        <Icon name="zap-solid" />
        {children}
      </button>
-      <SendSats
+      <ZapModal
        targets={[
          {
            type: "lnurl",
--- a/packages/app/src/Components/Event/ZapGoal.tsx
+++ b/packages/app/src/Components/Event/ZapGoal.tsx
@ -6,13 +6,12 @@ import { FormattedNumber } from "react-intl";

 import Icon from "@/Components/Icons/Icon";
 import Progress from "@/Components/Progress/Progress";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import useZapsFeed from "@/Feed/ZapsFeed";
 import { findTag } from "@/Utils";
 import { formatShort } from "@/Utils/Number";
 import { Zapper } from "@/Utils/Zapper";

-import SendSats from "../SendSats/SendSats";
-
 export function ZapGoal({ ev }: { ev: NostrEvent }) {
  const [zap, setZap] = useState(false);
  const zaps = useZapsFeed(NostrLink.fromEvent(ev));
@ -27,7 +26,7 @@ export function ZapGoal({ ev }: { ev: NostrEvent }) {
        <div className="zap-button flex" onClick={() => setZap(true)}>
          <Icon name="zap" size={15} />
        </div>
-        <SendSats targets={Zapper.fromEvent(ev)} show={zap} onClose={() => setZap(false)} />
+        <ZapModal targets={Zapper.fromEvent(ev)} show={zap} onClose={() => setZap(false)} />
      </div>

      <div className="flex justify-between">
--- a/packages/app/src/Components/Nip5Service.tsx
+++ b/packages/app/src/Components/Nip5Service.tsx
@ -7,7 +7,7 @@ import { useNavigate } from "react-router-dom";
 import { UserCache } from "@/Cache";
 import AsyncButton from "@/Components/Button/AsyncButton";
 import Copy from "@/Components/Copy/Copy";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import useLogin from "@/Hooks/useLogin";
 import { unwrap } from "@/Utils";
@ -298,7 +298,7 @@ export default function Nip5Service(props: Nip05ServiceProps) {
          </b>
        </div>
      )}
-      <SendSats
+      <ZapModal
        invoice={registerResponse?.invoice}
        show={showInvoice}
        onClose={() => setShowInvoice(false)}
--- a/packages/app/src/Components/ZapModal/SuccessAction.tsx
+++ b/packages/app/src/Components/ZapModal/SuccessAction.tsx
--- a/packages/app/src/Components/ZapModal/ZapModal.css
+++ b/packages/app/src/Components/ZapModal/ZapModal.css
--- a/packages/app/src/Components/ZapModal/ZapModal.tsx
+++ b/packages/app/src/Components/ZapModal/ZapModal.tsx
@ -1,4 +1,4 @@
-import "./SendSats.css";
+import "./ZapModal.css";

 import { LNURLSuccessAction } from "@snort/shared";
 import { HexKey } from "@snort/system";
@ -6,11 +6,11 @@ import React, { ReactNode, useEffect, useState } from "react";

 import CloseButton from "@/Components/Button/CloseButton";
 import Modal from "@/Components/Modal/Modal";
-import { SendSatsInput, SendSatsInputSelection } from "@/Components/SendSats/SendSatsInput";
-import { SendSatsInvoice } from "@/Components/SendSats/SendSatsInvoice";
-import { SendSatsTitle } from "@/Components/SendSats/SendSatsTitle";
-import { SuccessAction } from "@/Components/SendSats/SuccessAction";
-import { ZapType } from "@/Components/SendSats/ZapType";
+import { SuccessAction } from "@/Components/ZapModal/SuccessAction";
+import { SendSatsInputSelection,ZapModalInput } from "@/Components/ZapModal/ZapModalInput";
+import { ZapModalInvoice } from "@/Components/ZapModal/ZapModalInvoice";
+import { ZapModalTitle } from "@/Components/ZapModal/ZapModalTitle";
+import { ZapType } from "@/Components/ZapModal/ZapType";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import { debounce } from "@/Utils";
 import { Zapper, ZapTarget, ZapTargetResult } from "@/Utils/Zapper";
@ -27,7 +27,7 @@ export interface SendSatsProps {
  allocatePool?: boolean;
 }

-export default function SendSats(props: SendSatsProps) {
+export default function ZapModal(props: SendSatsProps) {
  const onClose = props.onClose || (() => undefined);

  const [zapper, setZapper] = useState<Zapper>();
@ -91,12 +91,12 @@ export default function SendSats(props: SendSatsProps) {
      <div className="p flex flex-col g12">
        <div className="flex g12">
          <div className="flex items-center grow">
-            {props.title || <SendSatsTitle amount={amount} targets={props.targets} zapper={zapper} />}
+            {props.title || <ZapModalTitle amount={amount} targets={props.targets} zapper={zapper} />}
          </div>
          <CloseButton onClick={onClose} />
        </div>
        {zapper && !invoice && (
-          <SendSatsInput
+          <ZapModalInput
            zapper={zapper}
            onChange={v => setAmount(v)}
            onNextStage={async p => {
@ -129,7 +129,7 @@ export default function SendSats(props: SendSatsProps) {
        )}
        {error && <p className="error">{error}</p>}
        {invoice && !success && (
-          <SendSatsInvoice
+          <ZapModalInvoice
            invoice={invoice}
            wallet={wallet}
            notice={props.notice}
--- a/packages/app/src/Components/ZapModal/ZapModalInput.tsx
+++ b/packages/app/src/Components/ZapModal/ZapModalInput.tsx
@ -4,8 +4,8 @@ import { FormattedMessage, useIntl } from "react-intl";
 import AsyncButton from "@/Components/Button/AsyncButton";
 import Icon from "@/Components/Icons/Icon";
 import messages from "@/Components/messages";
-import { SendSatsZapTypeSelector } from "@/Components/SendSats/SendSatsZapTypeSelector";
-import { ZapType } from "@/Components/SendSats/ZapType";
+import { ZapType } from "@/Components/ZapModal/ZapType";
+import { ZapTypeSelector } from "@/Components/ZapModal/ZapTypeSelector";
 import useLogin from "@/Hooks/useLogin";
 import { formatShort } from "@/Utils/Number";
 import { Zapper } from "@/Utils/Zapper";
@ -16,7 +16,7 @@ export interface SendSatsInputSelection {
  type: ZapType;
 }

-export function SendSatsInput(props: {
+export function ZapModalInput(props: {
  zapper: Zapper;
  onChange?: (v: SendSatsInputSelection) => void;
  onNextStage: (v: SendSatsInputSelection) => Promise<void>;
@ -119,7 +119,7 @@ export function SendSatsInput(props: {
          />
        )}
      </div>
-      <SendSatsZapTypeSelector zapType={zapType} setZapType={setZapType} />
+      <ZapTypeSelector zapType={zapType} setZapType={setZapType} />
      {(amount ?? 0) > 0 && (
        <AsyncButton onClick={() => props.onNextStage(getValue())}>
          <Icon name="zap" />
--- a/packages/app/src/Components/ZapModal/ZapModalInvoice.tsx
+++ b/packages/app/src/Components/ZapModal/ZapModalInvoice.tsx
@ -6,7 +6,7 @@ import QrCode from "@/Components/QrCode";
 import { ZapTargetResult } from "@/Utils/Zapper";
 import { LNWallet } from "@/Wallet";

-export function SendSatsInvoice(props: {
+export function ZapModalInvoice(props: {
  invoice: Array<ZapTargetResult>;
  wallet?: LNWallet;
  notice?: ReactNode;
--- a/packages/app/src/Components/ZapModal/ZapModalTitle.tsx
+++ b/packages/app/src/Components/ZapModal/ZapModalTitle.tsx
@ -1,12 +1,12 @@
 import React from "react";
 import { FormattedMessage } from "react-intl";

-import { SendSatsInputSelection } from "@/Components/SendSats/SendSatsInput";
 import ProfileImage from "@/Components/User/ProfileImage";
+import { SendSatsInputSelection } from "@/Components/ZapModal/ZapModalInput";
 import { formatShort } from "@/Utils/Number";
 import { Zapper, ZapTarget } from "@/Utils/Zapper";

-export function SendSatsTitle({
+export function ZapModalTitle({
  targets,
  zapper,
  amount,
--- a/packages/app/src/Components/ZapModal/ZapType.tsx
+++ b/packages/app/src/Components/ZapModal/ZapType.tsx
--- a/packages/app/src/Components/SendSats/SendSatsZapTypeSelector.tsx
+++ b/packages/app/src/Components/SendSats/SendSatsZapTypeSelector.tsx
@ -1,16 +1,10 @@
 import React from "react";
 import { FormattedMessage } from "react-intl";

-import { ZapType } from "@/Components/SendSats/ZapType";
+import { ZapType } from "@/Components/ZapModal/ZapType";
 import useLogin from "@/Hooks/useLogin";

-export function SendSatsZapTypeSelector({
-  zapType,
-  setZapType,
-}: {
-  zapType: ZapType;
-  setZapType: (t: ZapType) => void;
-}) {
+export function ZapTypeSelector({ zapType, setZapType }: { zapType: ZapType; setZapType: (t: ZapType) => void }) {
  const { readonly } = useLogin(s => ({ readonly: s.readonly }));
  const makeTab = (t: ZapType, n: React.ReactNode) => (
    <button type="button" className={zapType === t ? "" : "secondary"} onClick={() => setZapType(t)}>
--- a/packages/app/src/Pages/Profile/ProfilePage.tsx
+++ b/packages/app/src/Pages/Profile/ProfilePage.tsx
@ -22,7 +22,6 @@ import Icon from "@/Components/Icons/Icon";
 import Modal from "@/Components/Modal/Modal";
 import { ProxyImg } from "@/Components/ProxyImg";
 import QrCode from "@/Components/QrCode";
-import SendSats from "@/Components/SendSats/SendSats";
 import { SpotlightMediaModal } from "@/Components/Spotlight/SpotlightMedia";
 import { Tab, TabElement } from "@/Components/Tabs/Tabs";
 import Text from "@/Components/Text/Text";
@ -38,6 +37,7 @@ import MutedList from "@/Components/User/MutedList";
 import Nip05 from "@/Components/User/Nip05";
 import ProfileImage from "@/Components/User/ProfileImage";
 import { UserWebsiteLink } from "@/Components/User/UserWebsiteLink";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import useProfileBadges from "@/Feed/BadgesFeed";
 import useFollowsFeed from "@/Feed/FollowsFeed";
 import { useStatusFeed } from "@/Feed/StatusFeed";
@ -181,7 +181,7 @@ export default function ProfilePage({ id: propId, state }: ProfilePageProps) {
          </div>
        )}

-        <SendSats
+        <ZapModal
          targets={
            lnurl?.lnurl && id
              ? [
--- a/packages/app/src/Pages/subscribe/RenewSub.tsx
+++ b/packages/app/src/Pages/subscribe/RenewSub.tsx
@ -3,7 +3,7 @@ import { useState } from "react";
 import { FormattedMessage, useIntl } from "react-intl";

 import AsyncButton from "@/Components/Button/AsyncButton";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import SnortApi, { Subscription, SubscriptionError } from "@/External/SnortApi";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import useLogin from "@/Hooks/useLogin";
@ -72,7 +72,7 @@ export function RenewSub({ sub: s }: { sub?: Subscription }) {
          </AsyncButton>
        </div>
      </div>
-      <SendSats
+      <ZapModal
        invoice={invoice}
        show={invoice !== ""}
        onClose={() => setInvoice("")}
--- a/packages/app/src/Pages/subscribe/index.tsx
+++ b/packages/app/src/Pages/subscribe/index.tsx
@ -6,7 +6,7 @@ import { FormattedMessage } from "react-intl";
 import { RouteObject } from "react-router-dom";

 import AsyncButton from "@/Components/Button/AsyncButton";
-import SendSats from "@/Components/SendSats/SendSats";
+import ZapModal from "@/Components/ZapModal/ZapModal";
 import SnortApi, { SubscriptionError } from "@/External/SnortApi";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import ManageSubscriptionPage from "@/Pages/subscribe/ManageSubscription";
@ -86,7 +86,7 @@ export function SubscribePage() {
        })}
      </div>
      {error && <b className="error">{mapSubscriptionErrorCode(error)}</b>}
-      <SendSats invoice={invoice} show={invoice !== ""} onClose={() => setInvoice("")} />
+      <ZapModal invoice={invoice} show={invoice !== ""} onClose={() => setInvoice("")} />
    </>
  );
 }