@b3dotfun/sdk 0.0.33-alpha.5 → 0.0.33-alpha.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/anyspend/react/components/AnySpend.js +1 -1
- package/dist/cjs/anyspend/react/components/AnySpendCustom.js +1 -1
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.d.ts +0 -1
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +5 -36
- package/dist/cjs/anyspend/react/components/common/InsufficientDepositPayment.d.ts +12 -0
- package/dist/cjs/anyspend/react/components/common/InsufficientDepositPayment.js +25 -0
- package/dist/cjs/anyspend/react/components/common/OrderDetails.d.ts +3 -3
- package/dist/cjs/anyspend/react/components/common/OrderDetails.js +40 -36
- package/dist/cjs/anyspend/react/components/common/OrderStatus.js +1 -1
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts +3 -3
- package/dist/cjs/anyspend/react/hooks/useAnyspendOrderAndTransactions.d.ts +6 -6
- package/dist/cjs/anyspend/react/hooks/useAnyspendOrderHistory.d.ts +54 -10
- package/dist/cjs/anyspend/react/hooks/useAnyspendQuote.js +1 -1
- package/dist/cjs/anyspend/types/api.d.ts +130 -14
- package/dist/cjs/anyspend/utils/chain.js +1 -1
- package/dist/cjs/anyspend/utils/format.js +1 -0
- package/dist/cjs/anyspend/utils/orderPayload.js +7 -0
- package/dist/cjs/global-account/react/stores/useModalStore.d.ts +0 -2
- package/dist/esm/anyspend/react/components/AnySpend.js +1 -1
- package/dist/esm/anyspend/react/components/AnySpendCustom.js +1 -1
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.d.ts +0 -1
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +6 -37
- package/dist/esm/anyspend/react/components/common/InsufficientDepositPayment.d.ts +12 -0
- package/dist/esm/anyspend/react/components/common/InsufficientDepositPayment.js +22 -0
- package/dist/esm/anyspend/react/components/common/OrderDetails.d.ts +3 -3
- package/dist/esm/anyspend/react/components/common/OrderDetails.js +40 -36
- package/dist/esm/anyspend/react/components/common/OrderStatus.js +1 -1
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts +3 -3
- package/dist/esm/anyspend/react/hooks/useAnyspendOrderAndTransactions.d.ts +6 -6
- package/dist/esm/anyspend/react/hooks/useAnyspendOrderHistory.d.ts +54 -10
- package/dist/esm/anyspend/react/hooks/useAnyspendQuote.js +1 -1
- package/dist/esm/anyspend/types/api.d.ts +130 -14
- package/dist/esm/anyspend/utils/chain.js +1 -1
- package/dist/esm/anyspend/utils/format.js +1 -0
- package/dist/esm/anyspend/utils/orderPayload.js +7 -0
- package/dist/esm/global-account/react/stores/useModalStore.d.ts +0 -2
- package/dist/types/anyspend/react/components/AnyspendDepositHype.d.ts +0 -1
- package/dist/types/anyspend/react/components/common/InsufficientDepositPayment.d.ts +12 -0
- package/dist/types/anyspend/react/components/common/OrderDetails.d.ts +3 -3
- package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts +3 -3
- package/dist/types/anyspend/react/hooks/useAnyspendOrderAndTransactions.d.ts +6 -6
- package/dist/types/anyspend/react/hooks/useAnyspendOrderHistory.d.ts +54 -10
- package/dist/types/anyspend/types/api.d.ts +130 -14
- package/dist/types/global-account/react/stores/useModalStore.d.ts +0 -2
- package/package.json +1 -1
- package/src/anyspend/react/components/AnySpend.tsx +1 -1
- package/src/anyspend/react/components/AnySpendCustom.tsx +1 -1
- package/src/anyspend/react/components/AnyspendDepositHype.tsx +5 -43
- package/src/anyspend/react/components/common/InsufficientDepositPayment.tsx +144 -0
- package/src/anyspend/react/components/common/OrderDetails.tsx +85 -64
- package/src/anyspend/react/components/common/OrderStatus.tsx +1 -1
- package/src/anyspend/react/hooks/useAnyspendQuote.ts +1 -1
- package/src/anyspend/types/api.ts +131 -11
- package/src/anyspend/utils/chain.ts +1 -1
- package/src/anyspend/utils/format.ts +1 -0
- package/src/anyspend/utils/orderPayload.ts +7 -0
- package/src/global-account/react/stores/useModalStore.ts +0 -2
|
@@ -417,18 +417,23 @@ export interface paths {
|
|
|
417
417
|
* }
|
|
418
418
|
* ]
|
|
419
419
|
*/
|
|
420
|
-
depositTxs: components["schemas"]["DepositTx"][]
|
|
421
|
-
/**
|
|
422
|
-
*
|
|
423
|
-
*
|
|
424
|
-
*
|
|
425
|
-
*
|
|
426
|
-
*
|
|
427
|
-
*
|
|
428
|
-
|
|
420
|
+
depositTxs: components["schemas"]["DepositTx"][];
|
|
421
|
+
/**
|
|
422
|
+
* @description Cross-chain relay transactions
|
|
423
|
+
* @example [
|
|
424
|
+
* {
|
|
425
|
+
* "orderId": "5392f7a7-d472-4d6b-9848-bd07117fb82d",
|
|
426
|
+
* "chain": 8453,
|
|
427
|
+
* "txHash": "0x9df917e14bb089f74763d1d2662761d75c97a5a068b8a9e411c3d384c9c40d19",
|
|
428
|
+
* "status": "success",
|
|
429
|
+
* "createdAt": 1752505817654
|
|
430
|
+
* }
|
|
431
|
+
* ]
|
|
432
|
+
*/
|
|
433
|
+
relayTxs: components["schemas"]["RelayTx"][];
|
|
429
434
|
executeTx: components["schemas"]["ExecuteTx"] | null;
|
|
430
435
|
/** @description Refund transactions if order failed */
|
|
431
|
-
refundTxs: components["schemas"]["RefundTx"][]
|
|
436
|
+
refundTxs: components["schemas"]["RefundTx"][];
|
|
432
437
|
};
|
|
433
438
|
/** @example 200 */
|
|
434
439
|
statusCode: number;
|
|
@@ -467,7 +472,7 @@ export interface paths {
|
|
|
467
472
|
"/orders/quote": {
|
|
468
473
|
/**
|
|
469
474
|
* Get anyspend quote
|
|
470
|
-
* @description Retrieves a quote to swap or
|
|
475
|
+
* @description Retrieves a quote to swap, execute contract, or participate in HypeDuel
|
|
471
476
|
*/
|
|
472
477
|
post: {
|
|
473
478
|
requestBody: {
|
|
@@ -591,6 +596,42 @@ export interface paths {
|
|
|
591
596
|
onrampVendor?: "coinbase" | "stripe" | "stripe-web2";
|
|
592
597
|
contractAddress: string;
|
|
593
598
|
fundAmount: string;
|
|
599
|
+
} | {
|
|
600
|
+
/**
|
|
601
|
+
* @description Order type for HypeDuel
|
|
602
|
+
* @enum {string}
|
|
603
|
+
*/
|
|
604
|
+
type: "hype_duel";
|
|
605
|
+
/**
|
|
606
|
+
* @description Source chain ID
|
|
607
|
+
* @example 1
|
|
608
|
+
*/
|
|
609
|
+
srcChain: number;
|
|
610
|
+
/**
|
|
611
|
+
* @description Destination chain ID
|
|
612
|
+
* @example 8453
|
|
613
|
+
*/
|
|
614
|
+
dstChain: number;
|
|
615
|
+
/**
|
|
616
|
+
* @description Source token contract address
|
|
617
|
+
* @example 0x0000000000000000000000000000000000000000
|
|
618
|
+
*/
|
|
619
|
+
srcTokenAddress: string;
|
|
620
|
+
/**
|
|
621
|
+
* @description Destination token contract address
|
|
622
|
+
* @example 0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913
|
|
623
|
+
*/
|
|
624
|
+
dstTokenAddress: string;
|
|
625
|
+
/**
|
|
626
|
+
* @description Amount to quote
|
|
627
|
+
* @example 1000000000000000000
|
|
628
|
+
*/
|
|
629
|
+
amount: string;
|
|
630
|
+
/**
|
|
631
|
+
* @description Optional onramp vendor
|
|
632
|
+
* @enum {string}
|
|
633
|
+
*/
|
|
634
|
+
onrampVendor?: "coinbase" | "stripe" | "stripe-web2";
|
|
594
635
|
};
|
|
595
636
|
};
|
|
596
637
|
};
|
|
@@ -1037,6 +1078,19 @@ export interface components {
|
|
|
1037
1078
|
*/
|
|
1038
1079
|
actualDstAmount: string | null;
|
|
1039
1080
|
};
|
|
1081
|
+
/** @description HypeDuel-specific payload */
|
|
1082
|
+
HypeDuelPayload: {
|
|
1083
|
+
/**
|
|
1084
|
+
* @description Expected amount of destination tokens
|
|
1085
|
+
* @example 990000
|
|
1086
|
+
*/
|
|
1087
|
+
expectedDstAmount: string;
|
|
1088
|
+
/**
|
|
1089
|
+
* @description Actual received amount (null for new orders)
|
|
1090
|
+
* @example 990000
|
|
1091
|
+
*/
|
|
1092
|
+
actualDstAmount: string | null;
|
|
1093
|
+
};
|
|
1040
1094
|
/** @description Custom execution payload */
|
|
1041
1095
|
CustomPayload: {
|
|
1042
1096
|
/**
|
|
@@ -1115,6 +1169,11 @@ export interface components {
|
|
|
1115
1169
|
srcToken: components["schemas"]["Token"];
|
|
1116
1170
|
dstToken: components["schemas"]["Token"];
|
|
1117
1171
|
};
|
|
1172
|
+
/** @description HypeDuel metadata for display purposes */
|
|
1173
|
+
HypeDuelMetadata: {
|
|
1174
|
+
srcToken: components["schemas"]["Token"];
|
|
1175
|
+
dstToken: components["schemas"]["Token"];
|
|
1176
|
+
};
|
|
1118
1177
|
/** @description Custom metadata for display purposes */
|
|
1119
1178
|
CustomMetadata: {
|
|
1120
1179
|
srcToken: components["schemas"]["Token"];
|
|
@@ -1185,7 +1244,7 @@ export interface components {
|
|
|
1185
1244
|
* @example executed
|
|
1186
1245
|
* @enum {string}
|
|
1187
1246
|
*/
|
|
1188
|
-
status: "scanning_deposit_transaction" | "waiting_stripe_payment" | "expired" | "sending_token_from_vault" | "relay" | "executed" | "refunding" | "refunded" | "failure";
|
|
1247
|
+
status: "scanning_deposit_transaction" | "waiting_stripe_payment" | "expired" | "sending_token_from_vault" | "relay" | "executing" | "executed" | "refunding" | "refunded" | "failure";
|
|
1189
1248
|
/** @description Error details if order failed */
|
|
1190
1249
|
errorDetails: string | null;
|
|
1191
1250
|
/**
|
|
@@ -1224,6 +1283,15 @@ export interface components {
|
|
|
1224
1283
|
payload: components["schemas"]["SwapPayload"];
|
|
1225
1284
|
metadata: components["schemas"]["SwapMetadata"];
|
|
1226
1285
|
};
|
|
1286
|
+
HypeDuelOrder: components["schemas"]["BaseOrder"] & {
|
|
1287
|
+
/**
|
|
1288
|
+
* @description Order type
|
|
1289
|
+
* @enum {string}
|
|
1290
|
+
*/
|
|
1291
|
+
type: "hype_duel";
|
|
1292
|
+
payload: components["schemas"]["HypeDuelPayload"];
|
|
1293
|
+
metadata: components["schemas"]["HypeDuelMetadata"];
|
|
1294
|
+
};
|
|
1227
1295
|
CustomOrder: components["schemas"]["BaseOrder"] & {
|
|
1228
1296
|
/**
|
|
1229
1297
|
* @description Order type
|
|
@@ -1260,7 +1328,7 @@ export interface components {
|
|
|
1260
1328
|
payload: components["schemas"]["FundTournamentPayload"];
|
|
1261
1329
|
metadata: components["schemas"]["TournamentMetadata"];
|
|
1262
1330
|
};
|
|
1263
|
-
Order: components["schemas"]["SwapOrder"] | components["schemas"]["CustomOrder"] | components["schemas"]["MintNftOrder"] | components["schemas"]["JoinTournamentOrder"] | components["schemas"]["FundTournamentOrder"];
|
|
1331
|
+
Order: components["schemas"]["SwapOrder"] | components["schemas"]["HypeDuelOrder"] | components["schemas"]["CustomOrder"] | components["schemas"]["MintNftOrder"] | components["schemas"]["JoinTournamentOrder"] | components["schemas"]["FundTournamentOrder"];
|
|
1264
1332
|
/** @description Swap order request */
|
|
1265
1333
|
SwapOrderRequest: {
|
|
1266
1334
|
/**
|
|
@@ -1309,6 +1377,54 @@ export interface components {
|
|
|
1309
1377
|
*/
|
|
1310
1378
|
creatorAddress?: string;
|
|
1311
1379
|
};
|
|
1380
|
+
/** @description HypeDuel order request */
|
|
1381
|
+
HypeDuelOrderRequest: {
|
|
1382
|
+
/**
|
|
1383
|
+
* @description Order type
|
|
1384
|
+
* @enum {string}
|
|
1385
|
+
*/
|
|
1386
|
+
type: "hype_duel";
|
|
1387
|
+
/**
|
|
1388
|
+
* @description Address to receive the destination tokens
|
|
1389
|
+
* @example 0x58241893EF1f86C9fBd8109Cd44Ea961fDb474e1
|
|
1390
|
+
*/
|
|
1391
|
+
recipientAddress: string;
|
|
1392
|
+
/**
|
|
1393
|
+
* @description Source chain ID
|
|
1394
|
+
* @example 1
|
|
1395
|
+
*/
|
|
1396
|
+
srcChain: number;
|
|
1397
|
+
/**
|
|
1398
|
+
* @description Destination chain ID
|
|
1399
|
+
* @example 8453
|
|
1400
|
+
*/
|
|
1401
|
+
dstChain: number;
|
|
1402
|
+
/**
|
|
1403
|
+
* @description Source token contract address
|
|
1404
|
+
* @example 0xA0b86a33E6441E8A91DEF8f5663ACb4C9B4a1234
|
|
1405
|
+
*/
|
|
1406
|
+
srcTokenAddress: string;
|
|
1407
|
+
/**
|
|
1408
|
+
* @description Destination token contract address
|
|
1409
|
+
* @example 0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913
|
|
1410
|
+
*/
|
|
1411
|
+
dstTokenAddress: string;
|
|
1412
|
+
/**
|
|
1413
|
+
* @description Amount of source tokens for HypeDuel
|
|
1414
|
+
* @example 1000000
|
|
1415
|
+
*/
|
|
1416
|
+
srcAmount: string;
|
|
1417
|
+
payload: components["schemas"]["HypeDuelPayload"];
|
|
1418
|
+
metadata: components["schemas"]["HypeDuelMetadata"];
|
|
1419
|
+
/** @description Optional partner identifier */
|
|
1420
|
+
partnerId?: string;
|
|
1421
|
+
onramp?: components["schemas"]["Onramp"];
|
|
1422
|
+
/**
|
|
1423
|
+
* @description Optional address of the order creator
|
|
1424
|
+
* @example 0x58241893EF1f86C9fBd8109Cd44Ea961fDb474e1
|
|
1425
|
+
*/
|
|
1426
|
+
creatorAddress?: string;
|
|
1427
|
+
};
|
|
1312
1428
|
/** @description Custom order request */
|
|
1313
1429
|
CustomOrderRequest: {
|
|
1314
1430
|
/**
|
|
@@ -1501,7 +1617,7 @@ export interface components {
|
|
|
1501
1617
|
*/
|
|
1502
1618
|
creatorAddress?: string;
|
|
1503
1619
|
};
|
|
1504
|
-
OrderRequest: components["schemas"]["SwapOrderRequest"] | components["schemas"]["CustomOrderRequest"] | components["schemas"]["MintNftOrderRequest"] | components["schemas"]["JoinTournamentOrderRequest"] | components["schemas"]["FundTournamentOrderRequest"];
|
|
1620
|
+
OrderRequest: components["schemas"]["SwapOrderRequest"] | components["schemas"]["HypeDuelOrderRequest"] | components["schemas"]["CustomOrderRequest"] | components["schemas"]["MintNftOrderRequest"] | components["schemas"]["JoinTournamentOrderRequest"] | components["schemas"]["FundTournamentOrderRequest"];
|
|
1505
1621
|
/** @description Deposit transaction (payment from user) */
|
|
1506
1622
|
DepositTx: {
|
|
1507
1623
|
/**
|
|
@@ -57,7 +57,7 @@ exports.EVM_MAINNET = {
|
|
|
57
57
|
name: "Arbitrum",
|
|
58
58
|
type: chain_1.ChainType.EVM,
|
|
59
59
|
logoUrl: "https://assets.relay.link/icons/square/42161/light.png",
|
|
60
|
-
nativeRequired: (0, viem_1.parseEther)("0.
|
|
60
|
+
nativeRequired: (0, viem_1.parseEther)("0.0003"),
|
|
61
61
|
canDepositNative: true,
|
|
62
62
|
defaultToken: (0, token_1.getEthToken)(chains_1.arbitrum.id),
|
|
63
63
|
nativeToken: (0, token_1.getEthToken)(chains_1.arbitrum.id),
|
|
@@ -41,6 +41,11 @@ const buildPayload = (orderType, params) => {
|
|
|
41
41
|
};
|
|
42
42
|
case "custom":
|
|
43
43
|
return { ...payload };
|
|
44
|
+
case "hype_duel":
|
|
45
|
+
return {
|
|
46
|
+
expectedDstAmount,
|
|
47
|
+
actualDstAmount: null,
|
|
48
|
+
};
|
|
44
49
|
default:
|
|
45
50
|
throw new Error(`Invalid order type: ${orderType}`);
|
|
46
51
|
}
|
|
@@ -62,6 +67,8 @@ const buildMetadata = (orderType, params) => {
|
|
|
62
67
|
return { ...baseMetadata, tournament };
|
|
63
68
|
case "custom":
|
|
64
69
|
return { ...baseMetadata, action: payload.action };
|
|
70
|
+
case "hype_duel":
|
|
71
|
+
return { ...baseMetadata };
|
|
65
72
|
default:
|
|
66
73
|
throw new Error(`Invalid order type: ${orderType}`);
|
|
67
74
|
}
|
|
@@ -280,8 +280,6 @@ export interface AnySpendDepositHypeProps extends BaseModalProps {
|
|
|
280
280
|
sourceTokenChainId?: number;
|
|
281
281
|
/** Payment type - crypto or fiat */
|
|
282
282
|
paymentType?: "crypto" | "fiat";
|
|
283
|
-
/** Deposit contract address */
|
|
284
|
-
depositContractAddress: string;
|
|
285
283
|
/** Main footer */
|
|
286
284
|
mainFooter?: React.ReactNode;
|
|
287
285
|
/** Callback function called when the deposit is successful */
|
|
@@ -650,7 +650,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
650
650
|
window.scrollTo({ top: 0, behavior: "smooth" });
|
|
651
651
|
}, [activePanel]);
|
|
652
652
|
const historyView = (_jsx("div", { className: "mx-auto flex w-[560px] max-w-full flex-col items-center", children: _jsx(OrderHistory, { mode: mode, onBack: () => setActivePanel(PanelView.MAIN), onSelectOrder: onSelectOrder }) }));
|
|
653
|
-
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,
|
|
653
|
+
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, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, onBack: () => {
|
|
654
654
|
setOrderId(undefined);
|
|
655
655
|
setActivePanel(PanelView.MAIN);
|
|
656
656
|
setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.NONE); // Reset payment method when going back
|
|
@@ -413,7 +413,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
413
413
|
const historyView = (_jsx("div", { className: cn("mx-auto flex w-full max-w-2xl flex-col items-center p-5", mode === "modal" && "bg-b3-react-background"), children: _jsx(OrderHistory, { mode: mode, onBack: () => {
|
|
414
414
|
setActivePanel(PanelView.HISTORY);
|
|
415
415
|
}, onSelectOrder: onSelectOrder }) }));
|
|
416
|
-
const orderDetailsView = (_jsxs("div", { className: cn("mx-auto flex w-full flex-col items-center gap-4", mode === "modal" && "bg-b3-react-background rounded-xl"), children: [oat && (_jsxs(_Fragment, { children: [_jsx(OrderStatusDisplay, { order: oat.data.order, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod }), _jsx(OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs,
|
|
416
|
+
const orderDetailsView = (_jsxs("div", { className: cn("mx-auto flex w-full flex-col items-center gap-4", mode === "modal" && "bg-b3-react-background rounded-xl"), children: [oat && (_jsxs(_Fragment, { children: [_jsx(OrderStatusDisplay, { order: oat.data.order, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod }), _jsx(OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: activeTab === "fiat" ? CryptoPaymentMethodType.NONE : selectedCryptoPaymentMethod, onBack: () => {
|
|
417
417
|
setOrderId(undefined);
|
|
418
418
|
setActivePanel(PanelView.CONFIRM_ORDER);
|
|
419
419
|
// Remove orderId from URL when canceling
|
|
@@ -10,7 +10,6 @@ export interface AnySpendDepositHypeProps {
|
|
|
10
10
|
sourceTokenAddress?: string;
|
|
11
11
|
sourceTokenChainId?: number;
|
|
12
12
|
onSuccess?: () => void;
|
|
13
|
-
depositContractAddress?: string;
|
|
14
13
|
mainFooter?: React.ReactNode;
|
|
15
14
|
}
|
|
16
15
|
export declare function AnySpendDepositHype(props: AnySpendDepositHypeProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { B3_TOKEN
|
|
2
|
+
import { B3_TOKEN } from "../../../anyspend/index.js";
|
|
3
3
|
import { Button, ShinyButton, StyleRoot, TransitionPanel } from "../../../global-account/react/index.js";
|
|
4
4
|
import { cn } from "../../../shared/utils/cn.js";
|
|
5
5
|
import invariant from "invariant";
|
|
6
6
|
import { motion } from "motion/react";
|
|
7
7
|
import { useMemo } from "react";
|
|
8
8
|
import { toast } from "sonner";
|
|
9
|
-
import { encodeFunctionData } from "viem";
|
|
10
9
|
import { base } from "viem/chains";
|
|
11
10
|
import { PanelView, useAnyspendFlow } from "../hooks/useAnyspendFlow.js";
|
|
12
11
|
import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper.js";
|
|
@@ -18,7 +17,6 @@ import { OrderDetails } from "./common/OrderDetails.js";
|
|
|
18
17
|
import { OrderStatus } from "./common/OrderStatus.js";
|
|
19
18
|
import { PaySection } from "./common/PaySection.js";
|
|
20
19
|
import { RecipientSelection } from "./common/RecipientSelection.js";
|
|
21
|
-
import { ESCROW_ABI } from "../../../anyspend/abis/escrow.js";
|
|
22
20
|
import { ArrowDown } from "lucide-react";
|
|
23
21
|
import { PanelOnramp } from "./common/PanelOnramp.js";
|
|
24
22
|
const SLIPPAGE_PERCENT = 3;
|
|
@@ -26,20 +24,11 @@ export const HYPE_TOKEN_DETAILS = {
|
|
|
26
24
|
SYMBOL: "HYPE",
|
|
27
25
|
LOGO_URI: "https://cdn.hypeduel.com/hypes-coin.svg",
|
|
28
26
|
};
|
|
29
|
-
function generateEncodedDataForDepositHype(amount, beneficiary) {
|
|
30
|
-
invariant(BigInt(amount) > 0, "Amount must be greater than zero");
|
|
31
|
-
const encodedData = encodeFunctionData({
|
|
32
|
-
abi: ESCROW_ABI,
|
|
33
|
-
functionName: "depositFor",
|
|
34
|
-
args: [beneficiary, B3_TOKEN.address, BigInt(amount)],
|
|
35
|
-
});
|
|
36
|
-
return encodedData;
|
|
37
|
-
}
|
|
38
27
|
export function AnySpendDepositHype(props) {
|
|
39
28
|
const fingerprintConfig = getFingerprintConfig();
|
|
40
29
|
return (_jsx(AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: _jsx(AnySpendDepositHypeInner, { ...props }) }));
|
|
41
30
|
}
|
|
42
|
-
function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess,
|
|
31
|
+
function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, }) {
|
|
43
32
|
// Use shared flow hook
|
|
44
33
|
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({
|
|
45
34
|
paymentType,
|
|
@@ -132,28 +121,17 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
|
|
|
132
121
|
try {
|
|
133
122
|
invariant(anyspendQuote, "Relay price is not found");
|
|
134
123
|
invariant(selectedRecipientAddress, "Recipient address is not found");
|
|
135
|
-
invariant(depositContractAddress, "Deposit contract address is not found");
|
|
136
124
|
const srcAmountBigInt = BigInt(activeInputAmountInWei);
|
|
137
|
-
// TODO: temp subtract 3% for slippage
|
|
138
|
-
const originalDepositAmountWei = anyspendQuote.data?.currencyOut?.amount || "0";
|
|
139
|
-
const depositAmountWei = ((BigInt(originalDepositAmountWei) * BigInt(100 - SLIPPAGE_PERCENT)) /
|
|
140
|
-
BigInt(100)).toString();
|
|
141
|
-
const encodedData = generateEncodedDataForDepositHype(depositAmountWei, selectedRecipientAddress);
|
|
142
125
|
createOrder({
|
|
143
126
|
recipientAddress: selectedRecipientAddress,
|
|
144
|
-
orderType: "
|
|
127
|
+
orderType: "hype_duel",
|
|
145
128
|
srcChain: selectedSrcChainId,
|
|
146
129
|
dstChain: base.id,
|
|
147
130
|
srcToken: selectedSrcToken,
|
|
148
131
|
dstToken: B3_TOKEN,
|
|
149
132
|
srcAmount: srcAmountBigInt.toString(),
|
|
133
|
+
expectedDstAmount: anyspendQuote?.data?.currencyOut?.amount?.toString() || "0",
|
|
150
134
|
creatorAddress: globalAddress,
|
|
151
|
-
payload: {
|
|
152
|
-
amount: depositAmountWei,
|
|
153
|
-
data: encodedData,
|
|
154
|
-
to: depositContractAddress,
|
|
155
|
-
action: DEPOSIT_HYPE_ACTION,
|
|
156
|
-
},
|
|
157
135
|
});
|
|
158
136
|
}
|
|
159
137
|
catch (err) {
|
|
@@ -166,7 +144,6 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
|
|
|
166
144
|
try {
|
|
167
145
|
invariant(anyspendQuote, "Relay price is not found");
|
|
168
146
|
invariant(selectedRecipientAddress, "Recipient address is not found");
|
|
169
|
-
invariant(depositContractAddress, "Deposit contract address is not found");
|
|
170
147
|
if (!srcAmount || parseFloat(srcAmount) <= 0) {
|
|
171
148
|
toast.error("Please enter a valid amount");
|
|
172
149
|
return;
|
|
@@ -194,11 +171,9 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
|
|
|
194
171
|
toast.error("Please select a payment method");
|
|
195
172
|
return;
|
|
196
173
|
}
|
|
197
|
-
const depositAmountWei = anyspendQuote.data?.currencyOut?.amount || "0";
|
|
198
|
-
const encodedData = generateEncodedDataForDepositHype(depositAmountWei, selectedRecipientAddress);
|
|
199
174
|
createOnrampOrder({
|
|
200
175
|
recipientAddress: selectedRecipientAddress,
|
|
201
|
-
orderType: "
|
|
176
|
+
orderType: "hype_duel",
|
|
202
177
|
dstChain: base.id,
|
|
203
178
|
dstToken: B3_TOKEN,
|
|
204
179
|
srcFiatAmount: srcAmount,
|
|
@@ -210,12 +185,6 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
|
|
|
210
185
|
},
|
|
211
186
|
expectedDstAmount: anyspendQuote?.data?.currencyOut?.amount?.toString() || "0",
|
|
212
187
|
creatorAddress: globalAddress,
|
|
213
|
-
payload: {
|
|
214
|
-
amount: depositAmountWei,
|
|
215
|
-
data: encodedData,
|
|
216
|
-
to: depositContractAddress,
|
|
217
|
-
action: DEPOSIT_HYPE_ACTION,
|
|
218
|
-
},
|
|
219
188
|
});
|
|
220
189
|
}
|
|
221
190
|
catch (err) {
|
|
@@ -224,7 +193,7 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
|
|
|
224
193
|
}
|
|
225
194
|
};
|
|
226
195
|
// Order details view
|
|
227
|
-
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,
|
|
196
|
+
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, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: paymentType === "fiat" ? CryptoPaymentMethodType.NONE : selectedCryptoPaymentMethod, onBack: () => {
|
|
228
197
|
setOrderId(undefined);
|
|
229
198
|
setActivePanel(PanelView.MAIN);
|
|
230
199
|
}, disableUrlParamManagement: true })] })) }) }));
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { components } from "../../../../anyspend/types/api";
|
|
2
|
+
interface InsufficientDepositPaymentProps {
|
|
3
|
+
order: components["schemas"]["Order"];
|
|
4
|
+
srcToken: components["schemas"]["Token"];
|
|
5
|
+
depositDeficit: bigint;
|
|
6
|
+
phantomWalletAddress: string | null;
|
|
7
|
+
txLoading: boolean;
|
|
8
|
+
isSwitchingOrExecuting: boolean;
|
|
9
|
+
onPayment: () => Promise<void>;
|
|
10
|
+
}
|
|
11
|
+
export declare function InsufficientDepositPayment({ order, srcToken, depositDeficit, phantomWalletAddress, txLoading, isSwitchingOrExecuting, onPayment, }: InsufficientDepositPaymentProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { ALL_CHAINS, getChainName, getPaymentUrl, RELAY_ETH_ADDRESS, RELAY_SOLANA_MAINNET_CHAIN_ID, } from "../../../../anyspend/index.js";
|
|
4
|
+
import { Badge, CopyToClipboard, ShinyButton, TextLoop } from "../../../../global-account/react/index.js";
|
|
5
|
+
import { cn } from "../../../../shared/utils/index.js";
|
|
6
|
+
import { b3 } from "viem/chains";
|
|
7
|
+
import { formatUnits } from "../../../../shared/utils/number.js";
|
|
8
|
+
import { WalletCoinbase, WalletMetamask, WalletPhantom, WalletTrust } from "@web3icons/react";
|
|
9
|
+
import { ChevronRight, Copy, Loader2 } from "lucide-react";
|
|
10
|
+
import { motion } from "motion/react";
|
|
11
|
+
import { QRCodeSVG } from "qrcode.react";
|
|
12
|
+
import { toast } from "sonner";
|
|
13
|
+
export function InsufficientDepositPayment({ order, srcToken, depositDeficit, phantomWalletAddress, txLoading, isSwitchingOrExecuting, onPayment, }) {
|
|
14
|
+
const depositDeficitAmount = formatUnits(depositDeficit.toString(), srcToken.decimals);
|
|
15
|
+
return (_jsxs("div", { className: "insufficient-deposit-payment relative flex w-full flex-1 flex-col", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "insufficient-deposit-payment-text text-as-primary/50", children: "Please send remaining" }), _jsxs("div", { className: "flex w-full flex-wrap items-center gap-6 sm:justify-between sm:gap-0", children: [_jsx(CopyToClipboard, { text: depositDeficitAmount, onCopy: () => {
|
|
16
|
+
toast.success("Copied to clipboard");
|
|
17
|
+
}, children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("strong", { className: "border-as-brand text-as-primary border-b-2 pb-1 text-2xl font-semibold sm:text-xl", children: [depositDeficitAmount, " ", srcToken.symbol] }), _jsx(Copy, { className: "text-as-primary/50 hover:text-as-primary h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), _jsxs(Badge, { variant: "outline", className: "flex h-10 items-center gap-2 px-3 py-1 pr-2 text-sm", children: ["on ", getChainName(order.srcChain), _jsx("img", { src: ALL_CHAINS[order.srcChain].logoUrl, alt: getChainName(order.srcChain), className: cn("h-6 rounded-full", order.srcChain === b3.id && "h-5 rounded-none") })] })] }), _jsx("span", { className: "text-as-primary/50 mb-1 mt-2", children: " to the address:" })] }), _jsx(CopyToClipboard, { text: order.globalAddress, onCopy: () => {
|
|
18
|
+
toast.success("Copied to clipboard");
|
|
19
|
+
}, children: _jsxs("div", { className: "payment-address bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [_jsx("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), _jsx(Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), _jsxs("div", { className: "payment-buttons mt-4 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
|
|
20
|
+
? "Pay from Phantom Wallet"
|
|
21
|
+
: "Pay from Connected Wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) }), _jsx("div", { children: "Or" }), _jsx(motion.div, { initial: { opacity: 0, filter: "blur(10px)" }, animate: { opacity: 1, filter: "blur(0px)" }, transition: { duration: 0.5, ease: "easeInOut" }, className: "flex w-full items-center justify-evenly gap-4", children: _jsxs("div", { className: "qr-code flex flex-col items-center rounded-lg pb-3", children: [_jsx(QRCodeSVG, { value: getPaymentUrl(order.globalAddress, BigInt(depositDeficit), order.srcTokenAddress === RELAY_ETH_ADDRESS ? srcToken?.symbol || "ETH" : order.srcTokenAddress, order.srcChain, srcToken?.decimals), className: "max-w-[200px]" }), _jsxs("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [_jsx("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), _jsxs(TextLoop, { interval: 3, children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" })] })] })] }) })] })] }));
|
|
22
|
+
}
|
|
@@ -3,10 +3,10 @@ import { CryptoPaymentMethodType } from "./CryptoPaymentMethod";
|
|
|
3
3
|
interface OrderDetailsProps {
|
|
4
4
|
mode?: "modal" | "page";
|
|
5
5
|
order: components["schemas"]["Order"];
|
|
6
|
-
depositTxs: components["schemas"]["DepositTx"][]
|
|
7
|
-
|
|
6
|
+
depositTxs: components["schemas"]["DepositTx"][];
|
|
7
|
+
relayTxs: components["schemas"]["RelayTx"][];
|
|
8
8
|
executeTx: components["schemas"]["ExecuteTx"] | null;
|
|
9
|
-
refundTxs: components["schemas"]["RefundTx"][]
|
|
9
|
+
refundTxs: components["schemas"]["RefundTx"][];
|
|
10
10
|
cryptoPaymentMethod?: CryptoPaymentMethodType;
|
|
11
11
|
onBack?: () => void;
|
|
12
12
|
disableUrlParamManagement?: boolean;
|