@b3dotfun/sdk 0.0.29-alpha.2 → 0.0.29-alpha.4

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.
Files changed (50) hide show
  1. package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +3 -1
  2. package/dist/cjs/anyspend/react/components/common/ConnectWalletPayment.js +9 -1
  3. package/dist/cjs/anyspend/react/components/common/CryptoPaymentMethod.js +130 -41
  4. package/dist/cjs/anyspend/react/components/common/OrderDetails.js +3 -3
  5. package/dist/cjs/anyspend/react/components/common/PaySection.js +6 -4
  6. package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js +29 -0
  7. package/dist/cjs/anyspend/react/hooks/useSigMint.d.ts +1 -1
  8. package/dist/cjs/bondkit/abis/BondkitTokenABI.d.ts +60 -12
  9. package/dist/cjs/bondkit/abis/BondkitTokenABI.js +39 -6
  10. package/dist/cjs/bondkit/abis/BondkitTokenFactoryABI.d.ts +0 -25
  11. package/dist/cjs/bondkit/abis/BondkitTokenFactoryABI.js +0 -9
  12. package/dist/cjs/bondkit/constants.js +1 -1
  13. package/dist/cjs/global-account/react/hooks/useUnifiedChainSwitchAndExecute.d.ts +1 -0
  14. package/dist/cjs/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +1 -0
  15. package/dist/cjs/shared/constants/chains/b3Chain.d.ts +2 -2
  16. package/dist/cjs/shared/constants/chains/supported.d.ts +4 -4
  17. package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +3 -1
  18. package/dist/esm/anyspend/react/components/common/ConnectWalletPayment.js +6 -1
  19. package/dist/esm/anyspend/react/components/common/CryptoPaymentMethod.js +133 -44
  20. package/dist/esm/anyspend/react/components/common/OrderDetails.js +3 -3
  21. package/dist/esm/anyspend/react/components/common/PaySection.js +7 -5
  22. package/dist/esm/anyspend/react/hooks/useAnyspendFlow.js +30 -1
  23. package/dist/esm/anyspend/react/hooks/useSigMint.d.ts +1 -1
  24. package/dist/esm/bondkit/abis/BondkitTokenABI.d.ts +60 -12
  25. package/dist/esm/bondkit/abis/BondkitTokenABI.js +39 -6
  26. package/dist/esm/bondkit/abis/BondkitTokenFactoryABI.d.ts +0 -25
  27. package/dist/esm/bondkit/abis/BondkitTokenFactoryABI.js +0 -9
  28. package/dist/esm/bondkit/constants.js +1 -1
  29. package/dist/esm/global-account/react/hooks/useUnifiedChainSwitchAndExecute.d.ts +1 -0
  30. package/dist/esm/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +1 -0
  31. package/dist/esm/shared/constants/chains/b3Chain.d.ts +2 -2
  32. package/dist/esm/shared/constants/chains/supported.d.ts +4 -4
  33. package/dist/styles/index.css +1 -1
  34. package/dist/types/anyspend/react/hooks/useSigMint.d.ts +1 -1
  35. package/dist/types/bondkit/abis/BondkitTokenABI.d.ts +60 -12
  36. package/dist/types/bondkit/abis/BondkitTokenFactoryABI.d.ts +0 -25
  37. package/dist/types/global-account/react/hooks/useUnifiedChainSwitchAndExecute.d.ts +1 -0
  38. package/dist/types/shared/constants/chains/b3Chain.d.ts +2 -2
  39. package/dist/types/shared/constants/chains/supported.d.ts +4 -4
  40. package/package.json +1 -1
  41. package/src/anyspend/react/components/AnyspendDepositHype.tsx +4 -0
  42. package/src/anyspend/react/components/common/ConnectWalletPayment.tsx +9 -0
  43. package/src/anyspend/react/components/common/CryptoPaymentMethod.tsx +289 -103
  44. package/src/anyspend/react/components/common/OrderDetails.tsx +3 -3
  45. package/src/anyspend/react/components/common/PaySection.tsx +9 -7
  46. package/src/anyspend/react/hooks/useAnyspendFlow.ts +33 -1
  47. package/src/bondkit/abis/BondkitTokenABI.ts +39 -6
  48. package/src/bondkit/abis/BondkitTokenFactoryABI.ts +0 -9
  49. package/src/bondkit/constants.ts +1 -1
  50. package/src/global-account/react/hooks/useUnifiedChainSwitchAndExecute.ts +1 -0
@@ -161,11 +161,6 @@ exports.BondkitTokenABI = [
161
161
  name: "ValidationInvalidLPSplitRatio",
162
162
  type: "error",
163
163
  },
164
- {
165
- inputs: [{ internalType: "address", name: "providedAddress", type: "address" }],
166
- name: "ValidationInvalidMigrationAdminAddress",
167
- type: "error",
168
- },
169
164
  {
170
165
  inputs: [{ internalType: "uint24", name: "value", type: "uint24" }],
171
166
  name: "ValidationInvalidV4PoolFee",
@@ -186,6 +181,15 @@ exports.BondkitTokenABI = [
186
181
  name: "Approval",
187
182
  type: "event",
188
183
  },
184
+ {
185
+ anonymous: false,
186
+ inputs: [
187
+ { indexed: true, internalType: "address", name: "previousAdmin", type: "address" },
188
+ { indexed: true, internalType: "address", name: "newAdmin", type: "address" },
189
+ ],
190
+ name: "B3AdminUpdated",
191
+ type: "event",
192
+ },
189
193
  {
190
194
  anonymous: false,
191
195
  inputs: [
@@ -237,6 +241,15 @@ exports.BondkitTokenABI = [
237
241
  name: "BondkitTokenMigrated",
238
242
  type: "event",
239
243
  },
244
+ {
245
+ anonymous: false,
246
+ inputs: [
247
+ { indexed: false, internalType: "uint256", name: "totalRaisedBonding", type: "uint256" },
248
+ { indexed: false, internalType: "uint256", name: "targetAmount", type: "uint256" },
249
+ ],
250
+ name: "DexTriggerThresholdMet",
251
+ type: "event",
252
+ },
240
253
  {
241
254
  anonymous: false,
242
255
  inputs: [
@@ -305,6 +318,13 @@ exports.BondkitTokenABI = [
305
318
  stateMutability: "nonpayable",
306
319
  type: "function",
307
320
  },
321
+ {
322
+ inputs: [],
323
+ name: "b3Admin",
324
+ outputs: [{ internalType: "address", name: "", type: "address" }],
325
+ stateMutability: "view",
326
+ type: "function",
327
+ },
308
328
  {
309
329
  inputs: [{ internalType: "address", name: "account", type: "address" }],
310
330
  name: "balanceOf",
@@ -400,6 +420,13 @@ exports.BondkitTokenABI = [
400
420
  stateMutability: "view",
401
421
  type: "function",
402
422
  },
423
+ {
424
+ inputs: [],
425
+ name: "getB3Admin",
426
+ outputs: [{ internalType: "address", name: "", type: "address" }],
427
+ stateMutability: "view",
428
+ type: "function",
429
+ },
403
430
  {
404
431
  inputs: [],
405
432
  name: "getBondingCurveConfig",
@@ -542,7 +569,6 @@ exports.BondkitTokenABI = [
542
569
  { internalType: "uint256", name: "lpSplitRatioFeeRecipientBps", type: "uint256" },
543
570
  { internalType: "uint256", name: "targetAmount", type: "uint256" },
544
571
  { internalType: "address", name: "tradingToken", type: "address" },
545
- { internalType: "address", name: "migrationAdminAddress", type: "address" },
546
572
  { internalType: "address", name: "bondingPhaseSplitter", type: "address" },
547
573
  { internalType: "address", name: "v4PoolManager", type: "address" },
548
574
  { internalType: "address", name: "v4Hook", type: "address" },
@@ -662,6 +688,13 @@ exports.BondkitTokenABI = [
662
688
  stateMutability: "nonpayable",
663
689
  type: "function",
664
690
  },
691
+ {
692
+ inputs: [{ internalType: "address", name: "_newAdmin", type: "address" }],
693
+ name: "updateB3Admin",
694
+ outputs: [],
695
+ stateMutability: "nonpayable",
696
+ type: "function",
697
+ },
665
698
  {
666
699
  inputs: [{ internalType: "address", name: "_bondingPhaseSplitter", type: "address" }],
667
700
  name: "updateSplitter",
@@ -106,14 +106,6 @@ export declare const BondkitTokenFactoryABI: readonly [{
106
106
  }];
107
107
  readonly name: "ValidationInvalidLPSplitRatio";
108
108
  readonly type: "error";
109
- }, {
110
- readonly inputs: readonly [{
111
- readonly internalType: "address";
112
- readonly name: "providedAddress";
113
- readonly type: "address";
114
- }];
115
- readonly name: "ValidationInvalidMigrationAdminAddress";
116
- readonly type: "error";
117
109
  }, {
118
110
  readonly inputs: readonly [{
119
111
  readonly internalType: "uint24";
@@ -157,11 +149,6 @@ export declare const BondkitTokenFactoryABI: readonly [{
157
149
  readonly internalType: "address";
158
150
  readonly name: "feeRecipient";
159
151
  readonly type: "address";
160
- }, {
161
- readonly indexed: false;
162
- readonly internalType: "address";
163
- readonly name: "migrationAdmin";
164
- readonly type: "address";
165
152
  }];
166
153
  readonly name: "BondkitTokenCreated";
167
154
  readonly type: "event";
@@ -259,10 +246,6 @@ export declare const BondkitTokenFactoryABI: readonly [{
259
246
  readonly internalType: "address";
260
247
  readonly name: "tradingToken";
261
248
  readonly type: "address";
262
- }, {
263
- readonly internalType: "address";
264
- readonly name: "migrationAdminAddress";
265
- readonly type: "address";
266
249
  }, {
267
250
  readonly internalType: "address";
268
251
  readonly name: "bondingPhaseSplitter";
@@ -350,10 +333,6 @@ export declare const BondkitTokenFactoryABI: readonly [{
350
333
  readonly internalType: "address";
351
334
  readonly name: "tradingToken";
352
335
  readonly type: "address";
353
- }, {
354
- readonly internalType: "address";
355
- readonly name: "migrationAdminAddress";
356
- readonly type: "address";
357
336
  }, {
358
337
  readonly internalType: "address";
359
338
  readonly name: "bondingPhaseSplitter";
@@ -461,10 +440,6 @@ export declare const BondkitTokenFactoryABI: readonly [{
461
440
  readonly internalType: "address";
462
441
  readonly name: "tradingToken";
463
442
  readonly type: "address";
464
- }, {
465
- readonly internalType: "address";
466
- readonly name: "migrationAdminAddress";
467
- readonly type: "address";
468
443
  }, {
469
444
  readonly internalType: "address";
470
445
  readonly name: "bondingPhaseSplitter";
@@ -60,11 +60,6 @@ exports.BondkitTokenFactoryABI = [
60
60
  name: "ValidationInvalidLPSplitRatio",
61
61
  type: "error",
62
62
  },
63
- {
64
- inputs: [{ internalType: "address", name: "providedAddress", type: "address" }],
65
- name: "ValidationInvalidMigrationAdminAddress",
66
- type: "error",
67
- },
68
63
  {
69
64
  inputs: [{ internalType: "uint24", name: "value", type: "uint24" }],
70
65
  name: "ValidationInvalidV4PoolFee",
@@ -83,7 +78,6 @@ exports.BondkitTokenFactoryABI = [
83
78
  { indexed: false, internalType: "string", name: "name", type: "string" },
84
79
  { indexed: false, internalType: "string", name: "symbol", type: "string" },
85
80
  { indexed: true, internalType: "address", name: "feeRecipient", type: "address" },
86
- { indexed: false, internalType: "address", name: "migrationAdmin", type: "address" },
87
81
  ],
88
82
  name: "BondkitTokenCreated",
89
83
  type: "event",
@@ -135,7 +129,6 @@ exports.BondkitTokenFactoryABI = [
135
129
  { internalType: "uint256", name: "lpSplitRatioFeeRecipientBps", type: "uint256" },
136
130
  { internalType: "uint256", name: "targetAmount", type: "uint256" },
137
131
  { internalType: "address", name: "tradingToken", type: "address" },
138
- { internalType: "address", name: "migrationAdminAddress", type: "address" },
139
132
  { internalType: "address", name: "bondingPhaseSplitter", type: "address" },
140
133
  { internalType: "address", name: "v4PoolManager", type: "address" },
141
134
  { internalType: "address", name: "v4Hook", type: "address" },
@@ -178,7 +171,6 @@ exports.BondkitTokenFactoryABI = [
178
171
  { internalType: "uint256", name: "lpSplitRatioFeeRecipientBps", type: "uint256" },
179
172
  { internalType: "uint256", name: "targetAmount", type: "uint256" },
180
173
  { internalType: "address", name: "tradingToken", type: "address" },
181
- { internalType: "address", name: "migrationAdminAddress", type: "address" },
182
174
  { internalType: "address", name: "bondingPhaseSplitter", type: "address" },
183
175
  { internalType: "address", name: "v4PoolManager", type: "address" },
184
176
  { internalType: "address", name: "v4Hook", type: "address" },
@@ -230,7 +222,6 @@ exports.BondkitTokenFactoryABI = [
230
222
  { internalType: "uint256", name: "lpSplitRatioFeeRecipientBps", type: "uint256" },
231
223
  { internalType: "uint256", name: "targetAmount", type: "uint256" },
232
224
  { internalType: "address", name: "tradingToken", type: "address" },
233
- { internalType: "address", name: "migrationAdminAddress", type: "address" },
234
225
  { internalType: "address", name: "bondingPhaseSplitter", type: "address" },
235
226
  { internalType: "address", name: "v4PoolManager", type: "address" },
236
227
  { internalType: "address", name: "v4Hook", type: "address" },
@@ -1,5 +1,5 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.BaseMainnetRpcUrl = exports.BaseBondkitTokenFactoryContractAddress = void 0;
4
- exports.BaseBondkitTokenFactoryContractAddress = "0x0ccA36e9BE8Fdf456dE4BC20b378B1560Aeb6653";
4
+ exports.BaseBondkitTokenFactoryContractAddress = "0x5d641bbB206d4B5585eCCd919F36270200A9A2Ad";
5
5
  exports.BaseMainnetRpcUrl = "https://base-rpc.publicnode.com";
@@ -5,6 +5,7 @@ export interface UnifiedTransactionParams {
5
5
  }
6
6
  export declare function useUnifiedChainSwitchAndExecute(): {
7
7
  switchChainAndExecute: (targetChainId: number, params: UnifiedTransactionParams) => Promise<string | undefined>;
8
+ switchChainAndExecuteWithEOA: (targetChainId: number, params: UnifiedTransactionParams) => Promise<string | undefined>;
8
9
  isSwitchingOrExecuting: boolean;
9
10
  isActiveSmartWallet: boolean | undefined;
10
11
  isActiveEOAWallet: boolean | undefined;
@@ -164,6 +164,7 @@ function useUnifiedChainSwitchAndExecute() {
164
164
  }, [isActiveSmartWallet, isActiveEOAWallet, handleAASendTransaction, handleEOASwitchChainAndSendTransaction]);
165
165
  return {
166
166
  switchChainAndExecute,
167
+ switchChainAndExecuteWithEOA: handleEOASwitchChainAndSendTransaction,
167
168
  isSwitchingOrExecuting,
168
169
  isActiveSmartWallet,
169
170
  isActiveEOAWallet,
@@ -88,9 +88,9 @@ export declare const getViemChainConfig: (config: ChainNetworks) => {
88
88
  readonly rpc: string;
89
89
  readonly icon: {
90
90
  format: string;
91
- url: string;
92
- width: number;
93
91
  height: number;
92
+ width: number;
93
+ url: string;
94
94
  };
95
95
  };
96
96
  export declare const thirdwebB3Testnet: ThirdwebChain;
@@ -10,9 +10,9 @@ export declare const supportedChainNetworks: {
10
10
  testnet?: boolean | undefined;
11
11
  fees?: Record<string, any> | undefined;
12
12
  formatters?: Record<string, any> | undefined;
13
+ color?: string | undefined;
13
14
  testnetConfigID?: number | undefined;
14
15
  badge?: string | undefined;
15
- color?: string | undefined;
16
16
  enabledFeatures?: string[] | undefined;
17
17
  blockExplorers: {
18
18
  default: string;
@@ -35,13 +35,13 @@ export declare const supportedChainNetworks: {
35
35
  uri: string;
36
36
  }[];
37
37
  };
38
- _id: string | {};
39
38
  icon: {
40
39
  format: string;
41
- url: string;
42
- width: number;
43
40
  height: number;
41
+ width: number;
42
+ url: string;
44
43
  };
44
+ _id: string | {};
45
45
  }[];
46
46
  export declare const coingeckoChains: Record<number, {
47
47
  coingecko_id: string;
@@ -36,7 +36,7 @@ export function AnySpendDepositHype(props) {
36
36
  }
37
37
  function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, depositContractAddress, mainFooter, }) {
38
38
  // Use shared flow hook
39
- const { activePanel, setActivePanel, orderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, dstAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, anyspendQuote, isLoadingAnyspendQuote, getAnyspendQuoteError, activeInputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = useAnyspendFlow({
39
+ const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, dstAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, anyspendQuote, isLoadingAnyspendQuote, getAnyspendQuoteError, activeInputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = useAnyspendFlow({
40
40
  paymentType,
41
41
  recipientAddress,
42
42
  loadOrder,
@@ -215,6 +215,7 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
215
215
  };
216
216
  // Order details view
217
217
  const orderDetailsView = (_jsx("div", { className: "mx-auto w-[460px] max-w-full", children: _jsx("div", { className: "relative flex flex-col gap-4", children: oat && (_jsxs(_Fragment, { children: [_jsx(OrderStatus, { order: oat.data.order, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod }), _jsx(OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTx: oat.data.relayTx, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: paymentType === "fiat" ? CryptoPaymentMethodType.NONE : selectedCryptoPaymentMethod, onBack: () => {
218
+ setOrderId(undefined);
218
219
  setActivePanel(PanelView.MAIN);
219
220
  onSuccess?.();
220
221
  } })] })) }) }));
@@ -233,6 +234,7 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
233
234
  setSelectedFiatPaymentMethod(method);
234
235
  setActivePanel(PanelView.MAIN);
235
236
  }, srcAmountOnRamp: srcAmount }));
237
+ console.log("activePanel", activePanel, orderId, oat);
236
238
  // If showing token selection, render with panel transitions
237
239
  return (_jsx(StyleRoot, { children: _jsx("div", { className: cn("anyspend-container font-inter mx-auto w-full max-w-[460px]", mode === "page" &&
238
240
  "bg-as-surface-primary border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsx(TransitionPanel, { activeIndex: orderId
@@ -2,13 +2,16 @@
2
2
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { RELAY_SOLANA_MAINNET_CHAIN_ID } from "../../../../anyspend/index.js";
4
4
  import { ShinyButton, useProfile } from "../../../../global-account/react/index.js";
5
+ import centerTruncate from "../../../../shared/utils/centerTruncate.js";
5
6
  import { formatTokenAmount } from "../../../../shared/utils/number.js";
6
7
  import { motion } from "framer-motion";
7
8
  import { ChevronRight, Loader2 } from "lucide-react";
9
+ import { useAccount } from "wagmi";
8
10
  import { OrderDetailsCollapsible } from "./OrderDetailsCollapsible.js";
9
11
  export default function ConnectWalletPayment({ order, onPayment, txLoading, isSwitchingOrExecuting, phantomWalletAddress, tournament, nft, }) {
10
12
  const profile = useProfile({ address: order.recipientAddress });
11
13
  const recipientName = profile.data?.name?.replace(/\.b3\.fun/g, "");
14
+ const { address: connectedAddress } = useAccount();
12
15
  const srcToken = order.metadata.srcToken;
13
16
  const dstToken = order.metadata.dstToken;
14
17
  const expectedDstAmount = order.type === "mint_nft" ||
@@ -23,5 +26,7 @@ export default function ConnectWalletPayment({ order, onPayment, txLoading, isSw
23
26
  }
24
27
  return (_jsx("div", { className: "flex w-full flex-col items-center gap-6", children: _jsxs(motion.div, { initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, transition: { delay: 0.5 }, className: "flex w-full flex-col items-center gap-2", children: [_jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 max-w-[400px] items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: onPayment, children: txLoading ? (_jsxs(_Fragment, { children: ["Transaction Pending", _jsx(Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "whitespace-nowrap pl-4 text-lg md:text-sm", children: order.srcChain === RELAY_SOLANA_MAINNET_CHAIN_ID && phantomWalletAddress
25
28
  ? "Pay from Phantom Wallet"
26
- : "Pay from Connected Wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) }), _jsx("div", { className: "mt-4", children: _jsx(OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount }) })] }) }));
29
+ : "Pay from Connected Wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) }), _jsxs("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to:", " ", order.srcChain === RELAY_SOLANA_MAINNET_CHAIN_ID && phantomWalletAddress
30
+ ? centerTruncate(phantomWalletAddress, 6)
31
+ : centerTruncate(connectedAddress || "")] }), _jsx("div", { className: "mt-4", children: _jsx(OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount }) })] }) }));
27
32
  }
@@ -1,17 +1,13 @@
1
1
  "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
3
  import { useAccountWallet } from "../../../../global-account/react/index.js";
4
- import { thirdwebB3Mainnet } from "../../../../shared/constants/chains/b3Chain.js";
5
4
  import { cn } from "../../../../shared/utils/cn.js";
6
5
  import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
7
- import { client } from "../../../../shared/utils/thirdweb.js";
8
- import { ChevronLeft, ChevronRightCircle, Wallet, X } from "lucide-react";
6
+ import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-react";
9
7
  import { useState } from "react";
10
8
  import { createPortal } from "react-dom";
11
9
  import { toast } from "sonner";
12
- import { ConnectEmbed, lightTheme, useActiveWallet, useDisconnect as useThirdwebDisconnect } from "thirdweb/react";
13
- import { createWallet } from "thirdweb/wallets";
14
- import { useDisconnect } from "wagmi";
10
+ import { useAccount, useConnect, useDisconnect, useWalletClient } from "wagmi";
15
11
  export var CryptoPaymentMethodType;
16
12
  (function (CryptoPaymentMethodType) {
17
13
  CryptoPaymentMethodType["NONE"] = "none";
@@ -20,45 +16,138 @@ export var CryptoPaymentMethodType;
20
16
  })(CryptoPaymentMethodType || (CryptoPaymentMethodType = {}));
21
17
  export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod, isCreatingOrder, onBack, onSelectPaymentMethod, }) {
22
18
  const { wallet: globalWallet } = useAccountWallet();
23
- const activeWallet = useActiveWallet();
19
+ const { address, isConnected, connector } = useAccount();
20
+ const { connect, connectors, isPending } = useConnect();
24
21
  const { disconnect } = useDisconnect();
25
- const { disconnect: disconnectThirdweb } = useThirdwebDisconnect();
22
+ const { data: walletClient } = useWalletClient();
26
23
  const [showWalletModal, setShowWalletModal] = useState(false);
27
- // Define available wallets for the modal
28
- const availableWallets = [
29
- createWallet("io.metamask"),
30
- // createWallet("com.coinbase.wallet"),
31
- createWallet("me.rainbow"),
32
- createWallet("walletConnect"),
33
- createWallet("io.rabby"),
34
- createWallet("app.phantom"),
35
- ];
36
- return (_jsxs("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full", children: [_jsxs("div", { className: cn("relative flex flex-col gap-10"), children: [_jsx("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary absolute flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }), _jsx("div", { className: "flex items-center justify-around gap-4", children: _jsx("div", { className: "flex-1 text-center", children: _jsx("h2", { className: "text-as-primary text-lg font-semibold", children: "Choose payment method" }) }) }), _jsxs("div", { className: "crypto-payment-methods flex flex-col gap-3", children: [!activeWallet ? (
37
- // Not connected - show single connect button
38
- _jsxs("button", { onClick: () => setShowWalletModal(true), className: "crypto-payment-method-connect-wallet bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-4 w-4 text-blue-600" }) }), _jsxs("div", { className: "flex flex-col items-start text-left", children: [_jsx("h4", { className: "text-as-primary font-semibold", children: "Connect wallet" }), _jsx("p", { className: "text-as-primary/60 text-sm", children: "Choose from multiple wallet options" })] })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })) : (
39
- // Connected - show wallet info
40
- _jsx("div", { className: "crypto-payment-method-connect-wallet wallet-connected bg-as-surface-primary border-as-border-secondary rounded-xl border", children: _jsxs("div", { className: "flex items-center justify-between p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [globalWallet?.meta?.icon ? (_jsx("img", { src: globalWallet.meta.icon, alt: "Connected Wallet", className: "h-8 w-8 rounded-full" })) : (_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-green-100", children: _jsx(Wallet, { className: "h-4 w-4 text-green-600" }) })), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(activeWallet.getAccount()?.address || "") })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("button", { onClick: () => {
41
- setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
42
- onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
43
- }, className: "bg-as-brand hover:bg-as-brand/90 rounded-lg px-3 py-1.5 text-sm font-medium text-white transition-colors", children: "Use Wallet" }), _jsx("button", { onClick: async () => {
44
- disconnect();
45
- disconnectThirdweb(activeWallet);
46
- toast.success("Wallet disconnected");
47
- if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
48
- setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
49
- }
50
- }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) })), _jsxs("button", { onClick: () => {
24
+ const [selectedWalletConnector, setSelectedWalletConnector] = useState(null);
25
+ const [modalStep, setModalStep] = useState("wallet-selection");
26
+ // Define available wallet connectors
27
+ const availableConnectors = connectors.filter(connector => ["MetaMask", "WalletConnect", "Coinbase Wallet", "Rainbow"].includes(connector.name));
28
+ // Define wallet options with icons and info
29
+ const walletOptions = [
30
+ {
31
+ id: "metamask",
32
+ name: "MetaMask",
33
+ icon: "🦊",
34
+ description: "Connect using MetaMask browser extension",
35
+ connector: availableConnectors.find(c => c.name === "MetaMask"),
36
+ },
37
+ {
38
+ id: "coinbase",
39
+ name: "Coinbase Wallet",
40
+ icon: "🔵",
41
+ description: "Connect using Coinbase Wallet",
42
+ connector: availableConnectors.find(c => c.name === "Coinbase Wallet"),
43
+ },
44
+ {
45
+ id: "rainbow",
46
+ name: "Rainbow",
47
+ icon: "🌈",
48
+ description: "Connect using Rainbow wallet",
49
+ connector: availableConnectors.find(c => c.name === "Rainbow"),
50
+ },
51
+ {
52
+ id: "walletconnect",
53
+ name: "WalletConnect",
54
+ icon: "🔗",
55
+ description: "Connect using WalletConnect protocol",
56
+ connector: availableConnectors.find(c => c.name === "WalletConnect"),
57
+ },
58
+ ].filter(wallet => wallet.connector); // Only show wallets that have available connectors
59
+ // Reset modal state when closing
60
+ const handleCloseModal = () => {
61
+ setShowWalletModal(false);
62
+ setModalStep("wallet-selection");
63
+ setSelectedWalletConnector(null);
64
+ };
65
+ // Function to request wallet permissions for specific wallet
66
+ const requestWalletPermissions = async (walletConnector) => {
67
+ try {
68
+ // If a specific wallet connector is provided and it's different from current
69
+ if (walletConnector && connector?.name !== walletConnector.name) {
70
+ // Disconnect current and connect to the selected wallet
71
+ // if (isConnected) {
72
+ // disconnect();
73
+ // // Small delay to ensure disconnection
74
+ // await new Promise(resolve => setTimeout(resolve, 100));
75
+ // }
76
+ await connect({ connector: walletConnector });
77
+ setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
78
+ onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
79
+ toast.success(`Connected to ${walletConnector.name}`);
80
+ return;
81
+ }
82
+ // If same wallet or no specific wallet, request permissions for account switching
83
+ if (walletClient && "request" in walletClient) {
84
+ await walletClient.request({
85
+ method: "wallet_requestPermissions",
86
+ params: [{ eth_accounts: {} }],
87
+ });
88
+ toast.success("Account selection completed");
89
+ setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
90
+ onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
91
+ }
92
+ else {
93
+ // Fallback: show modal for manual wallet selection
94
+ setShowWalletModal(true);
95
+ }
96
+ }
97
+ catch (error) {
98
+ console.error("Failed to request wallet permissions:", error);
99
+ if (error && typeof error === "object" && "message" in error) {
100
+ const errorMessage = error.message.toLowerCase();
101
+ if (errorMessage.includes("rejected") ||
102
+ errorMessage.includes("denied") ||
103
+ errorMessage.includes("cancelled")) {
104
+ toast.error("Account selection cancelled");
105
+ }
106
+ else {
107
+ toast.error("Failed to open account selection");
108
+ }
109
+ }
110
+ else {
111
+ toast.error("Failed to open account selection");
112
+ }
113
+ }
114
+ };
115
+ return (_jsxs("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full", children: [_jsxs("div", { className: cn("relative flex flex-col gap-10"), children: [_jsx("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary absolute flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }), _jsx("div", { className: "flex items-center justify-around gap-4", children: _jsx("div", { className: "flex-1 text-center", children: _jsx("h2", { className: "text-as-primary text-lg font-semibold", children: "Select a payment method" }) }) }), _jsxs("div", { className: "crypto-payment-methods flex flex-col gap-6", children: [_jsxs("button", { onClick: () => {
116
+ // Always show wallet selection modal first
117
+ setShowWalletModal(true);
118
+ }, className: "crypto-payment-method-connect-wallet bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-4 w-4 text-blue-600" }) }), _jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Connect wallet" }) })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] }), _jsxs("button", { onClick: () => {
51
119
  setSelectedPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
52
120
  onSelectPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
53
- }, disabled: isCreatingOrder, className: "crypto-payment-method-transfer bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Transfer crypto" }) }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })] })] }), showWalletModal &&
54
- createPortal(_jsx("div", { className: "pointer-events-auto fixed inset-0 z-[9999] flex items-center justify-center bg-black/50", children: _jsxs("div", { className: "max-h-[80vh] w-[400px] max-w-[90vw] overflow-auto rounded-xl bg-white p-6 dark:bg-gray-900", children: [_jsxs("div", { className: "mb-4 flex items-center justify-between", children: [_jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: "Connect Wallet" }), _jsx("button", { onClick: () => setShowWalletModal(false), className: "text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: _jsx(X, { className: "h-5 w-5" }) })] }), _jsx(ConnectEmbed, { client: client, chain: thirdwebB3Mainnet, wallets: availableWallets, showThirdwebBranding: false, theme: lightTheme(), onConnect: async (wallet) => {
55
- console.log("Wallet connected:", wallet);
56
- // setShowWalletModal(false);
57
- setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
58
- onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
59
- setShowWalletModal(false);
60
- }, style: {
61
- width: "100%",
62
- minHeight: "300px",
63
- } })] }) }), typeof window !== "undefined" ? document.getElementById("b3-root") || document.body : document.body)] }));
121
+ }, disabled: isCreatingOrder, className: "crypto-payment-method-transfer bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-orange-100", children: _jsx(ZapIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Transfer crypto" }) })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] }), isConnected && (_jsxs("div", { className: "installed-wallets", children: [_jsx("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Connected wallets" }), _jsx("div", { className: "space-y-2", children: _jsx("button", { onClick: () => {
122
+ setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
123
+ onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
124
+ toast.success(`Selected ${connector?.name || "wallet"}`);
125
+ }, className: cn("crypto-payment-method-connect-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET
126
+ ? "connected-wallet border-as-brand bg-as-brand/5"
127
+ : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80"), children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [globalWallet?.meta?.icon ? (_jsx("img", { src: globalWallet.meta.icon, alt: "Wallet", className: "h-10 w-10 rounded-full" })) : (_jsx("div", { className: "wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-5 w-5 text-blue-600" }) })), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: connector?.name || "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(address || "") })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET && (_jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })), _jsx("button", { onClick: e => {
128
+ e.stopPropagation();
129
+ disconnect();
130
+ toast.success("Wallet disconnected");
131
+ if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
132
+ setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
133
+ }
134
+ }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) }) })] }))] })] }), showWalletModal &&
135
+ createPortal(_jsx("div", { className: "pointer-events-auto fixed inset-0 z-[9999] flex items-center justify-center bg-black/50", children: _jsxs("div", { className: "max-h-[80vh] w-[400px] max-w-[90vw] overflow-auto rounded-xl bg-white p-6 dark:bg-gray-900", children: [_jsxs("div", { className: "mb-4 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [modalStep === "account-selection" && (_jsx("button", { onClick: () => setModalStep("wallet-selection"), className: "text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: _jsx(ChevronLeft, { className: "h-5 w-5" }) })), _jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: modalStep === "wallet-selection"
136
+ ? "Select a payment method"
137
+ : `Connect ${selectedWalletConnector?.name}` })] }), _jsx("button", { onClick: handleCloseModal, className: "text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: _jsx(X, { className: "h-5 w-5" }) })] }), _jsx("div", { className: "space-y-4", children: modalStep === "wallet-selection" ? (_jsx(_Fragment, { children: _jsxs("div", { className: "space-y-3", children: [_jsx("h4", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: isConnected ? "Switch wallet or account" : "Choose wallet to connect" }), walletOptions.map(walletOption => {
138
+ const isCurrentWallet = isConnected && connector?.name === walletOption.connector?.name;
139
+ return (_jsx("button", { onClick: async () => {
140
+ setSelectedWalletConnector(walletOption.connector);
141
+ setModalStep("account-selection");
142
+ }, disabled: isPending, className: `w-full rounded-xl border p-4 text-left transition-all hover:shadow-md disabled:opacity-50 ${isCurrentWallet
143
+ ? "border-blue-500 bg-blue-50 dark:bg-blue-900/20"
144
+ : "border-gray-200 bg-white hover:border-gray-300 dark:border-gray-600 dark:bg-gray-800 dark:hover:border-gray-500"}`, children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: `flex h-12 w-12 items-center justify-center rounded-xl text-xl ${isCurrentWallet ? "bg-blue-100 dark:bg-blue-800" : "bg-gray-100 dark:bg-gray-700"}`, children: walletOption.icon }), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "text-sm font-semibold text-gray-900 dark:text-white", children: walletOption.name }), isCurrentWallet && (_jsx("span", { className: "rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-800 dark:text-blue-200", children: "Connected" }))] }), _jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: isCurrentWallet ? "Switch account or reconnect" : walletOption.description })] })] }), _jsx(ChevronRightCircle, { className: "h-5 w-5 text-gray-400" })] }) }, walletOption.id));
145
+ })] }) })) : (
146
+ /* Account Selection Step */
147
+ _jsxs("div", { className: "space-y-4", children: [_jsxs("p", { className: "text-sm text-gray-600 dark:text-gray-400", children: ["Connect to ", selectedWalletConnector?.name, " to view available accounts"] }), _jsx("button", { onClick: async () => {
148
+ handleCloseModal();
149
+ await requestWalletPermissions(selectedWalletConnector);
150
+ }, disabled: isPending, className: "w-full rounded-lg border border-gray-200 bg-white p-4 text-center transition-all hover:border-gray-300 hover:shadow-md disabled:opacity-50 dark:border-gray-600 dark:bg-gray-800 dark:hover:border-gray-500", children: _jsxs("div", { className: "flex items-center justify-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-gray-100 dark:bg-gray-700", children: _jsx(Wallet, { className: "h-5 w-5 text-gray-600 dark:text-gray-400" }) }), _jsxs("div", { children: [_jsx("div", { className: "text-sm font-medium text-gray-900 dark:text-white", children: isPending
151
+ ? `Connecting to ${selectedWalletConnector?.name}...`
152
+ : `Connect ${selectedWalletConnector?.name}` }), _jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: isPending ? "Please check your wallet" : "Click to connect and select account" })] })] }) })] })) })] }) }), typeof window !== "undefined" ? document.getElementById("b3-root") || document.body : document.body)] }));
64
153
  }
@@ -139,7 +139,7 @@ export const OrderDetails = memo(function OrderDetails({ mode = "modal", order,
139
139
  const [txHash, setTxHash] = useState();
140
140
  const [showQRCode, setShowQRCode] = useState(false);
141
141
  const { isLoading: txLoading, isSuccess: txSuccess } = useWaitForTransactionReceipt({ hash: txHash });
142
- const { switchChainAndExecute, isSwitchingOrExecuting } = useUnifiedChainSwitchAndExecute();
142
+ const { switchChainAndExecuteWithEOA, isSwitchingOrExecuting } = useUnifiedChainSwitchAndExecute();
143
143
  const { colorMode } = useColorMode();
144
144
  const roundedUpSrcAmount = useMemo(() => {
145
145
  // Display the full transfer amount without rounding since users need to see the exact value they're transferring.
@@ -169,11 +169,11 @@ export const OrderDetails = memo(function OrderDetails({ mode = "modal", order,
169
169
  to = order.srcTokenAddress;
170
170
  value = BigInt(0);
171
171
  }
172
- const txHash = await switchChainAndExecute(order.srcChain, { to, data: txData, value });
172
+ const txHash = await switchChainAndExecuteWithEOA(order.srcChain, { to, data: txData, value });
173
173
  if (txHash) {
174
174
  setTxHash(txHash);
175
175
  }
176
- }, [order, switchChainAndExecute]);
176
+ }, [order, switchChainAndExecuteWithEOA]);
177
177
  // Main payment handler that triggers chain switch and payment
178
178
  const handlePayment = async () => {
179
179
  console.log("Initiating payment process. Target chain:", order.srcChain, "Current chain:", walletClient?.chain?.id);
@@ -1,18 +1,20 @@
1
1
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Input, useAccountWallet, useTokenData } from "../../../../global-account/react/index.js";
2
+ import { Input, useProfile, useTokenData } from "../../../../global-account/react/index.js";
3
3
  import { formatUsername } from "../../../../shared/utils/index.js";
4
4
  import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
5
5
  import { formatDisplayNumber } from "../../../../shared/utils/number.js";
6
6
  import { ChevronRight } from "lucide-react";
7
7
  import { motion } from "motion/react";
8
8
  import { useEffect, useRef } from "react";
9
+ import { useAccount } from "wagmi";
9
10
  import { CryptoPaymentMethodType } from "./CryptoPaymentMethod.js";
10
11
  import { FiatPaymentMethod } from "./FiatPaymentMethod.js";
11
12
  import { OrderTokenAmount } from "./OrderTokenAmount.js";
12
13
  import { TokenBalance } from "./TokenBalance.js";
13
14
  export function PaySection({ paymentType, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, selectedFiatPaymentMethod, onSelectCryptoPaymentMethod, onSelectFiatPaymentMethod, anyspendQuote, }) {
14
- const { address: globalAddress, wallet: globalWallet, ensName: connectedName } = useAccountWallet();
15
- const connectedAddress = globalWallet?.address;
15
+ const { address: connectedAddress, isConnected } = useAccount();
16
+ const { data: profileData } = useProfile({ address: connectedAddress });
17
+ const connectedName = profileData?.displayName;
16
18
  const { data: srcTokenMetadata } = useTokenData(selectedSrcToken?.chainId, selectedSrcToken?.address);
17
19
  // Add ref to track if we've applied metadata
18
20
  const appliedSrcMetadataRef = useRef(false);
@@ -38,13 +40,13 @@ export function PaySection({ paymentType, selectedSrcChainId, setSelectedSrcChai
38
40
  useEffect(() => {
39
41
  appliedSrcMetadataRef.current = false;
40
42
  }, [selectedSrcToken.address, selectedSrcToken.chainId]);
41
- return (_jsxs(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "bg-as-surface-secondary border-as-border-secondary relative flex w-full flex-col gap-2 rounded-2xl border p-4 sm:p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-as-primary/50 flex h-7 items-center text-sm", children: "Pay" }), paymentType === "crypto" ? (_jsx("button", { className: "text-as-tertiarry flex h-7 items-center gap-2 text-sm transition-colors", onClick: onSelectCryptoPaymentMethod, children: selectedCryptoPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET ? (_jsxs(_Fragment, { children: [globalAddress ? (_jsx("div", { className: "flex items-center gap-1", children: connectedName ? formatUsername(connectedName) : shortenAddress(connectedAddress || "") })) : ("Connect wallet"), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : selectedCryptoPaymentMethod === CryptoPaymentMethodType.TRANSFER_CRYPTO ? (_jsxs(_Fragment, { children: ["Transfer crypto", _jsx(ChevronRight, { className: "h-4 w-4" })] })) : (_jsxs(_Fragment, { children: ["Select payment method", _jsx(ChevronRight, { className: "h-4 w-4" })] })) })) : (_jsx("button", { className: "text-as-tertiarry flex h-7 items-center gap-2 text-sm transition-colors", onClick: onSelectFiatPaymentMethod, children: selectedFiatPaymentMethod === FiatPaymentMethod.COINBASE_PAY ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-blue-600", children: _jsx("span", { className: "text-xs font-bold text-white", children: "C" }) }), "Coinbase Pay"] }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : selectedFiatPaymentMethod === FiatPaymentMethod.STRIPE ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-blue-600", children: _jsx("span", { className: "text-xs font-bold text-white", children: "S" }) }), "Credit/Debit Card"] }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : (_jsxs(_Fragment, { children: ["Select payment method", _jsx(ChevronRight, { className: "h-4 w-4" })] })) }))] }), paymentType === "crypto" ? (_jsxs(_Fragment, { children: [_jsx(OrderTokenAmount, { address: globalAddress, context: "from", inputValue: srcAmount, onChangeInput: value => {
43
+ return (_jsxs(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "bg-as-surface-secondary border-as-border-secondary relative flex w-full flex-col gap-2 rounded-2xl border p-4 sm:p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-as-primary/50 flex h-7 items-center text-sm", children: "Pay" }), paymentType === "crypto" ? (_jsx("button", { className: "text-as-tertiarry flex h-7 items-center gap-2 text-sm transition-colors focus:!outline-none", onClick: onSelectCryptoPaymentMethod, children: selectedCryptoPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET ? (_jsxs(_Fragment, { children: [isConnected ? (_jsx("div", { className: "flex items-center gap-1", children: connectedName ? formatUsername(connectedName) : shortenAddress(connectedAddress || "") })) : ("Connect wallet"), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : selectedCryptoPaymentMethod === CryptoPaymentMethodType.TRANSFER_CRYPTO ? (_jsxs(_Fragment, { children: ["Transfer crypto", _jsx(ChevronRight, { className: "h-4 w-4" })] })) : (_jsxs(_Fragment, { children: ["Select payment method", _jsx(ChevronRight, { className: "h-4 w-4" })] })) })) : (_jsx("button", { className: "text-as-tertiarry flex h-7 items-center gap-2 text-sm transition-colors", onClick: onSelectFiatPaymentMethod, children: selectedFiatPaymentMethod === FiatPaymentMethod.COINBASE_PAY ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-blue-600", children: _jsx("span", { className: "text-xs font-bold text-white", children: "C" }) }), "Coinbase Pay"] }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : selectedFiatPaymentMethod === FiatPaymentMethod.STRIPE ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-blue-600", children: _jsx("span", { className: "text-xs font-bold text-white", children: "S" }) }), "Credit/Debit Card"] }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) : (_jsxs(_Fragment, { children: ["Select payment method", _jsx(ChevronRight, { className: "h-4 w-4" })] })) }))] }), paymentType === "crypto" ? (_jsxs(_Fragment, { children: [_jsx(OrderTokenAmount, { address: connectedAddress, context: "from", inputValue: srcAmount, onChangeInput: value => {
42
44
  setIsSrcInputDirty(true);
43
45
  setSrcAmount(value);
44
46
  }, chainId: selectedSrcChainId, setChainId: setSelectedSrcChainId, token: selectedSrcToken, setToken: setSelectedSrcToken }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-as-primary/50 flex h-5 items-center text-sm", children: formatDisplayNumber(anyspendQuote?.data?.currencyIn?.amountUsd, {
45
47
  style: "currency",
46
48
  fallback: "",
47
- }) }), _jsx(TokenBalance, { token: selectedSrcToken, walletAddress: globalAddress, onChangeInput: value => {
49
+ }) }), _jsx(TokenBalance, { token: selectedSrcToken, walletAddress: connectedAddress, onChangeInput: value => {
48
50
  setIsSrcInputDirty(true);
49
51
  setSrcAmount(value);
50
52
  } })] })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex items-center justify-center pb-2 pt-8", children: _jsxs("div", { className: "flex gap-1", children: [_jsx("span", { className: "text-as-tertiarry text-2xl font-bold", children: "$" }), _jsx(Input, { type: "text", value: srcAmount, onChange: e => setSrcAmount(e.target.value.replace(/[^0-9.]/g, "")), placeholder: "5", className: "text-as-primary placeholder:text-as-primary/50 h-auto min-w-[70px] border-0 bg-transparent p-0 px-3 pt-1 text-4xl font-bold focus-visible:ring-0 focus-visible:ring-offset-0", style: {