thirdweb 5.88.7 → 5.88.8-nightly-1fa36c1d56758788a8f9053f8929497bacb2b115-20250225000329
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/contract/deployment/utils/create-2-factory.js +4 -0
- package/dist/cjs/contract/deployment/utils/create-2-factory.js.map +1 -1
- package/dist/cjs/pay/buyWithFiat/getQuote.js +1 -0
- package/dist/cjs/pay/buyWithFiat/getQuote.js.map +1 -1
- package/dist/cjs/pay/buyWithFiat/isSwapRequiredPostOnramp.js +44 -0
- package/dist/cjs/pay/buyWithFiat/isSwapRequiredPostOnramp.js.map +1 -1
- package/dist/cjs/pay/convert/type.js +30 -1
- package/dist/cjs/pay/convert/type.js.map +1 -1
- package/dist/cjs/react/core/hooks/pay/useBuyWithFiatStatus.js +1 -0
- package/dist/cjs/react/core/hooks/pay/useBuyWithFiatStatus.js.map +1 -1
- package/dist/cjs/react/core/hooks/wallets/useSendToken.js +18 -2
- package/dist/cjs/react/core/hooks/wallets/useSendToken.js.map +1 -1
- package/dist/cjs/react/core/providers/invalidateWalletBalance.js +6 -1
- package/dist/cjs/react/core/providers/invalidateWalletBalance.js.map +1 -1
- package/dist/cjs/react/core/utils/account.js +2 -7
- package/dist/cjs/react/core/utils/account.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/NetworkSelector.js +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/NetworkSelector.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/icons/currencies/JPYIcon.js +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/icons/currencies/JPYIcon.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.js +5 -3
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.js +2 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/CurrencySelection.js +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/CurrencySelection.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.js +0 -13
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.js +6 -26
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatTxDetailsTable.js +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatTxDetailsTable.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/OnRampScreen.js +541 -0
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/OnRampScreen.js.map +1 -0
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.js +23 -0
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/main/useUISelectionStates.js +8 -0
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/main/useUISelectionStates.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.js +21 -0
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.js.map +1 -0
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/swap/SwapSummary.js +4 -9
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/swap/SwapSummary.js.map +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.js +2 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.js.map +1 -1
- package/dist/cjs/rpc/rpc.js +1 -1
- package/dist/cjs/storage/upload/mobile.js +1 -1
- package/dist/cjs/storage/upload/mobile.js.map +1 -1
- package/dist/cjs/storage/upload/web-node.js +1 -0
- package/dist/cjs/storage/upload/web-node.js.map +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/version.js.map +1 -1
- package/dist/cjs/wallets/in-app/web/ecosystem.js +1 -1
- package/dist/cjs/wallets/in-app/web/lib/iframe-wallet.js +1 -1
- package/dist/cjs/wallets/in-app/web/lib/iframe-wallet.js.map +1 -1
- package/dist/esm/contract/deployment/utils/create-2-factory.js +4 -0
- package/dist/esm/contract/deployment/utils/create-2-factory.js.map +1 -1
- package/dist/esm/pay/buyWithFiat/getQuote.js +1 -0
- package/dist/esm/pay/buyWithFiat/getQuote.js.map +1 -1
- package/dist/esm/pay/buyWithFiat/isSwapRequiredPostOnramp.js +43 -0
- package/dist/esm/pay/buyWithFiat/isSwapRequiredPostOnramp.js.map +1 -1
- package/dist/esm/pay/convert/type.js +29 -2
- package/dist/esm/pay/convert/type.js.map +1 -1
- package/dist/esm/react/core/hooks/pay/useBuyWithFiatStatus.js +1 -0
- package/dist/esm/react/core/hooks/pay/useBuyWithFiatStatus.js.map +1 -1
- package/dist/esm/react/core/hooks/wallets/useSendToken.js +19 -3
- package/dist/esm/react/core/hooks/wallets/useSendToken.js.map +1 -1
- package/dist/esm/react/core/providers/invalidateWalletBalance.js +6 -1
- package/dist/esm/react/core/providers/invalidateWalletBalance.js.map +1 -1
- package/dist/esm/react/core/utils/account.js +1 -6
- package/dist/esm/react/core/utils/account.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/NetworkSelector.js +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/NetworkSelector.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/icons/currencies/JPYIcon.js +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/icons/currencies/JPYIcon.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.js +5 -3
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.js +2 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/CurrencySelection.js +3 -3
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/CurrencySelection.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.js +0 -13
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.js +7 -27
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatTxDetailsTable.js +2 -2
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatTxDetailsTable.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/OnRampScreen.js +538 -0
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/OnRampScreen.js.map +1 -0
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.js +22 -0
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/main/useUISelectionStates.js +8 -0
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/main/useUISelectionStates.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.js +18 -0
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.js.map +1 -0
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/swap/SwapSummary.js +5 -10
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/swap/SwapSummary.js.map +1 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.js +2 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.js.map +1 -1
- package/dist/esm/rpc/rpc.js +1 -1
- package/dist/esm/storage/upload/mobile.js +1 -1
- package/dist/esm/storage/upload/mobile.js.map +1 -1
- package/dist/esm/storage/upload/web-node.js +1 -0
- package/dist/esm/storage/upload/web-node.js.map +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/esm/version.js.map +1 -1
- package/dist/esm/wallets/in-app/web/ecosystem.js +1 -1
- package/dist/esm/wallets/in-app/web/lib/iframe-wallet.js +1 -1
- package/dist/esm/wallets/in-app/web/lib/iframe-wallet.js.map +1 -1
- package/dist/types/pay/buyWithFiat/getQuote.d.ts +8 -32
- package/dist/types/pay/buyWithFiat/getQuote.d.ts.map +1 -1
- package/dist/types/pay/buyWithFiat/isSwapRequiredPostOnramp.d.ts +7 -0
- package/dist/types/pay/buyWithFiat/isSwapRequiredPostOnramp.d.ts.map +1 -1
- package/dist/types/pay/convert/type.d.ts +2 -1
- package/dist/types/pay/convert/type.d.ts.map +1 -1
- package/dist/types/react/core/hooks/connection/ConnectButtonProps.d.ts +2 -1
- package/dist/types/react/core/hooks/connection/ConnectButtonProps.d.ts.map +1 -1
- package/dist/types/react/core/hooks/pay/useBuyWithFiatStatus.d.ts +2 -1
- package/dist/types/react/core/hooks/pay/useBuyWithFiatStatus.d.ts.map +1 -1
- package/dist/types/react/core/hooks/wallets/useSendToken.d.ts +6 -1
- package/dist/types/react/core/hooks/wallets/useSendToken.d.ts.map +1 -1
- package/dist/types/react/core/providers/invalidateWalletBalance.d.ts +1 -1
- package/dist/types/react/core/providers/invalidateWalletBalance.d.ts.map +1 -1
- package/dist/types/react/core/utils/account.d.ts +1 -1
- package/dist/types/react/core/utils/account.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.d.ts +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/CurrencySelection.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.d.ts +7 -2
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/{FiatFlow.d.ts → OnRampScreen.d.ts} +4 -4
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/OnRampScreen.d.ts.map +1 -0
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.d.ts +6 -2
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/main/types.d.ts +0 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/main/types.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.d.ts +4 -0
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.d.ts.map +1 -0
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/swap/SwapSummary.d.ts.map +1 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.d.ts +1 -0
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.d.ts.map +1 -1
- package/dist/types/react/web/ui/MediaRenderer/MediaRenderer.d.ts +2 -2
- package/dist/types/react/web/ui/MediaRenderer/ModelViewer.d.ts +1 -1
- package/dist/types/storage/upload/web-node.d.ts.map +1 -1
- package/dist/types/version.d.ts +1 -1
- package/dist/types/version.d.ts.map +1 -1
- package/dist/types/wallets/in-app/web/ecosystem.d.ts +1 -1
- package/package.json +1 -1
- package/src/contract/deployment/utils/create-2-factory.ts +4 -0
- package/src/pay/buyWithFiat/getQuote.ts +9 -33
- package/src/pay/buyWithFiat/isSwapRequiredPostOnramp.ts +56 -0
- package/src/pay/convert/type.ts +30 -1
- package/src/react/core/hooks/connection/ConnectButtonProps.ts +2 -1
- package/src/react/core/hooks/pay/useBuyWithFiatStatus.ts +3 -1
- package/src/react/core/hooks/wallets/useSendToken.ts +19 -3
- package/src/react/core/providers/invalidateWalletBalance.ts +6 -1
- package/src/react/core/utils/account.ts +4 -8
- package/src/react/web/ui/ConnectWallet/NetworkSelector.tsx +1 -1
- package/src/react/web/ui/ConnectWallet/icons/currencies/JPYIcon.tsx +1 -1
- package/src/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.tsx +7 -3
- package/src/react/web/ui/ConnectWallet/screens/Buy/PayWIthCreditCard.tsx +2 -2
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/CurrencySelection.tsx +3 -6
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.tsx +0 -19
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatSteps.tsx +9 -32
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatTxDetailsTable.tsx +2 -2
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/OnRampScreen.tsx +790 -0
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/currencies.tsx +38 -2
- package/src/react/web/ui/ConnectWallet/screens/Buy/main/types.ts +0 -1
- package/src/react/web/ui/ConnectWallet/screens/Buy/main/useUISelectionStates.ts +10 -0
- package/src/react/web/ui/ConnectWallet/screens/Buy/swap/StepConnector.tsx +55 -0
- package/src/react/web/ui/ConnectWallet/screens/Buy/swap/SwapSummary.tsx +18 -41
- package/src/react/web/ui/ConnectWallet/screens/Buy/swap/WalletRow.tsx +10 -1
- package/src/rpc/rpc.ts +1 -1
- package/src/storage/upload/mobile.ts +1 -1
- package/src/storage/upload/web-node.ts +1 -0
- package/src/version.ts +1 -1
- package/src/wallets/in-app/web/ecosystem.ts +1 -1
- package/src/wallets/in-app/web/lib/iframe-wallet.ts +1 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.js +0 -63
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.js.map +0 -1
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.js +0 -116
- package/dist/cjs/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.js.map +0 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.js +0 -60
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.js.map +0 -1
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.js +0 -113
- package/dist/esm/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.js.map +0 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.d.ts.map +0 -1
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.d.ts +0 -24
- package/dist/types/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.d.ts.map +0 -1
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.tsx +0 -152
- package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.tsx +0 -258
@@ -1,113 +0,0 @@
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
2
|
-
import { CheckCircledIcon } from "@radix-ui/react-icons";
|
3
|
-
import { useQueryClient } from "@tanstack/react-query";
|
4
|
-
import { useEffect, useRef } from "react";
|
5
|
-
import { isMobile } from "../../../../../../../utils/web/isMobile.js";
|
6
|
-
import { iconSize } from "../../../../../../core/design-system/index.js";
|
7
|
-
import { useBuyWithFiatStatus } from "../../../../../../core/hooks/pay/useBuyWithFiatStatus.js";
|
8
|
-
import { invalidateWalletBalance } from "../../../../../../core/providers/invalidateWalletBalance.js";
|
9
|
-
import { Spacer } from "../../../../components/Spacer.js";
|
10
|
-
import { Spinner } from "../../../../components/Spinner.js";
|
11
|
-
import { StepBar } from "../../../../components/StepBar.js";
|
12
|
-
import { Container, ModalHeader } from "../../../../components/basic.js";
|
13
|
-
import { Button } from "../../../../components/buttons.js";
|
14
|
-
import { Text } from "../../../../components/text.js";
|
15
|
-
import { AccentFailIcon } from "../../../icons/AccentFailIcon.js";
|
16
|
-
import { getBuyWithFiatStatusMeta } from "../pay-transactions/statusMeta.js";
|
17
|
-
import { OnRampTxDetailsTable } from "./FiatTxDetailsTable.js";
|
18
|
-
/**
|
19
|
-
* Poll for "Buy with Fiat" status - when the on-ramp is in progress
|
20
|
-
* - Show success screen if swap is not required and on-ramp is completed
|
21
|
-
* - Show Failed screen if on-ramp failed
|
22
|
-
* - call `onShowSwapFlow` if on-ramp is completed and swap is required
|
23
|
-
*/
|
24
|
-
export function OnrampStatusScreen(props) {
|
25
|
-
const queryClient = useQueryClient();
|
26
|
-
const { openedWindow, onSuccess } = props;
|
27
|
-
const statusQuery = useBuyWithFiatStatus({
|
28
|
-
intentId: props.intentId,
|
29
|
-
client: props.client,
|
30
|
-
});
|
31
|
-
// determine UI status
|
32
|
-
let uiStatus = "loading";
|
33
|
-
if (statusQuery.data?.status === "ON_RAMP_TRANSFER_FAILED" ||
|
34
|
-
statusQuery.data?.status === "PAYMENT_FAILED") {
|
35
|
-
uiStatus = "failed";
|
36
|
-
}
|
37
|
-
else if (statusQuery.data?.status === "CRYPTO_SWAP_FALLBACK") {
|
38
|
-
uiStatus = "partialSuccess";
|
39
|
-
}
|
40
|
-
else if (statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED") {
|
41
|
-
uiStatus = "completed";
|
42
|
-
}
|
43
|
-
const purchaseCbCalled = useRef(false);
|
44
|
-
useEffect(() => {
|
45
|
-
if (purchaseCbCalled.current || !onSuccess) {
|
46
|
-
return;
|
47
|
-
}
|
48
|
-
if (statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED") {
|
49
|
-
purchaseCbCalled.current = true;
|
50
|
-
onSuccess(statusQuery.data);
|
51
|
-
}
|
52
|
-
}, [onSuccess, statusQuery.data]);
|
53
|
-
// close the onramp popup if onramp is completed
|
54
|
-
useEffect(() => {
|
55
|
-
if (!openedWindow || !statusQuery.data) {
|
56
|
-
return;
|
57
|
-
}
|
58
|
-
if (statusQuery.data?.status === "CRYPTO_SWAP_REQUIRED" ||
|
59
|
-
statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED") {
|
60
|
-
openedWindow.close();
|
61
|
-
}
|
62
|
-
}, [statusQuery.data, openedWindow]);
|
63
|
-
// invalidate wallet balance when onramp is completed
|
64
|
-
const invalidatedBalance = useRef(false);
|
65
|
-
useEffect(() => {
|
66
|
-
if (!invalidatedBalance.current &&
|
67
|
-
statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED") {
|
68
|
-
invalidatedBalance.current = true;
|
69
|
-
invalidateWalletBalance(queryClient);
|
70
|
-
}
|
71
|
-
}, [statusQuery.data, queryClient]);
|
72
|
-
// show swap flow
|
73
|
-
useEffect(() => {
|
74
|
-
if (statusQuery.data?.status === "CRYPTO_SWAP_REQUIRED") {
|
75
|
-
props.onShowSwapFlow(statusQuery.data);
|
76
|
-
}
|
77
|
-
}, [statusQuery.data, props.onShowSwapFlow]);
|
78
|
-
return (_jsxs(Container, { p: "lg", children: [_jsx(ModalHeader, { title: props.title, onBack: props.onBack }), props.hasTwoSteps && (_jsxs(_Fragment, { children: [_jsx(Spacer, { y: "lg" }), _jsx(StepBar, { steps: 2, currentStep: 1 }), _jsx(Spacer, { y: "sm" }), _jsxs(Text, { size: "xs", children: ["Step 1 of 2 - Buying ", props.quote.onRampToken.token.symbol, " with", " ", props.quote.fromCurrencyWithFees.currencySymbol] })] })), _jsx(OnrampStatusScreenUI, { uiStatus: uiStatus, onDone: props.onDone, fiatStatus: statusQuery.data, client: props.client, transactionMode: props.transactionMode, quote: props.quote, isEmbed: props.isEmbed })] }));
|
79
|
-
}
|
80
|
-
function OnrampStatusScreenUI(props) {
|
81
|
-
const { uiStatus } = props;
|
82
|
-
const statusMeta = props.fiatStatus
|
83
|
-
? getBuyWithFiatStatusMeta(props.fiatStatus)
|
84
|
-
: undefined;
|
85
|
-
const fiatStatus = props.fiatStatus && props.fiatStatus.status !== "NOT_FOUND"
|
86
|
-
? props.fiatStatus
|
87
|
-
: undefined;
|
88
|
-
const onRampTokenQuote = props.quote.onRampToken;
|
89
|
-
const txDetails = (_jsx(OnRampTxDetailsTable, { client: props.client, token: fiatStatus?.source // source tx is onRamp token
|
90
|
-
? {
|
91
|
-
chainId: fiatStatus.source.token.chainId,
|
92
|
-
address: fiatStatus.source.token.tokenAddress,
|
93
|
-
symbol: fiatStatus.source.token.symbol || "",
|
94
|
-
amount: fiatStatus.source.amount,
|
95
|
-
}
|
96
|
-
: {
|
97
|
-
chainId: onRampTokenQuote.token.chainId,
|
98
|
-
address: onRampTokenQuote.token.tokenAddress,
|
99
|
-
symbol: onRampTokenQuote.token.symbol,
|
100
|
-
amount: onRampTokenQuote.amount,
|
101
|
-
}, fiat: {
|
102
|
-
amount: props.quote.fromCurrencyWithFees.amount,
|
103
|
-
currencySymbol: props.quote.fromCurrencyWithFees.currencySymbol,
|
104
|
-
}, statusMeta: fiatStatus?.source && statusMeta
|
105
|
-
? {
|
106
|
-
color: statusMeta?.color,
|
107
|
-
text: statusMeta?.status,
|
108
|
-
txHash: fiatStatus.source.transactionHash,
|
109
|
-
}
|
110
|
-
: undefined }));
|
111
|
-
return (_jsxs(Container, { children: [_jsx(Spacer, { y: "xl" }), uiStatus === "loading" && (_jsxs(_Fragment, { children: [_jsx(Spacer, { y: "md" }), _jsx(Container, { flex: "row", center: "x", children: _jsx(Spinner, { size: "xxl", color: "accentText" }) }), _jsx(Spacer, { y: "md" }), _jsx(Text, { color: "primaryText", size: "lg", center: true, children: "Buy Pending" }), _jsx(Spacer, { y: "sm" }), !isMobile() && _jsx(Text, { center: true, children: "Complete the purchase in popup" }), _jsx(Spacer, { y: "xxl" }), txDetails] })), uiStatus === "failed" && (_jsxs(_Fragment, { children: [_jsx(Spacer, { y: "md" }), _jsx(Container, { flex: "row", center: "x", children: _jsx(AccentFailIcon, { size: iconSize["3xl"] }) }), _jsx(Spacer, { y: "lg" }), _jsx(Text, { color: "primaryText", size: "lg", center: true, children: "Transaction Failed" }), _jsx(Spacer, { y: "xxl" }), txDetails] })), uiStatus === "completed" && (_jsxs(_Fragment, { children: [_jsx(Spacer, { y: "md" }), _jsx(Container, { flex: "row", center: "x", color: "success", children: _jsx(CheckCircledIcon, { width: iconSize["3xl"], height: iconSize["3xl"] }) }), _jsx(Spacer, { y: "md" }), _jsx(Text, { color: "primaryText", size: "lg", center: true, children: "Buy Complete" }), props.fiatStatus && props.fiatStatus.status !== "NOT_FOUND" && (_jsxs(_Fragment, { children: [_jsx(Spacer, { y: "xxl" }), txDetails, _jsx(Spacer, { y: "sm" })] })), _jsx(Button, { variant: "accent", fullWidth: true, onClick: props.onDone, children: props.transactionMode ? "Continue Transaction" : "Done" })] }))] }));
|
112
|
-
}
|
113
|
-
//# sourceMappingURL=FiatStatusScreen.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"FiatStatusScreen.js","sourceRoot":"","sources":["../../../../../../../../../src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.tsx"],"names":[],"mappings":"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"}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"FiatFlow.d.ts","sourceRoot":"","sources":["../../../../../../../../../src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kDAAkD,CAAC;AACzF,OAAO,EACL,KAAK,iBAAiB,EAEvB,MAAM,mDAAmD,CAAC;AAI3D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AA+B7C,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,gBAAgB,CAAC;IACxB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,cAAc,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,SAAS,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;CAChD,qDAgGA"}
|
@@ -1,24 +0,0 @@
|
|
1
|
-
import type { ThirdwebClient } from "../../../../../../../client/client.js";
|
2
|
-
import type { BuyWithFiatQuote } from "../../../../../../../pay/buyWithFiat/getQuote.js";
|
3
|
-
import type { BuyWithFiatStatus } from "../../../../../../../pay/buyWithFiat/getStatus.js";
|
4
|
-
/**
|
5
|
-
* Poll for "Buy with Fiat" status - when the on-ramp is in progress
|
6
|
-
* - Show success screen if swap is not required and on-ramp is completed
|
7
|
-
* - Show Failed screen if on-ramp failed
|
8
|
-
* - call `onShowSwapFlow` if on-ramp is completed and swap is required
|
9
|
-
*/
|
10
|
-
export declare function OnrampStatusScreen(props: {
|
11
|
-
title: string;
|
12
|
-
client: ThirdwebClient;
|
13
|
-
onBack: () => void;
|
14
|
-
intentId: string;
|
15
|
-
hasTwoSteps: boolean;
|
16
|
-
openedWindow: Window | null;
|
17
|
-
quote: BuyWithFiatQuote;
|
18
|
-
onDone: () => void;
|
19
|
-
onShowSwapFlow: (status: BuyWithFiatStatus) => void;
|
20
|
-
transactionMode: boolean;
|
21
|
-
isEmbed: boolean;
|
22
|
-
onSuccess: ((status: BuyWithFiatStatus) => void) | undefined;
|
23
|
-
}): import("react/jsx-runtime.js").JSX.Element;
|
24
|
-
//# sourceMappingURL=FiatStatusScreen.d.ts.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"FiatStatusScreen.d.ts","sourceRoot":"","sources":["../../../../../../../../../src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatStatusScreen.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kDAAkD,CAAC;AACzF,OAAO,KAAK,EACV,iBAAiB,EAElB,MAAM,mDAAmD,CAAC;AAiB3D;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,KAAK,EAAE,gBAAgB,CAAC;IACxB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,cAAc,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD,eAAe,EAAE,OAAO,CAAC;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CAC9D,8CA2FA"}
|
@@ -1,152 +0,0 @@
|
|
1
|
-
import { useCallback, useState } from "react";
|
2
|
-
import { trackPayEvent } from "../../../../../../../analytics/track/pay.js";
|
3
|
-
import type { ThirdwebClient } from "../../../../../../../client/client.js";
|
4
|
-
import type { BuyWithFiatQuote } from "../../../../../../../pay/buyWithFiat/getQuote.js";
|
5
|
-
import {
|
6
|
-
type BuyWithFiatStatus,
|
7
|
-
getBuyWithFiatStatus,
|
8
|
-
} from "../../../../../../../pay/buyWithFiat/getStatus.js";
|
9
|
-
import { isSwapRequiredPostOnramp } from "../../../../../../../pay/buyWithFiat/isSwapRequiredPostOnramp.js";
|
10
|
-
import { openOnrampPopup } from "../openOnRamppopup.js";
|
11
|
-
import { addPendingTx } from "../swap/pendingSwapTx.js";
|
12
|
-
import type { PayerInfo } from "../types.js";
|
13
|
-
import { OnrampStatusScreen } from "./FiatStatusScreen.js";
|
14
|
-
import { FiatSteps, fiatQuoteToPartialQuote } from "./FiatSteps.js";
|
15
|
-
import { PostOnRampSwapFlow } from "./PostOnRampSwapFlow.js";
|
16
|
-
|
17
|
-
// 2 possible flows
|
18
|
-
|
19
|
-
// If a Swap is required after doing onramp
|
20
|
-
// 1. show the 2 steps ui with step 1 highlighted, on continue button click:
|
21
|
-
// 2. open provider window, show onramp status screen, on onramp success:
|
22
|
-
// 3. show the 2 steps ui with step 2 highlighted, on continue button click:
|
23
|
-
// 4. show swap flow
|
24
|
-
|
25
|
-
// If a Swap is not required after doing onramp
|
26
|
-
// - window will already be opened before this component is mounted and `openedWindow` prop will be set, show onramp status screen
|
27
|
-
|
28
|
-
type Screen =
|
29
|
-
| {
|
30
|
-
id: "step-1";
|
31
|
-
}
|
32
|
-
| {
|
33
|
-
id: "onramp-status";
|
34
|
-
}
|
35
|
-
| {
|
36
|
-
id: "postonramp-swap";
|
37
|
-
data: BuyWithFiatStatus;
|
38
|
-
}
|
39
|
-
| {
|
40
|
-
id: "step-2";
|
41
|
-
};
|
42
|
-
|
43
|
-
export function FiatFlow(props: {
|
44
|
-
title: string;
|
45
|
-
quote: BuyWithFiatQuote;
|
46
|
-
onBack: () => void;
|
47
|
-
client: ThirdwebClient;
|
48
|
-
testMode: boolean;
|
49
|
-
theme: "light" | "dark";
|
50
|
-
openedWindow: Window | null;
|
51
|
-
onDone: () => void;
|
52
|
-
transactionMode: boolean;
|
53
|
-
isEmbed: boolean;
|
54
|
-
payer: PayerInfo;
|
55
|
-
onSuccess: (status: BuyWithFiatStatus) => void;
|
56
|
-
}) {
|
57
|
-
const hasTwoSteps = isSwapRequiredPostOnramp(props.quote);
|
58
|
-
const [screen, setScreen] = useState<Screen>(
|
59
|
-
hasTwoSteps
|
60
|
-
? {
|
61
|
-
id: "step-1",
|
62
|
-
}
|
63
|
-
: {
|
64
|
-
id: "onramp-status",
|
65
|
-
},
|
66
|
-
);
|
67
|
-
|
68
|
-
const [popupWindow, setPopupWindow] = useState<Window | null>(
|
69
|
-
props.openedWindow,
|
70
|
-
);
|
71
|
-
|
72
|
-
const onPostOnrampSuccess = useCallback(() => {
|
73
|
-
// report the status of fiat status instead of post onramp swap status when post onramp swap is successful
|
74
|
-
getBuyWithFiatStatus({
|
75
|
-
intentId: props.quote.intentId,
|
76
|
-
client: props.client,
|
77
|
-
}).then((status) => {
|
78
|
-
props.onSuccess(status);
|
79
|
-
});
|
80
|
-
}, [props.onSuccess, props.quote.intentId, props.client]);
|
81
|
-
|
82
|
-
if (screen.id === "step-1") {
|
83
|
-
return (
|
84
|
-
<FiatSteps
|
85
|
-
title={props.title}
|
86
|
-
client={props.client}
|
87
|
-
onBack={props.onBack}
|
88
|
-
partialQuote={fiatQuoteToPartialQuote(props.quote)}
|
89
|
-
step={1}
|
90
|
-
onContinue={() => {
|
91
|
-
const popup = openOnrampPopup(props.quote.onRampLink, props.theme);
|
92
|
-
trackPayEvent({
|
93
|
-
event: "open_onramp_popup",
|
94
|
-
client: props.client,
|
95
|
-
walletAddress: props.payer.account.address,
|
96
|
-
walletType: props.payer.wallet.id,
|
97
|
-
});
|
98
|
-
addPendingTx({
|
99
|
-
type: "fiat",
|
100
|
-
intentId: props.quote.intentId,
|
101
|
-
});
|
102
|
-
setPopupWindow(popup);
|
103
|
-
setScreen({ id: "onramp-status" });
|
104
|
-
}}
|
105
|
-
/>
|
106
|
-
);
|
107
|
-
}
|
108
|
-
|
109
|
-
if (screen.id === "onramp-status") {
|
110
|
-
return (
|
111
|
-
<OnrampStatusScreen
|
112
|
-
title={props.title}
|
113
|
-
client={props.client}
|
114
|
-
intentId={props.quote.intentId}
|
115
|
-
onBack={props.onBack}
|
116
|
-
hasTwoSteps={hasTwoSteps}
|
117
|
-
openedWindow={popupWindow}
|
118
|
-
quote={props.quote}
|
119
|
-
onDone={props.onDone}
|
120
|
-
onShowSwapFlow={(_status) => {
|
121
|
-
setScreen({ id: "postonramp-swap", data: _status });
|
122
|
-
}}
|
123
|
-
transactionMode={props.transactionMode}
|
124
|
-
isEmbed={props.isEmbed}
|
125
|
-
onSuccess={props.onSuccess}
|
126
|
-
/>
|
127
|
-
);
|
128
|
-
}
|
129
|
-
|
130
|
-
if (screen.id === "postonramp-swap") {
|
131
|
-
return (
|
132
|
-
<PostOnRampSwapFlow
|
133
|
-
title={props.title}
|
134
|
-
status={screen.data}
|
135
|
-
quote={fiatQuoteToPartialQuote(props.quote)}
|
136
|
-
client={props.client}
|
137
|
-
onBack={props.onBack}
|
138
|
-
onDone={props.onDone}
|
139
|
-
onSwapFlowStarted={() => {
|
140
|
-
// no op
|
141
|
-
}}
|
142
|
-
transactionMode={props.transactionMode}
|
143
|
-
isEmbed={props.isEmbed}
|
144
|
-
payer={props.payer}
|
145
|
-
onSuccess={onPostOnrampSuccess}
|
146
|
-
/>
|
147
|
-
);
|
148
|
-
}
|
149
|
-
|
150
|
-
// never
|
151
|
-
return null;
|
152
|
-
}
|
@@ -1,258 +0,0 @@
|
|
1
|
-
import { CheckCircledIcon } from "@radix-ui/react-icons";
|
2
|
-
import { useQueryClient } from "@tanstack/react-query";
|
3
|
-
import { useEffect, useRef } from "react";
|
4
|
-
import type { ThirdwebClient } from "../../../../../../../client/client.js";
|
5
|
-
import type { BuyWithFiatQuote } from "../../../../../../../pay/buyWithFiat/getQuote.js";
|
6
|
-
import type {
|
7
|
-
BuyWithFiatStatus,
|
8
|
-
ValidBuyWithFiatStatus,
|
9
|
-
} from "../../../../../../../pay/buyWithFiat/getStatus.js";
|
10
|
-
import { isMobile } from "../../../../../../../utils/web/isMobile.js";
|
11
|
-
import { iconSize } from "../../../../../../core/design-system/index.js";
|
12
|
-
import { useBuyWithFiatStatus } from "../../../../../../core/hooks/pay/useBuyWithFiatStatus.js";
|
13
|
-
import { invalidateWalletBalance } from "../../../../../../core/providers/invalidateWalletBalance.js";
|
14
|
-
import { Spacer } from "../../../../components/Spacer.js";
|
15
|
-
import { Spinner } from "../../../../components/Spinner.js";
|
16
|
-
import { StepBar } from "../../../../components/StepBar.js";
|
17
|
-
import { Container, ModalHeader } from "../../../../components/basic.js";
|
18
|
-
import { Button } from "../../../../components/buttons.js";
|
19
|
-
import { Text } from "../../../../components/text.js";
|
20
|
-
import { AccentFailIcon } from "../../../icons/AccentFailIcon.js";
|
21
|
-
import { getBuyWithFiatStatusMeta } from "../pay-transactions/statusMeta.js";
|
22
|
-
import { OnRampTxDetailsTable } from "./FiatTxDetailsTable.js";
|
23
|
-
|
24
|
-
type UIStatus = "loading" | "failed" | "completed" | "partialSuccess";
|
25
|
-
|
26
|
-
/**
|
27
|
-
* Poll for "Buy with Fiat" status - when the on-ramp is in progress
|
28
|
-
* - Show success screen if swap is not required and on-ramp is completed
|
29
|
-
* - Show Failed screen if on-ramp failed
|
30
|
-
* - call `onShowSwapFlow` if on-ramp is completed and swap is required
|
31
|
-
*/
|
32
|
-
export function OnrampStatusScreen(props: {
|
33
|
-
title: string;
|
34
|
-
client: ThirdwebClient;
|
35
|
-
onBack: () => void;
|
36
|
-
intentId: string;
|
37
|
-
hasTwoSteps: boolean;
|
38
|
-
openedWindow: Window | null;
|
39
|
-
quote: BuyWithFiatQuote;
|
40
|
-
onDone: () => void;
|
41
|
-
onShowSwapFlow: (status: BuyWithFiatStatus) => void;
|
42
|
-
transactionMode: boolean;
|
43
|
-
isEmbed: boolean;
|
44
|
-
onSuccess: ((status: BuyWithFiatStatus) => void) | undefined;
|
45
|
-
}) {
|
46
|
-
const queryClient = useQueryClient();
|
47
|
-
const { openedWindow, onSuccess } = props;
|
48
|
-
const statusQuery = useBuyWithFiatStatus({
|
49
|
-
intentId: props.intentId,
|
50
|
-
client: props.client,
|
51
|
-
});
|
52
|
-
|
53
|
-
// determine UI status
|
54
|
-
let uiStatus: UIStatus = "loading";
|
55
|
-
if (
|
56
|
-
statusQuery.data?.status === "ON_RAMP_TRANSFER_FAILED" ||
|
57
|
-
statusQuery.data?.status === "PAYMENT_FAILED"
|
58
|
-
) {
|
59
|
-
uiStatus = "failed";
|
60
|
-
} else if (statusQuery.data?.status === "CRYPTO_SWAP_FALLBACK") {
|
61
|
-
uiStatus = "partialSuccess";
|
62
|
-
} else if (statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED") {
|
63
|
-
uiStatus = "completed";
|
64
|
-
}
|
65
|
-
|
66
|
-
const purchaseCbCalled = useRef(false);
|
67
|
-
useEffect(() => {
|
68
|
-
if (purchaseCbCalled.current || !onSuccess) {
|
69
|
-
return;
|
70
|
-
}
|
71
|
-
|
72
|
-
if (statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED") {
|
73
|
-
purchaseCbCalled.current = true;
|
74
|
-
onSuccess(statusQuery.data);
|
75
|
-
}
|
76
|
-
}, [onSuccess, statusQuery.data]);
|
77
|
-
|
78
|
-
// close the onramp popup if onramp is completed
|
79
|
-
useEffect(() => {
|
80
|
-
if (!openedWindow || !statusQuery.data) {
|
81
|
-
return;
|
82
|
-
}
|
83
|
-
|
84
|
-
if (
|
85
|
-
statusQuery.data?.status === "CRYPTO_SWAP_REQUIRED" ||
|
86
|
-
statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED"
|
87
|
-
) {
|
88
|
-
openedWindow.close();
|
89
|
-
}
|
90
|
-
}, [statusQuery.data, openedWindow]);
|
91
|
-
|
92
|
-
// invalidate wallet balance when onramp is completed
|
93
|
-
const invalidatedBalance = useRef(false);
|
94
|
-
useEffect(() => {
|
95
|
-
if (
|
96
|
-
!invalidatedBalance.current &&
|
97
|
-
statusQuery.data?.status === "ON_RAMP_TRANSFER_COMPLETED"
|
98
|
-
) {
|
99
|
-
invalidatedBalance.current = true;
|
100
|
-
invalidateWalletBalance(queryClient);
|
101
|
-
}
|
102
|
-
}, [statusQuery.data, queryClient]);
|
103
|
-
|
104
|
-
// show swap flow
|
105
|
-
useEffect(() => {
|
106
|
-
if (statusQuery.data?.status === "CRYPTO_SWAP_REQUIRED") {
|
107
|
-
props.onShowSwapFlow(statusQuery.data);
|
108
|
-
}
|
109
|
-
}, [statusQuery.data, props.onShowSwapFlow]);
|
110
|
-
|
111
|
-
return (
|
112
|
-
<Container p="lg">
|
113
|
-
<ModalHeader title={props.title} onBack={props.onBack} />
|
114
|
-
{props.hasTwoSteps && (
|
115
|
-
<>
|
116
|
-
<Spacer y="lg" />
|
117
|
-
<StepBar steps={2} currentStep={1} />
|
118
|
-
<Spacer y="sm" />
|
119
|
-
<Text size="xs">
|
120
|
-
Step 1 of 2 - Buying {props.quote.onRampToken.token.symbol} with{" "}
|
121
|
-
{props.quote.fromCurrencyWithFees.currencySymbol}
|
122
|
-
</Text>
|
123
|
-
</>
|
124
|
-
)}
|
125
|
-
<OnrampStatusScreenUI
|
126
|
-
uiStatus={uiStatus}
|
127
|
-
onDone={props.onDone}
|
128
|
-
fiatStatus={statusQuery.data}
|
129
|
-
client={props.client}
|
130
|
-
transactionMode={props.transactionMode}
|
131
|
-
quote={props.quote}
|
132
|
-
isEmbed={props.isEmbed}
|
133
|
-
/>
|
134
|
-
</Container>
|
135
|
-
);
|
136
|
-
}
|
137
|
-
|
138
|
-
function OnrampStatusScreenUI(props: {
|
139
|
-
uiStatus: UIStatus;
|
140
|
-
fiatStatus?: BuyWithFiatStatus;
|
141
|
-
onDone: () => void;
|
142
|
-
client: ThirdwebClient;
|
143
|
-
transactionMode: boolean;
|
144
|
-
isEmbed: boolean;
|
145
|
-
quote: BuyWithFiatQuote;
|
146
|
-
}) {
|
147
|
-
const { uiStatus } = props;
|
148
|
-
|
149
|
-
const statusMeta = props.fiatStatus
|
150
|
-
? getBuyWithFiatStatusMeta(props.fiatStatus)
|
151
|
-
: undefined;
|
152
|
-
|
153
|
-
const fiatStatus: ValidBuyWithFiatStatus | undefined =
|
154
|
-
props.fiatStatus && props.fiatStatus.status !== "NOT_FOUND"
|
155
|
-
? props.fiatStatus
|
156
|
-
: undefined;
|
157
|
-
|
158
|
-
const onRampTokenQuote = props.quote.onRampToken;
|
159
|
-
|
160
|
-
const txDetails = (
|
161
|
-
<OnRampTxDetailsTable
|
162
|
-
client={props.client}
|
163
|
-
token={
|
164
|
-
fiatStatus?.source // source tx is onRamp token
|
165
|
-
? {
|
166
|
-
chainId: fiatStatus.source.token.chainId,
|
167
|
-
address: fiatStatus.source.token.tokenAddress,
|
168
|
-
symbol: fiatStatus.source.token.symbol || "",
|
169
|
-
amount: fiatStatus.source.amount,
|
170
|
-
}
|
171
|
-
: {
|
172
|
-
chainId: onRampTokenQuote.token.chainId,
|
173
|
-
address: onRampTokenQuote.token.tokenAddress,
|
174
|
-
symbol: onRampTokenQuote.token.symbol,
|
175
|
-
amount: onRampTokenQuote.amount,
|
176
|
-
}
|
177
|
-
}
|
178
|
-
fiat={{
|
179
|
-
amount: props.quote.fromCurrencyWithFees.amount,
|
180
|
-
currencySymbol: props.quote.fromCurrencyWithFees.currencySymbol,
|
181
|
-
}}
|
182
|
-
statusMeta={
|
183
|
-
fiatStatus?.source && statusMeta
|
184
|
-
? {
|
185
|
-
color: statusMeta?.color,
|
186
|
-
text: statusMeta?.status,
|
187
|
-
txHash: fiatStatus.source.transactionHash,
|
188
|
-
}
|
189
|
-
: undefined
|
190
|
-
}
|
191
|
-
/>
|
192
|
-
);
|
193
|
-
|
194
|
-
return (
|
195
|
-
<Container>
|
196
|
-
<Spacer y="xl" />
|
197
|
-
|
198
|
-
{uiStatus === "loading" && (
|
199
|
-
<>
|
200
|
-
<Spacer y="md" />
|
201
|
-
<Container flex="row" center="x">
|
202
|
-
<Spinner size="xxl" color="accentText" />
|
203
|
-
</Container>
|
204
|
-
<Spacer y="md" />
|
205
|
-
<Text color="primaryText" size="lg" center>
|
206
|
-
Buy Pending
|
207
|
-
</Text>
|
208
|
-
<Spacer y="sm" />
|
209
|
-
{!isMobile() && <Text center>Complete the purchase in popup</Text>}
|
210
|
-
<Spacer y="xxl" />
|
211
|
-
{txDetails}
|
212
|
-
</>
|
213
|
-
)}
|
214
|
-
|
215
|
-
{uiStatus === "failed" && (
|
216
|
-
<>
|
217
|
-
<Spacer y="md" />
|
218
|
-
<Container flex="row" center="x">
|
219
|
-
<AccentFailIcon size={iconSize["3xl"]} />
|
220
|
-
</Container>
|
221
|
-
<Spacer y="lg" />
|
222
|
-
<Text color="primaryText" size="lg" center>
|
223
|
-
Transaction Failed
|
224
|
-
</Text>
|
225
|
-
<Spacer y="xxl" />
|
226
|
-
{txDetails}
|
227
|
-
</>
|
228
|
-
)}
|
229
|
-
|
230
|
-
{uiStatus === "completed" && (
|
231
|
-
<>
|
232
|
-
<Spacer y="md" />
|
233
|
-
<Container flex="row" center="x" color="success">
|
234
|
-
<CheckCircledIcon
|
235
|
-
width={iconSize["3xl"]}
|
236
|
-
height={iconSize["3xl"]}
|
237
|
-
/>
|
238
|
-
</Container>
|
239
|
-
<Spacer y="md" />
|
240
|
-
<Text color="primaryText" size="lg" center>
|
241
|
-
Buy Complete
|
242
|
-
</Text>
|
243
|
-
{props.fiatStatus && props.fiatStatus.status !== "NOT_FOUND" && (
|
244
|
-
<>
|
245
|
-
<Spacer y="xxl" />
|
246
|
-
{txDetails}
|
247
|
-
<Spacer y="sm" />
|
248
|
-
</>
|
249
|
-
)}
|
250
|
-
|
251
|
-
<Button variant="accent" fullWidth onClick={props.onDone}>
|
252
|
-
{props.transactionMode ? "Continue Transaction" : "Done"}
|
253
|
-
</Button>
|
254
|
-
</>
|
255
|
-
)}
|
256
|
-
</Container>
|
257
|
-
);
|
258
|
-
}
|