diff --git a/apps/web/src/app/propose/success/WalletCheckout.tsx b/apps/web/src/app/propose/success/WalletCheckout.tsx new file mode 100644 index 0000000..ed7638d --- /dev/null +++ b/apps/web/src/app/propose/success/WalletCheckout.tsx @@ -0,0 +1,138 @@ +"use client"; + +import { Copy, ExternalLink, Wallet } from "lucide-react"; +import { useState } from "react"; + +type WalletCheckoutProps = { + amountUsdc: string; + network: string; + walletAddress: string; + walletLabel: string; + chainId: string; + tokenAddress: string; + atomicAmount: string; + paymentUri: string; + proposalId: string; + capturedReference?: string; +}; + +type CopyRowProps = { + label: string; + value: string; + copyValue?: string; + copiedKey: string; + copied: string; + onCopy: (key: string, value: string) => void; +}; + +function CopyRow({ label, value, copyValue, copiedKey, copied, onCopy }: CopyRowProps) { + const valueToCopy = copyValue || value; + + return ( +
+
{label}
+
{value}
+ +
+ ); +} + +export function WalletCheckout({ + amountUsdc, + network, + walletAddress, + walletLabel, + chainId, + tokenAddress, + atomicAmount, + paymentUri, + proposalId, + capturedReference, +}: WalletCheckoutProps) { + const [copied, setCopied] = useState(""); + const paymentMemo = `VibeWork Proposal ${proposalId}`; + const walletReady = Boolean(walletAddress); + + const copyValue = async (key: string, value: string) => { + try { + await navigator.clipboard.writeText(value); + setCopied(key); + window.setTimeout(() => setCopied((current) => (current === key ? "" : current)), 1600); + } catch { + setCopied("copy-failed"); + } + }; + + return ( +
+
+
+ +
+

USDC wallet checkout

+

+ 請使用 Base USDC 轉帳,完成後貼上 tx hash 進入人工確認。 +

+
+
+ {paymentUri && !capturedReference ? ( + + + 開啟錢包付款 + + ) : null} +
+ + {capturedReference ? ( +
+ 已確認 receipt:{capturedReference} +
+ ) : null} + +
+ + + + {walletReady ? ( + <> + + + + + {paymentUri ? ( + + ) : null} + + ) : null} +
+ + {copied === "copy-failed" ? ( +

瀏覽器阻擋自動複製,請手動選取付款資訊。

+ ) : null} +
+ ); +} diff --git a/apps/web/src/app/propose/success/page.tsx b/apps/web/src/app/propose/success/page.tsx index 853ffde..26d0beb 100644 --- a/apps/web/src/app/propose/success/page.tsx +++ b/apps/web/src/app/propose/success/page.tsx @@ -10,8 +10,9 @@ import { TREASURY_WALLET_LABEL, usdcAtomicUnitsFromCents, } from "@/lib/a2a-growth"; -import { CheckCircle2, Copy, ExternalLink, Wallet } from "lucide-react"; +import { CheckCircle2 } from "lucide-react"; import Link from "next/link"; +import { WalletCheckout } from "./WalletCheckout"; export const dynamic = "force-dynamic"; @@ -138,65 +139,21 @@ export default async function ProposalSuccessPage({ searchParams }: { searchPara {payment === "wallet" ? ( -
-
- - USDC wallet payment -
-
-
-
Amount
-
{formatUsdcAmount(proposalPackage.feeCents)} USDC
-
-
-
Network
-
{TREASURY_USDC_NETWORK}
-
-
-
Wallet
-
- {TREASURY_USDC_ADDRESS || `${TREASURY_WALLET_LABEL} is not configured yet`} -
-
- {TREASURY_USDC_ADDRESS ? ( -
-
Chain / token
-
- Chain ID {TREASURY_USDC_CHAIN_ID} · {TREASURY_USDC_TOKEN_ADDRESS} -
-
- ) : null} - {TREASURY_USDC_ADDRESS ? ( -
-
USDC atomic amount
-
{usdcAtomicUnitsFromCents(proposalPackage.feeCents)}
-
- ) : null} - {walletCaptured ? ( -
-
Receipt
-
{task?.stripe_payment_intent_id?.replace(/^wallet:/, "")}
-
- ) : null} -
- {TREASURY_USDC_ADDRESS ? ( -
- - 轉帳備註請包含 Proposal ID;入帳確認前 referral ledger 不會進入可出金狀態。 -
- ) : null} - {walletPaymentUri && !walletCaptured ? ( - - - 開啟錢包付款 - - ) : null} - +
+ {!walletCaptured ? ( -
+

提交付款 receipt

送出 tx hash 後會進入人工確認;確認前不會計入 paid conversion,也不會建立可出金 referral ledger。 @@ -252,7 +209,7 @@ export default async function ProposalSuccessPage({ searchParams }: { searchPara