@unifold/connect-react 0.1.61 → 0.1.62
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/README.md +1 -1
- package/dist/index.d.mts +7 -3
- package/dist/index.d.ts +7 -3
- package/dist/index.js +372 -359
- package/dist/index.mjs +530 -517
- package/package.json +4 -4
package/dist/index.mjs
CHANGED
|
@@ -1145,10 +1145,10 @@ ${new this._window.XMLSerializer().serializeToString(e3)}`;
|
|
|
1145
1145
|
|
|
1146
1146
|
// src/provider.tsx
|
|
1147
1147
|
import React38, {
|
|
1148
|
-
useState as
|
|
1148
|
+
useState as useState31,
|
|
1149
1149
|
useCallback as useCallback13,
|
|
1150
1150
|
useMemo as useMemo15,
|
|
1151
|
-
useEffect as
|
|
1151
|
+
useEffect as useEffect33
|
|
1152
1152
|
} from "react";
|
|
1153
1153
|
|
|
1154
1154
|
// ../react-provider/dist/index.mjs
|
|
@@ -1225,11 +1225,11 @@ function useUnifold() {
|
|
|
1225
1225
|
|
|
1226
1226
|
// ../ui-react/dist/index.mjs
|
|
1227
1227
|
import {
|
|
1228
|
-
useState as
|
|
1229
|
-
useEffect as
|
|
1228
|
+
useState as useState32,
|
|
1229
|
+
useEffect as useEffect26,
|
|
1230
1230
|
useLayoutEffect as useLayoutEffect22,
|
|
1231
1231
|
useCallback as useCallback52,
|
|
1232
|
-
useRef as
|
|
1232
|
+
useRef as useRef92,
|
|
1233
1233
|
useMemo as useMemo10
|
|
1234
1234
|
} from "react";
|
|
1235
1235
|
|
|
@@ -7355,7 +7355,7 @@ import * as React102 from "react";
|
|
|
7355
7355
|
import { jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
7356
7356
|
import * as React112 from "react";
|
|
7357
7357
|
import { jsx as jsx222, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
7358
|
-
import * as
|
|
7358
|
+
import * as React252 from "react";
|
|
7359
7359
|
|
|
7360
7360
|
// ../../node_modules/.pnpm/mipd@0.0.7_typescript@5.9.3/node_modules/mipd/dist/esm/utils.js
|
|
7361
7361
|
function requestProviders(listener) {
|
|
@@ -7413,32 +7413,33 @@ function createStore() {
|
|
|
7413
7413
|
|
|
7414
7414
|
// ../ui-react/dist/index.mjs
|
|
7415
7415
|
import * as React122 from "react";
|
|
7416
|
-
import { jsx as jsx232, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
7417
7416
|
import * as React132 from "react";
|
|
7418
|
-
import { jsx as
|
|
7417
|
+
import { jsx as jsx232, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
7419
7418
|
import * as React142 from "react";
|
|
7420
|
-
import { jsx as
|
|
7419
|
+
import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
7421
7420
|
import * as React152 from "react";
|
|
7422
|
-
import { jsx as
|
|
7421
|
+
import { jsx as jsx25, jsxs as jsxs222 } from "react/jsx-runtime";
|
|
7423
7422
|
import * as React162 from "react";
|
|
7424
|
-
import { jsx as
|
|
7423
|
+
import { jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
7425
7424
|
import * as React172 from "react";
|
|
7426
|
-
import { jsx as
|
|
7425
|
+
import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
7427
7426
|
import * as React182 from "react";
|
|
7428
|
-
import { jsx as
|
|
7427
|
+
import { jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
7429
7428
|
import * as React192 from "react";
|
|
7430
|
-
import { jsx as
|
|
7429
|
+
import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
7431
7430
|
import * as React202 from "react";
|
|
7432
|
-
import { jsx as
|
|
7431
|
+
import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
7433
7432
|
import * as React212 from "react";
|
|
7434
|
-
import { jsx as
|
|
7433
|
+
import { jsx as jsx31, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
7435
7434
|
import * as React222 from "react";
|
|
7436
|
-
import { jsx as
|
|
7435
|
+
import { jsx as jsx322, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
7437
7436
|
import * as React232 from "react";
|
|
7437
|
+
import { jsx as jsx33, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
7438
|
+
import * as React242 from "react";
|
|
7438
7439
|
import { jsx as jsx34, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
7439
7440
|
import { jsx as jsx35, jsxs as jsxs322 } from "react/jsx-runtime";
|
|
7440
7441
|
import { jsx as jsx36, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
7441
|
-
import { useState as
|
|
7442
|
+
import { useState as useState222, useEffect as useEffect172, useCallback as useCallback22, useMemo as useMemo42, useRef as useRef62 } from "react";
|
|
7442
7443
|
import { useQuery as useQuery4 } from "@tanstack/react-query";
|
|
7443
7444
|
import { useQuery as useQuery5 } from "@tanstack/react-query";
|
|
7444
7445
|
import { useQuery as useQuery6 } from "@tanstack/react-query";
|
|
@@ -7447,13 +7448,13 @@ import { useQuery as useQuery7 } from "@tanstack/react-query";
|
|
|
7447
7448
|
import { useQuery as useQuery8 } from "@tanstack/react-query";
|
|
7448
7449
|
import { useQuery as useQuery9 } from "@tanstack/react-query";
|
|
7449
7450
|
import { useQuery as useQuery10 } from "@tanstack/react-query";
|
|
7450
|
-
import { useState as
|
|
7451
|
-
import { useEffect as
|
|
7452
|
-
import * as
|
|
7451
|
+
import { useState as useState28, useEffect as useEffect222, useMemo as useMemo72 } from "react";
|
|
7452
|
+
import { useEffect as useEffect192, useState as useState232 } from "react";
|
|
7453
|
+
import * as React272 from "react";
|
|
7453
7454
|
import { jsx as jsx38 } from "react/jsx-runtime";
|
|
7454
7455
|
import { jsx as jsx39, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
7455
7456
|
import { Fragment as Fragment52, jsx as jsx40, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
7456
|
-
import { useState as
|
|
7457
|
+
import { useState as useState242, useMemo as useMemo62, useEffect as useEffect202 } from "react";
|
|
7457
7458
|
|
|
7458
7459
|
// ../../node_modules/.pnpm/fuse.js@7.4.0/node_modules/fuse.js/dist/fuse.mjs
|
|
7459
7460
|
function isArray(value) {
|
|
@@ -9455,11 +9456,11 @@ Fuse.use = function(...plugins) {
|
|
|
9455
9456
|
|
|
9456
9457
|
// ../ui-react/dist/index.mjs
|
|
9457
9458
|
import { jsx as jsx41, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
9458
|
-
import { useState as
|
|
9459
|
+
import { useState as useState252, useEffect as useEffect212, useRef as useRef72 } from "react";
|
|
9459
9460
|
import { jsx as jsx422, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
9460
9461
|
import { Fragment as Fragment62, jsx as jsx43, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
9461
|
-
import { useState as
|
|
9462
|
-
import * as
|
|
9462
|
+
import { useState as useState262 } from "react";
|
|
9463
|
+
import * as React282 from "react";
|
|
9463
9464
|
|
|
9464
9465
|
// ../../node_modules/.pnpm/@radix-ui+react-tooltip@1.2.8_@types+react-dom@19.2.3_@types+react@19.2.9__@types+react@19.2._udyjcec5g7ve3mpsxbgla63vgi/node_modules/@radix-ui/react-tooltip/dist/index.mjs
|
|
9465
9466
|
import * as React31 from "react";
|
|
@@ -12200,8 +12201,8 @@ import { jsx as jsx44 } from "react/jsx-runtime";
|
|
|
12200
12201
|
import { useQuery as useQuery11 } from "@tanstack/react-query";
|
|
12201
12202
|
import { jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
12202
12203
|
import { Fragment as Fragment72, jsx as jsx46, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
12203
|
-
import { useState as
|
|
12204
|
-
import * as
|
|
12204
|
+
import { useState as useState29, useEffect as useEffect232, useMemo as useMemo82 } from "react";
|
|
12205
|
+
import * as React292 from "react";
|
|
12205
12206
|
|
|
12206
12207
|
// ../../node_modules/.pnpm/@radix-ui+react-select@2.2.6_@types+react-dom@19.2.3_@types+react@19.2.9__@types+react@19.2.9_cot3leusltbsophitaz3dgdqdm/node_modules/@radix-ui/react-select/dist/index.mjs
|
|
12207
12208
|
import * as React35 from "react";
|
|
@@ -13438,49 +13439,49 @@ var Separator = SelectSeparator;
|
|
|
13438
13439
|
// ../ui-react/dist/index.mjs
|
|
13439
13440
|
import { jsx as jsx47, jsxs as jsxs422 } from "react/jsx-runtime";
|
|
13440
13441
|
import { jsx as jsx48, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
13441
|
-
import * as
|
|
13442
|
+
import * as React302 from "react";
|
|
13442
13443
|
import { useQuery as useQuery12 } from "@tanstack/react-query";
|
|
13443
13444
|
import { jsx as jsx49 } from "react/jsx-runtime";
|
|
13444
13445
|
import { jsx as jsx50, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
13445
13446
|
import { Fragment as Fragment82, jsx as jsx51, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
13446
13447
|
import { Fragment as Fragment9, jsx as jsx522, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
13447
|
-
import { useEffect as
|
|
13448
|
+
import { useEffect as useEffect242, useState as useState302 } from "react";
|
|
13448
13449
|
import { Fragment as Fragment10, jsx as jsx53, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
13449
13450
|
import { jsx as jsx54, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
13450
13451
|
import { Fragment as Fragment11, jsx as jsx55, jsxs as jsxs49 } from "react/jsx-runtime";
|
|
13451
13452
|
import {
|
|
13452
|
-
useState as
|
|
13453
|
-
useEffect as
|
|
13453
|
+
useState as useState33,
|
|
13454
|
+
useEffect as useEffect272,
|
|
13454
13455
|
useLayoutEffect as useLayoutEffect32,
|
|
13455
13456
|
useCallback as useCallback62,
|
|
13456
|
-
useRef as
|
|
13457
|
+
useRef as useRef102,
|
|
13457
13458
|
useMemo as useMemo112
|
|
13458
13459
|
} from "react";
|
|
13459
13460
|
import { useQuery as useQuery13 } from "@tanstack/react-query";
|
|
13460
13461
|
import { Fragment as Fragment12, jsx as jsx56, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
13461
13462
|
import {
|
|
13462
|
-
useState as
|
|
13463
|
-
useEffect as
|
|
13463
|
+
useState as useState37,
|
|
13464
|
+
useEffect as useEffect31,
|
|
13464
13465
|
useLayoutEffect as useLayoutEffect42,
|
|
13465
13466
|
useCallback as useCallback82,
|
|
13466
|
-
useRef as
|
|
13467
|
+
useRef as useRef122
|
|
13467
13468
|
} from "react";
|
|
13468
13469
|
import { useQuery as useQuery14 } from "@tanstack/react-query";
|
|
13469
13470
|
import { useQuery as useQuery15 } from "@tanstack/react-query";
|
|
13470
13471
|
import { useQuery as useQuery16 } from "@tanstack/react-query";
|
|
13471
13472
|
import { useQuery as useQuery17 } from "@tanstack/react-query";
|
|
13472
|
-
import { useState as
|
|
13473
|
+
import { useState as useState34, useEffect as useEffect282, useRef as useRef112 } from "react";
|
|
13473
13474
|
import { jsx as jsx57, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
13474
|
-
import { useState as
|
|
13475
|
+
import { useState as useState35, useCallback as useCallback72, useMemo as useMemo132, useEffect as useEffect292 } from "react";
|
|
13475
13476
|
import { useQuery as useQuery18 } from "@tanstack/react-query";
|
|
13476
13477
|
import { useMemo as useMemo122 } from "react";
|
|
13477
13478
|
import { useQuery as useQuery19 } from "@tanstack/react-query";
|
|
13478
13479
|
import { Fragment as Fragment13, jsx as jsx58, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
13479
13480
|
import { jsx as jsx59, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
13480
|
-
import { useState as
|
|
13481
|
+
import { useState as useState36, useEffect as useEffect302 } from "react";
|
|
13481
13482
|
import { Fragment as Fragment14, jsx as jsx60, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
13482
13483
|
import { Fragment as Fragment15, jsx as jsx61, jsxs as jsxs55 } from "react/jsx-runtime";
|
|
13483
|
-
import { useState as
|
|
13484
|
+
import { useState as useState38, useMemo as useMemo142 } from "react";
|
|
13484
13485
|
import { jsx as jsx622, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
13485
13486
|
function cn(...inputs) {
|
|
13486
13487
|
return twMerge(clsx(inputs));
|
|
@@ -18563,6 +18564,190 @@ function collectAllEip6963EthProviders() {
|
|
|
18563
18564
|
if (!store) return [];
|
|
18564
18565
|
return store.getProviders().map((d) => d.provider);
|
|
18565
18566
|
}
|
|
18567
|
+
function identifyEthWallet(provider, hint) {
|
|
18568
|
+
switch (hint) {
|
|
18569
|
+
case "metamask":
|
|
18570
|
+
return { type: "metamask", name: "MetaMask", icon: "metamask" };
|
|
18571
|
+
case "phantom":
|
|
18572
|
+
return { type: "phantom-ethereum", name: "Phantom", icon: "phantom" };
|
|
18573
|
+
case "coinbase":
|
|
18574
|
+
return { type: "coinbase", name: "Coinbase Wallet", icon: "coinbase" };
|
|
18575
|
+
case "okx":
|
|
18576
|
+
return { type: "okx", name: "OKX Wallet", icon: "okx" };
|
|
18577
|
+
case "rabby":
|
|
18578
|
+
return { type: "rabby", name: "Rabby", icon: "rabby" };
|
|
18579
|
+
case "trust":
|
|
18580
|
+
return { type: "trust", name: "Trust Wallet", icon: "trust" };
|
|
18581
|
+
case "rainbow":
|
|
18582
|
+
return { type: "rainbow", name: "Rainbow", icon: "rainbow" };
|
|
18583
|
+
}
|
|
18584
|
+
const anyProvider = provider;
|
|
18585
|
+
if (provider.isPhantom) {
|
|
18586
|
+
return { type: "phantom-ethereum", name: "Phantom", icon: "phantom" };
|
|
18587
|
+
}
|
|
18588
|
+
if (anyProvider.isCoinbaseWallet) {
|
|
18589
|
+
return { type: "coinbase", name: "Coinbase Wallet", icon: "coinbase" };
|
|
18590
|
+
}
|
|
18591
|
+
if (anyProvider.isRabby) {
|
|
18592
|
+
return { type: "rabby", name: "Rabby", icon: "rabby" };
|
|
18593
|
+
}
|
|
18594
|
+
if (anyProvider.isTrust) {
|
|
18595
|
+
return { type: "trust", name: "Trust Wallet", icon: "trust" };
|
|
18596
|
+
}
|
|
18597
|
+
if (anyProvider.isRainbow) {
|
|
18598
|
+
return { type: "rainbow", name: "Rainbow", icon: "rainbow" };
|
|
18599
|
+
}
|
|
18600
|
+
if (provider.isMetaMask && !provider.isPhantom) {
|
|
18601
|
+
return { type: "metamask", name: "MetaMask", icon: "metamask" };
|
|
18602
|
+
}
|
|
18603
|
+
return { type: "metamask", name: "Wallet", icon: "metamask" };
|
|
18604
|
+
}
|
|
18605
|
+
async function detectConnectedBrowserWallet(chainType) {
|
|
18606
|
+
if (typeof window === "undefined") return null;
|
|
18607
|
+
if (getUserDisconnectedWallet()) return null;
|
|
18608
|
+
try {
|
|
18609
|
+
const win = window;
|
|
18610
|
+
if (!chainType || chainType === "solana") {
|
|
18611
|
+
const trySilentSolana = async (provider, type, name, icon) => {
|
|
18612
|
+
if (!provider) return null;
|
|
18613
|
+
if (provider.isConnected && provider.publicKey) {
|
|
18614
|
+
return { type, name, address: provider.publicKey.toString(), icon };
|
|
18615
|
+
}
|
|
18616
|
+
try {
|
|
18617
|
+
const resp = await provider.connect({ onlyIfTrusted: true });
|
|
18618
|
+
if (resp.publicKey) {
|
|
18619
|
+
return { type, name, address: resp.publicKey.toString(), icon };
|
|
18620
|
+
}
|
|
18621
|
+
} catch {
|
|
18622
|
+
}
|
|
18623
|
+
return null;
|
|
18624
|
+
};
|
|
18625
|
+
const solanaCandidates = [
|
|
18626
|
+
[win.phantom?.solana, "phantom-solana", "Phantom", "phantom"],
|
|
18627
|
+
[win.solflare, "solflare", "Solflare", "solflare"],
|
|
18628
|
+
[win.backpack, "backpack", "Backpack", "backpack"],
|
|
18629
|
+
[win.glow, "glow", "Glow", "glow"]
|
|
18630
|
+
];
|
|
18631
|
+
for (const [provider, type, name, icon] of solanaCandidates) {
|
|
18632
|
+
const found = await trySilentSolana(provider, type, name, icon);
|
|
18633
|
+
if (found) return found;
|
|
18634
|
+
}
|
|
18635
|
+
}
|
|
18636
|
+
if (!chainType || chainType === "ethereum") {
|
|
18637
|
+
const allProviders = [];
|
|
18638
|
+
const eip6963 = getEip6963Providers();
|
|
18639
|
+
for (const { provider, walletId } of eip6963) {
|
|
18640
|
+
allProviders.push({
|
|
18641
|
+
provider,
|
|
18642
|
+
walletId: walletId === "unknown" ? "default" : walletId
|
|
18643
|
+
});
|
|
18644
|
+
}
|
|
18645
|
+
if (allProviders.length === 0) {
|
|
18646
|
+
if (win.phantom?.ethereum) {
|
|
18647
|
+
allProviders.push({ provider: win.phantom.ethereum, walletId: "phantom" });
|
|
18648
|
+
}
|
|
18649
|
+
if (win.okxwallet) {
|
|
18650
|
+
allProviders.push({ provider: win.okxwallet, walletId: "okx" });
|
|
18651
|
+
}
|
|
18652
|
+
if (win.coinbaseWalletExtension) {
|
|
18653
|
+
allProviders.push({ provider: win.coinbaseWalletExtension, walletId: "coinbase" });
|
|
18654
|
+
}
|
|
18655
|
+
if (win.ethereum && !allProviders.some((p) => p.provider === win.ethereum)) {
|
|
18656
|
+
allProviders.push({ provider: win.ethereum, walletId: "default" });
|
|
18657
|
+
}
|
|
18658
|
+
}
|
|
18659
|
+
for (const { provider, walletId } of allProviders) {
|
|
18660
|
+
if (!provider) continue;
|
|
18661
|
+
try {
|
|
18662
|
+
const accounts = await provider.request({ method: "eth_accounts" });
|
|
18663
|
+
if (!accounts || accounts.length === 0) continue;
|
|
18664
|
+
const resolved = identifyEthWallet(provider, walletId);
|
|
18665
|
+
return { ...resolved, address: accounts[0] };
|
|
18666
|
+
} catch {
|
|
18667
|
+
}
|
|
18668
|
+
}
|
|
18669
|
+
}
|
|
18670
|
+
} catch (error) {
|
|
18671
|
+
console.error("[detectConnectedBrowserWallet] detection error:", error);
|
|
18672
|
+
}
|
|
18673
|
+
return null;
|
|
18674
|
+
}
|
|
18675
|
+
function useDetectedBrowserWallet(opts = {}) {
|
|
18676
|
+
const { chainType, enabled = true, onDisconnect } = opts;
|
|
18677
|
+
const [wallet, setWallet] = React122.useState(null);
|
|
18678
|
+
const [isLoading, setIsLoading] = React122.useState(enabled);
|
|
18679
|
+
const [eip6963ProviderCount, setEip6963ProviderCount] = React122.useState(0);
|
|
18680
|
+
const onDisconnectRef = React122.useRef(onDisconnect);
|
|
18681
|
+
onDisconnectRef.current = onDisconnect;
|
|
18682
|
+
React122.useEffect(() => {
|
|
18683
|
+
const store = getEip6963Store();
|
|
18684
|
+
if (!store) return;
|
|
18685
|
+
setEip6963ProviderCount(store.getProviders().length);
|
|
18686
|
+
return store.subscribe((providers) => setEip6963ProviderCount(providers.length));
|
|
18687
|
+
}, []);
|
|
18688
|
+
React122.useEffect(() => {
|
|
18689
|
+
if (!enabled) {
|
|
18690
|
+
setWallet(null);
|
|
18691
|
+
setIsLoading(false);
|
|
18692
|
+
return;
|
|
18693
|
+
}
|
|
18694
|
+
let mounted = true;
|
|
18695
|
+
const detect = async () => {
|
|
18696
|
+
if (!mounted) return;
|
|
18697
|
+
setIsLoading(true);
|
|
18698
|
+
const detected = await detectConnectedBrowserWallet(chainType);
|
|
18699
|
+
if (!mounted) return;
|
|
18700
|
+
setWallet(detected);
|
|
18701
|
+
setIsLoading(false);
|
|
18702
|
+
};
|
|
18703
|
+
detect();
|
|
18704
|
+
const onChange = () => detect();
|
|
18705
|
+
const onDisc = () => {
|
|
18706
|
+
onDisconnectRef.current?.();
|
|
18707
|
+
detect();
|
|
18708
|
+
};
|
|
18709
|
+
const onEthAccounts = (accounts) => {
|
|
18710
|
+
if (Array.isArray(accounts) && accounts.length === 0) onDisconnectRef.current?.();
|
|
18711
|
+
detect();
|
|
18712
|
+
};
|
|
18713
|
+
const win = typeof window !== "undefined" ? window : void 0;
|
|
18714
|
+
const solanaProvider = win?.phantom?.solana || win?.solana;
|
|
18715
|
+
if (solanaProvider) {
|
|
18716
|
+
solanaProvider.on("connect", onChange);
|
|
18717
|
+
solanaProvider.on("disconnect", onDisc);
|
|
18718
|
+
solanaProvider.on("accountChanged", onChange);
|
|
18719
|
+
}
|
|
18720
|
+
const ethProviders = [];
|
|
18721
|
+
for (const { provider } of getEip6963Providers()) {
|
|
18722
|
+
const p = provider;
|
|
18723
|
+
if (p && !ethProviders.includes(p)) ethProviders.push(p);
|
|
18724
|
+
}
|
|
18725
|
+
if (win?.ethereum && !ethProviders.includes(win.ethereum)) ethProviders.push(win.ethereum);
|
|
18726
|
+
if (win?.phantom?.ethereum && !ethProviders.includes(win.phantom.ethereum)) {
|
|
18727
|
+
ethProviders.push(win.phantom.ethereum);
|
|
18728
|
+
}
|
|
18729
|
+
for (const p of ethProviders) {
|
|
18730
|
+
p.on("accountsChanged", onEthAccounts);
|
|
18731
|
+
p.on("chainChanged", onChange);
|
|
18732
|
+
}
|
|
18733
|
+
return () => {
|
|
18734
|
+
mounted = false;
|
|
18735
|
+
if (solanaProvider) {
|
|
18736
|
+
solanaProvider.off?.("connect", onChange);
|
|
18737
|
+
solanaProvider.off?.("disconnect", onDisc);
|
|
18738
|
+
solanaProvider.off?.("accountChanged", onChange);
|
|
18739
|
+
}
|
|
18740
|
+
for (const p of ethProviders) {
|
|
18741
|
+
const off = p.off?.bind(p) ?? p.removeListener?.bind(p);
|
|
18742
|
+
if (off) {
|
|
18743
|
+
off("accountsChanged", onEthAccounts);
|
|
18744
|
+
off("chainChanged", onChange);
|
|
18745
|
+
}
|
|
18746
|
+
}
|
|
18747
|
+
};
|
|
18748
|
+
}, [chainType, eip6963ProviderCount, enabled]);
|
|
18749
|
+
return { wallet, isLoading, setWallet };
|
|
18750
|
+
}
|
|
18566
18751
|
var SOLANA_DISCONNECT_TYPES = [
|
|
18567
18752
|
"phantom-solana",
|
|
18568
18753
|
"solflare",
|
|
@@ -18650,7 +18835,7 @@ function MetamaskIcon({
|
|
|
18650
18835
|
className,
|
|
18651
18836
|
variant = "color"
|
|
18652
18837
|
}) {
|
|
18653
|
-
const id =
|
|
18838
|
+
const id = React132.useId();
|
|
18654
18839
|
if (variant === "light" || variant === "dark") {
|
|
18655
18840
|
return /* @__PURE__ */ jsxs20(
|
|
18656
18841
|
"svg",
|
|
@@ -18775,7 +18960,7 @@ function PhantomIcon({
|
|
|
18775
18960
|
className,
|
|
18776
18961
|
variant = "color"
|
|
18777
18962
|
}) {
|
|
18778
|
-
const id =
|
|
18963
|
+
const id = React142.useId();
|
|
18779
18964
|
if (variant === "light") {
|
|
18780
18965
|
return /* @__PURE__ */ jsx24(
|
|
18781
18966
|
"svg",
|
|
@@ -18846,7 +19031,7 @@ function CoinbaseIcon({
|
|
|
18846
19031
|
className,
|
|
18847
19032
|
variant = "color"
|
|
18848
19033
|
}) {
|
|
18849
|
-
const id =
|
|
19034
|
+
const id = React152.useId();
|
|
18850
19035
|
if (variant === "light") {
|
|
18851
19036
|
return /* @__PURE__ */ jsxs222(
|
|
18852
19037
|
"svg",
|
|
@@ -18930,7 +19115,7 @@ function RabbyIcon({
|
|
|
18930
19115
|
className,
|
|
18931
19116
|
variant = "color"
|
|
18932
19117
|
}) {
|
|
18933
|
-
const id =
|
|
19118
|
+
const id = React162.useId();
|
|
18934
19119
|
if (variant === "light") {
|
|
18935
19120
|
return /* @__PURE__ */ jsxs23(
|
|
18936
19121
|
"svg",
|
|
@@ -19281,7 +19466,7 @@ function RainbowIcon({
|
|
|
19281
19466
|
className,
|
|
19282
19467
|
variant = "color"
|
|
19283
19468
|
}) {
|
|
19284
|
-
const id =
|
|
19469
|
+
const id = React172.useId();
|
|
19285
19470
|
if (variant === "light") {
|
|
19286
19471
|
return /* @__PURE__ */ jsxs24(
|
|
19287
19472
|
"svg",
|
|
@@ -19747,7 +19932,7 @@ function TrustIcon({
|
|
|
19747
19932
|
className,
|
|
19748
19933
|
variant = "color"
|
|
19749
19934
|
}) {
|
|
19750
|
-
const id =
|
|
19935
|
+
const id = React182.useId();
|
|
19751
19936
|
if (variant === "light") {
|
|
19752
19937
|
return /* @__PURE__ */ jsx28(
|
|
19753
19938
|
"svg",
|
|
@@ -19840,7 +20025,7 @@ function OkxIcon({
|
|
|
19840
20025
|
className,
|
|
19841
20026
|
variant = "color"
|
|
19842
20027
|
}) {
|
|
19843
|
-
const id =
|
|
20028
|
+
const id = React192.useId();
|
|
19844
20029
|
if (variant === "light") {
|
|
19845
20030
|
return /* @__PURE__ */ jsx29(
|
|
19846
20031
|
"svg",
|
|
@@ -19911,7 +20096,7 @@ function GlowIcon({
|
|
|
19911
20096
|
className,
|
|
19912
20097
|
variant = "color"
|
|
19913
20098
|
}) {
|
|
19914
|
-
const id =
|
|
20099
|
+
const id = React202.useId();
|
|
19915
20100
|
if (variant === "light") {
|
|
19916
20101
|
return /* @__PURE__ */ jsx30(
|
|
19917
20102
|
"svg",
|
|
@@ -20016,7 +20201,7 @@ function BackpackIcon({
|
|
|
20016
20201
|
className,
|
|
20017
20202
|
variant = "color"
|
|
20018
20203
|
}) {
|
|
20019
|
-
const id =
|
|
20204
|
+
const id = React212.useId();
|
|
20020
20205
|
if (variant === "light") {
|
|
20021
20206
|
return /* @__PURE__ */ jsx31(
|
|
20022
20207
|
"svg",
|
|
@@ -20093,7 +20278,7 @@ function SolflareIcon({
|
|
|
20093
20278
|
className,
|
|
20094
20279
|
variant = "color"
|
|
20095
20280
|
}) {
|
|
20096
|
-
const id =
|
|
20281
|
+
const id = React222.useId();
|
|
20097
20282
|
if (variant === "light") {
|
|
20098
20283
|
return /* @__PURE__ */ jsx322(
|
|
20099
20284
|
"svg",
|
|
@@ -20164,7 +20349,7 @@ function EthereumIcon({
|
|
|
20164
20349
|
className,
|
|
20165
20350
|
variant = "color"
|
|
20166
20351
|
}) {
|
|
20167
|
-
const id =
|
|
20352
|
+
const id = React232.useId();
|
|
20168
20353
|
if (variant === "light") {
|
|
20169
20354
|
return /* @__PURE__ */ jsxs30(
|
|
20170
20355
|
"svg",
|
|
@@ -20298,7 +20483,7 @@ function SolanaIcon({
|
|
|
20298
20483
|
className,
|
|
20299
20484
|
variant = "color"
|
|
20300
20485
|
}) {
|
|
20301
|
-
const id =
|
|
20486
|
+
const id = React242.useId();
|
|
20302
20487
|
if (variant === "light") {
|
|
20303
20488
|
return /* @__PURE__ */ jsx34(
|
|
20304
20489
|
"svg",
|
|
@@ -20547,44 +20732,6 @@ function truncateAddress3(address) {
|
|
|
20547
20732
|
if (address.length <= 10) return address;
|
|
20548
20733
|
return `${address.slice(0, 4)}...${address.slice(-4)}`;
|
|
20549
20734
|
}
|
|
20550
|
-
function identifyEthWallet(provider, _win, hint) {
|
|
20551
|
-
switch (hint) {
|
|
20552
|
-
case "metamask":
|
|
20553
|
-
return { type: "metamask", name: "MetaMask", icon: "metamask" };
|
|
20554
|
-
case "phantom":
|
|
20555
|
-
return { type: "phantom-ethereum", name: "Phantom", icon: "phantom" };
|
|
20556
|
-
case "coinbase":
|
|
20557
|
-
return { type: "coinbase", name: "Coinbase Wallet", icon: "coinbase" };
|
|
20558
|
-
case "okx":
|
|
20559
|
-
return { type: "okx", name: "OKX Wallet", icon: "okx" };
|
|
20560
|
-
case "rabby":
|
|
20561
|
-
return { type: "rabby", name: "Rabby", icon: "rabby" };
|
|
20562
|
-
case "trust":
|
|
20563
|
-
return { type: "trust", name: "Trust Wallet", icon: "trust" };
|
|
20564
|
-
case "rainbow":
|
|
20565
|
-
return { type: "rainbow", name: "Rainbow", icon: "rainbow" };
|
|
20566
|
-
}
|
|
20567
|
-
const anyProvider = provider;
|
|
20568
|
-
if (provider.isPhantom) {
|
|
20569
|
-
return { type: "phantom-ethereum", name: "Phantom", icon: "phantom" };
|
|
20570
|
-
}
|
|
20571
|
-
if (anyProvider.isCoinbaseWallet) {
|
|
20572
|
-
return { type: "coinbase", name: "Coinbase Wallet", icon: "coinbase" };
|
|
20573
|
-
}
|
|
20574
|
-
if (anyProvider.isRabby) {
|
|
20575
|
-
return { type: "rabby", name: "Rabby", icon: "rabby" };
|
|
20576
|
-
}
|
|
20577
|
-
if (anyProvider.isTrust) {
|
|
20578
|
-
return { type: "trust", name: "Trust Wallet", icon: "trust" };
|
|
20579
|
-
}
|
|
20580
|
-
if (anyProvider.isRainbow) {
|
|
20581
|
-
return { type: "rainbow", name: "Rainbow", icon: "rainbow" };
|
|
20582
|
-
}
|
|
20583
|
-
if (provider.isMetaMask && !provider.isPhantom) {
|
|
20584
|
-
return { type: "metamask", name: "MetaMask", icon: "metamask" };
|
|
20585
|
-
}
|
|
20586
|
-
return { type: "metamask", name: "Wallet", icon: "metamask" };
|
|
20587
|
-
}
|
|
20588
20735
|
function BrowserWalletButton({
|
|
20589
20736
|
onClick,
|
|
20590
20737
|
onConnectClick,
|
|
@@ -20595,30 +20742,19 @@ function BrowserWalletButton({
|
|
|
20595
20742
|
subtitle = i18n2.depositModal.browserWallet.subtitle
|
|
20596
20743
|
}) {
|
|
20597
20744
|
const { colors: colors2, fonts, components } = useTheme();
|
|
20598
|
-
const [isHovered, setIsHovered] =
|
|
20599
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
20600
|
-
const
|
|
20601
|
-
const [
|
|
20602
|
-
const [
|
|
20603
|
-
const [
|
|
20604
|
-
const [
|
|
20605
|
-
const
|
|
20606
|
-
const onDisconnectRef = React242.useRef(onDisconnect);
|
|
20745
|
+
const [isHovered, setIsHovered] = React252.useState(false);
|
|
20746
|
+
const [isTouchDevice, setIsTouchDevice] = React252.useState(false);
|
|
20747
|
+
const { wallet, isLoading, setWallet } = useDetectedBrowserWallet({ chainType, onDisconnect });
|
|
20748
|
+
const [isConnecting, setIsConnecting] = React252.useState(false);
|
|
20749
|
+
const [balanceText, setBalanceText] = React252.useState(null);
|
|
20750
|
+
const [isLoadingBalance, setIsLoadingBalance] = React252.useState(false);
|
|
20751
|
+
const [isDisconnecting, setIsDisconnecting] = React252.useState(false);
|
|
20752
|
+
const onDisconnectRef = React252.useRef(onDisconnect);
|
|
20607
20753
|
onDisconnectRef.current = onDisconnect;
|
|
20608
|
-
|
|
20754
|
+
React252.useEffect(() => {
|
|
20609
20755
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
20610
20756
|
}, []);
|
|
20611
|
-
|
|
20612
|
-
React242.useEffect(() => {
|
|
20613
|
-
const store = getEip6963Store();
|
|
20614
|
-
if (!store) return;
|
|
20615
|
-
setEip6963ProviderCount(store.getProviders().length);
|
|
20616
|
-
const unsubscribe = store.subscribe((providers) => {
|
|
20617
|
-
setEip6963ProviderCount(providers.length);
|
|
20618
|
-
});
|
|
20619
|
-
return unsubscribe;
|
|
20620
|
-
}, []);
|
|
20621
|
-
React242.useEffect(() => {
|
|
20757
|
+
React252.useEffect(() => {
|
|
20622
20758
|
if (!wallet || !publishableKey) {
|
|
20623
20759
|
setBalanceText(null);
|
|
20624
20760
|
return;
|
|
@@ -20659,206 +20795,6 @@ function BrowserWalletButton({
|
|
|
20659
20795
|
cancelled = true;
|
|
20660
20796
|
};
|
|
20661
20797
|
}, [wallet, publishableKey]);
|
|
20662
|
-
React242.useEffect(() => {
|
|
20663
|
-
let mounted = true;
|
|
20664
|
-
const detectWallet = async () => {
|
|
20665
|
-
if (!mounted) return;
|
|
20666
|
-
setIsLoading(true);
|
|
20667
|
-
try {
|
|
20668
|
-
const win = typeof window !== "undefined" ? window : null;
|
|
20669
|
-
if (!win) return;
|
|
20670
|
-
if (getUserDisconnectedWallet()) {
|
|
20671
|
-
if (mounted) {
|
|
20672
|
-
setWallet(null);
|
|
20673
|
-
setIsLoading(false);
|
|
20674
|
-
}
|
|
20675
|
-
return;
|
|
20676
|
-
}
|
|
20677
|
-
if (!chainType || chainType === "solana") {
|
|
20678
|
-
const anyWin = win;
|
|
20679
|
-
const trySilentSolana = async (provider, type, name, icon) => {
|
|
20680
|
-
if (!provider) return false;
|
|
20681
|
-
if (provider.isConnected && provider.publicKey) {
|
|
20682
|
-
if (mounted) {
|
|
20683
|
-
setWallet({
|
|
20684
|
-
type,
|
|
20685
|
-
name,
|
|
20686
|
-
address: provider.publicKey.toString(),
|
|
20687
|
-
icon
|
|
20688
|
-
});
|
|
20689
|
-
setIsLoading(false);
|
|
20690
|
-
}
|
|
20691
|
-
return true;
|
|
20692
|
-
}
|
|
20693
|
-
try {
|
|
20694
|
-
const resp = await provider.connect({ onlyIfTrusted: true });
|
|
20695
|
-
if (mounted && resp.publicKey) {
|
|
20696
|
-
setWallet({
|
|
20697
|
-
type,
|
|
20698
|
-
name,
|
|
20699
|
-
address: resp.publicKey.toString(),
|
|
20700
|
-
icon
|
|
20701
|
-
});
|
|
20702
|
-
setIsLoading(false);
|
|
20703
|
-
return true;
|
|
20704
|
-
}
|
|
20705
|
-
} catch {
|
|
20706
|
-
}
|
|
20707
|
-
return false;
|
|
20708
|
-
};
|
|
20709
|
-
if (await trySilentSolana(
|
|
20710
|
-
win.phantom?.solana,
|
|
20711
|
-
"phantom-solana",
|
|
20712
|
-
"Phantom",
|
|
20713
|
-
"phantom"
|
|
20714
|
-
))
|
|
20715
|
-
return;
|
|
20716
|
-
if (await trySilentSolana(
|
|
20717
|
-
anyWin.solflare,
|
|
20718
|
-
"solflare",
|
|
20719
|
-
"Solflare",
|
|
20720
|
-
"solflare"
|
|
20721
|
-
))
|
|
20722
|
-
return;
|
|
20723
|
-
if (await trySilentSolana(
|
|
20724
|
-
anyWin.backpack,
|
|
20725
|
-
"backpack",
|
|
20726
|
-
"Backpack",
|
|
20727
|
-
"backpack"
|
|
20728
|
-
))
|
|
20729
|
-
return;
|
|
20730
|
-
if (await trySilentSolana(
|
|
20731
|
-
anyWin.glow,
|
|
20732
|
-
"glow",
|
|
20733
|
-
"Glow",
|
|
20734
|
-
"glow"
|
|
20735
|
-
))
|
|
20736
|
-
return;
|
|
20737
|
-
}
|
|
20738
|
-
if (!chainType || chainType === "ethereum") {
|
|
20739
|
-
const anyWin = win;
|
|
20740
|
-
const allProviders = [];
|
|
20741
|
-
const eip6963 = getEip6963Providers();
|
|
20742
|
-
for (const { provider, walletId } of eip6963) {
|
|
20743
|
-
allProviders.push({
|
|
20744
|
-
provider,
|
|
20745
|
-
walletId: walletId === "unknown" ? "default" : walletId
|
|
20746
|
-
});
|
|
20747
|
-
}
|
|
20748
|
-
if (allProviders.length === 0) {
|
|
20749
|
-
if (win.phantom?.ethereum) {
|
|
20750
|
-
allProviders.push({
|
|
20751
|
-
provider: win.phantom.ethereum,
|
|
20752
|
-
walletId: "phantom"
|
|
20753
|
-
});
|
|
20754
|
-
}
|
|
20755
|
-
if (anyWin.okxwallet) {
|
|
20756
|
-
allProviders.push({
|
|
20757
|
-
provider: anyWin.okxwallet,
|
|
20758
|
-
walletId: "okx"
|
|
20759
|
-
});
|
|
20760
|
-
}
|
|
20761
|
-
if (anyWin.coinbaseWalletExtension) {
|
|
20762
|
-
allProviders.push({
|
|
20763
|
-
provider: anyWin.coinbaseWalletExtension,
|
|
20764
|
-
walletId: "coinbase"
|
|
20765
|
-
});
|
|
20766
|
-
}
|
|
20767
|
-
if (win.ethereum) {
|
|
20768
|
-
const isDuplicate = allProviders.some(
|
|
20769
|
-
(p) => p.provider === win.ethereum
|
|
20770
|
-
);
|
|
20771
|
-
if (!isDuplicate) {
|
|
20772
|
-
allProviders.push({
|
|
20773
|
-
provider: win.ethereum,
|
|
20774
|
-
walletId: "default"
|
|
20775
|
-
});
|
|
20776
|
-
}
|
|
20777
|
-
}
|
|
20778
|
-
}
|
|
20779
|
-
for (const { provider, walletId } of allProviders) {
|
|
20780
|
-
if (!provider) continue;
|
|
20781
|
-
try {
|
|
20782
|
-
const accounts = await provider.request({
|
|
20783
|
-
method: "eth_accounts"
|
|
20784
|
-
});
|
|
20785
|
-
if (!accounts || accounts.length === 0) continue;
|
|
20786
|
-
const address = accounts[0];
|
|
20787
|
-
const resolved = identifyEthWallet(provider, anyWin, walletId);
|
|
20788
|
-
if (mounted) {
|
|
20789
|
-
setWallet({ ...resolved, address });
|
|
20790
|
-
setIsLoading(false);
|
|
20791
|
-
}
|
|
20792
|
-
return;
|
|
20793
|
-
} catch {
|
|
20794
|
-
}
|
|
20795
|
-
}
|
|
20796
|
-
}
|
|
20797
|
-
if (mounted) {
|
|
20798
|
-
setWallet(null);
|
|
20799
|
-
setIsLoading(false);
|
|
20800
|
-
}
|
|
20801
|
-
} catch (error) {
|
|
20802
|
-
console.error("[BrowserWalletButton] Error detecting wallet:", error);
|
|
20803
|
-
if (mounted) {
|
|
20804
|
-
setWallet(null);
|
|
20805
|
-
setIsLoading(false);
|
|
20806
|
-
}
|
|
20807
|
-
}
|
|
20808
|
-
};
|
|
20809
|
-
detectWallet();
|
|
20810
|
-
const handleAccountsChanged = () => {
|
|
20811
|
-
detectWallet();
|
|
20812
|
-
};
|
|
20813
|
-
const handleDisconnect = () => {
|
|
20814
|
-
onDisconnectRef.current?.();
|
|
20815
|
-
detectWallet();
|
|
20816
|
-
};
|
|
20817
|
-
const handleEthAccountsChanged = (accounts) => {
|
|
20818
|
-
if (Array.isArray(accounts) && accounts.length === 0) {
|
|
20819
|
-
onDisconnectRef.current?.();
|
|
20820
|
-
}
|
|
20821
|
-
detectWallet();
|
|
20822
|
-
};
|
|
20823
|
-
const solanaProvider = window.phantom?.solana || window.solana;
|
|
20824
|
-
if (solanaProvider) {
|
|
20825
|
-
solanaProvider.on("connect", handleAccountsChanged);
|
|
20826
|
-
solanaProvider.on("disconnect", handleDisconnect);
|
|
20827
|
-
solanaProvider.on("accountChanged", handleAccountsChanged);
|
|
20828
|
-
}
|
|
20829
|
-
const ethProviders = [];
|
|
20830
|
-
for (const { provider } of getEip6963Providers()) {
|
|
20831
|
-
const p = provider;
|
|
20832
|
-
if (p && !ethProviders.includes(p)) {
|
|
20833
|
-
ethProviders.push(p);
|
|
20834
|
-
}
|
|
20835
|
-
}
|
|
20836
|
-
if (window.ethereum && !ethProviders.includes(window.ethereum)) {
|
|
20837
|
-
ethProviders.push(window.ethereum);
|
|
20838
|
-
}
|
|
20839
|
-
if (window.phantom?.ethereum && !ethProviders.includes(window.phantom.ethereum)) {
|
|
20840
|
-
ethProviders.push(window.phantom.ethereum);
|
|
20841
|
-
}
|
|
20842
|
-
for (const provider of ethProviders) {
|
|
20843
|
-
provider.on("accountsChanged", handleEthAccountsChanged);
|
|
20844
|
-
provider.on("chainChanged", handleAccountsChanged);
|
|
20845
|
-
}
|
|
20846
|
-
return () => {
|
|
20847
|
-
mounted = false;
|
|
20848
|
-
if (solanaProvider) {
|
|
20849
|
-
solanaProvider.off("connect", handleAccountsChanged);
|
|
20850
|
-
solanaProvider.off("disconnect", handleDisconnect);
|
|
20851
|
-
solanaProvider.off("accountChanged", handleAccountsChanged);
|
|
20852
|
-
}
|
|
20853
|
-
for (const provider of ethProviders) {
|
|
20854
|
-
const off = provider.off?.bind(provider) ?? provider.removeListener?.bind(provider);
|
|
20855
|
-
if (off) {
|
|
20856
|
-
off("accountsChanged", handleEthAccountsChanged);
|
|
20857
|
-
off("chainChanged", handleAccountsChanged);
|
|
20858
|
-
}
|
|
20859
|
-
}
|
|
20860
|
-
};
|
|
20861
|
-
}, [chainType, eip6963ProviderCount]);
|
|
20862
20798
|
const handleConnect = async () => {
|
|
20863
20799
|
if (wallet) {
|
|
20864
20800
|
onClick(wallet);
|
|
@@ -20942,7 +20878,7 @@ function BrowserWalletButton({
|
|
|
20942
20878
|
border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
|
|
20943
20879
|
};
|
|
20944
20880
|
const sortedWallets = featuredWallets ? [...featuredWallets].sort((a, b) => a.position - b.position) : [];
|
|
20945
|
-
const walletIconBlock = wallet ? WALLET_ICON_COMPONENTS[wallet.icon] ?
|
|
20881
|
+
const walletIconBlock = wallet ? WALLET_ICON_COMPONENTS[wallet.icon] ? React252.createElement(WALLET_ICON_COMPONENTS[wallet.icon], {
|
|
20946
20882
|
size: 36,
|
|
20947
20883
|
className: "uf-rounded-lg",
|
|
20948
20884
|
variant: "color"
|
|
@@ -21204,6 +21140,7 @@ function CoinbaseConnect({
|
|
|
21204
21140
|
onBack: parentOnBack,
|
|
21205
21141
|
onDisconnect,
|
|
21206
21142
|
skipToHoldings,
|
|
21143
|
+
canGoBack = true,
|
|
21207
21144
|
onExecutionsChange
|
|
21208
21145
|
}) {
|
|
21209
21146
|
const { colors: colors2, fonts, components } = useTheme();
|
|
@@ -21229,25 +21166,25 @@ function CoinbaseConnect({
|
|
|
21229
21166
|
const appName = projectConfig?.project_name ?? "Unifold";
|
|
21230
21167
|
const t12 = i18n2.connectExchange;
|
|
21231
21168
|
const initialView = skipToHoldings && getStoredIntegrationToken(IntegrationProvider.COINBASE) ? "holdings" : "select_exchange";
|
|
21232
|
-
const [view, setView] =
|
|
21233
|
-
const [prevView, setPrevView] =
|
|
21234
|
-
const [isTransitioning, setIsTransitioning] =
|
|
21235
|
-
const [exchanges, setExchanges] =
|
|
21236
|
-
const [exchangesLoading, setExchangesLoading] =
|
|
21237
|
-
const [selectedExchange, setSelectedExchange] =
|
|
21238
|
-
const [accessToken, setAccessToken] =
|
|
21239
|
-
const [holdings, setHoldings] =
|
|
21240
|
-
const [selectedHolding, setSelectedHolding] =
|
|
21241
|
-
const [selectedAsset, setSelectedAsset] =
|
|
21242
|
-
const [sendAmount, setSendAmount] =
|
|
21243
|
-
const [transferIntent, setTransferIntent] =
|
|
21244
|
-
const [mfaCode, setMfaCode] =
|
|
21245
|
-
const [mfaError, setMfaError] =
|
|
21246
|
-
const [errorMessage, setErrorMessage] =
|
|
21247
|
-
const [isLoading, setIsLoading] =
|
|
21248
|
-
const [confirmResult, setConfirmResult] =
|
|
21249
|
-
const [showTransferDetails, setShowTransferDetails] =
|
|
21250
|
-
const [transferDepositWalletId, setTransferDepositWalletId] =
|
|
21169
|
+
const [view, setView] = useState222(initialView);
|
|
21170
|
+
const [prevView, setPrevView] = useState222(initialView);
|
|
21171
|
+
const [isTransitioning, setIsTransitioning] = useState222(false);
|
|
21172
|
+
const [exchanges, setExchanges] = useState222([]);
|
|
21173
|
+
const [exchangesLoading, setExchangesLoading] = useState222(true);
|
|
21174
|
+
const [selectedExchange, setSelectedExchange] = useState222(null);
|
|
21175
|
+
const [accessToken, setAccessToken] = useState222(null);
|
|
21176
|
+
const [holdings, setHoldings] = useState222([]);
|
|
21177
|
+
const [selectedHolding, setSelectedHolding] = useState222(null);
|
|
21178
|
+
const [selectedAsset, setSelectedAsset] = useState222(null);
|
|
21179
|
+
const [sendAmount, setSendAmount] = useState222("");
|
|
21180
|
+
const [transferIntent, setTransferIntent] = useState222(null);
|
|
21181
|
+
const [mfaCode, setMfaCode] = useState222("");
|
|
21182
|
+
const [mfaError, setMfaError] = useState222(false);
|
|
21183
|
+
const [errorMessage, setErrorMessage] = useState222("");
|
|
21184
|
+
const [isLoading, setIsLoading] = useState222(initialView === "holdings");
|
|
21185
|
+
const [confirmResult, setConfirmResult] = useState222(null);
|
|
21186
|
+
const [showTransferDetails, setShowTransferDetails] = useState222(false);
|
|
21187
|
+
const [transferDepositWalletId, setTransferDepositWalletId] = useState222(void 0);
|
|
21251
21188
|
const exchangeSupportedCurrencies = useMemo42(() => {
|
|
21252
21189
|
const set = /* @__PURE__ */ new Set();
|
|
21253
21190
|
selectedExchange?.supported_currencies.forEach((c) => set.add(c.toLowerCase()));
|
|
@@ -21302,12 +21239,12 @@ function CoinbaseConnect({
|
|
|
21302
21239
|
} : void 0,
|
|
21303
21240
|
onDepositError: onTransferError
|
|
21304
21241
|
});
|
|
21305
|
-
|
|
21242
|
+
useEffect172(() => {
|
|
21306
21243
|
onExecutionsChange?.(depositExecutions);
|
|
21307
21244
|
}, [depositExecutions, onExecutionsChange]);
|
|
21308
|
-
const pollRef =
|
|
21309
|
-
const popupRef =
|
|
21310
|
-
const viewRef =
|
|
21245
|
+
const pollRef = useRef62(null);
|
|
21246
|
+
const popupRef = useRef62(null);
|
|
21247
|
+
const viewRef = useRef62(initialView);
|
|
21311
21248
|
const transitionTo = useCallback22((nextView) => {
|
|
21312
21249
|
if (nextView === viewRef.current) return;
|
|
21313
21250
|
setIsTransitioning(true);
|
|
@@ -21337,7 +21274,7 @@ function CoinbaseConnect({
|
|
|
21337
21274
|
},
|
|
21338
21275
|
[publishableKey]
|
|
21339
21276
|
);
|
|
21340
|
-
|
|
21277
|
+
useEffect172(() => {
|
|
21341
21278
|
getIntegrationExchanges(publishableKey).then((res) => {
|
|
21342
21279
|
setExchanges(res.data);
|
|
21343
21280
|
if (!selectedExchange) {
|
|
@@ -21395,7 +21332,7 @@ function CoinbaseConnect({
|
|
|
21395
21332
|
},
|
|
21396
21333
|
[publishableKey, transitionTo, tryRefreshToken]
|
|
21397
21334
|
);
|
|
21398
|
-
|
|
21335
|
+
useEffect172(() => {
|
|
21399
21336
|
return () => {
|
|
21400
21337
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
21401
21338
|
};
|
|
@@ -21591,6 +21528,16 @@ function CoinbaseConnect({
|
|
|
21591
21528
|
setIsLoading(false);
|
|
21592
21529
|
}
|
|
21593
21530
|
};
|
|
21531
|
+
const handleDisconnect = () => {
|
|
21532
|
+
onDisconnect?.();
|
|
21533
|
+
if (!canGoBack) {
|
|
21534
|
+
setAccessToken(null);
|
|
21535
|
+
setHoldings([]);
|
|
21536
|
+
setSelectedHolding(null);
|
|
21537
|
+
setSelectedAsset(null);
|
|
21538
|
+
transitionTo("select_exchange");
|
|
21539
|
+
}
|
|
21540
|
+
};
|
|
21594
21541
|
const handleBack = () => {
|
|
21595
21542
|
switch (view) {
|
|
21596
21543
|
case "select_exchange":
|
|
@@ -21651,7 +21598,7 @@ function CoinbaseConnect({
|
|
|
21651
21598
|
DepositHeader,
|
|
21652
21599
|
{
|
|
21653
21600
|
title: t12.title,
|
|
21654
|
-
showBack:
|
|
21601
|
+
showBack: canGoBack,
|
|
21655
21602
|
onBack: handleBack,
|
|
21656
21603
|
onClose
|
|
21657
21604
|
}
|
|
@@ -21664,7 +21611,7 @@ function CoinbaseConnect({
|
|
|
21664
21611
|
DepositHeader,
|
|
21665
21612
|
{
|
|
21666
21613
|
title: t12.title,
|
|
21667
|
-
showBack:
|
|
21614
|
+
showBack: canGoBack,
|
|
21668
21615
|
onBack: handleBack,
|
|
21669
21616
|
onClose
|
|
21670
21617
|
}
|
|
@@ -22376,7 +22323,7 @@ function CoinbaseConnect({
|
|
|
22376
22323
|
borderRadius: components.button.borderRadius,
|
|
22377
22324
|
fontFamily: fonts.medium
|
|
22378
22325
|
},
|
|
22379
|
-
onClick:
|
|
22326
|
+
onClick: handleDisconnect,
|
|
22380
22327
|
children: t12.disconnect
|
|
22381
22328
|
}
|
|
22382
22329
|
)
|
|
@@ -23163,7 +23110,7 @@ function ThemeStyleInjector({
|
|
|
23163
23110
|
className
|
|
23164
23111
|
}) {
|
|
23165
23112
|
const { colors: colors2, fonts, mode } = useTheme();
|
|
23166
|
-
const cssVars =
|
|
23113
|
+
const cssVars = React272.useMemo(() => {
|
|
23167
23114
|
const hexToHSL = (hex) => {
|
|
23168
23115
|
hex = hex.replace("#", "");
|
|
23169
23116
|
const r2 = parseInt(hex.slice(0, 2), 16) / 255;
|
|
@@ -23223,7 +23170,7 @@ function ThemeStyleInjector({
|
|
|
23223
23170
|
...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
|
|
23224
23171
|
};
|
|
23225
23172
|
}, [colors2, fonts.regular]);
|
|
23226
|
-
|
|
23173
|
+
React272.useEffect(() => {
|
|
23227
23174
|
if (typeof document === "undefined") return;
|
|
23228
23175
|
if (fonts.regular) {
|
|
23229
23176
|
document.documentElement.style.setProperty(
|
|
@@ -23305,9 +23252,9 @@ function DepositsModal({
|
|
|
23305
23252
|
themeClass = ""
|
|
23306
23253
|
}) {
|
|
23307
23254
|
const { colors: colors2, fonts, components } = useTheme();
|
|
23308
|
-
const [allExecutions, setAllExecutions] =
|
|
23309
|
-
const [selectedExecution, setSelectedExecution] =
|
|
23310
|
-
|
|
23255
|
+
const [allExecutions, setAllExecutions] = useState232(sessionExecutions);
|
|
23256
|
+
const [selectedExecution, setSelectedExecution] = useState232(null);
|
|
23257
|
+
useEffect192(() => {
|
|
23311
23258
|
if (!open || !userId) return;
|
|
23312
23259
|
const fetchExecutions = async () => {
|
|
23313
23260
|
try {
|
|
@@ -23329,7 +23276,7 @@ function DepositsModal({
|
|
|
23329
23276
|
clearInterval(pollInterval);
|
|
23330
23277
|
};
|
|
23331
23278
|
}, [open, userId, publishableKey, sessionExecutions]);
|
|
23332
|
-
|
|
23279
|
+
useEffect192(() => {
|
|
23333
23280
|
if (!open) {
|
|
23334
23281
|
setSelectedExecution(null);
|
|
23335
23282
|
}
|
|
@@ -23460,10 +23407,10 @@ function TokenSelectorSheet({
|
|
|
23460
23407
|
}) {
|
|
23461
23408
|
const { themeClass, colors: colors2, fonts, components } = useTheme();
|
|
23462
23409
|
const isDarkMode = themeClass.includes("uf-dark");
|
|
23463
|
-
const [searchQuery, setSearchQuery] =
|
|
23464
|
-
const [recentTokens, setRecentTokens] =
|
|
23465
|
-
const [hoveredTokenKey, setHoveredTokenKey] =
|
|
23466
|
-
|
|
23410
|
+
const [searchQuery, setSearchQuery] = useState242("");
|
|
23411
|
+
const [recentTokens, setRecentTokens] = useState242([]);
|
|
23412
|
+
const [hoveredTokenKey, setHoveredTokenKey] = useState242(null);
|
|
23413
|
+
useEffect202(() => {
|
|
23467
23414
|
setRecentTokens(getRecentTokens());
|
|
23468
23415
|
}, []);
|
|
23469
23416
|
const allOptions = useMemo62(() => {
|
|
@@ -23947,11 +23894,11 @@ function useDefaultToken({
|
|
|
23947
23894
|
defaultTokenAddress,
|
|
23948
23895
|
defaultSymbol
|
|
23949
23896
|
}) {
|
|
23950
|
-
const [token, setToken] =
|
|
23951
|
-
const [chain, setChain] =
|
|
23952
|
-
const [initialSelectionDone, setInitialSelectionDone] =
|
|
23953
|
-
const appliedDefaultsRef =
|
|
23954
|
-
|
|
23897
|
+
const [token, setToken] = useState252(null);
|
|
23898
|
+
const [chain, setChain] = useState252(null);
|
|
23899
|
+
const [initialSelectionDone, setInitialSelectionDone] = useState252(false);
|
|
23900
|
+
const appliedDefaultsRef = useRef72("");
|
|
23901
|
+
useEffect212(() => {
|
|
23955
23902
|
if (!tokens.length) return;
|
|
23956
23903
|
const defaultsKey = `${defaultTokenAddress ?? ""}|${defaultSymbol ?? ""}|${defaultChainType ?? ""}|${defaultChainId ?? ""}`;
|
|
23957
23904
|
const defaultsChanged = appliedDefaultsRef.current !== defaultsKey;
|
|
@@ -23977,7 +23924,7 @@ function useDefaultToken({
|
|
|
23977
23924
|
defaultChainId,
|
|
23978
23925
|
initialSelectionDone
|
|
23979
23926
|
]);
|
|
23980
|
-
|
|
23927
|
+
useEffect212(() => {
|
|
23981
23928
|
if (!tokens.length || !token) return;
|
|
23982
23929
|
const currentToken = tokens.find((t12) => t12.symbol === token);
|
|
23983
23930
|
if (!currentToken || currentToken.chains.length === 0) return;
|
|
@@ -24172,7 +24119,7 @@ function GlossaryModal({
|
|
|
24172
24119
|
) });
|
|
24173
24120
|
}
|
|
24174
24121
|
function useCopyAddress() {
|
|
24175
|
-
const [copied, setCopied] =
|
|
24122
|
+
const [copied, setCopied] = useState262(false);
|
|
24176
24123
|
const handleCopy = (address) => {
|
|
24177
24124
|
if (!address) return;
|
|
24178
24125
|
navigator.clipboard.writeText(address);
|
|
@@ -24182,14 +24129,14 @@ function useCopyAddress() {
|
|
|
24182
24129
|
return { copied, handleCopy };
|
|
24183
24130
|
}
|
|
24184
24131
|
var TooltipProvider2 = Provider;
|
|
24185
|
-
var TooltipContext =
|
|
24132
|
+
var TooltipContext = React282.createContext({
|
|
24186
24133
|
open: false,
|
|
24187
24134
|
onOpenChange: () => {
|
|
24188
24135
|
}
|
|
24189
24136
|
});
|
|
24190
|
-
var TooltipTrigger2 =
|
|
24191
|
-
const { open, onOpenChange } =
|
|
24192
|
-
const handleClick =
|
|
24137
|
+
var TooltipTrigger2 = React282.forwardRef(({ onClick, ...props }, ref) => {
|
|
24138
|
+
const { open, onOpenChange } = React282.useContext(TooltipContext);
|
|
24139
|
+
const handleClick = React282.useCallback(
|
|
24193
24140
|
(e) => {
|
|
24194
24141
|
onOpenChange(!open);
|
|
24195
24142
|
onClick?.(e);
|
|
@@ -24199,7 +24146,7 @@ var TooltipTrigger2 = React272.forwardRef(({ onClick, ...props }, ref) => {
|
|
|
24199
24146
|
return /* @__PURE__ */ jsx44(Trigger, { ref, onClick: handleClick, ...props });
|
|
24200
24147
|
});
|
|
24201
24148
|
TooltipTrigger2.displayName = Trigger.displayName;
|
|
24202
|
-
var TooltipContent2 =
|
|
24149
|
+
var TooltipContent2 = React282.forwardRef(({ className, sideOffset = 4, ...props }, ref) => {
|
|
24203
24150
|
const { themeClass, colors: colors2 } = useTheme();
|
|
24204
24151
|
return /* @__PURE__ */ jsx44(Portal3, { children: /* @__PURE__ */ jsx44(
|
|
24205
24152
|
Content22,
|
|
@@ -24322,12 +24269,12 @@ function TransferCryptoSingleInput({
|
|
|
24322
24269
|
}) {
|
|
24323
24270
|
const { themeClass, colors: colors2, fonts, components } = useTheme();
|
|
24324
24271
|
const isDarkMode = themeClass.includes("uf-dark");
|
|
24325
|
-
const [copied, setCopied] =
|
|
24272
|
+
const [copied, setCopied] = useState28(false);
|
|
24326
24273
|
const { copied: copiedRecipient, handleCopy: handleCopyRecipientAddress } = useCopyAddress();
|
|
24327
|
-
const [glossaryOpen, setGlossaryOpen] =
|
|
24328
|
-
const [detailsExpanded, setDetailsExpanded] =
|
|
24329
|
-
const [depositsModalOpen, setDepositsModalOpen] =
|
|
24330
|
-
const [tokenSelectorOpen, setTokenSelectorOpen] =
|
|
24274
|
+
const [glossaryOpen, setGlossaryOpen] = useState28(false);
|
|
24275
|
+
const [detailsExpanded, setDetailsExpanded] = useState28(false);
|
|
24276
|
+
const [depositsModalOpen, setDepositsModalOpen] = useState28(false);
|
|
24277
|
+
const [tokenSelectorOpen, setTokenSelectorOpen] = useState28(false);
|
|
24331
24278
|
const { data: tokensResponse, isLoading: tokensLoading } = useSupportedDepositTokens(publishableKey, {
|
|
24332
24279
|
destination_token_address: destinationTokenAddress,
|
|
24333
24280
|
destination_chain_id: destinationChainId,
|
|
@@ -24400,7 +24347,7 @@ function TransferCryptoSingleInput({
|
|
|
24400
24347
|
publishableKey,
|
|
24401
24348
|
enabled: !!depositAddress && !!recipientAddress
|
|
24402
24349
|
});
|
|
24403
|
-
|
|
24350
|
+
useEffect222(() => {
|
|
24404
24351
|
if (!onSourceTokenChange || !token || !chain || !initialSelectionDone) return;
|
|
24405
24352
|
const { chainType, chainId } = parseChainKey(chain);
|
|
24406
24353
|
const matchedToken = supportedTokens.find((t12) => t12.symbol === token);
|
|
@@ -24417,7 +24364,7 @@ function TransferCryptoSingleInput({
|
|
|
24417
24364
|
isStablecoin: matchedToken?.is_stablecoin ?? false
|
|
24418
24365
|
});
|
|
24419
24366
|
}, [token, chain, initialSelectionDone, onSourceTokenChange, supportedTokens]);
|
|
24420
|
-
|
|
24367
|
+
useEffect222(() => {
|
|
24421
24368
|
if (onExecutionsChange) {
|
|
24422
24369
|
onExecutionsChange(depositExecutions);
|
|
24423
24370
|
}
|
|
@@ -24804,7 +24751,7 @@ function TransferCryptoSingleInput({
|
|
|
24804
24751
|
}
|
|
24805
24752
|
var Select2 = Root23;
|
|
24806
24753
|
var SelectValue2 = Value;
|
|
24807
|
-
var SelectTrigger2 =
|
|
24754
|
+
var SelectTrigger2 = React292.forwardRef(({ className, style, children, ...props }, ref) => {
|
|
24808
24755
|
const { components } = useTheme();
|
|
24809
24756
|
return /* @__PURE__ */ jsxs422(
|
|
24810
24757
|
Trigger2,
|
|
@@ -24828,7 +24775,7 @@ var SelectTrigger2 = React282.forwardRef(({ className, style, children, ...props
|
|
|
24828
24775
|
);
|
|
24829
24776
|
});
|
|
24830
24777
|
SelectTrigger2.displayName = Trigger2.displayName;
|
|
24831
|
-
var SelectScrollUpButton2 =
|
|
24778
|
+
var SelectScrollUpButton2 = React292.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
|
|
24832
24779
|
ScrollUpButton,
|
|
24833
24780
|
{
|
|
24834
24781
|
ref,
|
|
@@ -24841,7 +24788,7 @@ var SelectScrollUpButton2 = React282.forwardRef(({ className, ...props }, ref) =
|
|
|
24841
24788
|
}
|
|
24842
24789
|
));
|
|
24843
24790
|
SelectScrollUpButton2.displayName = ScrollUpButton.displayName;
|
|
24844
|
-
var SelectScrollDownButton2 =
|
|
24791
|
+
var SelectScrollDownButton2 = React292.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
|
|
24845
24792
|
ScrollDownButton,
|
|
24846
24793
|
{
|
|
24847
24794
|
ref,
|
|
@@ -24854,7 +24801,7 @@ var SelectScrollDownButton2 = React282.forwardRef(({ className, ...props }, ref)
|
|
|
24854
24801
|
}
|
|
24855
24802
|
));
|
|
24856
24803
|
SelectScrollDownButton2.displayName = ScrollDownButton.displayName;
|
|
24857
|
-
var SelectContent2 =
|
|
24804
|
+
var SelectContent2 = React292.forwardRef(({ className, style, children, position = "popper", ...props }, ref) => {
|
|
24858
24805
|
const { themeClass, colors: colors2, components } = useTheme();
|
|
24859
24806
|
return /* @__PURE__ */ jsx47(Portal4, { children: /* @__PURE__ */ jsxs422(
|
|
24860
24807
|
Content23,
|
|
@@ -24892,7 +24839,7 @@ var SelectContent2 = React282.forwardRef(({ className, style, children, position
|
|
|
24892
24839
|
) });
|
|
24893
24840
|
});
|
|
24894
24841
|
SelectContent2.displayName = Content23.displayName;
|
|
24895
|
-
var SelectLabel2 =
|
|
24842
|
+
var SelectLabel2 = React292.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
|
|
24896
24843
|
Label,
|
|
24897
24844
|
{
|
|
24898
24845
|
ref,
|
|
@@ -24904,7 +24851,7 @@ var SelectLabel2 = React282.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
24904
24851
|
}
|
|
24905
24852
|
));
|
|
24906
24853
|
SelectLabel2.displayName = Label.displayName;
|
|
24907
|
-
var SelectItem2 =
|
|
24854
|
+
var SelectItem2 = React292.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs422(
|
|
24908
24855
|
Item,
|
|
24909
24856
|
{
|
|
24910
24857
|
ref,
|
|
@@ -24920,7 +24867,7 @@ var SelectItem2 = React282.forwardRef(({ className, children, ...props }, ref) =
|
|
|
24920
24867
|
}
|
|
24921
24868
|
));
|
|
24922
24869
|
SelectItem2.displayName = Item.displayName;
|
|
24923
|
-
var SelectSeparator2 =
|
|
24870
|
+
var SelectSeparator2 = React292.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
|
|
24924
24871
|
Separator,
|
|
24925
24872
|
{
|
|
24926
24873
|
ref,
|
|
@@ -24956,11 +24903,11 @@ function TransferCryptoDoubleInput({
|
|
|
24956
24903
|
}) {
|
|
24957
24904
|
const { themeClass, colors: colors2, fonts, components } = useTheme();
|
|
24958
24905
|
const isDarkMode = themeClass.includes("uf-dark");
|
|
24959
|
-
const [copied, setCopied] =
|
|
24906
|
+
const [copied, setCopied] = useState29(false);
|
|
24960
24907
|
const { copied: copiedRecipient, handleCopy: handleCopyRecipientAddress } = useCopyAddress();
|
|
24961
|
-
const [glossaryOpen, setGlossaryOpen] =
|
|
24962
|
-
const [detailsExpanded, setDetailsExpanded] =
|
|
24963
|
-
const [depositsModalOpen, setDepositsModalOpen] =
|
|
24908
|
+
const [glossaryOpen, setGlossaryOpen] = useState29(false);
|
|
24909
|
+
const [detailsExpanded, setDetailsExpanded] = useState29(false);
|
|
24910
|
+
const [depositsModalOpen, setDepositsModalOpen] = useState29(false);
|
|
24964
24911
|
const { data: tokensResponse, isLoading: tokensLoading } = useSupportedDepositTokens(publishableKey, {
|
|
24965
24912
|
destination_token_address: destinationTokenAddress,
|
|
24966
24913
|
destination_chain_id: destinationChainId,
|
|
@@ -25031,7 +24978,7 @@ function TransferCryptoDoubleInput({
|
|
|
25031
24978
|
publishableKey,
|
|
25032
24979
|
enabled: !!depositAddress && !!recipientAddress
|
|
25033
24980
|
});
|
|
25034
|
-
|
|
24981
|
+
useEffect232(() => {
|
|
25035
24982
|
if (onExecutionsChange) {
|
|
25036
24983
|
onExecutionsChange(depositExecutions);
|
|
25037
24984
|
}
|
|
@@ -26305,13 +26252,13 @@ function ConfirmingView({
|
|
|
26305
26252
|
amountReceivedUsdAtSubmission
|
|
26306
26253
|
}) {
|
|
26307
26254
|
const { colors: colors2, fonts, components } = useTheme();
|
|
26308
|
-
const [fallbackSettled, setFallbackSettled] =
|
|
26255
|
+
const [fallbackSettled, setFallbackSettled] = useState302(false);
|
|
26309
26256
|
const hasExecution = executions.length > 0;
|
|
26310
26257
|
const isCheckoutMode = paymentIntentStatus != null;
|
|
26311
26258
|
const isPaymentComplete = paymentIntentStatus === "succeeded";
|
|
26312
26259
|
const amountChanged = amountReceivedUsdAtSubmission != null && amountReceivedUsd != null && amountReceivedUsd !== amountReceivedUsdAtSubmission;
|
|
26313
26260
|
const piSettled = !isCheckoutMode || isPaymentComplete || amountChanged || fallbackSettled;
|
|
26314
|
-
|
|
26261
|
+
useEffect242(() => {
|
|
26315
26262
|
if (!hasExecution || piSettled) return;
|
|
26316
26263
|
const timeout = setTimeout(() => setFallbackSettled(true), SETTLE_FALLBACK_MS);
|
|
26317
26264
|
return () => clearTimeout(timeout);
|
|
@@ -26584,22 +26531,27 @@ function WalletConnect({
|
|
|
26584
26531
|
productType,
|
|
26585
26532
|
onBack: parentOnBack,
|
|
26586
26533
|
onClose,
|
|
26534
|
+
canGoBack = true,
|
|
26535
|
+
depositWalletsLoading = false,
|
|
26587
26536
|
onExecutionsChange
|
|
26588
26537
|
}) {
|
|
26589
26538
|
const { colors: colors2, fonts, components } = useTheme();
|
|
26590
|
-
const walletProvidedAtMount =
|
|
26591
|
-
const [activeWalletInfo, setActiveWalletInfo] =
|
|
26592
|
-
const [activeDepositWallet, setActiveDepositWallet] =
|
|
26539
|
+
const walletProvidedAtMount = React302.useRef(!!initialWalletInfo && !!initialDepositWallet);
|
|
26540
|
+
const [activeWalletInfo, setActiveWalletInfo] = React302.useState(initialWalletInfo ?? null);
|
|
26541
|
+
const [activeDepositWallet, setActiveDepositWallet] = React302.useState(initialDepositWallet ?? null);
|
|
26593
26542
|
const initialView = initialWalletInfo && initialDepositWallet ? "select_token" : "select_wallet";
|
|
26594
|
-
const [view, setView] =
|
|
26595
|
-
const [isTransitioning, setIsTransitioning] =
|
|
26596
|
-
const viewRef =
|
|
26597
|
-
const
|
|
26598
|
-
const
|
|
26599
|
-
const [
|
|
26600
|
-
const [
|
|
26601
|
-
const [
|
|
26602
|
-
|
|
26543
|
+
const [view, setView] = React302.useState(initialView);
|
|
26544
|
+
const [isTransitioning, setIsTransitioning] = React302.useState(false);
|
|
26545
|
+
const viewRef = React302.useRef(initialView);
|
|
26546
|
+
const standalone = !canGoBack && !walletProvidedAtMount.current;
|
|
26547
|
+
const { wallet: detectedWallet, isLoading: detectingWallet } = useDetectedBrowserWallet({ enabled: standalone });
|
|
26548
|
+
const [autoResolved, setAutoResolved] = React302.useState(false);
|
|
26549
|
+
const [selectedWalletDef, setSelectedWalletDef] = React302.useState(null);
|
|
26550
|
+
const [connectingNetwork, setConnectingNetwork] = React302.useState(null);
|
|
26551
|
+
const [walletError, setWalletError] = React302.useState(null);
|
|
26552
|
+
const [isWalletConnecting, setIsWalletConnecting] = React302.useState(false);
|
|
26553
|
+
const [eip6963ProviderCount, setEip6963ProviderCount] = React302.useState(0);
|
|
26554
|
+
React302.useEffect(() => {
|
|
26603
26555
|
const store = getEip6963Store();
|
|
26604
26556
|
if (!store) return;
|
|
26605
26557
|
setEip6963ProviderCount(store.getProviders().length);
|
|
@@ -26607,20 +26559,44 @@ function WalletConnect({
|
|
|
26607
26559
|
setEip6963ProviderCount(providers.length);
|
|
26608
26560
|
});
|
|
26609
26561
|
}, []);
|
|
26610
|
-
const availableWallets =
|
|
26611
|
-
|
|
26612
|
-
|
|
26613
|
-
|
|
26614
|
-
|
|
26615
|
-
|
|
26616
|
-
|
|
26617
|
-
|
|
26618
|
-
|
|
26619
|
-
|
|
26620
|
-
|
|
26621
|
-
|
|
26622
|
-
|
|
26623
|
-
|
|
26562
|
+
const availableWallets = React302.useMemo(() => detectAvailableWallets(), [eip6963ProviderCount]);
|
|
26563
|
+
React302.useEffect(() => {
|
|
26564
|
+
if (!standalone || autoResolved || detectingWallet) return;
|
|
26565
|
+
if (!detectedWallet) {
|
|
26566
|
+
setAutoResolved(true);
|
|
26567
|
+
return;
|
|
26568
|
+
}
|
|
26569
|
+
const wct = detectedWallet.type === "phantom-solana" || detectedWallet.type === "solflare" || detectedWallet.type === "backpack" || detectedWallet.type === "glow" ? "solana" : "ethereum";
|
|
26570
|
+
const matching = depositWallets?.find((w) => w.chain_type === wct);
|
|
26571
|
+
if (!matching) {
|
|
26572
|
+
if (!depositWalletsLoading) setAutoResolved(true);
|
|
26573
|
+
return;
|
|
26574
|
+
}
|
|
26575
|
+
setActiveWalletInfo(detectedWallet);
|
|
26576
|
+
setActiveDepositWallet(matching);
|
|
26577
|
+
onWalletConnected?.(detectedWallet, matching);
|
|
26578
|
+
setView("select_token");
|
|
26579
|
+
viewRef.current = "select_token";
|
|
26580
|
+
setAutoResolved(true);
|
|
26581
|
+
}, [standalone, autoResolved, detectingWallet, detectedWallet, depositWallets, depositWalletsLoading]);
|
|
26582
|
+
React302.useEffect(() => {
|
|
26583
|
+
if (!standalone || autoResolved) return;
|
|
26584
|
+
const t12 = setTimeout(() => setAutoResolved(true), 5e3);
|
|
26585
|
+
return () => clearTimeout(t12);
|
|
26586
|
+
}, [standalone, autoResolved]);
|
|
26587
|
+
const [balances, setBalances] = React302.useState([]);
|
|
26588
|
+
const [isLoading, setIsLoading] = React302.useState(false);
|
|
26589
|
+
const [selectedBalance, setSelectedBalance] = React302.useState(null);
|
|
26590
|
+
const [totalBalanceUsd, setTotalBalanceUsd] = React302.useState(null);
|
|
26591
|
+
const [error, setError] = React302.useState(null);
|
|
26592
|
+
const [isDisconnectingWallet, setIsDisconnectingWallet] = React302.useState(false);
|
|
26593
|
+
const [amountUsd, setAmountUsd] = React302.useState(prefillAmountUsd ?? "");
|
|
26594
|
+
const [isConfirming, setIsConfirming] = React302.useState(false);
|
|
26595
|
+
const [hasSignedTransaction, setHasSignedTransaction] = React302.useState(false);
|
|
26596
|
+
const [tokenChainDetails, setTokenChainDetails] = React302.useState(null);
|
|
26597
|
+
const [loadingTokenDetails, setLoadingTokenDetails] = React302.useState(false);
|
|
26598
|
+
const [showTransactionDetails, setShowTransactionDetails] = React302.useState(false);
|
|
26599
|
+
const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] = React302.useState(null);
|
|
26624
26600
|
const walletInfo = activeWalletInfo;
|
|
26625
26601
|
const depositWallet = activeDepositWallet;
|
|
26626
26602
|
const hasWallet = !!activeWalletInfo && !!activeDepositWallet;
|
|
@@ -26628,7 +26604,7 @@ function WalletConnect({
|
|
|
26628
26604
|
const recipientAddress = activeDepositWallet?.address ?? "";
|
|
26629
26605
|
const isCheckoutMode = !!checkoutAmountUsd;
|
|
26630
26606
|
const supportedChainType = chainType === "algorand" || chainType === "xrpl" ? "ethereum" : chainType;
|
|
26631
|
-
const transitionTo =
|
|
26607
|
+
const transitionTo = React302.useCallback((nextView) => {
|
|
26632
26608
|
if (nextView === viewRef.current) return;
|
|
26633
26609
|
setIsTransitioning(true);
|
|
26634
26610
|
setTimeout(() => {
|
|
@@ -26765,7 +26741,7 @@ function WalletConnect({
|
|
|
26765
26741
|
}
|
|
26766
26742
|
};
|
|
26767
26743
|
const selectedToken = selectedBalance ? getTokenFromBalance(selectedBalance) : null;
|
|
26768
|
-
const effectiveDestinationAmount =
|
|
26744
|
+
const effectiveDestinationAmount = React302.useMemo(() => {
|
|
26769
26745
|
if (!checkoutRemainingBaseUnits || checkoutRemainingBaseUnits === "0") return "0";
|
|
26770
26746
|
if (!checkoutAmountUsd) return checkoutRemainingBaseUnits;
|
|
26771
26747
|
const remaining = BigInt(checkoutRemainingBaseUnits);
|
|
@@ -26793,7 +26769,7 @@ function WalletConnect({
|
|
|
26793
26769
|
stablecoinParity,
|
|
26794
26770
|
enabled: isCheckoutMode && !!selectedToken && !!checkoutDestination && effectiveDestinationAmount !== "0"
|
|
26795
26771
|
});
|
|
26796
|
-
const activeCheckoutQuote =
|
|
26772
|
+
const activeCheckoutQuote = React302.useMemo(() => {
|
|
26797
26773
|
if (!isCheckoutMode) return null;
|
|
26798
26774
|
if (walletCheckoutQuote) return { sourceAmount: walletCheckoutQuote.source_amount, sourceTokenDecimals: walletCheckoutQuote.source_token_decimals, sourceTokenSymbol: walletCheckoutQuote.source_token_symbol, sourceAmountUsd: walletCheckoutQuote.source_amount_usd, slippageBufferPercent: walletCheckoutQuote.slippage_buffer_percent ?? null };
|
|
26799
26775
|
return checkoutQuote ?? null;
|
|
@@ -26807,19 +26783,19 @@ function WalletConnect({
|
|
|
26807
26783
|
onDepositSuccess,
|
|
26808
26784
|
onDepositError
|
|
26809
26785
|
});
|
|
26810
|
-
|
|
26786
|
+
React302.useEffect(() => {
|
|
26811
26787
|
onExecutionsChange?.(depositExecutions);
|
|
26812
26788
|
}, [depositExecutions, onExecutionsChange]);
|
|
26813
|
-
|
|
26789
|
+
React302.useEffect(() => {
|
|
26814
26790
|
if (!prefillAmountUsd || !tokenChainDetails || view !== "enter_amount") return;
|
|
26815
26791
|
const minDeposit = tokenChainDetails.minimum_deposit_amount_usd || 0;
|
|
26816
26792
|
const currentAmount = parseFloat(amountUsd) || 0;
|
|
26817
26793
|
if (currentAmount > 0 && currentAmount < minDeposit) setAmountUsd(minDeposit.toFixed(2));
|
|
26818
26794
|
}, [tokenChainDetails, view, prefillAmountUsd]);
|
|
26819
|
-
|
|
26795
|
+
React302.useEffect(() => {
|
|
26820
26796
|
if (view === "review") setShowTransactionDetails(false);
|
|
26821
26797
|
}, [view]);
|
|
26822
|
-
|
|
26798
|
+
React302.useEffect(() => {
|
|
26823
26799
|
if (view !== "enter_amount" && view !== "review" || !selectedBalance || !activeDepositWallet) return;
|
|
26824
26800
|
let cancelled = false;
|
|
26825
26801
|
const fetchTokenDetails = async () => {
|
|
@@ -26846,7 +26822,7 @@ function WalletConnect({
|
|
|
26846
26822
|
cancelled = true;
|
|
26847
26823
|
};
|
|
26848
26824
|
}, [view, selectedBalance, publishableKey, activeDepositWallet]);
|
|
26849
|
-
|
|
26825
|
+
React302.useEffect(() => {
|
|
26850
26826
|
if (!activeWalletInfo || !activeDepositWallet) return;
|
|
26851
26827
|
let cancelled = false;
|
|
26852
26828
|
setIsLoading(true);
|
|
@@ -26879,20 +26855,20 @@ function WalletConnect({
|
|
|
26879
26855
|
cancelled = true;
|
|
26880
26856
|
};
|
|
26881
26857
|
}, [activeWalletInfo?.address, activeDepositWallet?.chain_type, publishableKey]);
|
|
26882
|
-
const usdToTokenRate =
|
|
26858
|
+
const usdToTokenRate = React302.useMemo(() => {
|
|
26883
26859
|
if (!selectedBalance || !selectedBalance.amount_usd || !selectedToken) return 0;
|
|
26884
26860
|
const balanceAmount = Number(selectedBalance.amount) / 10 ** selectedToken.decimals;
|
|
26885
26861
|
const balanceUsd = parseFloat(selectedBalance.amount_usd);
|
|
26886
26862
|
if (balanceAmount === 0 || balanceUsd === 0) return 0;
|
|
26887
26863
|
return balanceAmount / balanceUsd;
|
|
26888
26864
|
}, [selectedBalance, selectedToken]);
|
|
26889
|
-
const tokenAmount =
|
|
26865
|
+
const tokenAmount = React302.useMemo(() => {
|
|
26890
26866
|
if (isCheckoutMode && activeCheckoutQuote && selectedToken) return Number(activeCheckoutQuote.sourceAmount) / 10 ** activeCheckoutQuote.sourceTokenDecimals;
|
|
26891
26867
|
const usdNum = parseFloat(amountUsd) || 0;
|
|
26892
26868
|
if (usdNum === 0 || usdToTokenRate === 0) return 0;
|
|
26893
26869
|
return usdNum * usdToTokenRate;
|
|
26894
26870
|
}, [amountUsd, usdToTokenRate, isCheckoutMode, activeCheckoutQuote, selectedToken]);
|
|
26895
|
-
|
|
26871
|
+
React302.useEffect(() => {
|
|
26896
26872
|
if (isCheckoutMode && activeCheckoutQuote?.sourceAmountUsd && view === "enter_amount") setAmountUsd(activeCheckoutQuote.sourceAmountUsd);
|
|
26897
26873
|
}, [isCheckoutMode, activeCheckoutQuote, view]);
|
|
26898
26874
|
const maxTokenAmount = selectedBalance && selectedToken ? Number(selectedBalance.amount) / 10 ** selectedToken.decimals : 0;
|
|
@@ -26900,7 +26876,7 @@ function WalletConnect({
|
|
|
26900
26876
|
const inputUsdNum = parseFloat(amountUsd) || 0;
|
|
26901
26877
|
const minDepositUsd = tokenChainDetails?.minimum_deposit_amount_usd || 0;
|
|
26902
26878
|
const isValidAmount = isCheckoutMode && activeCheckoutQuote ? tokenAmount > 0 && tokenAmount <= maxTokenAmount : inputUsdNum > 0 && inputUsdNum <= maxUsdAmount && inputUsdNum >= minDepositUsd;
|
|
26903
|
-
const formattedTokenAmount =
|
|
26879
|
+
const formattedTokenAmount = React302.useMemo(() => {
|
|
26904
26880
|
if (tokenAmount === 0 || !selectedToken) return null;
|
|
26905
26881
|
return `${tokenAmount.toFixed(6)} ${selectedToken.symbol}`.replace(/\.?0+$/, "");
|
|
26906
26882
|
}, [tokenAmount, selectedToken]);
|
|
@@ -26948,16 +26924,25 @@ function WalletConnect({
|
|
|
26948
26924
|
} catch (err) {
|
|
26949
26925
|
console.warn("[WalletConnect] disconnect error:", err);
|
|
26950
26926
|
} finally {
|
|
26951
|
-
setActiveWalletInfo(null);
|
|
26952
|
-
setActiveDepositWallet(null);
|
|
26953
|
-
setSelectedBalance(null);
|
|
26954
|
-
setBalances([]);
|
|
26955
|
-
setTotalBalanceUsd(null);
|
|
26956
|
-
setAmountUsd(prefillAmountUsd ?? "");
|
|
26957
|
-
setError(null);
|
|
26958
26927
|
setIsDisconnectingWallet(false);
|
|
26959
|
-
|
|
26960
|
-
|
|
26928
|
+
const clearWalletState = () => {
|
|
26929
|
+
setActiveWalletInfo(null);
|
|
26930
|
+
setActiveDepositWallet(null);
|
|
26931
|
+
setSelectedBalance(null);
|
|
26932
|
+
setBalances([]);
|
|
26933
|
+
setTotalBalanceUsd(null);
|
|
26934
|
+
setAmountUsd(prefillAmountUsd ?? "");
|
|
26935
|
+
setError(null);
|
|
26936
|
+
};
|
|
26937
|
+
if (standalone) {
|
|
26938
|
+
onWalletDisconnect?.();
|
|
26939
|
+
transitionTo("select_wallet");
|
|
26940
|
+
setTimeout(clearWalletState, 160);
|
|
26941
|
+
} else {
|
|
26942
|
+
clearWalletState();
|
|
26943
|
+
if (onWalletDisconnect) onWalletDisconnect();
|
|
26944
|
+
else parentOnBack?.();
|
|
26945
|
+
}
|
|
26961
26946
|
}
|
|
26962
26947
|
};
|
|
26963
26948
|
const handleReview = () => {
|
|
@@ -27083,9 +27068,15 @@ function WalletConnect({
|
|
|
27083
27068
|
setIsConfirming(false);
|
|
27084
27069
|
}
|
|
27085
27070
|
};
|
|
27071
|
+
if (standalone && !autoResolved) {
|
|
27072
|
+
return /* @__PURE__ */ jsxs48("div", { style: viewTransitionStyle, children: [
|
|
27073
|
+
/* @__PURE__ */ jsx54(DepositHeader, { title: "Connect Wallet", showBack: canGoBack, onBack: handleBack, onClose }),
|
|
27074
|
+
/* @__PURE__ */ jsx54("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-16", children: /* @__PURE__ */ jsx54(LoaderCircle, { className: "uf-w-8 uf-h-8 uf-animate-spin", style: { color: colors2.primary } }) })
|
|
27075
|
+
] });
|
|
27076
|
+
}
|
|
27086
27077
|
if (view === "select_wallet") {
|
|
27087
27078
|
return /* @__PURE__ */ jsxs48("div", { style: viewTransitionStyle, children: [
|
|
27088
|
-
/* @__PURE__ */ jsx54(DepositHeader, { title: "Connect Wallet", showBack:
|
|
27079
|
+
/* @__PURE__ */ jsx54(DepositHeader, { title: "Connect Wallet", showBack: canGoBack, onBack: handleBack, onClose }),
|
|
27089
27080
|
/* @__PURE__ */ jsxs48("div", { className: "uf-pb-4", children: [
|
|
27090
27081
|
/* @__PURE__ */ jsx54("p", { className: "uf-text-sm uf-text-center uf-pb-4", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: "Select a wallet to connect" }),
|
|
27091
27082
|
/* @__PURE__ */ jsx54("div", { className: "uf-space-y-2", style: { maxHeight: 330, overflowY: "auto" }, children: availableWallets.map((wallet) => /* @__PURE__ */ jsxs48(
|
|
@@ -27248,45 +27239,56 @@ function DepositModal({
|
|
|
27248
27239
|
if (s === "tracker" && hideDepositTracker) return "main";
|
|
27249
27240
|
if (s === "cashapp" && !enableCashApp) return "main";
|
|
27250
27241
|
if (s === "card" && enableFiatOnramp === false) return "main";
|
|
27242
|
+
if (s === "pay_with_exchange") return enablePayWithExchange === false ? "main" : "exchange";
|
|
27243
|
+
if (s === "exchange_connect") return enableConnectExchange ? "coinbase_connect" : "main";
|
|
27244
|
+
if (s === "wallet_connect") return enableConnectWallet ? "wallet_connect" : "main";
|
|
27251
27245
|
return s;
|
|
27252
|
-
}, [
|
|
27253
|
-
|
|
27246
|
+
}, [
|
|
27247
|
+
initialScreen,
|
|
27248
|
+
hideDepositTracker,
|
|
27249
|
+
enableCashApp,
|
|
27250
|
+
enableFiatOnramp,
|
|
27251
|
+
enablePayWithExchange,
|
|
27252
|
+
enableConnectExchange,
|
|
27253
|
+
enableConnectWallet
|
|
27254
|
+
]);
|
|
27255
|
+
const [containerEl, setContainerEl] = useState32(null);
|
|
27254
27256
|
const containerCallbackRef = useCallback52((el) => {
|
|
27255
27257
|
setContainerEl(el);
|
|
27256
27258
|
}, []);
|
|
27257
|
-
const [view, setView] =
|
|
27259
|
+
const [view, setView] = useState32(
|
|
27258
27260
|
effectiveInitialScreen
|
|
27259
27261
|
);
|
|
27260
|
-
const [coinbaseSkipToHoldings, setCoinbaseSkipToHoldings] =
|
|
27261
|
-
const resetViewTimeoutRef =
|
|
27262
|
-
const [cardView, setCardView] =
|
|
27262
|
+
const [coinbaseSkipToHoldings, setCoinbaseSkipToHoldings] = useState32(false);
|
|
27263
|
+
const resetViewTimeoutRef = useRef92(null);
|
|
27264
|
+
const [cardView, setCardView] = useState32(
|
|
27263
27265
|
"amount"
|
|
27264
27266
|
);
|
|
27265
|
-
const [exchangeView, setExchangeView] =
|
|
27267
|
+
const [exchangeView, setExchangeView] = useState32(
|
|
27266
27268
|
"providers"
|
|
27267
27269
|
);
|
|
27268
|
-
const [browserWalletModalOpen, setBrowserWalletModalOpen] =
|
|
27269
|
-
const [browserWalletInfo, setBrowserWalletInfo] =
|
|
27270
|
-
const [walletSelectionModalOpen, setWalletSelectionModalOpen] =
|
|
27271
|
-
const [browserWalletChainType, setBrowserWalletChainType] =
|
|
27272
|
-
const [quotesCount, setQuotesCount] =
|
|
27273
|
-
const [allExecutions, setAllExecutions] =
|
|
27274
|
-
const [selectedExecution, setSelectedExecution] =
|
|
27275
|
-
const [depositExecutions, setDepositExecutions] =
|
|
27270
|
+
const [browserWalletModalOpen, setBrowserWalletModalOpen] = useState32(false);
|
|
27271
|
+
const [browserWalletInfo, setBrowserWalletInfo] = useState32(null);
|
|
27272
|
+
const [walletSelectionModalOpen, setWalletSelectionModalOpen] = useState32(false);
|
|
27273
|
+
const [browserWalletChainType, setBrowserWalletChainType] = useState32(() => getStoredWalletChainType());
|
|
27274
|
+
const [quotesCount, setQuotesCount] = useState32(0);
|
|
27275
|
+
const [allExecutions, setAllExecutions] = useState32([]);
|
|
27276
|
+
const [selectedExecution, setSelectedExecution] = useState32(null);
|
|
27277
|
+
const [depositExecutions, setDepositExecutions] = useState32([]);
|
|
27276
27278
|
const isMobileView = useIsMobileViewport();
|
|
27277
|
-
const [integrationExchanges, setIntegrationExchanges] =
|
|
27278
|
-
|
|
27279
|
+
const [integrationExchanges, setIntegrationExchanges] = useState32([]);
|
|
27280
|
+
useEffect26(() => {
|
|
27279
27281
|
if (!enableConnectExchange || !open) return;
|
|
27280
27282
|
getIntegrationExchanges(publishableKey).then((res) => setIntegrationExchanges(res.data)).catch(() => {
|
|
27281
27283
|
});
|
|
27282
27284
|
}, [enableConnectExchange, open, publishableKey]);
|
|
27283
|
-
const [connectedExchange, setConnectedExchange] =
|
|
27285
|
+
const [connectedExchange, setConnectedExchange] = useState32(() => {
|
|
27284
27286
|
if (!enableConnectExchange) return null;
|
|
27285
27287
|
const stored = getStoredIntegrationToken(IntegrationProvider.COINBASE);
|
|
27286
27288
|
if (!stored) return null;
|
|
27287
27289
|
return { name: "Coinbase", iconUrl: void 0, balanceUsd: null, isLoading: true };
|
|
27288
27290
|
});
|
|
27289
|
-
|
|
27291
|
+
useEffect26(() => {
|
|
27290
27292
|
if (!enableConnectExchange || !open || view !== "main") return;
|
|
27291
27293
|
const stored = getStoredIntegrationToken(IntegrationProvider.COINBASE);
|
|
27292
27294
|
if (!stored) {
|
|
@@ -27323,7 +27325,7 @@ function DepositModal({
|
|
|
27323
27325
|
}
|
|
27324
27326
|
});
|
|
27325
27327
|
}, [enableConnectExchange, open, view, publishableKey]);
|
|
27326
|
-
|
|
27328
|
+
useEffect26(() => {
|
|
27327
27329
|
if (!connectedExchange || integrationExchanges.length === 0) return;
|
|
27328
27330
|
const cbExchange = integrationExchanges.find(
|
|
27329
27331
|
(e) => e.service_provider === IntegrationProvider.COINBASE
|
|
@@ -27345,10 +27347,10 @@ function DepositModal({
|
|
|
27345
27347
|
// Only fetch when modal is open
|
|
27346
27348
|
});
|
|
27347
27349
|
const wallets = depositAddressResponse?.data ?? [];
|
|
27348
|
-
const [resolvedTheme, setResolvedTheme] =
|
|
27350
|
+
const [resolvedTheme, setResolvedTheme] = useState32(
|
|
27349
27351
|
theme === "auto" ? "dark" : theme
|
|
27350
27352
|
);
|
|
27351
|
-
|
|
27353
|
+
useEffect26(() => {
|
|
27352
27354
|
if (theme === "auto") {
|
|
27353
27355
|
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
27354
27356
|
setResolvedTheme(mediaQuery.matches ? "dark" : "light");
|
|
@@ -27367,12 +27369,18 @@ function DepositModal({
|
|
|
27367
27369
|
});
|
|
27368
27370
|
const showPayWithExchange = enablePayWithExchange ?? projectConfig?.pay_with_exchange?.enabled ?? true;
|
|
27369
27371
|
const showFiatOnramp = enableFiatOnramp ?? projectConfig?.fiat_onramp?.enabled ?? true;
|
|
27370
|
-
|
|
27372
|
+
useEffect26(() => {
|
|
27371
27373
|
if (view === "card" && !showFiatOnramp) {
|
|
27372
27374
|
setView("main");
|
|
27373
27375
|
setCardView("amount");
|
|
27374
27376
|
}
|
|
27375
27377
|
}, [view, showFiatOnramp]);
|
|
27378
|
+
useEffect26(() => {
|
|
27379
|
+
if (view === "exchange" && !showPayWithExchange) {
|
|
27380
|
+
setView("main");
|
|
27381
|
+
setExchangeView("providers");
|
|
27382
|
+
}
|
|
27383
|
+
}, [view, showPayWithExchange]);
|
|
27376
27384
|
const { exchanges, isLoading: exchangesLoading } = useExchanges({
|
|
27377
27385
|
publishableKey,
|
|
27378
27386
|
enabled: open && showPayWithExchange
|
|
@@ -27387,7 +27395,7 @@ function DepositModal({
|
|
|
27387
27395
|
subdivisionCode: userIpInfo?.subdivisionCode ?? void 0,
|
|
27388
27396
|
enabled: open && !isLoadingIp
|
|
27389
27397
|
});
|
|
27390
|
-
|
|
27398
|
+
useEffect26(() => {
|
|
27391
27399
|
if (view !== "tracker" || !userId) return;
|
|
27392
27400
|
const fetchExecutions = async () => {
|
|
27393
27401
|
try {
|
|
@@ -27408,7 +27416,7 @@ function DepositModal({
|
|
|
27408
27416
|
clearInterval(pollInterval);
|
|
27409
27417
|
};
|
|
27410
27418
|
}, [view, userId, publishableKey]);
|
|
27411
|
-
|
|
27419
|
+
useEffect26(() => {
|
|
27412
27420
|
if (view !== "tracker") {
|
|
27413
27421
|
setSelectedExecution(null);
|
|
27414
27422
|
}
|
|
@@ -27492,7 +27500,7 @@ function DepositModal({
|
|
|
27492
27500
|
setBrowserWalletChainType(void 0);
|
|
27493
27501
|
setBrowserWalletInfo(null);
|
|
27494
27502
|
setBrowserWalletModalOpen(false);
|
|
27495
|
-
if (view === "wallet_connect") setView("main");
|
|
27503
|
+
if (view === "wallet_connect" && sessionOpenedFromMenu) setView("main");
|
|
27496
27504
|
};
|
|
27497
27505
|
const handleExchangeDisconnect = () => {
|
|
27498
27506
|
const stored = getStoredIntegrationToken(IntegrationProvider.COINBASE);
|
|
@@ -27501,7 +27509,7 @@ function DepositModal({
|
|
|
27501
27509
|
}
|
|
27502
27510
|
clearStoredIntegrationToken(IntegrationProvider.COINBASE);
|
|
27503
27511
|
setConnectedExchange(null);
|
|
27504
|
-
if (view === "coinbase_connect") setView("main");
|
|
27512
|
+
if (view === "coinbase_connect" && sessionOpenedFromMenu) setView("main");
|
|
27505
27513
|
};
|
|
27506
27514
|
const handleClose = () => {
|
|
27507
27515
|
onOpenChange(false);
|
|
@@ -27513,6 +27521,7 @@ function DepositModal({
|
|
|
27513
27521
|
setCardView("amount");
|
|
27514
27522
|
setExchangeView("providers");
|
|
27515
27523
|
setBrowserWalletInfo(null);
|
|
27524
|
+
setCoinbaseSkipToHoldings(false);
|
|
27516
27525
|
resetViewTimeoutRef.current = null;
|
|
27517
27526
|
}, 200);
|
|
27518
27527
|
};
|
|
@@ -27527,8 +27536,9 @@ function DepositModal({
|
|
|
27527
27536
|
setExchangeView("providers");
|
|
27528
27537
|
setBrowserWalletInfo(null);
|
|
27529
27538
|
setSelectedExecution(null);
|
|
27539
|
+
setCoinbaseSkipToHoldings(false);
|
|
27530
27540
|
}, [open, effectiveInitialScreen]);
|
|
27531
|
-
|
|
27541
|
+
useEffect26(
|
|
27532
27542
|
() => () => {
|
|
27533
27543
|
if (resetViewTimeoutRef.current) {
|
|
27534
27544
|
clearTimeout(resetViewTimeoutRef.current);
|
|
@@ -27536,8 +27546,8 @@ function DepositModal({
|
|
|
27536
27546
|
},
|
|
27537
27547
|
[]
|
|
27538
27548
|
);
|
|
27539
|
-
const [cashAppView, setCashAppView] =
|
|
27540
|
-
const [cashAppAmount, setCashAppAmount] =
|
|
27549
|
+
const [cashAppView, setCashAppView] = useState32("amount");
|
|
27550
|
+
const [cashAppAmount, setCashAppAmount] = useState32("");
|
|
27541
27551
|
const handleBack = () => {
|
|
27542
27552
|
if (view === "card" && cardView === "quotes") {
|
|
27543
27553
|
setCardView("amount");
|
|
@@ -27886,7 +27896,7 @@ function DepositModal({
|
|
|
27886
27896
|
DepositHeader,
|
|
27887
27897
|
{
|
|
27888
27898
|
title: payWithExchangeTitle,
|
|
27889
|
-
showBack:
|
|
27899
|
+
showBack: exchangeView === "pending" || sessionOpenedFromMenu,
|
|
27890
27900
|
onBack: handleBack,
|
|
27891
27901
|
onClose: handleClose
|
|
27892
27902
|
}
|
|
@@ -27940,6 +27950,7 @@ function DepositModal({
|
|
|
27940
27950
|
onClose: handleClose,
|
|
27941
27951
|
onDisconnect: handleExchangeDisconnect,
|
|
27942
27952
|
skipToHoldings: coinbaseSkipToHoldings,
|
|
27953
|
+
canGoBack: sessionOpenedFromMenu,
|
|
27943
27954
|
onExecutionsChange: setDepositExecutions
|
|
27944
27955
|
}
|
|
27945
27956
|
),
|
|
@@ -27977,7 +27988,9 @@ function DepositModal({
|
|
|
27977
27988
|
setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
|
|
27978
27989
|
},
|
|
27979
27990
|
onBack: handleBack,
|
|
27980
|
-
onClose: handleClose
|
|
27991
|
+
onClose: handleClose,
|
|
27992
|
+
canGoBack: sessionOpenedFromMenu,
|
|
27993
|
+
depositWalletsLoading: walletsLoading
|
|
27981
27994
|
}
|
|
27982
27995
|
),
|
|
27983
27996
|
depositPoweredByFooter
|
|
@@ -27986,7 +27999,7 @@ function DepositModal({
|
|
|
27986
27999
|
DepositHeader,
|
|
27987
28000
|
{
|
|
27988
28001
|
title: cashAppView !== "amount" && cashAppAmount ? `Pay $${cashAppAmount} via Cash App` : "Pay with Cash App",
|
|
27989
|
-
showBack:
|
|
28002
|
+
showBack: cashAppView !== "amount" || sessionOpenedFromMenu,
|
|
27990
28003
|
onBack: handleBack,
|
|
27991
28004
|
onClose: handleClose
|
|
27992
28005
|
}
|
|
@@ -28088,19 +28101,19 @@ function CheckoutModal({
|
|
|
28088
28101
|
onCheckoutError
|
|
28089
28102
|
}) {
|
|
28090
28103
|
const { colors: colors2, fonts, components } = useTheme();
|
|
28091
|
-
const [view, setView] =
|
|
28092
|
-
const resetViewTimeoutRef =
|
|
28104
|
+
const [view, setView] = useState33("main");
|
|
28105
|
+
const resetViewTimeoutRef = useRef102(
|
|
28093
28106
|
null
|
|
28094
28107
|
);
|
|
28095
|
-
const [browserWalletModalOpen, setBrowserWalletModalOpen] =
|
|
28096
|
-
const [browserWalletInfo, setBrowserWalletInfo] =
|
|
28097
|
-
const [walletSelectionModalOpen, setWalletSelectionModalOpen] =
|
|
28098
|
-
const [browserWalletChainType, setBrowserWalletChainType] =
|
|
28108
|
+
const [browserWalletModalOpen, setBrowserWalletModalOpen] = useState33(false);
|
|
28109
|
+
const [browserWalletInfo, setBrowserWalletInfo] = useState33(null);
|
|
28110
|
+
const [walletSelectionModalOpen, setWalletSelectionModalOpen] = useState33(false);
|
|
28111
|
+
const [browserWalletChainType, setBrowserWalletChainType] = useState33(() => getStoredWalletChainType());
|
|
28099
28112
|
const isMobileView = useIsMobileViewport();
|
|
28100
|
-
const [resolvedTheme, setResolvedTheme] =
|
|
28113
|
+
const [resolvedTheme, setResolvedTheme] = useState33(
|
|
28101
28114
|
theme === "auto" ? "dark" : theme
|
|
28102
28115
|
);
|
|
28103
|
-
|
|
28116
|
+
useEffect272(() => {
|
|
28104
28117
|
if (theme === "auto") {
|
|
28105
28118
|
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
28106
28119
|
setResolvedTheme(mediaQuery.matches ? "dark" : "light");
|
|
@@ -28128,8 +28141,8 @@ function CheckoutModal({
|
|
|
28128
28141
|
publishableKey,
|
|
28129
28142
|
enabled: open
|
|
28130
28143
|
});
|
|
28131
|
-
const prevStatusRef =
|
|
28132
|
-
|
|
28144
|
+
const prevStatusRef = useRef102(null);
|
|
28145
|
+
useEffect272(() => {
|
|
28133
28146
|
if (!paymentIntent) return;
|
|
28134
28147
|
const prev = prevStatusRef.current;
|
|
28135
28148
|
prevStatusRef.current = paymentIntent.status;
|
|
@@ -28175,7 +28188,7 @@ function CheckoutModal({
|
|
|
28175
28188
|
const remaining = total - received;
|
|
28176
28189
|
return remaining > 0n ? remaining.toString() : "0";
|
|
28177
28190
|
}, [paymentIntent]);
|
|
28178
|
-
const [selectedSource, setSelectedSource] =
|
|
28191
|
+
const [selectedSource, setSelectedSource] = useState33(null);
|
|
28179
28192
|
const remainingDestinationAmount = useMemo112(() => {
|
|
28180
28193
|
if (!paymentIntent) return "0";
|
|
28181
28194
|
const remaining = BigInt(paymentIntent.destination_amount) - BigInt(paymentIntent.destination_amount_received);
|
|
@@ -28295,7 +28308,7 @@ function CheckoutModal({
|
|
|
28295
28308
|
setView("main");
|
|
28296
28309
|
setBrowserWalletInfo(null);
|
|
28297
28310
|
}, [open]);
|
|
28298
|
-
|
|
28311
|
+
useEffect272(
|
|
28299
28312
|
() => () => {
|
|
28300
28313
|
if (resetViewTimeoutRef.current) {
|
|
28301
28314
|
clearTimeout(resetViewTimeoutRef.current);
|
|
@@ -28831,20 +28844,20 @@ function useWithdrawPolling({
|
|
|
28831
28844
|
onWithdrawSuccess,
|
|
28832
28845
|
onWithdrawError
|
|
28833
28846
|
}) {
|
|
28834
|
-
const [executions, setExecutions] =
|
|
28835
|
-
const [isPolling, setIsPolling] =
|
|
28836
|
-
const enabledAtRef =
|
|
28837
|
-
const trackedRef =
|
|
28838
|
-
const prevEnabledRef =
|
|
28839
|
-
const onSuccessRef =
|
|
28840
|
-
const onErrorRef =
|
|
28841
|
-
|
|
28847
|
+
const [executions, setExecutions] = useState34([]);
|
|
28848
|
+
const [isPolling, setIsPolling] = useState34(false);
|
|
28849
|
+
const enabledAtRef = useRef112(/* @__PURE__ */ new Date());
|
|
28850
|
+
const trackedRef = useRef112(/* @__PURE__ */ new Map());
|
|
28851
|
+
const prevEnabledRef = useRef112(false);
|
|
28852
|
+
const onSuccessRef = useRef112(onWithdrawSuccess);
|
|
28853
|
+
const onErrorRef = useRef112(onWithdrawError);
|
|
28854
|
+
useEffect282(() => {
|
|
28842
28855
|
onSuccessRef.current = onWithdrawSuccess;
|
|
28843
28856
|
}, [onWithdrawSuccess]);
|
|
28844
|
-
|
|
28857
|
+
useEffect282(() => {
|
|
28845
28858
|
onErrorRef.current = onWithdrawError;
|
|
28846
28859
|
}, [onWithdrawError]);
|
|
28847
|
-
|
|
28860
|
+
useEffect282(() => {
|
|
28848
28861
|
if (enabled && !prevEnabledRef.current) {
|
|
28849
28862
|
enabledAtRef.current = /* @__PURE__ */ new Date();
|
|
28850
28863
|
trackedRef.current.clear();
|
|
@@ -28854,7 +28867,7 @@ function useWithdrawPolling({
|
|
|
28854
28867
|
}
|
|
28855
28868
|
prevEnabledRef.current = enabled;
|
|
28856
28869
|
}, [enabled]);
|
|
28857
|
-
|
|
28870
|
+
useEffect282(() => {
|
|
28858
28871
|
if (!userId || !enabled) return;
|
|
28859
28872
|
const enabledAt = enabledAtRef.current;
|
|
28860
28873
|
const poll = async () => {
|
|
@@ -28916,7 +28929,7 @@ function useWithdrawPolling({
|
|
|
28916
28929
|
setIsPolling(false);
|
|
28917
28930
|
};
|
|
28918
28931
|
}, [userId, publishableKey, enabled]);
|
|
28919
|
-
|
|
28932
|
+
useEffect282(() => {
|
|
28920
28933
|
if (!enabled || !depositWalletId) return;
|
|
28921
28934
|
const trigger = async () => {
|
|
28922
28935
|
try {
|
|
@@ -29288,27 +29301,27 @@ function WithdrawForm({
|
|
|
29288
29301
|
footerLeft
|
|
29289
29302
|
}) {
|
|
29290
29303
|
const { colors: colors2, fonts, components } = useTheme();
|
|
29291
|
-
const [recipientAddress, setRecipientAddress] =
|
|
29292
|
-
const [amount, setAmount] =
|
|
29293
|
-
const [inputUnit, setInputUnit] =
|
|
29294
|
-
const [isSubmitting, setIsSubmitting] =
|
|
29295
|
-
const [submitError, setSubmitError] =
|
|
29296
|
-
const [detailsExpanded, setDetailsExpanded] =
|
|
29297
|
-
const [glossaryOpen, setGlossaryOpen] =
|
|
29298
|
-
const [isMaxed, setIsMaxed] =
|
|
29299
|
-
|
|
29304
|
+
const [recipientAddress, setRecipientAddress] = useState35(recipientAddressProp || "");
|
|
29305
|
+
const [amount, setAmount] = useState35("");
|
|
29306
|
+
const [inputUnit, setInputUnit] = useState35("fiat");
|
|
29307
|
+
const [isSubmitting, setIsSubmitting] = useState35(false);
|
|
29308
|
+
const [submitError, setSubmitError] = useState35(null);
|
|
29309
|
+
const [detailsExpanded, setDetailsExpanded] = useState35(false);
|
|
29310
|
+
const [glossaryOpen, setGlossaryOpen] = useState35(false);
|
|
29311
|
+
const [isMaxed, setIsMaxed] = useState35(false);
|
|
29312
|
+
useEffect292(() => {
|
|
29300
29313
|
setRecipientAddress(recipientAddressProp || "");
|
|
29301
29314
|
setAmount("");
|
|
29302
29315
|
setInputUnit("fiat");
|
|
29303
29316
|
setSubmitError(null);
|
|
29304
29317
|
setIsMaxed(false);
|
|
29305
29318
|
}, [recipientAddressProp]);
|
|
29306
|
-
|
|
29319
|
+
useEffect292(() => {
|
|
29307
29320
|
setIsMaxed(false);
|
|
29308
29321
|
}, [balanceData?.balanceBaseUnit]);
|
|
29309
29322
|
const trimmedAddress = recipientAddress.trim();
|
|
29310
|
-
const [debouncedAddress, setDebouncedAddress] =
|
|
29311
|
-
|
|
29323
|
+
const [debouncedAddress, setDebouncedAddress] = useState35(trimmedAddress);
|
|
29324
|
+
useEffect292(() => {
|
|
29312
29325
|
const id = setTimeout(() => setDebouncedAddress(trimmedAddress), 500);
|
|
29313
29326
|
return () => clearTimeout(id);
|
|
29314
29327
|
}, [trimmedAddress]);
|
|
@@ -29950,9 +29963,9 @@ function WithdrawConfirmingView({
|
|
|
29950
29963
|
onViewTracker
|
|
29951
29964
|
}) {
|
|
29952
29965
|
const { colors: colors2, fonts, components } = useTheme();
|
|
29953
|
-
const [showButton, setShowButton] =
|
|
29966
|
+
const [showButton, setShowButton] = useState36(false);
|
|
29954
29967
|
const latestExecution = executions.length > 0 ? executions[executions.length - 1] : null;
|
|
29955
|
-
|
|
29968
|
+
useEffect302(() => {
|
|
29956
29969
|
if (latestExecution) return;
|
|
29957
29970
|
const timer = setTimeout(() => setShowButton(true), SHOW_BUTTON_DELAY_MS);
|
|
29958
29971
|
return () => clearTimeout(timer);
|
|
@@ -30109,14 +30122,14 @@ function WithdrawModal({
|
|
|
30109
30122
|
hideOverlay = false
|
|
30110
30123
|
}) {
|
|
30111
30124
|
const { colors: colors2, fonts, components } = useTheme();
|
|
30112
|
-
const [containerEl, setContainerEl] =
|
|
30125
|
+
const [containerEl, setContainerEl] = useState37(null);
|
|
30113
30126
|
const containerCallbackRef = useCallback82((el) => {
|
|
30114
30127
|
setContainerEl(el);
|
|
30115
30128
|
}, []);
|
|
30116
|
-
const [resolvedTheme, setResolvedTheme] =
|
|
30129
|
+
const [resolvedTheme, setResolvedTheme] = useState37(
|
|
30117
30130
|
theme === "auto" ? "dark" : theme
|
|
30118
30131
|
);
|
|
30119
|
-
|
|
30132
|
+
useEffect31(() => {
|
|
30120
30133
|
if (theme === "auto") {
|
|
30121
30134
|
const mq = window.matchMedia("(prefers-color-scheme: dark)");
|
|
30122
30135
|
setResolvedTheme(mq.matches ? "dark" : "light");
|
|
@@ -30160,10 +30173,10 @@ function WithdrawModal({
|
|
|
30160
30173
|
});
|
|
30161
30174
|
const selectedToken = selectedTokenSymbol ? destinationTokens.find((t12) => t12.symbol === selectedTokenSymbol) ?? null : null;
|
|
30162
30175
|
const selectedChain = selectedToken && selectedChainKey ? selectedToken.chains.find((c) => getChainKey5(c.chain_id, c.chain_type) === selectedChainKey) ?? null : null;
|
|
30163
|
-
const [view, setView] =
|
|
30164
|
-
const [withdrawDepositWalletId, setWithdrawDepositWalletId] =
|
|
30165
|
-
const [selectedExecution, setSelectedExecution] =
|
|
30166
|
-
const [submittedTxInfo, setSubmittedTxInfo] =
|
|
30176
|
+
const [view, setView] = useState37("form");
|
|
30177
|
+
const [withdrawDepositWalletId, setWithdrawDepositWalletId] = useState37();
|
|
30178
|
+
const [selectedExecution, setSelectedExecution] = useState37(null);
|
|
30179
|
+
const [submittedTxInfo, setSubmittedTxInfo] = useState37(null);
|
|
30167
30180
|
const { executions: realtimeExecutions } = useWithdrawPolling({
|
|
30168
30181
|
userId: externalUserId,
|
|
30169
30182
|
publishableKey,
|
|
@@ -30202,7 +30215,7 @@ function WithdrawModal({
|
|
|
30202
30215
|
setSubmittedTxInfo(txInfo);
|
|
30203
30216
|
setView("confirming");
|
|
30204
30217
|
}, []);
|
|
30205
|
-
const resetViewTimeoutRef =
|
|
30218
|
+
const resetViewTimeoutRef = useRef122(null);
|
|
30206
30219
|
const handleClose = useCallback82(() => {
|
|
30207
30220
|
onOpenChange(false);
|
|
30208
30221
|
if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
|
|
@@ -30225,7 +30238,7 @@ function WithdrawModal({
|
|
|
30225
30238
|
setSubmittedTxInfo(null);
|
|
30226
30239
|
setWithdrawDepositWalletId(void 0);
|
|
30227
30240
|
}, [open]);
|
|
30228
|
-
|
|
30241
|
+
useEffect31(() => () => {
|
|
30229
30242
|
if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
|
|
30230
30243
|
}, []);
|
|
30231
30244
|
const handleTokenSymbolChange = useCallback82((symbol) => {
|
|
@@ -30356,20 +30369,20 @@ function UnifoldProvider2({
|
|
|
30356
30369
|
queryClient,
|
|
30357
30370
|
config
|
|
30358
30371
|
}) {
|
|
30359
|
-
const [isOpen, setIsOpen] =
|
|
30360
|
-
const [depositConfig, setDepositConfig] =
|
|
30372
|
+
const [isOpen, setIsOpen] = useState31(false);
|
|
30373
|
+
const [depositConfig, setDepositConfig] = useState31(
|
|
30361
30374
|
null
|
|
30362
30375
|
);
|
|
30363
|
-
const [isCheckoutOpen, setIsCheckoutOpen] =
|
|
30364
|
-
const [checkoutConfig, setCheckoutConfig] =
|
|
30376
|
+
const [isCheckoutOpen, setIsCheckoutOpen] = useState31(false);
|
|
30377
|
+
const [checkoutConfig, setCheckoutConfig] = useState31(
|
|
30365
30378
|
null
|
|
30366
30379
|
);
|
|
30367
|
-
const [isWithdrawOpen, setIsWithdrawOpen] =
|
|
30368
|
-
const [withdrawConfig, setWithdrawConfig] =
|
|
30380
|
+
const [isWithdrawOpen, setIsWithdrawOpen] = useState31(false);
|
|
30381
|
+
const [withdrawConfig, setWithdrawConfig] = useState31(
|
|
30369
30382
|
null
|
|
30370
30383
|
);
|
|
30371
30384
|
const [resolvedTheme, setResolvedTheme] = React38.useState("dark");
|
|
30372
|
-
|
|
30385
|
+
useEffect33(() => {
|
|
30373
30386
|
if (publishableKey) {
|
|
30374
30387
|
setApiConfig({ publishableKey });
|
|
30375
30388
|
}
|