@0xsequence/marketplace-sdk 2.0.0 → 2.0.2
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/CHANGELOG.md +18 -0
- package/dist/BellIcon.js +1 -1
- package/dist/Card.js +1 -1
- package/dist/ShopCard.d.ts +4 -4
- package/dist/builder-api.js +1 -1
- package/dist/collectible.js +2 -2
- package/dist/collectible.js.map +1 -1
- package/dist/collection.js +1 -1
- package/dist/create-config.d.ts +589 -193
- package/dist/create-config.js +1 -1
- package/dist/currency.js +3 -3
- package/dist/currency.js.map +1 -1
- package/dist/dist.js +167 -148
- package/dist/dist.js.map +1 -1
- package/dist/expirationDateSelect.js +1 -1
- package/dist/filter-state.d.ts +1 -1
- package/dist/filters.d.ts +1 -1
- package/dist/index.d.ts +3 -3
- package/dist/index.js +3 -3
- package/dist/index10.d.ts +1 -1
- package/dist/index11.d.ts +17 -17
- package/dist/index12.d.ts +21 -21
- package/dist/index14.d.ts +3 -3
- package/dist/index15.d.ts +3 -3
- package/dist/index16.d.ts +2 -2
- package/dist/index17.d.ts +75 -75
- package/dist/index18.d.ts +40 -40
- package/dist/index19.d.ts +5 -5
- package/dist/index2.d.ts +4 -1
- package/dist/index21.d.ts +15 -15
- package/dist/index22.d.ts +8 -65
- package/dist/index23.d.ts +21 -13
- package/dist/index26.d.ts +4 -4
- package/dist/index27.d.ts +4 -4
- package/dist/index28.d.ts +10 -10
- package/dist/index3.d.ts +2 -2194
- package/dist/index31.d.ts +5 -5
- package/dist/index33.d.ts +3 -3
- package/dist/index34.d.ts +1 -1
- package/dist/index35.d.ts +1 -1
- package/dist/index36.d.ts +5 -5
- package/dist/index37.d.ts +8 -6
- package/dist/index38.d.ts +5 -5
- package/dist/index39.d.ts +1 -1
- package/dist/index4.d.ts +1356 -1356
- package/dist/index40.d.ts +2 -2
- package/dist/index8.d.ts +11 -3
- package/dist/index9.d.ts +2811 -3
- package/dist/inventory.d.ts +4 -4
- package/dist/inventory.js +3 -3
- package/dist/inventory.js.map +1 -1
- package/dist/marketplace2.js +3 -3
- package/dist/marketplace2.js.map +1 -1
- package/dist/metadata.d.ts +41 -41
- package/dist/primary-sale-checkout-options.d.ts +4 -4
- package/dist/quantityInput.js +1 -1
- package/dist/ranges.d.ts +12 -12
- package/dist/react/_internal/index.d.ts +1 -1
- package/dist/react/_internal/index.js +1 -1
- package/dist/react/index.d.ts +1 -1
- package/dist/react/queries/collectible/index.d.ts +1 -1
- package/dist/react/queries/index.d.ts +1 -1
- package/dist/react/ssr/index.d.ts +3 -3
- package/dist/react/ssr/index.js +3 -3
- package/dist/react/ui/components/marketplace-collectible-card/index.d.ts +1 -1
- package/dist/react/ui/modals/CreateListingModal/internal/hooks/index.d.ts +1 -1
- package/dist/react/ui/modals/MakeOfferModal/internal/hooks/index.d.ts +1 -1
- package/dist/react/ui/modals/_internal/components/alertMessage/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/baseModal/index.d.ts +6 -6
- package/dist/react/ui/modals/_internal/components/calendar/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/currencyImage/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/currencyOptionsSelect/index.d.ts +3 -3
- package/dist/react/ui/modals/_internal/components/floorPriceText/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/priceInput/index.d.ts +3 -5
- package/dist/react/ui/modals/_internal/components/quantityInput/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/selectWaasFeeOptions/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/switchChainErrorModal/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/timeAgo/index.d.ts +2 -2
- package/dist/react/ui/modals/_internal/components/tokenPreview/index.d.ts +3 -3
- package/dist/react/ui/modals/_internal/components/transaction-footer/index.d.ts +3 -3
- package/dist/react/ui/modals/_internal/components/transactionDetails/index.d.ts +3 -3
- package/dist/react/ui/modals/_internal/components/transactionPreview/index.d.ts +3 -3
- package/dist/react/ui/modals/_internal/components/transactionStatusModal/index.d.ts +3 -3
- package/dist/react.js +2279 -1919
- package/dist/react.js.map +1 -1
- package/dist/styles/index.css +15 -0
- package/dist/token-balances.d.ts +28 -28
- package/dist/transaction-footer.js +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/types/index.js +1 -1
- package/dist/types.d.ts +1 -1
- package/dist/url-state.js +1 -1
- package/dist/utils/index.d.ts +2 -2
- package/dist/utils/index.js +2 -2
- package/dist/utils.js +31 -4
- package/dist/utils.js.map +1 -1
- package/package.json +7 -5
- package/src/react/hooks/config/useMarketplaceConfig.test.tsx +1 -0
- package/src/react/hooks/currency/list.test.tsx +23 -2
- package/src/react/hooks/transactions/useCancelTransactionSteps.tsx +4 -1
- package/src/react/hooks/transactions/useMarketTransactionSteps.tsx +55 -15
- package/src/react/hooks/utils/useEnsureCorrectChain.ts +10 -5
- package/src/react/queries/collectible/market-list.ts +5 -3
- package/src/react/queries/currency/list.ts +8 -5
- package/src/react/queries/inventory/inventory.ts +5 -3
- package/src/react/queries/marketplace/filters.ts +5 -3
- package/src/react/ui/modals/BuyModal/components/BuyModalContent.tsx +74 -37
- package/src/react/ui/modals/BuyModal/components/CryptoPaymentModal.tsx +74 -11
- package/src/react/ui/modals/BuyModal/components/Modal.tsx +62 -1
- package/src/react/ui/modals/BuyModal/hooks/useExecuteBundledTransactions.ts +13 -26
- package/src/react/ui/modals/BuyModal/hooks/useMarketPlatformFee.ts +5 -5
- package/src/react/ui/modals/BuyModal/internal/__tests__/buildTrailsMarketBuyActions.test.ts +213 -0
- package/src/react/ui/modals/BuyModal/internal/buildTrailsMarketBuyActions.ts +259 -0
- package/src/react/ui/modals/BuyModal/internal/buyModalContext.ts +79 -10
- package/src/react/ui/modals/BuyModal/internal/cryptoPaymentModalContext.tsx +44 -17
- package/src/react/ui/modals/CreateListingModal/internal/store.ts +5 -2
- package/src/react/ui/modals/MakeOfferModal/internal/context.ts +21 -1
- package/src/react/ui/modals/MakeOfferModal/internal/helpers/validation.ts +16 -1
- package/src/react/ui/modals/MakeOfferModal/internal/store.ts +5 -2
- package/src/react/ui/modals/SellModal/internal/store.ts +5 -2
- package/src/react/ui/modals/_internal/components/baseModal/errors/ModalInitializationError.tsx +8 -6
- package/src/react/ui/modals/_internal/components/currencyOptionsSelect/index.tsx +2 -1
- package/src/react/ui/modals/_internal/components/priceInput/index.tsx +13 -19
- package/src/react/ui/modals/_internal/components/transactionDetails/index.tsx +5 -2
- package/src/react/ui/modals/_internal/helpers/currency.test.ts +27 -0
- package/src/react/ui/modals/_internal/helpers/currency.ts +4 -2
- package/src/styles/styles.ts +18 -0
- package/src/utils/__tests__/getMarketplaceDetails.test.ts +10 -0
- package/src/utils/__tests__/getWebRPCErrorMessage.test.ts +28 -0
- package/src/utils/__tests__/marketplaceNormalization.test.ts +38 -0
- package/src/utils/collection.ts +19 -0
- package/src/utils/getConduitAddressForOrderbook.ts +2 -10
- package/src/utils/getMarketplaceDetails.ts +11 -4
- package/src/utils/getWebRPCErrorMessage.ts +21 -0
- package/src/utils/index.ts +1 -0
- package/src/utils/normalizeMarketplace.ts +31 -0
package/dist/react.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
'use client'
|
|
2
2
|
|
|
3
3
|
import { n as SEQUENCE_MARKET_V1_ADDRESS, r as SEQUENCE_MARKET_V2_ADDRESS, t as DEFAULT_MARKETPLACE_FEE_PERCENTAGE } from "./consts.js";
|
|
4
|
-
import {
|
|
4
|
+
import { f as ExecuteType, g as OrderSide, h as OfferType, l as isTransactionStep, m as MetadataStatus, o as findApprovalStep, p as MarketplaceKind, s as findBuyStep, t as ContractType$1, u as CollectionStatus, v as OrderbookKind, w as WalletKind, x as StepType } from "./dist.js";
|
|
5
5
|
import { a as TransactionSignatureError, i as TransactionExecutionError$1, o as UserRejectedRequestError$1, r as NoWalletConnectedError, s as BaseError$1, t as ChainSwitchError } from "./transaction.js";
|
|
6
6
|
import { i as TransactionType$2, t as CollectibleCardAction } from "./types.js";
|
|
7
7
|
import { n as SequenceMarketplaceV1_ABI, r as EIP2981_ABI } from "./marketplace.js";
|
|
8
8
|
import { i as ERC721_SALE_ABI_V0, r as ERC721_SALE_ABI_V1 } from "./primary-sale.js";
|
|
9
9
|
import { i as ERC20_ABI, n as ERC1155_ABI, r as ERC721_ABI } from "./token.js";
|
|
10
|
-
import { a as formatPriceWithFee, c as cn$1, i as formatPrice, l as
|
|
10
|
+
import { a as formatPriceWithFee, c as isOpenSeaOrderbook, d as findMarketCollection, f as cn$1, i as formatPrice, l as normalizeMarketplaceKind, o as validateOpenseaOfferDecimals, p as compareAddress, r as calculateTotalOfferCost, t as calculateEarningsAfterFees, u as normalizeOrderbookKind } from "./utils.js";
|
|
11
11
|
import { n as getPresentableChainName } from "./network.js";
|
|
12
12
|
import { c as getSequenceNodeGatewayUrl, g as getQueryClient, l as getTrailsApiUrl, n as getIndexerClient, o as getSequenceApiUrl, r as getMarketplaceClient, s as getSequenceIndexerUrl } from "./api.js";
|
|
13
13
|
import { a as PROVIDER_ID, r as buildQueryOptions, t as TransactionType$1 } from "./_internal.js";
|
|
@@ -34,22 +34,23 @@ import { n as expirationDateSelect_default } from "./expirationDateSelect.js";
|
|
|
34
34
|
import { t as currencyImage_default } from "./currencyImage.js";
|
|
35
35
|
import { t as useERC20Allowance } from "./hooks2.js";
|
|
36
36
|
import { ContractVerificationStatus } from "@0xsequence/indexer";
|
|
37
|
-
import { ChainNotConfiguredError, ConnectorAccountNotFoundError, ConnectorAlreadyConnectedError, ConnectorChainMismatchError, ConnectorNotFoundError, ConnectorUnavailableReconnectingError, ProviderNotFoundError, SwitchChainNotSupportedError, WagmiProviderNotFoundError, useAccount, useBalance, useChainId, useConnections, usePublicClient, useReadContract, useReadContracts, useSendTransaction, useSignMessage, useSignTypedData, useSwitchChain, useWalletClient, useWriteContract } from "wagmi";
|
|
37
|
+
import { ChainNotConfiguredError, ConnectorAccountNotFoundError, ConnectorAlreadyConnectedError, ConnectorChainMismatchError, ConnectorNotFoundError, ConnectorUnavailableReconnectingError, ProviderNotFoundError, SwitchChainNotSupportedError, WagmiProviderNotFoundError, useAccount, useBalance, useChainId, useConfig, useConnections, usePublicClient, useReadContract, useReadContracts, useSendTransaction, useSignMessage, useSignTypedData, useSwitchChain, useWalletClient, useWriteContract } from "wagmi";
|
|
38
38
|
import { sendTransactions, useChain, useOpenConnectModal, useWaasFeeOptions } from "@0xsequence/connect";
|
|
39
39
|
import { Component, createContext, forwardRef, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
40
40
|
import { Button, CartIcon, CheckmarkIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Dialog, DialogContent, DialogOverlay, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuPortal, DropdownMenuTrigger, Field, FieldLabel, Image, InfoIcon, Modal, NetworkImage, NumericInput, Select, Separator, Skeleton, Spinner, Text, TextInput, ThemeProvider, TokenImage, Tooltip, WarningIcon, cn } from "@0xsequence/design-system";
|
|
41
41
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
42
42
|
import { greaterThan, toNumber } from "dnum";
|
|
43
43
|
import { BaseError, ChainMismatchError, ChainNotFoundError, ContractFunctionExecutionError, ContractFunctionRevertedError, ContractFunctionZeroDataError, FeeCapTooHighError, FeeCapTooLowError, HttpRequestError, InsufficientFundsError, IntrinsicGasTooHighError, IntrinsicGasTooLowError, InvalidAddressError, InvalidHexValueError, LimitExceededRpcError, NonceTooLowError, SwitchChainError, TimeoutError, TransactionExecutionError, TransactionReceiptNotFoundError, UserRejectedRequestError, WaitForTransactionReceiptTimeoutError, decodeFunctionData, encodeFunctionData, erc20Abi, erc721Abi, formatUnits, isAddress, isHex, maxUint256, parseEventLogs, parseUnits, zeroAddress } from "viem";
|
|
44
|
-
import { QueryClientProvider, queryOptions, skipToken, useInfiniteQuery, useMutation, useQuery } from "@tanstack/react-query";
|
|
44
|
+
import { QueryClientProvider, queryOptions, skipToken, useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
|
45
45
|
import { Databeat } from "@databeat/tracker";
|
|
46
46
|
import { createStore } from "@xstate/store";
|
|
47
47
|
import { useSelector } from "@xstate/store/react";
|
|
48
48
|
import { avalanche, optimism } from "viem/chains";
|
|
49
49
|
import { readContract } from "viem/actions";
|
|
50
50
|
import { SequenceCheckoutProvider, useSelectPaymentModal } from "@0xsequence/checkout";
|
|
51
|
-
import {
|
|
52
|
-
import {
|
|
51
|
+
import { wagmiAdapter } from "@0xtrails/adapter-wagmi";
|
|
52
|
+
import { TrailsProvider, TrailsWidget } from "0xtrails/widget";
|
|
53
|
+
import { buildErc20Approve, encodeDestinationCalls, self, useSupportedChains } from "0xtrails";
|
|
53
54
|
import { createPortal } from "react-dom";
|
|
54
55
|
|
|
55
56
|
//#region src/utils/_internal/error/context.ts
|
|
@@ -149,7 +150,7 @@ function AnalyticsProvider({ config, children }) {
|
|
|
149
150
|
//#endregion
|
|
150
151
|
//#region src/react/providers/theme-provider.tsx
|
|
151
152
|
const ThemeProvider$1 = ({ children, theme, root }) => {
|
|
152
|
-
const { shadowDom } = useConfig();
|
|
153
|
+
const { shadowDom } = useConfig$1();
|
|
153
154
|
if (!shadowDom) return /* @__PURE__ */ jsx(ThemeProvider, {
|
|
154
155
|
defaultTheme: theme,
|
|
155
156
|
root,
|
|
@@ -212,7 +213,7 @@ function MarketplaceProviderWithSequenceConnect({ config, children, analytics })
|
|
|
212
213
|
|
|
213
214
|
//#endregion
|
|
214
215
|
//#region src/react/hooks/config/useConfig.tsx
|
|
215
|
-
function useConfig() {
|
|
216
|
+
function useConfig$1() {
|
|
216
217
|
const context = useContext(MarketplaceSdkContext);
|
|
217
218
|
if (!context) throw new MarketplaceSdkProviderNotFoundError();
|
|
218
219
|
return context;
|
|
@@ -264,7 +265,7 @@ function useConfig() {
|
|
|
264
265
|
*/
|
|
265
266
|
function usePrimarySaleCheckoutOptions(params) {
|
|
266
267
|
const { address } = useAccount();
|
|
267
|
-
const defaultConfig = useConfig();
|
|
268
|
+
const defaultConfig = useConfig$1();
|
|
268
269
|
return useQuery({ ...primarySaleCheckoutOptionsQueryOptions(params === skipToken || !address ? {
|
|
269
270
|
config: defaultConfig,
|
|
270
271
|
walletAddress: address ?? zeroAddress,
|
|
@@ -303,7 +304,7 @@ function usePrimarySaleCheckoutOptions(params) {
|
|
|
303
304
|
* ```
|
|
304
305
|
*/
|
|
305
306
|
function useCollectibleBalance(args) {
|
|
306
|
-
const config = useConfig();
|
|
307
|
+
const config = useConfig$1();
|
|
307
308
|
return useQuery(balanceOfCollectibleOptions({
|
|
308
309
|
...args,
|
|
309
310
|
config
|
|
@@ -434,7 +435,7 @@ const useErc721SaleDetailsV1 = ({ chainId, salesContractAddress, itemsContractAd
|
|
|
434
435
|
* ```
|
|
435
436
|
*/
|
|
436
437
|
function useCollectibleMarketCount(params) {
|
|
437
|
-
const defaultConfig = useConfig();
|
|
438
|
+
const defaultConfig = useConfig$1();
|
|
438
439
|
const { config = defaultConfig, ...rest } = params;
|
|
439
440
|
return useQuery({ ...countOfCollectablesQueryOptions({
|
|
440
441
|
config,
|
|
@@ -483,7 +484,7 @@ function useCollectibleMarketCount(params) {
|
|
|
483
484
|
* ```
|
|
484
485
|
*/
|
|
485
486
|
function useCollectibleMarketHighestOffer(params) {
|
|
486
|
-
const defaultConfig = useConfig();
|
|
487
|
+
const defaultConfig = useConfig$1();
|
|
487
488
|
const { config = defaultConfig, ...rest } = params;
|
|
488
489
|
return useQuery({ ...highestOfferQueryOptions({
|
|
489
490
|
config,
|
|
@@ -535,7 +536,7 @@ function useCollectibleMarketHighestOffer(params) {
|
|
|
535
536
|
* ```
|
|
536
537
|
*/
|
|
537
538
|
function useCollectibleMarketList(params) {
|
|
538
|
-
const defaultConfig = useConfig();
|
|
539
|
+
const defaultConfig = useConfig$1();
|
|
539
540
|
const { config = defaultConfig, ...rest } = params;
|
|
540
541
|
return useInfiniteQuery({ ...listCollectiblesQueryOptions({
|
|
541
542
|
config,
|
|
@@ -606,7 +607,7 @@ function useCollectibleMarketList(params) {
|
|
|
606
607
|
* ```
|
|
607
608
|
*/
|
|
608
609
|
function useCollectibleMarketListPaginated(params) {
|
|
609
|
-
const defaultConfig = useConfig();
|
|
610
|
+
const defaultConfig = useConfig$1();
|
|
610
611
|
const { config = defaultConfig, ...rest } = params;
|
|
611
612
|
return useQuery({ ...listCollectiblesPaginatedQueryOptions({
|
|
612
613
|
config,
|
|
@@ -671,7 +672,7 @@ function useCollectibleMarketListPaginated(params) {
|
|
|
671
672
|
* ```
|
|
672
673
|
*/
|
|
673
674
|
function useCollectibleMarketListings(params) {
|
|
674
|
-
const defaultConfig = useConfig();
|
|
675
|
+
const defaultConfig = useConfig$1();
|
|
675
676
|
const { config = defaultConfig, ...rest } = params;
|
|
676
677
|
return useQuery({ ...listListingsForCollectibleQueryOptions({
|
|
677
678
|
config,
|
|
@@ -718,7 +719,7 @@ function useCollectibleMarketListings(params) {
|
|
|
718
719
|
* ```
|
|
719
720
|
*/
|
|
720
721
|
function useCollectibleMarketListingsCount(params) {
|
|
721
|
-
const defaultConfig = useConfig();
|
|
722
|
+
const defaultConfig = useConfig$1();
|
|
722
723
|
const { config = defaultConfig, ...rest } = params;
|
|
723
724
|
return useQuery({ ...countListingsForCollectibleQueryOptions({
|
|
724
725
|
config,
|
|
@@ -767,7 +768,7 @@ function useCollectibleMarketListingsCount(params) {
|
|
|
767
768
|
* ```
|
|
768
769
|
*/
|
|
769
770
|
function useCollectibleMarketLowestListing(params) {
|
|
770
|
-
const defaultConfig = useConfig();
|
|
771
|
+
const defaultConfig = useConfig$1();
|
|
771
772
|
const { config = defaultConfig, ...rest } = params;
|
|
772
773
|
return useQuery({ ...lowestListingQueryOptions({
|
|
773
774
|
config,
|
|
@@ -816,7 +817,7 @@ function useCollectibleMarketLowestListing(params) {
|
|
|
816
817
|
* ```
|
|
817
818
|
*/
|
|
818
819
|
function useCollectibleMarketOffers(params) {
|
|
819
|
-
const defaultConfig = useConfig();
|
|
820
|
+
const defaultConfig = useConfig$1();
|
|
820
821
|
const { config = defaultConfig, ...rest } = params;
|
|
821
822
|
return useQuery({ ...listOffersForCollectibleQueryOptions({
|
|
822
823
|
config,
|
|
@@ -863,7 +864,7 @@ function useCollectibleMarketOffers(params) {
|
|
|
863
864
|
* ```
|
|
864
865
|
*/
|
|
865
866
|
function useCollectibleMarketOffersCount(params) {
|
|
866
|
-
const defaultConfig = useConfig();
|
|
867
|
+
const defaultConfig = useConfig$1();
|
|
867
868
|
const { config = defaultConfig, ...rest } = params;
|
|
868
869
|
return useQuery({ ...countOffersForCollectibleQueryOptions({
|
|
869
870
|
config,
|
|
@@ -912,7 +913,7 @@ function useCollectibleMarketOffersCount(params) {
|
|
|
912
913
|
* ```
|
|
913
914
|
*/
|
|
914
915
|
function useCollectibleMetadata(params) {
|
|
915
|
-
const defaultConfig = useConfig();
|
|
916
|
+
const defaultConfig = useConfig$1();
|
|
916
917
|
const { config = defaultConfig, ...rest } = params;
|
|
917
918
|
return useQuery({ ...collectibleQueryOptions({
|
|
918
919
|
config,
|
|
@@ -959,7 +960,7 @@ function useCollectibleMetadata(params) {
|
|
|
959
960
|
* ```
|
|
960
961
|
*/
|
|
961
962
|
function usePrimarySaleItem(params) {
|
|
962
|
-
const defaultConfig = useConfig();
|
|
963
|
+
const defaultConfig = useConfig$1();
|
|
963
964
|
const { config = defaultConfig, ...rest } = params;
|
|
964
965
|
return useQuery({ ...primarySaleItemQueryOptions({
|
|
965
966
|
config,
|
|
@@ -1008,7 +1009,7 @@ function usePrimarySaleItem(params) {
|
|
|
1008
1009
|
* ```
|
|
1009
1010
|
*/
|
|
1010
1011
|
function usePrimarySaleItems(params) {
|
|
1011
|
-
const defaultConfig = useConfig();
|
|
1012
|
+
const defaultConfig = useConfig$1();
|
|
1012
1013
|
const { config = defaultConfig, ...rest } = params;
|
|
1013
1014
|
return useInfiniteQuery(primarySaleItemsQueryOptions({
|
|
1014
1015
|
config,
|
|
@@ -1019,7 +1020,7 @@ function usePrimarySaleItems(params) {
|
|
|
1019
1020
|
//#endregion
|
|
1020
1021
|
//#region src/react/hooks/collectible/primary-sale-items-count.tsx
|
|
1021
1022
|
function usePrimarySaleItemsCount(args) {
|
|
1022
|
-
const defaultConfig = useConfig();
|
|
1023
|
+
const defaultConfig = useConfig$1();
|
|
1023
1024
|
const { config = defaultConfig, ...rest } = args;
|
|
1024
1025
|
return useQuery(primarySaleItemsCountQueryOptions({
|
|
1025
1026
|
config,
|
|
@@ -1049,7 +1050,7 @@ function usePrimarySaleItemsCount(args) {
|
|
|
1049
1050
|
* ```
|
|
1050
1051
|
*/
|
|
1051
1052
|
function useCollectibleTokenBalances(args) {
|
|
1052
|
-
const config = useConfig();
|
|
1053
|
+
const config = useConfig$1();
|
|
1053
1054
|
return useQuery(tokenBalancesOptions({
|
|
1054
1055
|
...args,
|
|
1055
1056
|
config
|
|
@@ -1110,7 +1111,7 @@ function useCollectibleTokenBalances(args) {
|
|
|
1110
1111
|
* ```
|
|
1111
1112
|
*/
|
|
1112
1113
|
function useCollectionBalanceDetails(params) {
|
|
1113
|
-
const defaultConfig = useConfig();
|
|
1114
|
+
const defaultConfig = useConfig$1();
|
|
1114
1115
|
const { config = defaultConfig, ...rest } = params;
|
|
1115
1116
|
return useQuery({ ...collectionBalanceDetailsQueryOptions({
|
|
1116
1117
|
config,
|
|
@@ -1121,7 +1122,7 @@ function useCollectionBalanceDetails(params) {
|
|
|
1121
1122
|
//#endregion
|
|
1122
1123
|
//#region src/react/hooks/config/useMarketplaceConfig.tsx
|
|
1123
1124
|
const useMarketplaceConfig = () => {
|
|
1124
|
-
return useQuery(marketplaceConfigOptions(useConfig()));
|
|
1125
|
+
return useQuery(marketplaceConfigOptions(useConfig$1()));
|
|
1125
1126
|
};
|
|
1126
1127
|
|
|
1127
1128
|
//#endregion
|
|
@@ -1166,7 +1167,7 @@ const useMarketplaceConfig = () => {
|
|
|
1166
1167
|
* ```
|
|
1167
1168
|
*/
|
|
1168
1169
|
function useCollectionList(params = {}) {
|
|
1169
|
-
const defaultConfig = useConfig();
|
|
1170
|
+
const defaultConfig = useConfig$1();
|
|
1170
1171
|
const { data: marketplaceConfig } = useMarketplaceConfig();
|
|
1171
1172
|
const { config = defaultConfig, marketplaceConfig: paramMarketplaceConfig, ...rest } = params;
|
|
1172
1173
|
return useQuery({ ...listCollectionsQueryOptions({
|
|
@@ -1208,13 +1209,13 @@ const collectionMarketDetailPollingOptions = (args, config) => {
|
|
|
1208
1209
|
});
|
|
1209
1210
|
};
|
|
1210
1211
|
const useCollectionMarketDetailPolling = (args) => {
|
|
1211
|
-
return useQuery(collectionMarketDetailPollingOptions(args, useConfig()));
|
|
1212
|
+
return useQuery(collectionMarketDetailPollingOptions(args, useConfig$1()));
|
|
1212
1213
|
};
|
|
1213
1214
|
|
|
1214
1215
|
//#endregion
|
|
1215
1216
|
//#region src/react/hooks/collection/market-filtered-count.tsx
|
|
1216
1217
|
function useCollectionMarketFilteredCount(params) {
|
|
1217
|
-
const defaultConfig = useConfig();
|
|
1218
|
+
const defaultConfig = useConfig$1();
|
|
1218
1219
|
const { config = defaultConfig, ...rest } = params;
|
|
1219
1220
|
return useQuery({ ...getCountOfFilteredOrdersQueryOptions({
|
|
1220
1221
|
config,
|
|
@@ -1264,7 +1265,7 @@ function useCollectionMarketFilteredCount(params) {
|
|
|
1264
1265
|
* ```
|
|
1265
1266
|
*/
|
|
1266
1267
|
function useCollectionMarketFloor(params) {
|
|
1267
|
-
const defaultConfig = useConfig();
|
|
1268
|
+
const defaultConfig = useConfig$1();
|
|
1268
1269
|
const { config = defaultConfig, ...rest } = params;
|
|
1269
1270
|
return useQuery({ ...floorOrderQueryOptions({
|
|
1270
1271
|
config,
|
|
@@ -1322,7 +1323,7 @@ function useCollectionMarketFloor(params) {
|
|
|
1322
1323
|
* ```
|
|
1323
1324
|
*/
|
|
1324
1325
|
function useCollectionMarketItems(params) {
|
|
1325
|
-
const defaultConfig = useConfig();
|
|
1326
|
+
const defaultConfig = useConfig$1();
|
|
1326
1327
|
const { config = defaultConfig, ...rest } = params;
|
|
1327
1328
|
return useInfiniteQuery({ ...listItemsOrdersForCollectionQueryOptions({
|
|
1328
1329
|
config,
|
|
@@ -1384,7 +1385,7 @@ function useCollectionMarketItems(params) {
|
|
|
1384
1385
|
* ```
|
|
1385
1386
|
*/
|
|
1386
1387
|
function useCollectionMarketItemsCount(params) {
|
|
1387
|
-
const defaultConfig = useConfig();
|
|
1388
|
+
const defaultConfig = useConfig$1();
|
|
1388
1389
|
const { config = defaultConfig, ...rest } = params;
|
|
1389
1390
|
return useQuery({ ...countItemsOrdersForCollectionQueryOptions({
|
|
1390
1391
|
config,
|
|
@@ -1456,7 +1457,7 @@ function useCollectionMarketItemsCount(params) {
|
|
|
1456
1457
|
* ```
|
|
1457
1458
|
*/
|
|
1458
1459
|
function useCollectionMarketItemsPaginated(params) {
|
|
1459
|
-
const defaultConfig = useConfig();
|
|
1460
|
+
const defaultConfig = useConfig$1();
|
|
1460
1461
|
const { config = defaultConfig, ...rest } = params;
|
|
1461
1462
|
return useQuery({ ...listItemsOrdersForCollectionPaginatedQueryOptions({
|
|
1462
1463
|
config,
|
|
@@ -1502,7 +1503,7 @@ function useCollectionMarketItemsPaginated(params) {
|
|
|
1502
1503
|
* ```
|
|
1503
1504
|
*/
|
|
1504
1505
|
function useCollectionMetadata(params) {
|
|
1505
|
-
const defaultConfig = useConfig();
|
|
1506
|
+
const defaultConfig = useConfig$1();
|
|
1506
1507
|
const { config = defaultConfig, ...rest } = params;
|
|
1507
1508
|
return useQuery({ ...collectionQueryOptions({
|
|
1508
1509
|
config,
|
|
@@ -1579,7 +1580,7 @@ function collectionActiveListingsCurrenciesQueryOptions(params) {
|
|
|
1579
1580
|
* ```
|
|
1580
1581
|
*/
|
|
1581
1582
|
function useCollectionActiveListingsCurrencies(params) {
|
|
1582
|
-
const defaultConfig = useConfig();
|
|
1583
|
+
const defaultConfig = useConfig$1();
|
|
1583
1584
|
const { config = defaultConfig, ...rest } = params;
|
|
1584
1585
|
return useQuery({ ...collectionActiveListingsCurrenciesQueryOptions({
|
|
1585
1586
|
config,
|
|
@@ -1656,7 +1657,7 @@ function collectionActiveOffersCurrenciesQueryOptions(params) {
|
|
|
1656
1657
|
* ```
|
|
1657
1658
|
*/
|
|
1658
1659
|
function useCollectionActiveOffersCurrencies(params) {
|
|
1659
|
-
const defaultConfig = useConfig();
|
|
1660
|
+
const defaultConfig = useConfig$1();
|
|
1660
1661
|
const { config = defaultConfig, ...rest } = params;
|
|
1661
1662
|
return useQuery({ ...collectionActiveOffersCurrenciesQueryOptions({
|
|
1662
1663
|
config,
|
|
@@ -1716,7 +1717,7 @@ function useCollectionActiveOffersCurrencies(params) {
|
|
|
1716
1717
|
* ```
|
|
1717
1718
|
*/
|
|
1718
1719
|
function useCurrencyComparePrices(params) {
|
|
1719
|
-
const defaultConfig = useConfig();
|
|
1720
|
+
const defaultConfig = useConfig$1();
|
|
1720
1721
|
const { config = defaultConfig, ...rest } = params;
|
|
1721
1722
|
return useQuery({ ...comparePricesQueryOptions({
|
|
1722
1723
|
config,
|
|
@@ -1771,7 +1772,7 @@ function useCurrencyComparePrices(params) {
|
|
|
1771
1772
|
* ```
|
|
1772
1773
|
*/
|
|
1773
1774
|
function useCurrencyConvertToUSD(params) {
|
|
1774
|
-
const defaultConfig = useConfig();
|
|
1775
|
+
const defaultConfig = useConfig$1();
|
|
1775
1776
|
const { config = defaultConfig, ...rest } = params;
|
|
1776
1777
|
return useQuery({ ...convertPriceToUSDQueryOptions({
|
|
1777
1778
|
config,
|
|
@@ -1816,7 +1817,7 @@ function useCurrencyConvertToUSD(params) {
|
|
|
1816
1817
|
* ```
|
|
1817
1818
|
*/
|
|
1818
1819
|
function useCurrency(params) {
|
|
1819
|
-
const defaultConfig = useConfig();
|
|
1820
|
+
const defaultConfig = useConfig$1();
|
|
1820
1821
|
const { config = defaultConfig, ...rest } = params;
|
|
1821
1822
|
return useQuery({ ...currencyQueryOptions({
|
|
1822
1823
|
config,
|
|
@@ -1858,7 +1859,7 @@ function useCurrency(params) {
|
|
|
1858
1859
|
* ```
|
|
1859
1860
|
*/
|
|
1860
1861
|
function useCurrencyList(params) {
|
|
1861
|
-
const defaultConfig = useConfig();
|
|
1862
|
+
const defaultConfig = useConfig$1();
|
|
1862
1863
|
const { config = defaultConfig, ...rest } = params;
|
|
1863
1864
|
return useQuery({ ...marketCurrenciesQueryOptions({
|
|
1864
1865
|
config,
|
|
@@ -1869,7 +1870,7 @@ function useCurrencyList(params) {
|
|
|
1869
1870
|
//#endregion
|
|
1870
1871
|
//#region src/react/hooks/inventory/inventory.tsx
|
|
1871
1872
|
function useInventory(args) {
|
|
1872
|
-
const config = useConfig();
|
|
1873
|
+
const config = useConfig$1();
|
|
1873
1874
|
return useQuery(inventoryOptions({
|
|
1874
1875
|
...args,
|
|
1875
1876
|
config
|
|
@@ -1919,7 +1920,7 @@ function useInventory(args) {
|
|
|
1919
1920
|
* ```
|
|
1920
1921
|
*/
|
|
1921
1922
|
function useTokenBalances(params) {
|
|
1922
|
-
const defaultConfig = useConfig();
|
|
1923
|
+
const defaultConfig = useConfig$1();
|
|
1923
1924
|
const { config = defaultConfig, ...rest } = params;
|
|
1924
1925
|
return useInfiniteQuery(listBalancesOptions({
|
|
1925
1926
|
config,
|
|
@@ -2069,7 +2070,7 @@ function useTokenCurrencyBalance(args) {
|
|
|
2069
2070
|
* ```
|
|
2070
2071
|
*/
|
|
2071
2072
|
function useTokenMetadata(params) {
|
|
2072
|
-
const defaultConfig = useConfig();
|
|
2073
|
+
const defaultConfig = useConfig$1();
|
|
2073
2074
|
const { config = defaultConfig, ...rest } = params;
|
|
2074
2075
|
return useQuery({ ...listTokenMetadataQueryOptions({
|
|
2075
2076
|
config,
|
|
@@ -2148,7 +2149,7 @@ function useTokenMetadata(params) {
|
|
|
2148
2149
|
* ```
|
|
2149
2150
|
*/
|
|
2150
2151
|
function useTokenMetadataSearch(params) {
|
|
2151
|
-
const defaultConfig = useConfig();
|
|
2152
|
+
const defaultConfig = useConfig$1();
|
|
2152
2153
|
const { config = defaultConfig, onlyMinted, ...rest } = params;
|
|
2153
2154
|
const { data: suppliesData, hasNextPage: hasNextSuppliesPage, isFetching: isSuppliesFetching, isLoading: isSuppliesLoading, error: suppliesError, fetchNextPage: fetchNextSuppliesPage } = useInfiniteQuery(tokenSuppliesQueryOptions({
|
|
2154
2155
|
chainId: params.chainId,
|
|
@@ -2246,7 +2247,7 @@ function useTokenMetadataSearch(params) {
|
|
|
2246
2247
|
* ```
|
|
2247
2248
|
*/
|
|
2248
2249
|
function useTokenRanges(params) {
|
|
2249
|
-
const defaultConfig = useConfig();
|
|
2250
|
+
const defaultConfig = useConfig$1();
|
|
2250
2251
|
const { config = defaultConfig, ...rest } = params;
|
|
2251
2252
|
return useQuery({ ...getTokenRangesQueryOptions({
|
|
2252
2253
|
config,
|
|
@@ -2686,17 +2687,11 @@ function createFeeGuard(params) {
|
|
|
2686
2687
|
* https://etherscan.io/address/0x1e0049783f008a0085193e00003d00cd54003c71
|
|
2687
2688
|
*/
|
|
2688
2689
|
const OPENSEA_SEAPORT_CONDUIT_ADDRESS = "0x1E0049783F008A0085193E00003D00cd54003c71";
|
|
2689
|
-
/**
|
|
2690
|
-
* Magic Eden Conduit address
|
|
2691
|
-
* https://etherscan.io/address/0x2052f8A2Ff46283B30084e5d84c89A2fdBE7f74b
|
|
2692
|
-
*/
|
|
2693
|
-
const MAGICEDEN_CONDUIT_ADDRESS = "0x2052f8A2Ff46283B30084e5d84c89A2fdBE7f74b";
|
|
2694
2690
|
function getConduitAddressForOrderbook(orderbookKind) {
|
|
2695
|
-
switch (orderbookKind) {
|
|
2691
|
+
switch (normalizeOrderbookKind(orderbookKind)) {
|
|
2696
2692
|
case OrderbookKind.sequence_marketplace_v1: return SEQUENCE_MARKET_V1_ADDRESS;
|
|
2697
2693
|
case OrderbookKind.sequence_marketplace_v2: return SEQUENCE_MARKET_V2_ADDRESS;
|
|
2698
2694
|
case OrderbookKind.opensea: return OPENSEA_SEAPORT_CONDUIT_ADDRESS;
|
|
2699
|
-
case OrderbookKind.magic_eden: return MAGICEDEN_CONDUIT_ADDRESS;
|
|
2700
2695
|
default: return SEQUENCE_MARKET_V2_ADDRESS;
|
|
2701
2696
|
}
|
|
2702
2697
|
}
|
|
@@ -2899,7 +2894,7 @@ const useConnectorMetadata = () => {
|
|
|
2899
2894
|
//#endregion
|
|
2900
2895
|
//#region src/react/ui/modals/_internal/components/transactionStatusModal/hooks/useTransactionStatus.ts
|
|
2901
2896
|
const useTransactionStatus = (hash, chainId) => {
|
|
2902
|
-
const sdkConfig = useConfig();
|
|
2897
|
+
const sdkConfig = useConfig$1();
|
|
2903
2898
|
const [status, setStatus] = useState(hash ? "PENDING" : "SUCCESS");
|
|
2904
2899
|
const { data: confirmationResult, error } = useQuery({
|
|
2905
2900
|
queryKey: [
|
|
@@ -3122,7 +3117,7 @@ const useSellModal = () => {
|
|
|
3122
3117
|
const useSellModalState = () => {
|
|
3123
3118
|
const { isOpen, tokenId, collectionAddress, chainId, order } = useSelector(sellModalStore, (state) => state.context);
|
|
3124
3119
|
const { data: marketplaceConfig } = useMarketplaceConfig();
|
|
3125
|
-
const orderbookKind = marketplaceConfig?.market.collections
|
|
3120
|
+
const orderbookKind = findMarketCollection(marketplaceConfig?.market.collections ?? [], collectionAddress, chainId)?.destinationMarketplace;
|
|
3126
3121
|
const closeModal = () => sellModalStore.send({ type: "close" });
|
|
3127
3122
|
return {
|
|
3128
3123
|
isOpen,
|
|
@@ -3139,7 +3134,7 @@ const useSellModalState = () => {
|
|
|
3139
3134
|
//#endregion
|
|
3140
3135
|
//#region src/react/ui/modals/SellModal/internal/sell-mutations.ts
|
|
3141
3136
|
const useSellMutations = ({ tx, collectionAddress, chainId, contractType, orderbookKind, nftApprovalEnabled }) => {
|
|
3142
|
-
const sdkConfig = useConfig();
|
|
3137
|
+
const sdkConfig = useConfig$1();
|
|
3143
3138
|
const { show: showTxModal } = useTransactionStatusModal();
|
|
3144
3139
|
const analytics = useAnalytics();
|
|
3145
3140
|
const state = useSellModalState();
|
|
@@ -3242,7 +3237,7 @@ const useMarketPlatformFee = (params) => {
|
|
|
3242
3237
|
receiver: defaultPlatformFeeRecipient
|
|
3243
3238
|
};
|
|
3244
3239
|
const { chainId, collectionAddress } = params;
|
|
3245
|
-
const marketCollection = marketplaceConfig?.market?.collections
|
|
3240
|
+
const marketCollection = findMarketCollection(marketplaceConfig?.market?.collections ?? [], collectionAddress, chainId);
|
|
3246
3241
|
const receiver = chainId === avalanche.id || chainId === optimism.id ? avalancheAndOptimismPlatformFeeRecipient : defaultPlatformFeeRecipient;
|
|
3247
3242
|
const percentageToBPS = (percentage) => Number(percentage) * 1e4 / 100;
|
|
3248
3243
|
const feePercentage = marketCollection?.feePercentage ?? defaultFee;
|
|
@@ -3268,7 +3263,7 @@ const generateSellTransaction$1 = async (args, config) => {
|
|
|
3268
3263
|
};
|
|
3269
3264
|
};
|
|
3270
3265
|
const useGenerateSellTransaction$1 = (params) => {
|
|
3271
|
-
const client = useConfig();
|
|
3266
|
+
const client = useConfig$1();
|
|
3272
3267
|
const { chainId, collectionAddress, seller, marketplace, ordersData } = params;
|
|
3273
3268
|
const enabled = !!chainId && !!collectionAddress && !!seller && !!marketplace && !!ordersData;
|
|
3274
3269
|
const additionalFees = params.additionalFees ? params.additionalFees : [];
|
|
@@ -3297,7 +3292,7 @@ const useGenerateSellTransaction$1 = (params) => {
|
|
|
3297
3292
|
function useSellModalContext() {
|
|
3298
3293
|
const state = useSellModalState();
|
|
3299
3294
|
const { address } = useAccount();
|
|
3300
|
-
const config = useConfig();
|
|
3295
|
+
const config = useConfig$1();
|
|
3301
3296
|
const collectibleQuery = useCollectibleMetadata({
|
|
3302
3297
|
chainId: state.chainId,
|
|
3303
3298
|
collectionAddress: state.collectionAddress,
|
|
@@ -3499,7 +3494,7 @@ const BaseModal = ({ onClose, title, children, disableAnimation, transactionType
|
|
|
3499
3494
|
const ModalInitializationError = ({ onTryAgain, onClose, error }) => {
|
|
3500
3495
|
const [showTechnicalDetails, setShowTechnicalDetails] = useState(false);
|
|
3501
3496
|
return /* @__PURE__ */ jsxs("div", {
|
|
3502
|
-
className: "flex min-h-[400px] flex-col items-center justify-center p-
|
|
3497
|
+
className: "flex min-h-[400px] flex-col items-center justify-center p-6 text-white",
|
|
3503
3498
|
children: [
|
|
3504
3499
|
/* @__PURE__ */ jsx("div", {
|
|
3505
3500
|
className: "mb-6 flex h-16 w-16 items-center justify-center rounded-full bg-red-500",
|
|
@@ -3513,7 +3508,7 @@ const ModalInitializationError = ({ onTryAgain, onClose, error }) => {
|
|
|
3513
3508
|
className: "mb-8 max-w-md text-center text-gray-300 text-sm leading-relaxed",
|
|
3514
3509
|
children: "Something went wrong while loading this item. Please try again later or refresh the page."
|
|
3515
3510
|
}),
|
|
3516
|
-
error.
|
|
3511
|
+
error.cause && /* @__PURE__ */ jsxs("button", {
|
|
3517
3512
|
type: "button",
|
|
3518
3513
|
onClick: () => setShowTechnicalDetails(!showTechnicalDetails),
|
|
3519
3514
|
className: "mb-4 flex items-center text-gray-400 text-sm transition-colors hover:text-gray-300",
|
|
@@ -3529,17 +3524,17 @@ const ModalInitializationError = ({ onTryAgain, onClose, error }) => {
|
|
|
3529
3524
|
strokeWidth: 2,
|
|
3530
3525
|
d: "M19 9l-7 7-7-7"
|
|
3531
3526
|
})]
|
|
3532
|
-
}), "Show technical details"]
|
|
3527
|
+
}), showTechnicalDetails ? "Hide technical details" : "Show technical details"]
|
|
3533
3528
|
}),
|
|
3534
|
-
showTechnicalDetails && error.
|
|
3529
|
+
showTechnicalDetails && error.cause && /* @__PURE__ */ jsx("div", {
|
|
3535
3530
|
className: "mb-8 max-h-64 w-full max-w-md overflow-y-auto rounded-lg border border-red-900 bg-[#2b0000] p-4",
|
|
3536
3531
|
children: /* @__PURE__ */ jsx("pre", {
|
|
3537
3532
|
className: "whitespace-pre-wrap break-words text-red-100 text-xs",
|
|
3538
|
-
children: error.
|
|
3533
|
+
children: error.cause
|
|
3539
3534
|
})
|
|
3540
3535
|
}),
|
|
3541
3536
|
/* @__PURE__ */ jsxs("div", {
|
|
3542
|
-
className: "flex w-full
|
|
3537
|
+
className: "flex w-full flex-col space-y-3",
|
|
3543
3538
|
children: [onTryAgain && /* @__PURE__ */ jsx(Button, {
|
|
3544
3539
|
onClick: onTryAgain,
|
|
3545
3540
|
variant: "primary",
|
|
@@ -3694,6 +3689,9 @@ const getWagmiErrorMessage = (error) => {
|
|
|
3694
3689
|
//#endregion
|
|
3695
3690
|
//#region src/utils/getWebRPCErrorMessage.ts
|
|
3696
3691
|
const getWebRPCErrorMessage = (error) => {
|
|
3692
|
+
const causeMessage = typeof error.cause === "string" ? error.cause : error.cause instanceof Error ? error.cause.message : "";
|
|
3693
|
+
const rawDetails = [error.message, causeMessage].join(" ").toLowerCase();
|
|
3694
|
+
if (rawDetails.includes("outoffund") || rawDetails.includes("out of fund") || rawDetails.includes("insufficient funds") || rawDetails.includes("insufficient balance") || rawDetails.includes("not enough balance")) return "Insufficient balance to complete this transaction.";
|
|
3697
3695
|
switch (error.code) {
|
|
3698
3696
|
case -1: return "Connection failed. Please check your internet and try again.";
|
|
3699
3697
|
case -2: return "Invalid request. Please try again.";
|
|
@@ -4248,7 +4246,7 @@ function useCurrencyBalance(args) {
|
|
|
4248
4246
|
//#endregion
|
|
4249
4247
|
//#region src/react/ui/modals/_internal/components/selectWaasFeeOptions/useWaasFeeOptionManager.tsx
|
|
4250
4248
|
const useWaasFeeOptionManager = (chainId) => {
|
|
4251
|
-
const config = useConfig();
|
|
4249
|
+
const config = useConfig$1();
|
|
4252
4250
|
const { address: userAddress } = useAccount();
|
|
4253
4251
|
const { selectedFeeOption, setSelectedFeeOption } = useSelectWaasFeeOptionsStore();
|
|
4254
4252
|
const { pendingFeeOptionConfirmation, confirmPendingFeeOption, rejectPendingFeeOption } = useWaasFeeOptions$1(chainId, config);
|
|
@@ -4392,7 +4390,7 @@ function TokenPreview({ collectionName, collectionAddress, tokenId, chainId }) {
|
|
|
4392
4390
|
//#region src/react/ui/modals/_internal/components/transactionDetails/index.tsx
|
|
4393
4391
|
function TransactionDetails({ tokenId, collectionAddress, chainId, includeMarketplaceFee, price, showPlaceholderPrice, currencyImageUrl }) {
|
|
4394
4392
|
const { data, isLoading: marketplaceConfigLoading } = useMarketplaceConfig();
|
|
4395
|
-
const marketplaceFeePercentage = includeMarketplaceFee ? data?.market.collections
|
|
4393
|
+
const marketplaceFeePercentage = includeMarketplaceFee ? findMarketCollection(data?.market.collections ?? [], collectionAddress, chainId)?.feePercentage || DEFAULT_MARKETPLACE_FEE_PERCENTAGE : 0;
|
|
4396
4394
|
const { data: royalty, isLoading: royaltyLoading } = useRoyalty({
|
|
4397
4395
|
chainId,
|
|
4398
4396
|
collectionAddress,
|
|
@@ -4829,7 +4827,7 @@ function usePrimarySale721CardData({ primarySaleItemsWithMetadata, chainId, cont
|
|
|
4829
4827
|
chainId,
|
|
4830
4828
|
collectionAddress: contractAddress,
|
|
4831
4829
|
includeMetadata: true,
|
|
4832
|
-
config: useConfig()
|
|
4830
|
+
config: useConfig$1()
|
|
4833
4831
|
}) });
|
|
4834
4832
|
useEffect(() => {
|
|
4835
4833
|
async function fetchAllPages() {
|
|
@@ -5024,7 +5022,7 @@ function usePrimarySale1155CardData({ primarySaleItemsWithMetadata, chainId, con
|
|
|
5024
5022
|
* ```
|
|
5025
5023
|
*/
|
|
5026
5024
|
function useFilters(params) {
|
|
5027
|
-
const defaultConfig = useConfig();
|
|
5025
|
+
const defaultConfig = useConfig$1();
|
|
5028
5026
|
const { config = defaultConfig, ...rest } = params;
|
|
5029
5027
|
return useQuery({ ...filtersQueryOptions({
|
|
5030
5028
|
config,
|
|
@@ -5075,7 +5073,7 @@ function useFilters(params) {
|
|
|
5075
5073
|
* ```
|
|
5076
5074
|
*/
|
|
5077
5075
|
function useFiltersProgressive(params) {
|
|
5078
|
-
const defaultConfig = useConfig();
|
|
5076
|
+
const defaultConfig = useConfig$1();
|
|
5079
5077
|
const { config = defaultConfig, ...rest } = params;
|
|
5080
5078
|
const namesQuery = useQuery(filtersQueryOptions({
|
|
5081
5079
|
config,
|
|
@@ -5101,7 +5099,7 @@ function useFiltersProgressive(params) {
|
|
|
5101
5099
|
//#endregion
|
|
5102
5100
|
//#region src/react/hooks/ui/useOpenConnectModal.tsx
|
|
5103
5101
|
const useOpenConnectModal$1 = () => {
|
|
5104
|
-
return { openConnectModal: useConfig().openConnectModal };
|
|
5102
|
+
return { openConnectModal: useConfig$1().openConnectModal };
|
|
5105
5103
|
};
|
|
5106
5104
|
|
|
5107
5105
|
//#endregion
|
|
@@ -5210,19 +5208,21 @@ const useQuantity = () => useSelector(buyModalStore, (state) => state.context.qu
|
|
|
5210
5208
|
* This directly calls the marketplace API without using generators
|
|
5211
5209
|
*/
|
|
5212
5210
|
function useMarketTransactionSteps({ chainId, collectionAddress, buyer, marketplace, orderId, tokenId, quantity, additionalFees = [], enabled = true }) {
|
|
5213
|
-
const config = useConfig();
|
|
5211
|
+
const config = useConfig$1();
|
|
5212
|
+
const queryClient = useQueryClient();
|
|
5214
5213
|
const marketplaceClient = useMemo(() => getMarketplaceClient(config), [config]);
|
|
5215
5214
|
const useWithTrails = config.checkoutMode === "trails" || config.checkoutMode === void 0;
|
|
5216
|
-
|
|
5217
|
-
|
|
5218
|
-
|
|
5219
|
-
|
|
5220
|
-
|
|
5221
|
-
|
|
5222
|
-
|
|
5223
|
-
|
|
5224
|
-
|
|
5225
|
-
|
|
5215
|
+
const queryKey = ["market-transaction-steps", {
|
|
5216
|
+
chainId,
|
|
5217
|
+
collectionAddress,
|
|
5218
|
+
buyer,
|
|
5219
|
+
orderId,
|
|
5220
|
+
tokenId,
|
|
5221
|
+
quantity,
|
|
5222
|
+
useWithTrails
|
|
5223
|
+
}];
|
|
5224
|
+
const query = useQuery({
|
|
5225
|
+
queryKey,
|
|
5226
5226
|
queryFn: async () => {
|
|
5227
5227
|
const response = await marketplaceClient.generateBuyTransaction({
|
|
5228
5228
|
chainId,
|
|
@@ -5243,8 +5243,30 @@ function useMarketTransactionSteps({ chainId, collectionAddress, buyer, marketpl
|
|
|
5243
5243
|
canBeUsedWithTrails: response.resp?.canBeUsedWithTrails ?? false
|
|
5244
5244
|
};
|
|
5245
5245
|
},
|
|
5246
|
-
enabled: enabled && !!buyer
|
|
5246
|
+
enabled: enabled && !!buyer,
|
|
5247
|
+
retry: false
|
|
5247
5248
|
});
|
|
5249
|
+
useEffect(() => {
|
|
5250
|
+
if (!query.data && enabled && buyer && query.fetchStatus === "fetching" && !query.isError) {
|
|
5251
|
+
const intervalId = setInterval(() => {
|
|
5252
|
+
queryClient.cancelQueries({ queryKey });
|
|
5253
|
+
query.refetch();
|
|
5254
|
+
}, 3e3);
|
|
5255
|
+
return () => {
|
|
5256
|
+
clearInterval(intervalId);
|
|
5257
|
+
};
|
|
5258
|
+
}
|
|
5259
|
+
}, [
|
|
5260
|
+
query.data,
|
|
5261
|
+
enabled,
|
|
5262
|
+
buyer,
|
|
5263
|
+
query.fetchStatus,
|
|
5264
|
+
query.isError,
|
|
5265
|
+
query,
|
|
5266
|
+
queryClient,
|
|
5267
|
+
queryKey
|
|
5268
|
+
]);
|
|
5269
|
+
return query;
|
|
5248
5270
|
}
|
|
5249
5271
|
|
|
5250
5272
|
//#endregion
|
|
@@ -5664,9 +5686,10 @@ const useEnsureCorrectChain = () => {
|
|
|
5664
5686
|
closeSwitchChainErrorModal
|
|
5665
5687
|
]);
|
|
5666
5688
|
const ensureCorrectChainAsync = useCallback(async (targetChainId) => {
|
|
5667
|
-
if (currentChainId === targetChainId) return
|
|
5668
|
-
return switchChainAsync({ chainId: targetChainId }).catch(() => {
|
|
5689
|
+
if (currentChainId === targetChainId) return true;
|
|
5690
|
+
return switchChainAsync({ chainId: targetChainId }).then(() => true).catch(() => {
|
|
5669
5691
|
showSwitchChainErrorModal({ chainIdToSwitchTo: targetChainId });
|
|
5692
|
+
return false;
|
|
5670
5693
|
});
|
|
5671
5694
|
}, [
|
|
5672
5695
|
currentChainId,
|
|
@@ -5701,7 +5724,7 @@ const generateCancelTransaction = async (args, config) => {
|
|
|
5701
5724
|
return getMarketplaceClient(config).generateCancelTransaction(args).then((data) => data.steps);
|
|
5702
5725
|
};
|
|
5703
5726
|
const useGenerateCancelTransaction = (params) => {
|
|
5704
|
-
const config = useConfig();
|
|
5727
|
+
const config = useConfig$1();
|
|
5705
5728
|
const { mutate, mutateAsync, ...result } = useMutation({
|
|
5706
5729
|
onSuccess: (data) => {
|
|
5707
5730
|
if (params.onSuccess) params.onSuccess(data);
|
|
@@ -5721,7 +5744,7 @@ const useProcessStep = () => {
|
|
|
5721
5744
|
const { sendTransactionAsync } = useSendTransaction();
|
|
5722
5745
|
const { signMessageAsync } = useSignMessage();
|
|
5723
5746
|
const { signTypedDataAsync } = useSignTypedData();
|
|
5724
|
-
const marketplaceClient = getMarketplaceClient(useConfig());
|
|
5747
|
+
const marketplaceClient = getMarketplaceClient(useConfig$1());
|
|
5725
5748
|
const processStep = async (step, chainId) => {
|
|
5726
5749
|
if (isTransactionStep(step)) return {
|
|
5727
5750
|
type: "transaction",
|
|
@@ -5777,7 +5800,7 @@ const useProcessStep = () => {
|
|
|
5777
5800
|
const useCancelTransactionSteps = ({ collectionAddress, chainId, setSteps, onSuccess, onError }) => {
|
|
5778
5801
|
const { address } = useAccount();
|
|
5779
5802
|
const { ensureCorrectChainAsync } = useEnsureCorrectChain();
|
|
5780
|
-
const sdkConfig = useConfig();
|
|
5803
|
+
const sdkConfig = useConfig$1();
|
|
5781
5804
|
const { generateCancelTransactionAsync } = useGenerateCancelTransaction({ chainId });
|
|
5782
5805
|
const { processStep } = useProcessStep();
|
|
5783
5806
|
const getCancelSteps = async ({ orderId, marketplace }) => {
|
|
@@ -5799,7 +5822,7 @@ const useCancelTransactionSteps = ({ collectionAddress, chainId, setSteps, onSuc
|
|
|
5799
5822
|
const queryClient = getQueryClient();
|
|
5800
5823
|
if (!address) throw new NoWalletConnectedError();
|
|
5801
5824
|
try {
|
|
5802
|
-
await ensureCorrectChainAsync(Number(chainId));
|
|
5825
|
+
if (!await ensureCorrectChainAsync(Number(chainId))) return;
|
|
5803
5826
|
setSteps((prev) => ({
|
|
5804
5827
|
...prev,
|
|
5805
5828
|
isExecuting: true
|
|
@@ -5945,7 +5968,7 @@ const generateListingTransaction = async (params, config) => {
|
|
|
5945
5968
|
return (await getMarketplaceClient(config).generateListingTransaction(args)).steps;
|
|
5946
5969
|
};
|
|
5947
5970
|
const useGenerateListingTransaction = (params) => {
|
|
5948
|
-
const config = useConfig();
|
|
5971
|
+
const config = useConfig$1();
|
|
5949
5972
|
const { mutate, mutateAsync, ...result } = useMutation({
|
|
5950
5973
|
onSuccess: (data) => {
|
|
5951
5974
|
if (params.onSuccess) params.onSuccess(data);
|
|
@@ -5977,7 +6000,7 @@ const generateOfferTransaction = async (params, config, walletKind) => {
|
|
|
5977
6000
|
return (await getMarketplaceClient(config).generateOfferTransaction(args)).steps;
|
|
5978
6001
|
};
|
|
5979
6002
|
const useGenerateOfferTransaction = (params) => {
|
|
5980
|
-
const config = useConfig();
|
|
6003
|
+
const config = useConfig$1();
|
|
5981
6004
|
const { walletKind } = useConnectorMetadata();
|
|
5982
6005
|
const { mutate, mutateAsync, ...result } = useMutation({
|
|
5983
6006
|
onSuccess: params.onSuccess,
|
|
@@ -5999,7 +6022,7 @@ const generateSellTransaction = async (args, config) => {
|
|
|
5999
6022
|
return getMarketplaceClient(config).generateSellTransaction(args).then((data) => data.steps);
|
|
6000
6023
|
};
|
|
6001
6024
|
const useGenerateSellTransaction = (params) => {
|
|
6002
|
-
const config = useConfig();
|
|
6025
|
+
const config = useConfig$1();
|
|
6003
6026
|
const { mutate, mutateAsync, ...result } = useMutation({
|
|
6004
6027
|
onSuccess: (data) => {
|
|
6005
6028
|
if (params.onSuccess) params.onSuccess(data);
|
|
@@ -6442,7 +6465,7 @@ function ordersQueryOptions(params) {
|
|
|
6442
6465
|
* ```
|
|
6443
6466
|
*/
|
|
6444
6467
|
function useOrders(params) {
|
|
6445
|
-
const defaultConfig = useConfig();
|
|
6468
|
+
const defaultConfig = useConfig$1();
|
|
6446
6469
|
const { config = defaultConfig, ...rest } = params;
|
|
6447
6470
|
return useQuery({ ...ordersQueryOptions({
|
|
6448
6471
|
config,
|
|
@@ -6521,1894 +6544,2201 @@ const useBuyModalData = () => {
|
|
|
6521
6544
|
};
|
|
6522
6545
|
|
|
6523
6546
|
//#endregion
|
|
6524
|
-
//#region src/react/ui/modals/
|
|
6525
|
-
|
|
6526
|
-
|
|
6527
|
-
|
|
6528
|
-
|
|
6529
|
-
|
|
6530
|
-
|
|
6531
|
-
|
|
6532
|
-
|
|
6533
|
-
if (checkoutModeConfig === "crypto") return "crypto";
|
|
6534
|
-
}
|
|
6535
|
-
|
|
6536
|
-
//#endregion
|
|
6537
|
-
//#region src/react/ui/modals/BuyModal/internal/buyModalContext.ts
|
|
6538
|
-
function useBuyModalContext() {
|
|
6539
|
-
const config = useConfig();
|
|
6540
|
-
const modalProps = useBuyModalProps();
|
|
6541
|
-
const checkoutModeConfig = config.checkoutMode ?? "trails";
|
|
6542
|
-
const { close } = useBuyModal();
|
|
6543
|
-
const transactionStatusModal = useTransactionStatusModal();
|
|
6544
|
-
const { supportedChains, isLoadingChains } = useSupportedChains();
|
|
6545
|
-
const { collectible, collection, currency, marketOrder, collectionAddress, primarySaleItem, isLoading: isBuyModalDataLoading, isMarket, isShop, error, refetchQueries } = useBuyModalData();
|
|
6546
|
-
const transactionData = useBuyTransaction({
|
|
6547
|
-
modalProps,
|
|
6548
|
-
primarySalePrice: {
|
|
6549
|
-
amount: primarySaleItem?.priceAmount,
|
|
6550
|
-
currencyAddress: primarySaleItem?.currencyAddress
|
|
6547
|
+
//#region src/react/ui/modals/_internal/constants/opensea-currencies.ts
|
|
6548
|
+
const OPENSEA_CHAIN_CURRENCIES = {
|
|
6549
|
+
"1": {
|
|
6550
|
+
chainId: 1,
|
|
6551
|
+
openseaId: "ethereum",
|
|
6552
|
+
name: "Ethereum",
|
|
6553
|
+
nativeCurrency: {
|
|
6554
|
+
symbol: "ETH",
|
|
6555
|
+
address: zeroAddress
|
|
6551
6556
|
},
|
|
6552
|
-
|
|
6553
|
-
|
|
6554
|
-
|
|
6555
|
-
|
|
6556
|
-
|
|
6557
|
-
|
|
6558
|
-
|
|
6559
|
-
|
|
6560
|
-
const buyStep = steps?.find((step) => step.id === "buy");
|
|
6561
|
-
const checkoutMode = determineCheckoutMode({
|
|
6562
|
-
checkoutModeConfig,
|
|
6563
|
-
isChainSupported,
|
|
6564
|
-
canBeUsedWithTrails
|
|
6565
|
-
});
|
|
6566
|
-
const formattedAmount = currency?.decimals && buyStep?.price ? formatUnits(BigInt(buyStep.price), currency.decimals) : void 0;
|
|
6567
|
-
const handleTransactionSuccess = (hash) => {
|
|
6568
|
-
if (!collectible) throw new Error("Collectible not found");
|
|
6569
|
-
if (isMarket && !marketOrder) throw new Error("Order not found");
|
|
6570
|
-
if (!currency) throw new Error("Currency not found");
|
|
6571
|
-
const amountRaw = isMarket ? marketOrder?.priceAmount : primarySaleItem?.priceAmount;
|
|
6572
|
-
if (amountRaw == null) throw new Error("Price amount not found");
|
|
6573
|
-
close();
|
|
6574
|
-
transactionStatusModal.show({
|
|
6575
|
-
hash,
|
|
6576
|
-
orderId: isMarket ? marketOrder?.orderId : void 0,
|
|
6577
|
-
price: {
|
|
6578
|
-
amountRaw,
|
|
6579
|
-
currency
|
|
6580
|
-
},
|
|
6581
|
-
collectionAddress,
|
|
6582
|
-
chainId: modalProps.chainId,
|
|
6583
|
-
tokenId: collectible.tokenId,
|
|
6584
|
-
type: TransactionType$1.BUY
|
|
6585
|
-
});
|
|
6586
|
-
};
|
|
6587
|
-
const handleTrailsSuccess = (data) => {
|
|
6588
|
-
handleTransactionSuccess(data.txHash);
|
|
6589
|
-
};
|
|
6590
|
-
const handleClose = () => {
|
|
6591
|
-
if (pendingFeeOptionConfirmation?.id) {
|
|
6592
|
-
console.log("rejecting pending fee option", pendingFeeOptionConfirmation?.id);
|
|
6593
|
-
rejectPendingFeeOption(pendingFeeOptionConfirmation?.id);
|
|
6557
|
+
wrappedNativeCurrency: { address: "0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2" },
|
|
6558
|
+
offerCurrency: {
|
|
6559
|
+
symbol: "WETH",
|
|
6560
|
+
address: "0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2"
|
|
6561
|
+
},
|
|
6562
|
+
listingCurrency: {
|
|
6563
|
+
symbol: "ETH",
|
|
6564
|
+
address: zeroAddress
|
|
6594
6565
|
}
|
|
6595
|
-
|
|
6596
|
-
|
|
6597
|
-
|
|
6598
|
-
|
|
6599
|
-
|
|
6600
|
-
|
|
6601
|
-
|
|
6602
|
-
|
|
6603
|
-
modalProps,
|
|
6604
|
-
close: handleClose,
|
|
6605
|
-
steps,
|
|
6606
|
-
collectible,
|
|
6607
|
-
collection,
|
|
6608
|
-
primarySaleItem,
|
|
6609
|
-
marketOrder,
|
|
6610
|
-
isShop,
|
|
6611
|
-
buyStep,
|
|
6612
|
-
isLoading,
|
|
6613
|
-
checkoutMode,
|
|
6614
|
-
formattedAmount,
|
|
6615
|
-
handleTransactionSuccess,
|
|
6616
|
-
handleTrailsSuccess,
|
|
6617
|
-
error: error || transactionData.error,
|
|
6618
|
-
refetchAll
|
|
6619
|
-
};
|
|
6620
|
-
}
|
|
6621
|
-
|
|
6622
|
-
//#endregion
|
|
6623
|
-
//#region src/react/ui/modals/BuyModal/components/CollectibleMetadataSummary.tsx
|
|
6624
|
-
const CollectibleMetadataSummary = ({ checkoutMode, collectible, collection, chainId, currency, formattedPrice, renderCurrencyPrice, renderPriceUSD, isMarket }) => {
|
|
6625
|
-
if (!collectible) return null;
|
|
6626
|
-
const isTrails = checkoutMode === "trails";
|
|
6627
|
-
const isCryptoPayment = checkoutMode === "crypto";
|
|
6628
|
-
const imageSize = isTrails ? "h-12 w-12" : "h-[84px] w-[84px]";
|
|
6629
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
6630
|
-
className: isTrails ? "flex w-full items-start gap-4 p-6 pb-0" : "flex items-start gap-4",
|
|
6631
|
-
children: [/* @__PURE__ */ jsx(Media, {
|
|
6632
|
-
assets: [
|
|
6633
|
-
collectible.video,
|
|
6634
|
-
collectible.animation_url,
|
|
6635
|
-
collectible.image
|
|
6636
|
-
],
|
|
6637
|
-
name: collectible.name,
|
|
6638
|
-
containerClassName: `${imageSize} shrink-0 rounded-lg overflow-hidden object-cover`
|
|
6639
|
-
}), /* @__PURE__ */ jsxs("div", {
|
|
6640
|
-
className: "flex min-w-0 flex-1 flex-col gap-2",
|
|
6641
|
-
children: [isTrails ? /* @__PURE__ */ jsxs("div", {
|
|
6642
|
-
className: "flex flex-col gap-1",
|
|
6643
|
-
children: [/* @__PURE__ */ jsxs("div", {
|
|
6644
|
-
className: "flex items-center gap-2",
|
|
6645
|
-
children: [/* @__PURE__ */ jsx(Text, {
|
|
6646
|
-
className: "truncate font-semibold text-sm text-text-100",
|
|
6647
|
-
children: collectible.name || "Unnamed"
|
|
6648
|
-
}), collectible.tokenId !== void 0 && /* @__PURE__ */ jsxs(Text, {
|
|
6649
|
-
className: "shrink-0 font-bold text-text-50 text-xs",
|
|
6650
|
-
children: ["#", collectible.tokenId.toString()]
|
|
6651
|
-
})]
|
|
6652
|
-
}), collection && /* @__PURE__ */ jsxs("div", {
|
|
6653
|
-
className: "flex items-center gap-2",
|
|
6654
|
-
children: [collection.logoURI && /* @__PURE__ */ jsx("img", {
|
|
6655
|
-
src: collection.logoURI,
|
|
6656
|
-
alt: collection.name,
|
|
6657
|
-
className: "h-4 w-4 shrink-0 rounded-full"
|
|
6658
|
-
}), /* @__PURE__ */ jsx(Text, {
|
|
6659
|
-
className: "truncate font-bold text-text-50 text-xs",
|
|
6660
|
-
children: collection.name
|
|
6661
|
-
})]
|
|
6662
|
-
})]
|
|
6663
|
-
}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
|
|
6664
|
-
className: "flex items-center gap-2",
|
|
6665
|
-
children: [/* @__PURE__ */ jsx(Text, {
|
|
6666
|
-
className: "truncate font-semibold text-sm text-text-100",
|
|
6667
|
-
children: collectible.name
|
|
6668
|
-
}), collectible.tokenId !== void 0 && /* @__PURE__ */ jsxs(Text, {
|
|
6669
|
-
className: "shrink-0 font-bold text-text-50 text-xs",
|
|
6670
|
-
children: ["#", collectible.tokenId.toString()]
|
|
6671
|
-
})]
|
|
6672
|
-
}), collection && /* @__PURE__ */ jsx(Text, {
|
|
6673
|
-
className: "truncate font-bold text-text-50 text-xs",
|
|
6674
|
-
children: collection.name
|
|
6675
|
-
})] }), isCryptoPayment && renderCurrencyPrice && /* @__PURE__ */ jsxs("div", {
|
|
6676
|
-
className: "mt-2 flex flex-col",
|
|
6677
|
-
children: [/* @__PURE__ */ jsx(Tooltip, {
|
|
6678
|
-
message: `${formattedPrice || ""} ${currency?.symbol || ""}`,
|
|
6679
|
-
side: "right",
|
|
6680
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
6681
|
-
className: "flex items-center gap-1",
|
|
6682
|
-
children: [currency?.imageUrl ? /* @__PURE__ */ jsx("img", {
|
|
6683
|
-
src: currency.imageUrl,
|
|
6684
|
-
alt: currency.symbol,
|
|
6685
|
-
className: "h-5 w-5 rounded-full"
|
|
6686
|
-
}) : chainId ? /* @__PURE__ */ jsx(NetworkImage, {
|
|
6687
|
-
chainId,
|
|
6688
|
-
size: "sm"
|
|
6689
|
-
}) : null, /* @__PURE__ */ jsx(Text, {
|
|
6690
|
-
className: "font-bold text-md",
|
|
6691
|
-
children: renderCurrencyPrice()
|
|
6692
|
-
})]
|
|
6693
|
-
})
|
|
6694
|
-
}), isMarket && renderPriceUSD && renderPriceUSD() && /* @__PURE__ */ jsx(Text, {
|
|
6695
|
-
className: "font-bold text-text-50 text-xs",
|
|
6696
|
-
children: renderPriceUSD()
|
|
6697
|
-
})]
|
|
6698
|
-
})]
|
|
6699
|
-
})]
|
|
6700
|
-
});
|
|
6701
|
-
};
|
|
6702
|
-
|
|
6703
|
-
//#endregion
|
|
6704
|
-
//#region src/react/ui/components/_internals/ErrorLogBox.tsx
|
|
6705
|
-
const ErrorLogBox = ({ title, message, error, onDismiss }) => {
|
|
6706
|
-
const [showFullError, setShowFullError] = useState(false);
|
|
6707
|
-
const toggleFullError = () => {
|
|
6708
|
-
setShowFullError(!showFullError);
|
|
6709
|
-
};
|
|
6710
|
-
return /* @__PURE__ */ jsx("div", {
|
|
6711
|
-
className: "wrap-anywhere relative max-h-96 overflow-y-auto rounded-lg border border-red-900 bg-[#2b0000] p-3",
|
|
6712
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
6713
|
-
className: "flex items-start gap-3",
|
|
6714
|
-
children: [
|
|
6715
|
-
/* @__PURE__ */ jsx(WarningIcon, {
|
|
6716
|
-
className: "absolute mt-0.5 flex-shrink-0 text-red-500",
|
|
6717
|
-
size: "sm"
|
|
6718
|
-
}),
|
|
6719
|
-
/* @__PURE__ */ jsxs("div", {
|
|
6720
|
-
className: "min-w-0 flex-1",
|
|
6721
|
-
children: [/* @__PURE__ */ jsxs("div", {
|
|
6722
|
-
className: "relative ml-10 flex flex-col",
|
|
6723
|
-
children: [/* @__PURE__ */ jsx(Text, {
|
|
6724
|
-
className: "font-bold text-red-400 text-sm",
|
|
6725
|
-
children: title
|
|
6726
|
-
}), /* @__PURE__ */ jsx(Text, {
|
|
6727
|
-
className: "mt-1 text-red-300 text-xs",
|
|
6728
|
-
children: message
|
|
6729
|
-
})]
|
|
6730
|
-
}), error && /* @__PURE__ */ jsxs("div", {
|
|
6731
|
-
className: "mt-2",
|
|
6732
|
-
children: [
|
|
6733
|
-
/* @__PURE__ */ jsxs("button", {
|
|
6734
|
-
onClick: toggleFullError,
|
|
6735
|
-
className: "flex items-center gap-1 text-red-400 text-xs transition-colors hover:text-red-300",
|
|
6736
|
-
type: "button",
|
|
6737
|
-
children: [showFullError ? "Hide full error" : "Show full error", showFullError ? /* @__PURE__ */ jsx(ChevronUpIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-3 w-3" })]
|
|
6738
|
-
}),
|
|
6739
|
-
showFullError && /* @__PURE__ */ jsx("div", { className: "mt-2 h-px bg-red-900" }),
|
|
6740
|
-
showFullError && /* @__PURE__ */ jsx("div", {
|
|
6741
|
-
className: "mt-2 overflow-auto rounded-md bg-red-950 p-2",
|
|
6742
|
-
children: /* @__PURE__ */ jsxs(Text, {
|
|
6743
|
-
className: "whitespace-pre-wrap break-words font-mono text-red-100 text-xs",
|
|
6744
|
-
children: [
|
|
6745
|
-
error.message,
|
|
6746
|
-
error.stack && /* @__PURE__ */ jsxs(Fragment, { children: ["\n\nStack trace:\n", error.stack] }),
|
|
6747
|
-
JSON.stringify(error, null, 2)
|
|
6748
|
-
]
|
|
6749
|
-
})
|
|
6750
|
-
})
|
|
6751
|
-
]
|
|
6752
|
-
})]
|
|
6753
|
-
}),
|
|
6754
|
-
onDismiss && /* @__PURE__ */ jsx("button", {
|
|
6755
|
-
onClick: onDismiss,
|
|
6756
|
-
className: "absolute right-4 flex-shrink-0 text-red-400 transition-colors hover:text-red-300",
|
|
6757
|
-
type: "button",
|
|
6758
|
-
"aria-label": "Dismiss error",
|
|
6759
|
-
children: /* @__PURE__ */ jsx(CloseIcon, { className: "h-3 w-3" })
|
|
6760
|
-
})
|
|
6761
|
-
]
|
|
6762
|
-
})
|
|
6763
|
-
});
|
|
6764
|
-
};
|
|
6765
|
-
|
|
6766
|
-
//#endregion
|
|
6767
|
-
//#region src/react/ui/modals/BuyModal/hooks/useExecuteBundledTransactions.ts
|
|
6768
|
-
var FeeOptionInsufficientFundsError = class extends Error {
|
|
6769
|
-
feeOptions;
|
|
6770
|
-
constructor(message, feeOptions) {
|
|
6771
|
-
super(message);
|
|
6772
|
-
this.name = "FeeOptionInsufficientFundsError";
|
|
6773
|
-
this.feeOptions = feeOptions;
|
|
6774
|
-
}
|
|
6775
|
-
};
|
|
6776
|
-
const useExecuteBundledTransactions = ({ chainId, approvalStep, priceAmount }) => {
|
|
6777
|
-
const config = useConfig();
|
|
6778
|
-
const [isExecuting, setIsExecuting] = useState(false);
|
|
6779
|
-
const { address, connector } = useAccount();
|
|
6780
|
-
const publicClient = usePublicClient();
|
|
6781
|
-
const { data: walletClient } = useWalletClient();
|
|
6782
|
-
const indexerClient = getIndexerClient(chainId, config);
|
|
6783
|
-
const { collection, currency } = useBuyModalData();
|
|
6784
|
-
const isReady = !!address && !!publicClient && !!walletClient && !!indexerClient && !!connector && !!collection?.address && priceAmount != null;
|
|
6785
|
-
const executeBundledTransactions = async ({ step, onBalanceInsufficientForFeeOption, onTransactionFailed }) => {
|
|
6786
|
-
setIsExecuting(true);
|
|
6787
|
-
try {
|
|
6788
|
-
if (!address) throw new Error("Address not found");
|
|
6789
|
-
if (!publicClient) throw new Error("Public client not found");
|
|
6790
|
-
if (!walletClient) throw new Error("Wallet client not found");
|
|
6791
|
-
if (!indexerClient) throw new Error("Indexer client not found");
|
|
6792
|
-
if (!connector) throw new Error("Connector not found");
|
|
6793
|
-
if (!collection?.address) throw new Error("Collection address not found");
|
|
6794
|
-
if (priceAmount == null) throw new Error("Price amount not found");
|
|
6795
|
-
const approvalData = approvalStep ? {
|
|
6796
|
-
to: approvalStep.to,
|
|
6797
|
-
data: approvalStep.data,
|
|
6798
|
-
chainId
|
|
6799
|
-
} : void 0;
|
|
6800
|
-
const transactionData = {
|
|
6801
|
-
to: step.to,
|
|
6802
|
-
data: step.data,
|
|
6803
|
-
chainId,
|
|
6804
|
-
...currency?.nativeCurrency ? { value: priceAmount } : {}
|
|
6805
|
-
};
|
|
6806
|
-
const sendTransactionFns = await sendTransactions({
|
|
6807
|
-
chainId,
|
|
6808
|
-
senderAddress: address,
|
|
6809
|
-
publicClient,
|
|
6810
|
-
walletClient,
|
|
6811
|
-
indexerClient,
|
|
6812
|
-
connector,
|
|
6813
|
-
transactions: [...approvalData ? [approvalData] : [], transactionData],
|
|
6814
|
-
transactionConfirmations: 1,
|
|
6815
|
-
waitConfirmationForLastTransaction: false
|
|
6816
|
-
});
|
|
6817
|
-
if (!sendTransactionFns.length) throw new Error("No transactions returned");
|
|
6818
|
-
let txHash;
|
|
6819
|
-
for (const sendTransaction of sendTransactionFns) txHash = await sendTransaction();
|
|
6820
|
-
if (!txHash) throw new Error("Transaction hash not found");
|
|
6821
|
-
return txHash;
|
|
6822
|
-
} catch (error) {
|
|
6823
|
-
if (error instanceof FeeOptionInsufficientFundsError) {
|
|
6824
|
-
if (onBalanceInsufficientForFeeOption) onBalanceInsufficientForFeeOption(error);
|
|
6825
|
-
throw error;
|
|
6826
|
-
}
|
|
6827
|
-
if (onTransactionFailed) onTransactionFailed(error);
|
|
6828
|
-
throw error;
|
|
6829
|
-
} finally {
|
|
6830
|
-
setIsExecuting(false);
|
|
6831
|
-
}
|
|
6832
|
-
};
|
|
6833
|
-
return {
|
|
6834
|
-
executeBundledTransactions,
|
|
6835
|
-
isExecuting,
|
|
6836
|
-
isReady
|
|
6837
|
-
};
|
|
6838
|
-
};
|
|
6839
|
-
|
|
6840
|
-
//#endregion
|
|
6841
|
-
//#region src/react/ui/modals/BuyModal/hooks/useHasSufficientBalance.ts
|
|
6842
|
-
const useHasSufficientBalance = ({ chainId, value, tokenAddress }) => {
|
|
6843
|
-
const { address } = useAccount();
|
|
6844
|
-
const { data: balanceData, isLoading } = useTokenCurrencyBalance({
|
|
6845
|
-
currencyAddress: tokenAddress,
|
|
6846
|
-
chainId,
|
|
6847
|
-
userAddress: address
|
|
6848
|
-
});
|
|
6849
|
-
const balance = balanceData?.value ?? 0n;
|
|
6850
|
-
return {
|
|
6851
|
-
data: {
|
|
6852
|
-
hasSufficientBalance: balance >= value || value === 0n,
|
|
6853
|
-
balance
|
|
6566
|
+
},
|
|
6567
|
+
"10": {
|
|
6568
|
+
chainId: 10,
|
|
6569
|
+
openseaId: "optimism",
|
|
6570
|
+
name: "Optimism",
|
|
6571
|
+
nativeCurrency: {
|
|
6572
|
+
symbol: "ETH",
|
|
6573
|
+
address: zeroAddress
|
|
6854
6574
|
},
|
|
6855
|
-
|
|
6856
|
-
|
|
6857
|
-
|
|
6858
|
-
|
|
6859
|
-
|
|
6860
|
-
|
|
6861
|
-
|
|
6862
|
-
|
|
6863
|
-
const [isApproving, setIsApproving] = useState(false);
|
|
6864
|
-
const [error, setError] = useState(null);
|
|
6865
|
-
const { isSequence: isSequenceConnector, isWaaS } = useConnectorMetadata();
|
|
6866
|
-
const buyStep = steps.find((step) => step.id === StepType.buy);
|
|
6867
|
-
if (!buyStep) throw new Error("Buy step not found");
|
|
6868
|
-
const { collectible, currency, marketOrder, primarySaleItem, isMarket, isShop, collection, isLoading: isLoadingBuyModalData } = useBuyModalData();
|
|
6869
|
-
const sdkConfig = useConfig();
|
|
6870
|
-
const { ensureCorrectChainAsync, currentChainId } = useEnsureCorrectChain();
|
|
6871
|
-
const isOnCorrectChain = currentChainId === chainId;
|
|
6872
|
-
const priceAmount = isMarket ? marketOrder?.priceAmount : primarySaleItem?.priceAmount;
|
|
6873
|
-
const priceCurrencyAddress = isMarket ? marketOrder?.priceCurrencyAddress : primarySaleItem?.currencyAddress;
|
|
6874
|
-
const isAnyTransactionPending = isApproving || isExecuting;
|
|
6875
|
-
const { data, isLoading: isLoadingBalance } = useHasSufficientBalance({
|
|
6876
|
-
chainId,
|
|
6877
|
-
value: BigInt(priceAmount || 0),
|
|
6878
|
-
tokenAddress: priceCurrencyAddress
|
|
6879
|
-
});
|
|
6880
|
-
const hasSufficientBalance = data?.hasSufficientBalance ?? false;
|
|
6881
|
-
const { sendTransactionAsync } = useSendTransaction();
|
|
6882
|
-
const [approvalStep, setApprovalStep] = useState(steps.find((step) => step.id === StepType.tokenApproval));
|
|
6883
|
-
const { executeBundledTransactions, isExecuting: isExecutingBundledTransactions, isReady: isBundledTransactionsReady } = useExecuteBundledTransactions({
|
|
6884
|
-
chainId,
|
|
6885
|
-
approvalStep,
|
|
6886
|
-
priceAmount: BigInt(priceAmount || 0)
|
|
6887
|
-
});
|
|
6888
|
-
const waas = useSelectWaasFeeOptionsStore();
|
|
6889
|
-
const { pendingFeeOptionConfirmation, rejectPendingFeeOption } = useWaasFeeOptions$1(chainId, sdkConfig);
|
|
6890
|
-
const isSponsored = pendingFeeOptionConfirmation?.options?.length === 0;
|
|
6891
|
-
const isFeeSelectionVisible = waas.isVisible || !isSponsored && !!pendingFeeOptionConfirmation?.options;
|
|
6892
|
-
const executeTransaction = async (step) => {
|
|
6893
|
-
const data$1 = step.data;
|
|
6894
|
-
const to = step.to;
|
|
6895
|
-
const value = BigInt(step.value);
|
|
6896
|
-
if (!data$1 || !to) {
|
|
6897
|
-
const errorDetails = /* @__PURE__ */ new Error(`Invalid step: 'data' and 'to' are required:
|
|
6898
|
-
data: ${data$1}
|
|
6899
|
-
to: ${to}
|
|
6900
|
-
|
|
6901
|
-
${JSON.stringify(step)}`);
|
|
6902
|
-
setError({
|
|
6903
|
-
title: "Invalid step",
|
|
6904
|
-
message: "`data` and `to` are required",
|
|
6905
|
-
details: errorDetails
|
|
6906
|
-
});
|
|
6907
|
-
throw errorDetails;
|
|
6575
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6576
|
+
offerCurrency: {
|
|
6577
|
+
symbol: "WETH",
|
|
6578
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
6579
|
+
},
|
|
6580
|
+
listingCurrency: {
|
|
6581
|
+
symbol: "ETH",
|
|
6582
|
+
address: zeroAddress
|
|
6908
6583
|
}
|
|
6909
|
-
|
|
6910
|
-
|
|
6911
|
-
|
|
6912
|
-
|
|
6913
|
-
|
|
6914
|
-
|
|
6915
|
-
|
|
6916
|
-
|
|
6917
|
-
|
|
6918
|
-
|
|
6919
|
-
|
|
6920
|
-
|
|
6921
|
-
|
|
6922
|
-
|
|
6923
|
-
|
|
6924
|
-
|
|
6925
|
-
|
|
6926
|
-
try {
|
|
6927
|
-
await executeTransaction(approvalStep);
|
|
6928
|
-
setApprovalStep(void 0);
|
|
6929
|
-
} catch (error$1) {
|
|
6930
|
-
const errorObj = error$1 instanceof Error ? error$1 : new Error(String(error$1));
|
|
6931
|
-
setError({
|
|
6932
|
-
title: "Approval failed",
|
|
6933
|
-
message: errorObj.message || "Failed to approve token. Please try again.",
|
|
6934
|
-
details: errorObj
|
|
6935
|
-
});
|
|
6936
|
-
console.error("Approval transaction failed:", error$1);
|
|
6937
|
-
} finally {
|
|
6938
|
-
setIsApproving(false);
|
|
6584
|
+
},
|
|
6585
|
+
"137": {
|
|
6586
|
+
chainId: 137,
|
|
6587
|
+
openseaId: "matic",
|
|
6588
|
+
name: "Polygon",
|
|
6589
|
+
nativeCurrency: {
|
|
6590
|
+
symbol: "POL",
|
|
6591
|
+
address: zeroAddress
|
|
6592
|
+
},
|
|
6593
|
+
wrappedNativeCurrency: { address: "0x0d500b1d8e8ef31e21c99d1db9a6444d3adf1270" },
|
|
6594
|
+
offerCurrency: {
|
|
6595
|
+
symbol: "WETH",
|
|
6596
|
+
address: "0x7ceb23fd6bc0add59e62ac25578270cff1b9f619"
|
|
6597
|
+
},
|
|
6598
|
+
listingCurrency: {
|
|
6599
|
+
symbol: "WETH",
|
|
6600
|
+
address: "0x7ceb23fd6bc0add59e62ac25578270cff1b9f619"
|
|
6939
6601
|
}
|
|
6940
|
-
}
|
|
6941
|
-
|
|
6942
|
-
|
|
6943
|
-
|
|
6944
|
-
|
|
6945
|
-
|
|
6946
|
-
|
|
6947
|
-
|
|
6948
|
-
|
|
6949
|
-
|
|
6950
|
-
|
|
6951
|
-
|
|
6952
|
-
|
|
6953
|
-
|
|
6954
|
-
|
|
6955
|
-
|
|
6956
|
-
|
|
6957
|
-
const executeBuy = async () => {
|
|
6958
|
-
setError(null);
|
|
6959
|
-
setIsExecuting(true);
|
|
6960
|
-
try {
|
|
6961
|
-
onSuccess(await executeBundledTransactions({
|
|
6962
|
-
step: buyStep,
|
|
6963
|
-
onBalanceInsufficientForFeeOption: handleBalanceInsufficientForWaasFeeOption,
|
|
6964
|
-
onTransactionFailed: handleTransactionFailed
|
|
6965
|
-
}));
|
|
6966
|
-
} catch (error$1) {
|
|
6967
|
-
const errorObj = error$1 instanceof Error ? error$1 : new Error(String(error$1));
|
|
6968
|
-
setError({
|
|
6969
|
-
title: "Purchase failed",
|
|
6970
|
-
message: errorObj.message || "Failed to complete purchase. Please try again.",
|
|
6971
|
-
details: errorObj
|
|
6972
|
-
});
|
|
6973
|
-
console.error("Buy transaction failed:", error$1);
|
|
6974
|
-
} finally {
|
|
6975
|
-
setIsExecuting(false);
|
|
6602
|
+
},
|
|
6603
|
+
"360": {
|
|
6604
|
+
chainId: 360,
|
|
6605
|
+
openseaId: "shape",
|
|
6606
|
+
name: "Shape",
|
|
6607
|
+
nativeCurrency: {
|
|
6608
|
+
symbol: "ETH",
|
|
6609
|
+
address: zeroAddress
|
|
6610
|
+
},
|
|
6611
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6612
|
+
offerCurrency: {
|
|
6613
|
+
symbol: "WETH",
|
|
6614
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
6615
|
+
},
|
|
6616
|
+
listingCurrency: {
|
|
6617
|
+
symbol: "ETH",
|
|
6618
|
+
address: zeroAddress
|
|
6976
6619
|
}
|
|
6977
|
-
}
|
|
6978
|
-
|
|
6979
|
-
|
|
6980
|
-
|
|
6981
|
-
|
|
6982
|
-
|
|
6983
|
-
|
|
6984
|
-
|
|
6985
|
-
|
|
6986
|
-
|
|
6987
|
-
|
|
6988
|
-
|
|
6989
|
-
|
|
6990
|
-
|
|
6991
|
-
|
|
6992
|
-
|
|
6993
|
-
|
|
6994
|
-
return `~$${priceUSD}`;
|
|
6995
|
-
};
|
|
6996
|
-
const renderCurrencyPrice = () => {
|
|
6997
|
-
if (isFree) return "Free";
|
|
6998
|
-
if (Number.parseFloat(formattedPrice) < 1e-4) return /* @__PURE__ */ jsxs("div", {
|
|
6999
|
-
className: "flex items-center",
|
|
7000
|
-
children: [/* @__PURE__ */ jsx(ChevronLeftIcon, { className: "w-4" }), /* @__PURE__ */ jsxs(Text, { children: ["0.0001 ", currency?.symbol] })]
|
|
7001
|
-
});
|
|
7002
|
-
return `${formattedPrice} ${currency?.symbol}`;
|
|
7003
|
-
};
|
|
7004
|
-
const feeStep = isWaaS ? {
|
|
7005
|
-
label: "Select Fee",
|
|
7006
|
-
status: isSponsored || !!waas.selectedFeeOption ? "success" : isFeeSelectionVisible ? "selecting" : "idle",
|
|
7007
|
-
isSponsored,
|
|
7008
|
-
isSelecting: isFeeSelectionVisible,
|
|
7009
|
-
selectedOption: waas.selectedFeeOption,
|
|
7010
|
-
show: () => waas.show(),
|
|
7011
|
-
cancel: () => {
|
|
7012
|
-
waas.hide();
|
|
7013
|
-
if (pendingFeeOptionConfirmation?.id) rejectPendingFeeOption(pendingFeeOptionConfirmation.id);
|
|
6620
|
+
},
|
|
6621
|
+
"998": {
|
|
6622
|
+
chainId: 998,
|
|
6623
|
+
openseaId: "hyperevm",
|
|
6624
|
+
name: "HyperEVM",
|
|
6625
|
+
nativeCurrency: {
|
|
6626
|
+
symbol: "HYPE",
|
|
6627
|
+
address: zeroAddress
|
|
6628
|
+
},
|
|
6629
|
+
wrappedNativeCurrency: { address: "0x5555555555555555555555555555555555555555" },
|
|
6630
|
+
offerCurrency: {
|
|
6631
|
+
symbol: "WHYPE",
|
|
6632
|
+
address: "0x5555555555555555555555555555555555555555"
|
|
6633
|
+
},
|
|
6634
|
+
listingCurrency: {
|
|
6635
|
+
symbol: "HYPE",
|
|
6636
|
+
address: zeroAddress
|
|
7014
6637
|
}
|
|
7015
|
-
}
|
|
7016
|
-
|
|
7017
|
-
|
|
7018
|
-
|
|
7019
|
-
|
|
7020
|
-
|
|
7021
|
-
|
|
6638
|
+
},
|
|
6639
|
+
"130": {
|
|
6640
|
+
chainId: 130,
|
|
6641
|
+
openseaId: "unichain",
|
|
6642
|
+
name: "Unichain",
|
|
6643
|
+
nativeCurrency: {
|
|
6644
|
+
symbol: "ETH",
|
|
6645
|
+
address: zeroAddress
|
|
7022
6646
|
},
|
|
7023
|
-
|
|
7024
|
-
|
|
7025
|
-
|
|
6647
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6648
|
+
offerCurrency: {
|
|
6649
|
+
symbol: "WETH",
|
|
6650
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
7026
6651
|
},
|
|
7027
|
-
|
|
7028
|
-
|
|
7029
|
-
|
|
6652
|
+
listingCurrency: {
|
|
6653
|
+
symbol: "ETH",
|
|
6654
|
+
address: zeroAddress
|
|
6655
|
+
}
|
|
6656
|
+
},
|
|
6657
|
+
"1329": {
|
|
6658
|
+
chainId: 1329,
|
|
6659
|
+
openseaId: "sei",
|
|
6660
|
+
name: "Sei",
|
|
6661
|
+
nativeCurrency: {
|
|
6662
|
+
symbol: "SEI",
|
|
6663
|
+
address: zeroAddress
|
|
7030
6664
|
},
|
|
7031
|
-
|
|
7032
|
-
|
|
7033
|
-
|
|
7034
|
-
|
|
7035
|
-
isExecutingBundledTransactions
|
|
6665
|
+
wrappedNativeCurrency: { address: "0xe30fedd158a2e3b13e9badaeabafc5516e95e8c7" },
|
|
6666
|
+
offerCurrency: {
|
|
6667
|
+
symbol: "WSEI",
|
|
6668
|
+
address: "0xe30fedd158a2e3b13e9badaeabafc5516e95e8c7"
|
|
7036
6669
|
},
|
|
7037
|
-
|
|
7038
|
-
|
|
7039
|
-
|
|
6670
|
+
listingCurrency: {
|
|
6671
|
+
symbol: "SEI",
|
|
6672
|
+
address: zeroAddress
|
|
6673
|
+
}
|
|
6674
|
+
},
|
|
6675
|
+
"1868": {
|
|
6676
|
+
chainId: 1868,
|
|
6677
|
+
openseaId: "soneium",
|
|
6678
|
+
name: "Soneium",
|
|
6679
|
+
nativeCurrency: {
|
|
6680
|
+
symbol: "ETH",
|
|
6681
|
+
address: zeroAddress
|
|
7040
6682
|
},
|
|
7041
|
-
|
|
7042
|
-
|
|
7043
|
-
|
|
6683
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6684
|
+
offerCurrency: {
|
|
6685
|
+
symbol: "WETH",
|
|
6686
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
7044
6687
|
},
|
|
7045
|
-
|
|
7046
|
-
|
|
7047
|
-
|
|
6688
|
+
listingCurrency: {
|
|
6689
|
+
symbol: "ETH",
|
|
6690
|
+
address: zeroAddress
|
|
6691
|
+
}
|
|
6692
|
+
},
|
|
6693
|
+
"2020": {
|
|
6694
|
+
chainId: 2020,
|
|
6695
|
+
openseaId: "ronin",
|
|
6696
|
+
name: "Ronin",
|
|
6697
|
+
nativeCurrency: {
|
|
6698
|
+
symbol: "RON",
|
|
6699
|
+
address: zeroAddress
|
|
7048
6700
|
},
|
|
7049
|
-
|
|
7050
|
-
|
|
7051
|
-
|
|
7052
|
-
|
|
6701
|
+
wrappedNativeCurrency: { address: "0xe514d9deb7966c8be0ca922de8a064264ea6bcd4" },
|
|
6702
|
+
offerCurrency: {
|
|
6703
|
+
symbol: "WRON",
|
|
6704
|
+
address: "0xe514d9deb7966c8be0ca922de8a064264ea6bcd4"
|
|
7053
6705
|
},
|
|
7054
|
-
|
|
7055
|
-
|
|
7056
|
-
|
|
7057
|
-
|
|
6706
|
+
listingCurrency: {
|
|
6707
|
+
symbol: "RON",
|
|
6708
|
+
address: zeroAddress
|
|
6709
|
+
}
|
|
6710
|
+
},
|
|
6711
|
+
"2741": {
|
|
6712
|
+
chainId: 2741,
|
|
6713
|
+
openseaId: "abstract",
|
|
6714
|
+
name: "Abstract",
|
|
6715
|
+
nativeCurrency: {
|
|
6716
|
+
symbol: "ETH",
|
|
6717
|
+
address: zeroAddress
|
|
7058
6718
|
},
|
|
7059
|
-
|
|
7060
|
-
|
|
7061
|
-
|
|
6719
|
+
wrappedNativeCurrency: { address: "0x3439153eb7af838ad19d56e1571fbd09333c2809" },
|
|
6720
|
+
offerCurrency: {
|
|
6721
|
+
symbol: "WETH",
|
|
6722
|
+
address: "0x3439153eb7af838ad19d56e1571fbd09333c2809"
|
|
6723
|
+
},
|
|
6724
|
+
listingCurrency: {
|
|
6725
|
+
symbol: "ETH",
|
|
6726
|
+
address: zeroAddress
|
|
7062
6727
|
}
|
|
7063
|
-
}
|
|
7064
|
-
|
|
7065
|
-
|
|
7066
|
-
|
|
7067
|
-
|
|
7068
|
-
|
|
7069
|
-
|
|
7070
|
-
|
|
7071
|
-
|
|
7072
|
-
|
|
7073
|
-
|
|
7074
|
-
|
|
7075
|
-
|
|
7076
|
-
|
|
7077
|
-
|
|
7078
|
-
|
|
7079
|
-
|
|
7080
|
-
className: "flex items-center gap-2",
|
|
7081
|
-
children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-12" })]
|
|
7082
|
-
}),
|
|
7083
|
-
/* @__PURE__ */ jsx(Skeleton, { className: "mt-1 h-3 w-24" }),
|
|
7084
|
-
/* @__PURE__ */ jsxs("div", {
|
|
7085
|
-
className: "mt-2 flex flex-col",
|
|
7086
|
-
children: [/* @__PURE__ */ jsxs("div", {
|
|
7087
|
-
className: "flex items-center gap-2",
|
|
7088
|
-
children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-4 rounded-full" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-28" })]
|
|
7089
|
-
}), /* @__PURE__ */ jsx(Skeleton, { className: "mt-1 h-3 w-16" })]
|
|
7090
|
-
})
|
|
7091
|
-
]
|
|
7092
|
-
})]
|
|
7093
|
-
}),
|
|
7094
|
-
networkMismatch && /* @__PURE__ */ jsx(Skeleton, { className: "h-[98px] w-full rounded-lg" }),
|
|
7095
|
-
networkMismatch && /* @__PURE__ */ jsx(Skeleton, { className: "h-12 w-full rounded-full" }),
|
|
7096
|
-
/* @__PURE__ */ jsx(Skeleton, { className: "h-12 w-full rounded-full" })
|
|
7097
|
-
]
|
|
7098
|
-
})
|
|
7099
|
-
});
|
|
7100
|
-
};
|
|
7101
|
-
|
|
7102
|
-
//#endregion
|
|
7103
|
-
//#region src/react/ui/modals/BuyModal/components/CryptoPaymentModal.tsx
|
|
7104
|
-
const CryptoPaymentModal = ({ chainId, steps, onSuccess }) => {
|
|
7105
|
-
const { data: { collectible, currency, collection }, loading: { isLoadingBuyModalData, isLoadingBalance }, chain: { isOnCorrectChain, currentChainId }, balance: { hasSufficientBalance }, transaction: { isApproving, isExecuting, isExecutingBundledTransactions }, error: { error, dismissError }, steps: { approvalStep, feeStep }, connector: { isSequenceConnector }, flags: { isMarket }, permissions: { canApprove, canBuy }, price: { formattedPrice, renderCurrencyPrice, renderPriceUSD }, actions: { executeApproval, executeBuy } } = useCryptoPaymentModalContext({
|
|
7106
|
-
chainId,
|
|
7107
|
-
steps,
|
|
7108
|
-
onSuccess
|
|
7109
|
-
});
|
|
7110
|
-
const { ensureCorrectChainAsync } = useEnsureCorrectChain();
|
|
7111
|
-
const [chainSwitchError, setChainSwitchError] = useState(null);
|
|
7112
|
-
const handleChainSwitchError = (error$1) => {
|
|
7113
|
-
setChainSwitchError({
|
|
7114
|
-
title: "Chain switch failed",
|
|
7115
|
-
message: `Failed to switch to ${getPresentableChainName(chainId)}. Please try changing the network in your wallet manually.`,
|
|
7116
|
-
details: error$1
|
|
7117
|
-
});
|
|
7118
|
-
};
|
|
7119
|
-
const dismissChainSwitchError = () => {
|
|
7120
|
-
setChainSwitchError(null);
|
|
7121
|
-
};
|
|
7122
|
-
const executeWithChainSwitch = async (action) => {
|
|
7123
|
-
dismissChainSwitchError();
|
|
7124
|
-
try {
|
|
7125
|
-
await ensureCorrectChainAsync(chainId);
|
|
7126
|
-
} catch (error$1) {
|
|
7127
|
-
if (error$1 instanceof Error) handleChainSwitchError(error$1);
|
|
6728
|
+
},
|
|
6729
|
+
"8333": {
|
|
6730
|
+
chainId: 8333,
|
|
6731
|
+
openseaId: "b3",
|
|
6732
|
+
name: "B3",
|
|
6733
|
+
nativeCurrency: {
|
|
6734
|
+
symbol: "ETH",
|
|
6735
|
+
address: zeroAddress
|
|
6736
|
+
},
|
|
6737
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6738
|
+
offerCurrency: {
|
|
6739
|
+
symbol: "WETH",
|
|
6740
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
6741
|
+
},
|
|
6742
|
+
listingCurrency: {
|
|
6743
|
+
symbol: "ETH",
|
|
6744
|
+
address: zeroAddress
|
|
7128
6745
|
}
|
|
7129
|
-
|
|
7130
|
-
|
|
7131
|
-
|
|
7132
|
-
|
|
7133
|
-
|
|
7134
|
-
|
|
7135
|
-
|
|
7136
|
-
|
|
7137
|
-
|
|
7138
|
-
|
|
7139
|
-
|
|
7140
|
-
|
|
7141
|
-
|
|
7142
|
-
|
|
7143
|
-
|
|
7144
|
-
|
|
7145
|
-
|
|
7146
|
-
/* @__PURE__ */ jsx(CollectibleMetadataSummary, {
|
|
7147
|
-
checkoutMode: "crypto",
|
|
7148
|
-
collectible,
|
|
7149
|
-
collection,
|
|
7150
|
-
chainId,
|
|
7151
|
-
currency,
|
|
7152
|
-
formattedPrice,
|
|
7153
|
-
renderCurrencyPrice,
|
|
7154
|
-
renderPriceUSD,
|
|
7155
|
-
isMarket
|
|
7156
|
-
}),
|
|
7157
|
-
!isLoadingBalance && !isLoadingBuyModalData && !hasSufficientBalance && /* @__PURE__ */ jsxs(Text, {
|
|
7158
|
-
className: "text-sm text-warning",
|
|
7159
|
-
children: [
|
|
7160
|
-
"You do not have enough",
|
|
7161
|
-
" ",
|
|
7162
|
-
/* @__PURE__ */ jsx(Text, {
|
|
7163
|
-
className: "font-bold",
|
|
7164
|
-
children: currency?.name
|
|
7165
|
-
}),
|
|
7166
|
-
" to purchase this item"
|
|
7167
|
-
]
|
|
7168
|
-
}),
|
|
7169
|
-
approvalStep && !isSequenceConnector && /* @__PURE__ */ jsx(Button, {
|
|
7170
|
-
onClick: async () => {
|
|
7171
|
-
await executeWithChainSwitch("approval");
|
|
7172
|
-
},
|
|
7173
|
-
disabled: !canApprove,
|
|
7174
|
-
variant: "primary",
|
|
7175
|
-
size: "lg",
|
|
7176
|
-
className: "w-full",
|
|
7177
|
-
children: approvalButtonLabel
|
|
7178
|
-
}),
|
|
7179
|
-
!isLoadingBalance && !isLoadingBuyModalData && /* @__PURE__ */ jsx(Button, {
|
|
7180
|
-
onClick: async () => {
|
|
7181
|
-
await executeWithChainSwitch("buy");
|
|
7182
|
-
},
|
|
7183
|
-
disabled: !canBuy,
|
|
7184
|
-
variant: "primary",
|
|
7185
|
-
size: "lg",
|
|
7186
|
-
className: "w-full",
|
|
7187
|
-
children: buyButtonLabel
|
|
7188
|
-
}),
|
|
7189
|
-
feeStep?.isSelecting && /* @__PURE__ */ jsx(selectWaasFeeOptions_default, {
|
|
7190
|
-
chainId,
|
|
7191
|
-
onCancel: feeStep.cancel,
|
|
7192
|
-
titleOnConfirm: "Processing purchase..."
|
|
7193
|
-
}),
|
|
7194
|
-
(chainSwitchError || error) && /* @__PURE__ */ jsx(ErrorLogBox, {
|
|
7195
|
-
title: chainSwitchError?.title ?? error?.title ?? "",
|
|
7196
|
-
message: chainSwitchError?.message ?? error?.message ?? "",
|
|
7197
|
-
error: chainSwitchError?.details ?? error?.details,
|
|
7198
|
-
onDismiss: () => {
|
|
7199
|
-
dismissChainSwitchError();
|
|
7200
|
-
dismissError();
|
|
7201
|
-
}
|
|
7202
|
-
})
|
|
7203
|
-
]
|
|
7204
|
-
})
|
|
7205
|
-
});
|
|
7206
|
-
};
|
|
7207
|
-
|
|
7208
|
-
//#endregion
|
|
7209
|
-
//#region src/react/ui/modals/_internal/components/baseModal/ErrorBoundary.tsx
|
|
7210
|
-
var ErrorBoundary = class extends Component {
|
|
7211
|
-
constructor(props) {
|
|
7212
|
-
super(props);
|
|
7213
|
-
this.state = {
|
|
7214
|
-
hasError: false,
|
|
7215
|
-
error: null,
|
|
7216
|
-
errorInfo: null
|
|
7217
|
-
};
|
|
7218
|
-
}
|
|
7219
|
-
resetErrorBoundary = () => {
|
|
7220
|
-
this.setState({
|
|
7221
|
-
hasError: false,
|
|
7222
|
-
error: null,
|
|
7223
|
-
errorInfo: null
|
|
7224
|
-
});
|
|
7225
|
-
};
|
|
7226
|
-
static getDerivedStateFromError(error) {
|
|
7227
|
-
return {
|
|
7228
|
-
hasError: true,
|
|
7229
|
-
error
|
|
7230
|
-
};
|
|
7231
|
-
}
|
|
7232
|
-
componentDidCatch(error, errorInfo) {
|
|
7233
|
-
console.error("ErrorBoundary caught an error:", error, errorInfo);
|
|
7234
|
-
this.setState({ errorInfo });
|
|
7235
|
-
this.props.onError?.(error, errorInfo);
|
|
7236
|
-
}
|
|
7237
|
-
render() {
|
|
7238
|
-
if (this.state.hasError && this.state.error) {
|
|
7239
|
-
if (this.props.fallback) {
|
|
7240
|
-
if (this.state.errorInfo) return this.props.fallback(this.state.error, this.state.errorInfo);
|
|
7241
|
-
return null;
|
|
7242
|
-
}
|
|
7243
|
-
return /* @__PURE__ */ jsx("div", {
|
|
7244
|
-
className: this.props.className,
|
|
7245
|
-
"data-testid": "error-boundary",
|
|
7246
|
-
children: /* @__PURE__ */ jsx(SmartErrorHandler, {
|
|
7247
|
-
error: this.state.error,
|
|
7248
|
-
onAction: this.props.onAction
|
|
7249
|
-
})
|
|
7250
|
-
});
|
|
6746
|
+
},
|
|
6747
|
+
"8453": {
|
|
6748
|
+
chainId: 8453,
|
|
6749
|
+
openseaId: "base",
|
|
6750
|
+
name: "Base",
|
|
6751
|
+
nativeCurrency: {
|
|
6752
|
+
symbol: "ETH",
|
|
6753
|
+
address: zeroAddress
|
|
6754
|
+
},
|
|
6755
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6756
|
+
offerCurrency: {
|
|
6757
|
+
symbol: "WETH",
|
|
6758
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
6759
|
+
},
|
|
6760
|
+
listingCurrency: {
|
|
6761
|
+
symbol: "ETH",
|
|
6762
|
+
address: zeroAddress
|
|
7251
6763
|
}
|
|
7252
|
-
|
|
7253
|
-
|
|
7254
|
-
|
|
7255
|
-
|
|
7256
|
-
|
|
7257
|
-
|
|
7258
|
-
|
|
7259
|
-
|
|
7260
|
-
*
|
|
7261
|
-
* Improvements over the original wrapper:
|
|
7262
|
-
* - Built on BaseModal foundation
|
|
7263
|
-
* - Smart error handling integration
|
|
7264
|
-
* - Optional retry functionality
|
|
7265
|
-
* - Fallback to simple message display
|
|
7266
|
-
*/
|
|
7267
|
-
const ErrorModal = ({ onClose, title, chainId, error, message, onRetry, onErrorAction }) => /* @__PURE__ */ jsx(BaseModal, {
|
|
7268
|
-
onClose,
|
|
7269
|
-
title,
|
|
7270
|
-
chainId,
|
|
7271
|
-
children: /* @__PURE__ */ jsx("div", {
|
|
7272
|
-
className: "flex items-center justify-center p-4",
|
|
7273
|
-
"data-testid": "error-modal",
|
|
7274
|
-
children: error ? /* @__PURE__ */ jsx(SmartErrorHandler, {
|
|
7275
|
-
error,
|
|
7276
|
-
onAction: onErrorAction || (onRetry ? () => onRetry() : void 0)
|
|
7277
|
-
}) : /* @__PURE__ */ jsx(Text, {
|
|
7278
|
-
className: "font-body",
|
|
7279
|
-
color: "text80",
|
|
7280
|
-
children: message || "Error loading item details"
|
|
7281
|
-
})
|
|
7282
|
-
})
|
|
7283
|
-
});
|
|
7284
|
-
|
|
7285
|
-
//#endregion
|
|
7286
|
-
//#region src/react/ui/modals/_internal/components/baseModal/LoadingModal.tsx
|
|
7287
|
-
const LoadingModal = ({ onClose, title, chainId, disableAnimation = true, message }) => /* @__PURE__ */ jsx(BaseModal, {
|
|
7288
|
-
onClose,
|
|
7289
|
-
title,
|
|
7290
|
-
chainId,
|
|
7291
|
-
disableAnimation,
|
|
7292
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
7293
|
-
className: "flex flex-col items-center justify-center gap-4 p-4",
|
|
7294
|
-
"data-testid": "loading-modal",
|
|
7295
|
-
children: [/* @__PURE__ */ jsx(Spinner, { size: "lg" }), message && /* @__PURE__ */ jsx("p", {
|
|
7296
|
-
className: "text-center text-sm text-text-80",
|
|
7297
|
-
children: message
|
|
7298
|
-
})]
|
|
7299
|
-
})
|
|
7300
|
-
});
|
|
7301
|
-
|
|
7302
|
-
//#endregion
|
|
7303
|
-
//#region src/react/ui/modals/BuyModal/components/sequence-checkout/ERC1155QuantityModal.tsx
|
|
7304
|
-
const ERC1155QuantityModal = ({ order, quantityRemaining, unlimitedSupply, salePrice, chainId, cardType }) => {
|
|
7305
|
-
const minQuantity = 1n;
|
|
7306
|
-
const [quantity, setQuantity] = useState(minQuantity);
|
|
7307
|
-
const [localInvalidQuantity, setLocalInvalidQuantity] = useState(false);
|
|
7308
|
-
const maxQuantity = unlimitedSupply ? maxUint256 : quantityRemaining;
|
|
7309
|
-
const invalidQuantity = maxQuantity < minQuantity || localInvalidQuantity;
|
|
7310
|
-
const handleSetQuantity = () => {
|
|
7311
|
-
buyModalStore.send({
|
|
7312
|
-
type: "setQuantity",
|
|
7313
|
-
quantity: Number(quantity)
|
|
7314
|
-
});
|
|
7315
|
-
buyModalStore.send({ type: "openPaymentModal" });
|
|
7316
|
-
};
|
|
7317
|
-
return /* @__PURE__ */ jsx(ActionModal, {
|
|
7318
|
-
chainId,
|
|
7319
|
-
onClose: () => buyModalStore.send({ type: "close" }),
|
|
7320
|
-
title: "Select Quantity",
|
|
7321
|
-
disableAnimation: true,
|
|
7322
|
-
type: "buy",
|
|
7323
|
-
queries: {},
|
|
7324
|
-
primaryAction: {
|
|
7325
|
-
label: "Buy now",
|
|
7326
|
-
onClick: handleSetQuantity,
|
|
7327
|
-
disabled: invalidQuantity
|
|
6764
|
+
},
|
|
6765
|
+
"33139": {
|
|
6766
|
+
chainId: 33139,
|
|
6767
|
+
openseaId: "ape_chain",
|
|
6768
|
+
name: "ApeChain",
|
|
6769
|
+
nativeCurrency: {
|
|
6770
|
+
symbol: "APE",
|
|
6771
|
+
address: zeroAddress
|
|
7328
6772
|
},
|
|
7329
|
-
|
|
7330
|
-
|
|
7331
|
-
|
|
7332
|
-
|
|
6773
|
+
wrappedNativeCurrency: { address: "0x48b62137edfa95a428d35c09e44256a739f6b557" },
|
|
6774
|
+
offerCurrency: {
|
|
6775
|
+
symbol: "WAPE",
|
|
6776
|
+
address: "0x48b62137edfa95a428d35c09e44256a739f6b557"
|
|
6777
|
+
},
|
|
6778
|
+
listingCurrency: {
|
|
6779
|
+
symbol: "APE",
|
|
6780
|
+
address: zeroAddress
|
|
6781
|
+
}
|
|
6782
|
+
},
|
|
6783
|
+
"42161": {
|
|
6784
|
+
chainId: 42161,
|
|
6785
|
+
openseaId: "arbitrum",
|
|
6786
|
+
name: "Arbitrum",
|
|
6787
|
+
nativeCurrency: {
|
|
6788
|
+
symbol: "ETH",
|
|
6789
|
+
address: zeroAddress
|
|
6790
|
+
},
|
|
6791
|
+
wrappedNativeCurrency: { address: "0x82af49447d8a07e3bd95bd0d56f35241523fbab1" },
|
|
6792
|
+
offerCurrency: {
|
|
6793
|
+
symbol: "WETH",
|
|
6794
|
+
address: "0x82af49447d8a07e3bd95bd0d56f35241523fbab1"
|
|
6795
|
+
},
|
|
6796
|
+
listingCurrency: {
|
|
6797
|
+
symbol: "ETH",
|
|
6798
|
+
address: zeroAddress
|
|
6799
|
+
}
|
|
6800
|
+
},
|
|
6801
|
+
"42170": {
|
|
6802
|
+
chainId: 42170,
|
|
6803
|
+
openseaId: "arbitrum_nova",
|
|
6804
|
+
name: "Arbitrum Nova",
|
|
6805
|
+
nativeCurrency: {
|
|
6806
|
+
symbol: "ETH",
|
|
6807
|
+
address: zeroAddress
|
|
6808
|
+
},
|
|
6809
|
+
wrappedNativeCurrency: { address: "0x722e8bdd2ce80a4422e880164f2079488e115365" },
|
|
6810
|
+
offerCurrency: {
|
|
6811
|
+
symbol: "WETH",
|
|
6812
|
+
address: "0x722e8bdd2ce80a4422e880164f2079488e115365"
|
|
6813
|
+
},
|
|
6814
|
+
listingCurrency: {
|
|
6815
|
+
symbol: "ETH",
|
|
6816
|
+
address: zeroAddress
|
|
6817
|
+
}
|
|
6818
|
+
},
|
|
6819
|
+
"43114": {
|
|
6820
|
+
chainId: 43114,
|
|
6821
|
+
openseaId: "avalanche",
|
|
6822
|
+
name: "Avalanche",
|
|
6823
|
+
nativeCurrency: {
|
|
6824
|
+
symbol: "AVAX",
|
|
6825
|
+
address: zeroAddress
|
|
6826
|
+
},
|
|
6827
|
+
wrappedNativeCurrency: { address: "0xb31f66aa3c1e785363f0875a1b74e27b85fd66c7" },
|
|
6828
|
+
offerCurrency: {
|
|
6829
|
+
symbol: "WAVAX",
|
|
6830
|
+
address: "0xb31f66aa3c1e785363f0875a1b74e27b85fd66c7"
|
|
6831
|
+
},
|
|
6832
|
+
listingCurrency: {
|
|
6833
|
+
symbol: "AVAX",
|
|
6834
|
+
address: zeroAddress
|
|
6835
|
+
}
|
|
6836
|
+
},
|
|
6837
|
+
"43419": {
|
|
6838
|
+
chainId: 43419,
|
|
6839
|
+
openseaId: "gunzilla",
|
|
6840
|
+
name: "GUNZ",
|
|
6841
|
+
nativeCurrency: {
|
|
6842
|
+
symbol: "GUN",
|
|
6843
|
+
address: zeroAddress
|
|
6844
|
+
},
|
|
6845
|
+
wrappedNativeCurrency: { address: "0x5aad7bba61d95c2c4e525a35f4062040264611f1" },
|
|
6846
|
+
offerCurrency: {
|
|
6847
|
+
symbol: "WGUN",
|
|
6848
|
+
address: "0x5aad7bba61d95c2c4e525a35f4062040264611f1"
|
|
7333
6849
|
},
|
|
7334
|
-
|
|
7335
|
-
|
|
7336
|
-
|
|
7337
|
-
children: [/* @__PURE__ */ jsx(QuantityInput, {
|
|
7338
|
-
quantity,
|
|
7339
|
-
invalidQuantity,
|
|
7340
|
-
onQuantityChange: setQuantity,
|
|
7341
|
-
onInvalidQuantityChange: setLocalInvalidQuantity,
|
|
7342
|
-
maxQuantity
|
|
7343
|
-
}), /* @__PURE__ */ jsx(TotalPrice, {
|
|
7344
|
-
order,
|
|
7345
|
-
quantity,
|
|
7346
|
-
salePrice,
|
|
7347
|
-
chainId,
|
|
7348
|
-
cardType
|
|
7349
|
-
})]
|
|
7350
|
-
});
|
|
6850
|
+
listingCurrency: {
|
|
6851
|
+
symbol: "GUN",
|
|
6852
|
+
address: zeroAddress
|
|
7351
6853
|
}
|
|
7352
|
-
}
|
|
7353
|
-
|
|
7354
|
-
|
|
7355
|
-
|
|
7356
|
-
|
|
7357
|
-
|
|
7358
|
-
|
|
7359
|
-
|
|
7360
|
-
currencyAddress: order ? order.priceCurrencyAddress : salePrice?.currencyAddress
|
|
7361
|
-
});
|
|
7362
|
-
let error = null;
|
|
7363
|
-
let formattedPrice = "0";
|
|
7364
|
-
if (isMarket && currency && order) try {
|
|
7365
|
-
const marketplaceFeePercentage = (marketplaceConfig?.market?.collections?.find((col) => col.itemsAddress.toLowerCase() === order.collectionContractAddress.toLowerCase() && col.chainId === chainId))?.feePercentage ?? DEFAULT_MARKETPLACE_FEE_PERCENTAGE;
|
|
7366
|
-
formattedPrice = formatPriceWithFee(BigInt(order.priceAmount) * quantity, currency.decimals, marketplaceFeePercentage);
|
|
7367
|
-
} catch (e) {
|
|
7368
|
-
console.error("Error formatting price", e);
|
|
7369
|
-
error = "Unable to calculate total price";
|
|
7370
|
-
}
|
|
7371
|
-
if (isShop && salePrice && currency) formattedPrice = formatPriceWithFee(BigInt(salePrice.amount) * quantity, currency.decimals, 0);
|
|
7372
|
-
return error ? /* @__PURE__ */ jsx(Text, {
|
|
7373
|
-
className: "font-body font-medium text-xs",
|
|
7374
|
-
color: "text50",
|
|
7375
|
-
children: error
|
|
7376
|
-
}) : /* @__PURE__ */ jsxs("div", {
|
|
7377
|
-
className: "flex justify-between",
|
|
7378
|
-
children: [/* @__PURE__ */ jsx(Text, {
|
|
7379
|
-
className: "font-body font-medium text-xs",
|
|
7380
|
-
color: "text50",
|
|
7381
|
-
children: "Total Price"
|
|
7382
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
7383
|
-
className: "flex items-center gap-0.5",
|
|
7384
|
-
children: !currency || isCurrencyLoading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-12" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
7385
|
-
currency?.imageUrl && /* @__PURE__ */ jsx(TokenImage, {
|
|
7386
|
-
src: currency.imageUrl,
|
|
7387
|
-
size: "xs"
|
|
7388
|
-
}),
|
|
7389
|
-
/* @__PURE__ */ jsx(Text, {
|
|
7390
|
-
className: "font-body font-bold text-text-100 text-xs",
|
|
7391
|
-
children: formattedPrice
|
|
7392
|
-
}),
|
|
7393
|
-
/* @__PURE__ */ jsx(Text, {
|
|
7394
|
-
className: "font-body font-bold text-text-80 text-xs",
|
|
7395
|
-
children: currency?.symbol
|
|
7396
|
-
})
|
|
7397
|
-
] })
|
|
7398
|
-
})]
|
|
7399
|
-
});
|
|
7400
|
-
};
|
|
7401
|
-
|
|
7402
|
-
//#endregion
|
|
7403
|
-
//#region ../api/src/adapters/marketplace/marketplace.gen.ts
|
|
7404
|
-
let StepType$1 = /* @__PURE__ */ function(StepType$2) {
|
|
7405
|
-
StepType$2["unknown"] = "unknown";
|
|
7406
|
-
StepType$2["tokenApproval"] = "tokenApproval";
|
|
7407
|
-
StepType$2["buy"] = "buy";
|
|
7408
|
-
StepType$2["sell"] = "sell";
|
|
7409
|
-
StepType$2["createListing"] = "createListing";
|
|
7410
|
-
StepType$2["createOffer"] = "createOffer";
|
|
7411
|
-
StepType$2["signEIP712"] = "signEIP712";
|
|
7412
|
-
StepType$2["signEIP191"] = "signEIP191";
|
|
7413
|
-
StepType$2["cancel"] = "cancel";
|
|
7414
|
-
return StepType$2;
|
|
7415
|
-
}({});
|
|
7416
|
-
|
|
7417
|
-
//#endregion
|
|
7418
|
-
//#region src/utils/decode/erc20.ts
|
|
7419
|
-
function decodeERC20Approval(calldata) {
|
|
7420
|
-
const decoded = decodeFunctionData({
|
|
7421
|
-
abi: erc20Abi,
|
|
7422
|
-
data: calldata
|
|
7423
|
-
});
|
|
7424
|
-
if (decoded.functionName !== "approve") throw new Error("Not an ERC20 approval transaction");
|
|
7425
|
-
const [spender, value] = decoded.args;
|
|
7426
|
-
return {
|
|
7427
|
-
spender,
|
|
7428
|
-
value
|
|
7429
|
-
};
|
|
7430
|
-
}
|
|
7431
|
-
|
|
7432
|
-
//#endregion
|
|
7433
|
-
//#region src/react/ui/modals/BuyModal/components/sequence-checkout/usePaymentModalParams.ts
|
|
7434
|
-
const getBuyCollectableParams = async ({ address, chainId, collectionAddress, tokenId, successActionButtons, priceCurrencyAddress, customCreditCardProviderCallback, marketplaceKind, orderId, quantity, skipNativeBalanceCheck, nativeTokenAddress, buyAnalyticsId, onRampProvider, checkoutMode, steps, marketplaceType }) => {
|
|
7435
|
-
const checkoutOptions = typeof checkoutMode === "object" ? checkoutMode.options : void 0;
|
|
7436
|
-
const buyStep = steps?.find((step) => step.id === StepType$1.buy);
|
|
7437
|
-
const approveStep = steps?.find((step) => step.id === StepType$1.tokenApproval);
|
|
7438
|
-
const approvedSpenderAddress = approveStep ? decodeERC20Approval(approveStep.data).spender : void 0;
|
|
7439
|
-
if (!buyStep) throw new Error("Buy step not found");
|
|
7440
|
-
const creditCardProviders = customCreditCardProviderCallback ? ["custom"] : checkoutOptions?.nftCheckout || [];
|
|
7441
|
-
const supplementaryAnalyticsInfo = marketplaceType === "market" ? {
|
|
7442
|
-
requestId: orderId,
|
|
7443
|
-
...marketplaceKind && { marketplaceKind },
|
|
7444
|
-
buyAnalyticsId
|
|
7445
|
-
} : { marketplaceType: "shop" };
|
|
7446
|
-
const totalPrice = BigInt(buyStep.price) * BigInt(quantity);
|
|
7447
|
-
return {
|
|
7448
|
-
chain: chainId,
|
|
7449
|
-
collectibles: [{
|
|
7450
|
-
tokenId: tokenId?.toString() ?? "",
|
|
7451
|
-
quantity: quantity.toString()
|
|
7452
|
-
}],
|
|
7453
|
-
currencyAddress: priceCurrencyAddress,
|
|
7454
|
-
price: totalPrice.toString(),
|
|
7455
|
-
targetContractAddress: buyStep.to,
|
|
7456
|
-
approvedSpenderAddress,
|
|
7457
|
-
txData: buyStep.data,
|
|
7458
|
-
collectionAddress,
|
|
7459
|
-
recipientAddress: address,
|
|
7460
|
-
creditCardProviders,
|
|
7461
|
-
supplementaryAnalyticsInfo,
|
|
7462
|
-
onClose: () => {
|
|
7463
|
-
getQueryClient().invalidateQueries({ predicate: (query) => !query.meta?.persistent });
|
|
7464
|
-
buyModalStore.send({ type: "close" });
|
|
6854
|
+
},
|
|
6855
|
+
"50311": {
|
|
6856
|
+
chainId: 50311,
|
|
6857
|
+
openseaId: "somnia",
|
|
6858
|
+
name: "Somnia",
|
|
6859
|
+
nativeCurrency: {
|
|
6860
|
+
symbol: "SOMI",
|
|
6861
|
+
address: zeroAddress
|
|
7465
6862
|
},
|
|
7466
|
-
|
|
7467
|
-
|
|
7468
|
-
|
|
7469
|
-
|
|
7470
|
-
buyModalStore.send({ type: "close" });
|
|
7471
|
-
} },
|
|
7472
|
-
onRampProvider,
|
|
7473
|
-
successActionButtons
|
|
7474
|
-
};
|
|
7475
|
-
};
|
|
7476
|
-
const usePaymentModalParams = (args) => {
|
|
7477
|
-
const { marketplaceKind, priceCurrencyAddress, quantity, steps, marketplaceType } = args;
|
|
7478
|
-
const buyModalProps = useBuyModalProps();
|
|
7479
|
-
const { checkoutMode } = useBuyModalContext();
|
|
7480
|
-
const { chainId, collectionAddress, skipNativeBalanceCheck, nativeTokenAddress, onRampProvider, successActionButtons } = buyModalProps;
|
|
7481
|
-
const tokenId = isMarketProps(buyModalProps) ? buyModalProps.tokenId : buyModalProps.item.tokenId;
|
|
7482
|
-
const orderId = isMarketProps(buyModalProps) ? buyModalProps.orderId : "";
|
|
7483
|
-
const customCreditCardProviderCallback = isMarketProps(buyModalProps) ? buyModalProps.customCreditCardProviderCallback : void 0;
|
|
7484
|
-
const buyAnalyticsId = useBuyAnalyticsId();
|
|
7485
|
-
const { address } = useAccount();
|
|
7486
|
-
return useQuery({
|
|
7487
|
-
queryKey: [
|
|
7488
|
-
"buyCollectableParams",
|
|
7489
|
-
buyModalProps,
|
|
7490
|
-
args
|
|
7491
|
-
],
|
|
7492
|
-
queryFn: !!address && !!priceCurrencyAddress && !!quantity && !!steps && (marketplaceType === "market" ? !!marketplaceKind : true) ? () => getBuyCollectableParams({
|
|
7493
|
-
chainId,
|
|
7494
|
-
address,
|
|
7495
|
-
collectionAddress,
|
|
7496
|
-
tokenId,
|
|
7497
|
-
marketplaceKind,
|
|
7498
|
-
orderId,
|
|
7499
|
-
quantity,
|
|
7500
|
-
priceCurrencyAddress,
|
|
7501
|
-
successActionButtons,
|
|
7502
|
-
customCreditCardProviderCallback,
|
|
7503
|
-
skipNativeBalanceCheck,
|
|
7504
|
-
nativeTokenAddress,
|
|
7505
|
-
buyAnalyticsId,
|
|
7506
|
-
onRampProvider,
|
|
7507
|
-
checkoutMode,
|
|
7508
|
-
steps,
|
|
7509
|
-
marketplaceType
|
|
7510
|
-
}) : skipToken,
|
|
7511
|
-
retry: false
|
|
7512
|
-
});
|
|
7513
|
-
};
|
|
7514
|
-
|
|
7515
|
-
//#endregion
|
|
7516
|
-
//#region src/react/ui/modals/BuyModal/components/sequence-checkout/SequenceCheckoutNew.tsx
|
|
7517
|
-
const SequenceCheckout = ({ steps, contractType, primarySaleItem }) => {
|
|
7518
|
-
const modalProps = useBuyModalProps();
|
|
7519
|
-
const isMarket = isMarketProps(modalProps);
|
|
7520
|
-
const isShop = isShopProps(modalProps);
|
|
7521
|
-
const paymentModalState = usePaymentModalState();
|
|
7522
|
-
const { chainId, collectionAddress, hideQuantitySelector } = modalProps;
|
|
7523
|
-
const orderId = isMarket ? modalProps.orderId : "";
|
|
7524
|
-
const marketplaceKind = isMarket ? modalProps.marketplace : void 0;
|
|
7525
|
-
const { data: marketOrders } = useOrders({
|
|
7526
|
-
chainId,
|
|
7527
|
-
input: marketplaceKind && orderId ? [{
|
|
7528
|
-
contractAddress: collectionAddress,
|
|
7529
|
-
orderId,
|
|
7530
|
-
marketplace: marketplaceKind
|
|
7531
|
-
}] : [],
|
|
7532
|
-
query: { enabled: isMarket && !!orderId && !!marketplaceKind }
|
|
7533
|
-
});
|
|
7534
|
-
const marketOrder = marketOrders?.orders[0];
|
|
7535
|
-
const paymentModalParams = usePaymentModalParams({
|
|
7536
|
-
quantity: useQuantity(),
|
|
7537
|
-
marketplaceKind,
|
|
7538
|
-
priceCurrencyAddress: isMarket ? marketOrder?.priceCurrencyAddress : primarySaleItem?.currencyAddress,
|
|
7539
|
-
steps,
|
|
7540
|
-
marketplaceType: isMarket ? "market" : "shop"
|
|
7541
|
-
});
|
|
7542
|
-
if (!hideQuantitySelector && contractType === ContractType$1.ERC1155 && paymentModalState === "idle") {
|
|
7543
|
-
const quantityRemaining = isMarket ? marketOrder?.quantityRemaining : primarySaleItem?.supply;
|
|
7544
|
-
const unlimitedSupply = isShop && primarySaleItem?.unlimitedSupply ? primarySaleItem?.unlimitedSupply : false;
|
|
7545
|
-
return /* @__PURE__ */ jsx(ERC1155QuantityModal, {
|
|
7546
|
-
order: marketOrder,
|
|
7547
|
-
cardType: isMarket ? "market" : "shop",
|
|
7548
|
-
salePrice: isShop ? {
|
|
7549
|
-
amount: primarySaleItem?.priceAmount || 0n,
|
|
7550
|
-
currencyAddress: primarySaleItem?.currencyAddress
|
|
7551
|
-
} : void 0,
|
|
7552
|
-
quantityRemaining: quantityRemaining ?? 0n,
|
|
7553
|
-
unlimitedSupply,
|
|
7554
|
-
chainId
|
|
7555
|
-
});
|
|
7556
|
-
}
|
|
7557
|
-
if (paymentModalState === "closed") return null;
|
|
7558
|
-
return /* @__PURE__ */ jsx(ActionModal, {
|
|
7559
|
-
onClose: () => {
|
|
7560
|
-
buyModalStore.send({ type: "close" });
|
|
6863
|
+
wrappedNativeCurrency: { address: "0x046ede9564a72571df6f5e44d0405360c0f4dcab" },
|
|
6864
|
+
offerCurrency: {
|
|
6865
|
+
symbol: "WSOMI",
|
|
6866
|
+
address: "0x046ede9564a72571df6f5e44d0405360c0f4dcab"
|
|
7561
6867
|
},
|
|
7562
|
-
|
|
7563
|
-
|
|
7564
|
-
|
|
7565
|
-
|
|
7566
|
-
|
|
7567
|
-
|
|
6868
|
+
listingCurrency: {
|
|
6869
|
+
symbol: "SOMI",
|
|
6870
|
+
address: zeroAddress
|
|
6871
|
+
}
|
|
6872
|
+
},
|
|
6873
|
+
"80094": {
|
|
6874
|
+
chainId: 80094,
|
|
6875
|
+
openseaId: "bera_chain",
|
|
6876
|
+
name: "Berachain",
|
|
6877
|
+
nativeCurrency: {
|
|
6878
|
+
symbol: "BERA",
|
|
6879
|
+
address: zeroAddress
|
|
7568
6880
|
},
|
|
7569
|
-
|
|
7570
|
-
|
|
6881
|
+
wrappedNativeCurrency: { address: "0x6969696969696969696969696969696969696969" },
|
|
6882
|
+
offerCurrency: {
|
|
6883
|
+
symbol: "WBERA",
|
|
6884
|
+
address: "0x6969696969696969696969696969696969696969"
|
|
7571
6885
|
},
|
|
7572
|
-
|
|
7573
|
-
|
|
7574
|
-
|
|
7575
|
-
children: [/* @__PURE__ */ jsx(Spinner, { size: "lg" }), /* @__PURE__ */ jsx(Text, {
|
|
7576
|
-
className: "pulse",
|
|
7577
|
-
children: "Loading checkout"
|
|
7578
|
-
})]
|
|
7579
|
-
});
|
|
7580
|
-
return /* @__PURE__ */ jsx(PaymentModalOpener, { paymentModalParams: paymentModalParams$1 });
|
|
6886
|
+
listingCurrency: {
|
|
6887
|
+
symbol: "BERA",
|
|
6888
|
+
address: zeroAddress
|
|
7581
6889
|
}
|
|
7582
|
-
}
|
|
7583
|
-
|
|
7584
|
-
|
|
7585
|
-
|
|
7586
|
-
|
|
7587
|
-
|
|
7588
|
-
|
|
7589
|
-
|
|
6890
|
+
},
|
|
6891
|
+
"81457": {
|
|
6892
|
+
chainId: 81457,
|
|
6893
|
+
openseaId: "blast",
|
|
6894
|
+
name: "Blast",
|
|
6895
|
+
nativeCurrency: {
|
|
6896
|
+
symbol: "ETH",
|
|
6897
|
+
address: zeroAddress
|
|
6898
|
+
},
|
|
6899
|
+
wrappedNativeCurrency: { address: "0x4300000000000000000000000000000000000004" },
|
|
6900
|
+
offerCurrency: {
|
|
6901
|
+
symbol: "WETH",
|
|
6902
|
+
address: "0x4300000000000000000000000000000000000004"
|
|
6903
|
+
},
|
|
6904
|
+
listingCurrency: {
|
|
6905
|
+
symbol: "ETH",
|
|
6906
|
+
address: zeroAddress
|
|
7590
6907
|
}
|
|
7591
|
-
},
|
|
7592
|
-
|
|
7593
|
-
|
|
7594
|
-
|
|
7595
|
-
|
|
7596
|
-
|
|
7597
|
-
|
|
7598
|
-
|
|
7599
|
-
|
|
7600
|
-
|
|
7601
|
-
|
|
7602
|
-
|
|
7603
|
-
|
|
7604
|
-
|
|
7605
|
-
|
|
7606
|
-
|
|
7607
|
-
|
|
7608
|
-
|
|
7609
|
-
|
|
7610
|
-
|
|
7611
|
-
|
|
7612
|
-
|
|
7613
|
-
|
|
7614
|
-
|
|
7615
|
-
*/
|
|
7616
|
-
const TRAILS_CUSTOM_CSS = `
|
|
7617
|
-
}
|
|
7618
|
-
|
|
7619
|
-
/* ========================================
|
|
7620
|
-
* CSS Variable Overrides - Match Sequence Design System
|
|
7621
|
-
* These are wrapped in :root/:host by ShadowPortal
|
|
7622
|
-
* ======================================== */
|
|
7623
|
-
|
|
7624
|
-
:root, :host, [data-theme="dark"] {
|
|
7625
|
-
/* Background Colors */
|
|
7626
|
-
--trails-bg-primary: rgb(0 0 0) !important;
|
|
7627
|
-
--trails-bg-secondary: rgb(24 24 27) !important;
|
|
7628
|
-
--trails-bg-secondary-hover: rgb(39 39 42) !important;
|
|
7629
|
-
--trails-bg-secondary-focus-border: rgb(63 63 70) !important;
|
|
7630
|
-
--trails-bg-tertiary: rgb(39 39 42) !important;
|
|
7631
|
-
--trails-bg-card: rgb(24 24 27) !important;
|
|
7632
|
-
--trails-bg-overlay: rgb(0 0 0) !important;
|
|
7633
|
-
|
|
7634
|
-
/* Text Colors */
|
|
7635
|
-
--trails-text-primary: rgb(255 255 255) !important;
|
|
7636
|
-
--trails-text-secondary: rgba(255 255 255 / 0.8) !important;
|
|
7637
|
-
--trails-text-tertiary: rgba(255 255 255 / 0.6) !important;
|
|
7638
|
-
--trails-text-muted: rgb(113 113 122) !important;
|
|
7639
|
-
--trails-text-inverse: rgb(0 0 0) !important;
|
|
7640
|
-
|
|
7641
|
-
/* Border Colors */
|
|
7642
|
-
--trails-border-primary: rgb(63 63 70) !important;
|
|
7643
|
-
--trails-border-secondary: rgb(82 82 91) !important;
|
|
7644
|
-
--trails-border-tertiary: rgb(39 39 42) !important;
|
|
7645
|
-
|
|
7646
|
-
/* Interactive Colors */
|
|
7647
|
-
--trails-hover-bg: rgb(24 24 27) !important;
|
|
7648
|
-
--trails-hover-text: rgb(255 255 255) !important;
|
|
7649
|
-
|
|
7650
|
-
/* Input Field Colors */
|
|
7651
|
-
--trails-input-bg: rgb(0 0 0) !important;
|
|
7652
|
-
--trails-input-border: rgb(39 39 42) !important;
|
|
7653
|
-
--trails-input-text: rgb(255 255 255) !important;
|
|
7654
|
-
--trails-input-placeholder: rgb(113 113 122) !important;
|
|
7655
|
-
--trails-input-focus-border: rgb(139 92 246) !important;
|
|
7656
|
-
|
|
7657
|
-
/* Dropdown Colors */
|
|
7658
|
-
--trails-dropdown-bg: rgb(0 0 0) !important;
|
|
7659
|
-
--trails-dropdown-border: rgb(39 39 42) !important;
|
|
7660
|
-
--trails-dropdown-text: rgb(255 255 255) !important;
|
|
7661
|
-
--trails-dropdown-hover-bg: rgb(24 24 27) !important;
|
|
7662
|
-
--trails-dropdown-selected-bg: rgb(39 39 42) !important;
|
|
7663
|
-
--trails-dropdown-selected-text: rgb(255 255 255) !important;
|
|
7664
|
-
--trails-dropdown-focus-border: rgb(139 92 246) !important;
|
|
7665
|
-
|
|
7666
|
-
/* Modal Button Colors */
|
|
7667
|
-
--trails-modal-button-bg: transparent !important;
|
|
7668
|
-
--trails-modal-button-hover-bg: rgba(255 255 255 / 0.1) !important;
|
|
7669
|
-
--trails-modal-button-text: rgb(255 255 255) !important;
|
|
7670
|
-
--trails-modal-button-shadow: 0 1px 2px 0 rgba(0 0 0 / 0.1) !important;
|
|
7671
|
-
|
|
7672
|
-
/* Token List Colors */
|
|
7673
|
-
--trails-list-bg: rgb(0 0 0) !important;
|
|
7674
|
-
--trails-list-border: rgb(39 39 42) !important;
|
|
7675
|
-
--trails-list-hover-bg: rgb(24 24 27) !important;
|
|
7676
|
-
--trails-list-item-bg: transparent !important;
|
|
7677
|
-
--trails-list-item-selected-bg: rgb(39 39 42) !important;
|
|
7678
|
-
|
|
7679
|
-
/* Widget Border and Radius */
|
|
7680
|
-
--trails-widget-border: none !important;
|
|
7681
|
-
--trails-border-radius-widget: 24px !important;
|
|
7682
|
-
--trails-border-radius-button: 8px !important;
|
|
7683
|
-
--trails-border-radius-input: 8px !important;
|
|
7684
|
-
--trails-border-radius-dropdown: 8px !important;
|
|
7685
|
-
--trails-border-radius-container: 8px !important;
|
|
7686
|
-
--trails-border-radius-list: 8px !important;
|
|
7687
|
-
--trails-border-radius-list-button: 8px !important;
|
|
7688
|
-
--trails-border-radius-large-button: 8px !important;
|
|
7689
|
-
|
|
7690
|
-
/* Status Colors */
|
|
7691
|
-
--trails-success-bg: rgba(34 197 94 / 0.2) !important;
|
|
7692
|
-
--trails-success-text: rgb(34 197 94) !important;
|
|
7693
|
-
--trails-success-border: rgba(34 197 94 / 0.3) !important;
|
|
7694
|
-
|
|
7695
|
-
--trails-warning-bg: rgba(234 179 8 / 0.2) !important;
|
|
7696
|
-
--trails-warning-text: rgb(234 179 8) !important;
|
|
7697
|
-
--trails-warning-border: rgba(234 179 8 / 0.3) !important;
|
|
7698
|
-
|
|
7699
|
-
--trails-error-bg: rgba(239 68 68 / 0.2) !important;
|
|
7700
|
-
--trails-error-text: rgb(239 68 68) !important;
|
|
7701
|
-
--trails-error-border: rgba(239 68 68 / 0.3) !important;
|
|
7702
|
-
|
|
7703
|
-
/* Shadow */
|
|
7704
|
-
--trails-shadow: 0 4px 6px -1px rgba(0 0 0 / 0.1), 0 2px 4px -1px rgba(0 0 0 / 0.06) !important;
|
|
7705
|
-
|
|
7706
|
-
/* Primary Button */
|
|
7707
|
-
--trails-primary: rgb(255 255 255) !important;
|
|
7708
|
-
--trails-primary-hover: rgba(255 255 255 / 0.9) !important;
|
|
7709
|
-
--trails-primary-disabled: rgb(63 63 70) !important;
|
|
7710
|
-
--trails-primary-disabled-text: rgb(113 113 122) !important;
|
|
7711
|
-
|
|
7712
|
-
/* Percentage Button Colors */
|
|
7713
|
-
--trails-percentage-button-bg: rgb(24 24 27) !important;
|
|
7714
|
-
--trails-percentage-button-text: rgb(161 161 170) !important;
|
|
7715
|
-
--trails-percentage-button-hover-bg: rgb(39 39 42) !important;
|
|
7716
|
-
|
|
7717
|
-
/* Font Family */
|
|
7718
|
-
--trails-font-family: 'Inter', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
|
|
7719
|
-
}
|
|
7720
|
-
|
|
7721
|
-
/* ========================================
|
|
7722
|
-
* Direct Tailwind Class Overrides
|
|
7723
|
-
* Override hard-coded Tailwind classes used in Trails components
|
|
7724
|
-
* ======================================== */
|
|
7725
|
-
|
|
7726
|
-
/* White backgrounds -> black */
|
|
7727
|
-
.bg-white,
|
|
7728
|
-
.dark\\:bg-gray-900 {
|
|
7729
|
-
background-color: rgb(0 0 0) !important;
|
|
7730
|
-
}
|
|
7731
|
-
|
|
7732
|
-
/* Gray-800 backgrounds -> black */
|
|
7733
|
-
.bg-gray-800,
|
|
7734
|
-
.dark\\:bg-gray-800 {
|
|
7735
|
-
background-color: rgb(0 0 0) !important;
|
|
7736
|
-
}
|
|
7737
|
-
|
|
7738
|
-
/* Gray-700 backgrounds -> zinc-800 */
|
|
7739
|
-
.bg-gray-700,
|
|
7740
|
-
.dark\\:bg-gray-700 {
|
|
7741
|
-
background-color: rgb(39 39 42) !important;
|
|
7742
|
-
}
|
|
7743
|
-
|
|
7744
|
-
/* Hover states */
|
|
7745
|
-
.hover\\:bg-gray-50:hover {
|
|
7746
|
-
background-color: rgb(24 24 27) !important;
|
|
7747
|
-
}
|
|
7748
|
-
|
|
7749
|
-
.dark\\:hover\\:bg-gray-800:hover {
|
|
7750
|
-
background-color: rgb(24 24 27) !important;
|
|
7751
|
-
}
|
|
7752
|
-
|
|
7753
|
-
.dark\\:hover\\:bg-gray-700:hover {
|
|
7754
|
-
background-color: rgb(39 39 42) !important;
|
|
7755
|
-
}
|
|
7756
|
-
|
|
7757
|
-
/* Focus states */
|
|
7758
|
-
.focus-within\\:\\!bg-white:focus-within {
|
|
7759
|
-
background-color: rgb(0 0 0) !important;
|
|
7760
|
-
}
|
|
7761
|
-
|
|
7762
|
-
.dark\\:focus-within\\:\\!bg-gray-800:focus-within {
|
|
7763
|
-
background-color: rgb(0 0 0) !important;
|
|
7764
|
-
}
|
|
7765
|
-
|
|
7766
|
-
/* Border colors */
|
|
7767
|
-
.border-gray-200 {
|
|
7768
|
-
border-color: rgb(39 39 42) !important;
|
|
7769
|
-
}
|
|
7770
|
-
|
|
7771
|
-
.dark\\:border-gray-700 {
|
|
7772
|
-
border-color: rgb(39 39 42) !important;
|
|
7773
|
-
}
|
|
7774
|
-
|
|
7775
|
-
.border-gray-300 {
|
|
7776
|
-
border-color: rgb(63 63 70) !important;
|
|
7777
|
-
}
|
|
7778
|
-
|
|
7779
|
-
.dark\\:border-gray-600 {
|
|
7780
|
-
border-color: rgb(63 63 70) !important;
|
|
7781
|
-
}
|
|
7782
|
-
|
|
7783
|
-
/* Text colors */
|
|
7784
|
-
.text-gray-900 {
|
|
7785
|
-
color: rgb(255 255 255) !important;
|
|
7786
|
-
}
|
|
7787
|
-
|
|
7788
|
-
.dark\\:text-white {
|
|
7789
|
-
color: rgb(255 255 255) !important;
|
|
7790
|
-
}
|
|
7791
|
-
|
|
7792
|
-
.text-gray-500,
|
|
7793
|
-
.dark\\:text-gray-400 {
|
|
7794
|
-
color: rgb(161 161 170) !important;
|
|
7795
|
-
}
|
|
7796
|
-
|
|
7797
|
-
.text-black,
|
|
7798
|
-
.dark\\:text-blue-300 {
|
|
7799
|
-
color: rgb(255 255 255) !important;
|
|
6908
|
+
},
|
|
6909
|
+
"7777777": {
|
|
6910
|
+
chainId: 7777777,
|
|
6911
|
+
openseaId: "zora",
|
|
6912
|
+
name: "Zora",
|
|
6913
|
+
nativeCurrency: {
|
|
6914
|
+
symbol: "ETH",
|
|
6915
|
+
address: zeroAddress
|
|
6916
|
+
},
|
|
6917
|
+
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
6918
|
+
offerCurrency: {
|
|
6919
|
+
symbol: "WETH",
|
|
6920
|
+
address: "0x4200000000000000000000000000000000000006"
|
|
6921
|
+
},
|
|
6922
|
+
listingCurrency: {
|
|
6923
|
+
symbol: "ETH",
|
|
6924
|
+
address: zeroAddress
|
|
6925
|
+
}
|
|
6926
|
+
}
|
|
6927
|
+
};
|
|
6928
|
+
function getOpenseaCurrencyForChain(chainId, modalType) {
|
|
6929
|
+
const config = OPENSEA_CHAIN_CURRENCIES[chainId.toString()];
|
|
6930
|
+
if (!config) return;
|
|
6931
|
+
return modalType === "listing" ? config.listingCurrency : config.offerCurrency;
|
|
7800
6932
|
}
|
|
7801
6933
|
|
|
7802
|
-
|
|
7803
|
-
.
|
|
7804
|
-
|
|
6934
|
+
//#endregion
|
|
6935
|
+
//#region src/react/ui/modals/BuyModal/internal/buildTrailsMarketBuyActions.ts
|
|
6936
|
+
const WETH_ABI = [{
|
|
6937
|
+
type: "function",
|
|
6938
|
+
name: "withdraw",
|
|
6939
|
+
stateMutability: "nonpayable",
|
|
6940
|
+
inputs: [{
|
|
6941
|
+
name: "wad",
|
|
6942
|
+
type: "uint256"
|
|
6943
|
+
}],
|
|
6944
|
+
outputs: []
|
|
6945
|
+
}];
|
|
6946
|
+
const ERC721_TRANSFER_FROM_ABI = [{
|
|
6947
|
+
type: "function",
|
|
6948
|
+
name: "transferFrom",
|
|
6949
|
+
stateMutability: "nonpayable",
|
|
6950
|
+
inputs: [
|
|
6951
|
+
{
|
|
6952
|
+
name: "from",
|
|
6953
|
+
type: "address"
|
|
6954
|
+
},
|
|
6955
|
+
{
|
|
6956
|
+
name: "to",
|
|
6957
|
+
type: "address"
|
|
6958
|
+
},
|
|
6959
|
+
{
|
|
6960
|
+
name: "tokenId",
|
|
6961
|
+
type: "uint256"
|
|
6962
|
+
}
|
|
6963
|
+
],
|
|
6964
|
+
outputs: []
|
|
6965
|
+
}];
|
|
6966
|
+
const ERC1155_SAFE_TRANSFER_FROM_ABI = [{
|
|
6967
|
+
type: "function",
|
|
6968
|
+
name: "safeTransferFrom",
|
|
6969
|
+
stateMutability: "nonpayable",
|
|
6970
|
+
inputs: [
|
|
6971
|
+
{
|
|
6972
|
+
name: "from",
|
|
6973
|
+
type: "address"
|
|
6974
|
+
},
|
|
6975
|
+
{
|
|
6976
|
+
name: "to",
|
|
6977
|
+
type: "address"
|
|
6978
|
+
},
|
|
6979
|
+
{
|
|
6980
|
+
name: "id",
|
|
6981
|
+
type: "uint256"
|
|
6982
|
+
},
|
|
6983
|
+
{
|
|
6984
|
+
name: "amount",
|
|
6985
|
+
type: "uint256"
|
|
6986
|
+
},
|
|
6987
|
+
{
|
|
6988
|
+
name: "data",
|
|
6989
|
+
type: "bytes"
|
|
6990
|
+
}
|
|
6991
|
+
],
|
|
6992
|
+
outputs: []
|
|
6993
|
+
}];
|
|
6994
|
+
const OPENSEA_FULFILL_WITHOUT_RECIPIENT_SELECTORS = new Set(["0xfb0f3ee1", "0xb1b747c3"]);
|
|
6995
|
+
const isNativeCurrency = (currencyAddress) => currencyAddress.toLowerCase() === zeroAddress;
|
|
6996
|
+
const getPaymentAmount = ({ buyStep, marketOrder, isErc20Payment }) => {
|
|
6997
|
+
if (isErc20Payment) return buyStep.price > 0n ? buyStep.price : marketOrder.priceAmount;
|
|
6998
|
+
if (buyStep.value > 0n) return buyStep.value;
|
|
6999
|
+
return buyStep.price > 0n ? buyStep.price : marketOrder.priceAmount;
|
|
7000
|
+
};
|
|
7001
|
+
const getWrappedNativeCurrencyAddress = (chainId) => OPENSEA_CHAIN_CURRENCIES[chainId.toString()]?.wrappedNativeCurrency.address;
|
|
7002
|
+
const buildWrappedNativeWithdrawCall = ({ wrappedNativeAddress, amount }) => ({
|
|
7003
|
+
to: wrappedNativeAddress,
|
|
7004
|
+
data: encodeFunctionData({
|
|
7005
|
+
abi: WETH_ABI,
|
|
7006
|
+
functionName: "withdraw",
|
|
7007
|
+
args: [amount]
|
|
7008
|
+
})
|
|
7009
|
+
});
|
|
7010
|
+
const isOpenSeaFulfillWithoutRecipient = (calldata) => OPENSEA_FULFILL_WITHOUT_RECIPIENT_SELECTORS.has(calldata.slice(0, 10).toLowerCase());
|
|
7011
|
+
const buildOpenSeaNftTransferCall = ({ marketOrder, contractType, recipientAddress, quantity }) => {
|
|
7012
|
+
if (marketOrder.tokenId === void 0) return;
|
|
7013
|
+
const collectionAddress = marketOrder.collectionContractAddress;
|
|
7014
|
+
const executorAddress = self();
|
|
7015
|
+
if (contractType === ContractType$1.ERC1155) return {
|
|
7016
|
+
to: collectionAddress,
|
|
7017
|
+
data: encodeFunctionData({
|
|
7018
|
+
abi: ERC1155_SAFE_TRANSFER_FROM_ABI,
|
|
7019
|
+
functionName: "safeTransferFrom",
|
|
7020
|
+
args: [
|
|
7021
|
+
executorAddress,
|
|
7022
|
+
recipientAddress,
|
|
7023
|
+
marketOrder.tokenId,
|
|
7024
|
+
quantity,
|
|
7025
|
+
"0x"
|
|
7026
|
+
]
|
|
7027
|
+
})
|
|
7028
|
+
};
|
|
7029
|
+
return {
|
|
7030
|
+
to: collectionAddress,
|
|
7031
|
+
data: encodeFunctionData({
|
|
7032
|
+
abi: ERC721_TRANSFER_FROM_ABI,
|
|
7033
|
+
functionName: "transferFrom",
|
|
7034
|
+
args: [
|
|
7035
|
+
executorAddress,
|
|
7036
|
+
recipientAddress,
|
|
7037
|
+
marketOrder.tokenId
|
|
7038
|
+
]
|
|
7039
|
+
})
|
|
7040
|
+
};
|
|
7041
|
+
};
|
|
7042
|
+
function buildTrailsMarketBuyActions({ chainId, buyStep, marketOrder, contractType, recipientAddress, approvalStep, quantity = 1n }) {
|
|
7043
|
+
const calls = [];
|
|
7044
|
+
const currencyAddress = marketOrder.priceCurrencyAddress;
|
|
7045
|
+
const isErc20Payment = !isNativeCurrency(currencyAddress);
|
|
7046
|
+
const paymentAmount = getPaymentAmount({
|
|
7047
|
+
buyStep,
|
|
7048
|
+
marketOrder,
|
|
7049
|
+
isErc20Payment
|
|
7050
|
+
});
|
|
7051
|
+
let paymentTokenAddress = currencyAddress;
|
|
7052
|
+
if (isErc20Payment && paymentAmount > 0n) if (approvalStep) calls.push({
|
|
7053
|
+
to: approvalStep.to,
|
|
7054
|
+
data: approvalStep.data
|
|
7055
|
+
});
|
|
7056
|
+
else {
|
|
7057
|
+
const spenderAddress = getConduitAddressForOrderbook(marketOrder.marketplace);
|
|
7058
|
+
if (spenderAddress) calls.push(buildErc20Approve({
|
|
7059
|
+
tokenAddress: currencyAddress,
|
|
7060
|
+
spender: spenderAddress,
|
|
7061
|
+
amount: paymentAmount
|
|
7062
|
+
}));
|
|
7063
|
+
}
|
|
7064
|
+
else if (!isErc20Payment) {
|
|
7065
|
+
const wrappedNativeAddress = getWrappedNativeCurrencyAddress(chainId);
|
|
7066
|
+
if (!wrappedNativeAddress) return;
|
|
7067
|
+
paymentTokenAddress = wrappedNativeAddress;
|
|
7068
|
+
if (paymentAmount > 0n) calls.push(buildWrappedNativeWithdrawCall({
|
|
7069
|
+
wrappedNativeAddress,
|
|
7070
|
+
amount: paymentAmount
|
|
7071
|
+
}));
|
|
7072
|
+
}
|
|
7073
|
+
calls.push({
|
|
7074
|
+
to: buyStep.to,
|
|
7075
|
+
data: buyStep.data,
|
|
7076
|
+
...!isErc20Payment && paymentAmount > 0n ? {
|
|
7077
|
+
value: paymentAmount,
|
|
7078
|
+
sweepTokens: [zeroAddress]
|
|
7079
|
+
} : {}
|
|
7080
|
+
});
|
|
7081
|
+
if (normalizeMarketplaceKind(marketOrder.marketplace) === MarketplaceKind.opensea && isOpenSeaFulfillWithoutRecipient(buyStep.data)) {
|
|
7082
|
+
const nftTransferCall = buildOpenSeaNftTransferCall({
|
|
7083
|
+
marketOrder,
|
|
7084
|
+
contractType,
|
|
7085
|
+
recipientAddress,
|
|
7086
|
+
quantity
|
|
7087
|
+
});
|
|
7088
|
+
if (nftTransferCall) calls.push(nftTransferCall);
|
|
7089
|
+
}
|
|
7090
|
+
return {
|
|
7091
|
+
calls,
|
|
7092
|
+
paymentTokenAddress,
|
|
7093
|
+
paymentAmount
|
|
7094
|
+
};
|
|
7805
7095
|
}
|
|
7806
7096
|
|
|
7807
|
-
|
|
7808
|
-
|
|
7809
|
-
|
|
7097
|
+
//#endregion
|
|
7098
|
+
//#region src/react/ui/modals/BuyModal/internal/determineCheckoutMode.ts
|
|
7099
|
+
function determineCheckoutMode({ checkoutModeConfig, isChainSupported, canBeUsedWithTrails }) {
|
|
7100
|
+
if (checkoutModeConfig === "trails" && isChainSupported && canBeUsedWithTrails) return "trails";
|
|
7101
|
+
if (checkoutModeConfig === "trails" && isChainSupported && !canBeUsedWithTrails) return "crypto";
|
|
7102
|
+
if (checkoutModeConfig === "trails" && !isChainSupported) return "crypto";
|
|
7103
|
+
if (typeof checkoutModeConfig === "object" && checkoutModeConfig.mode === "sequence-checkout") return {
|
|
7104
|
+
mode: "sequence-checkout",
|
|
7105
|
+
options: checkoutModeConfig.options
|
|
7106
|
+
};
|
|
7107
|
+
if (checkoutModeConfig === "crypto") return "crypto";
|
|
7810
7108
|
}
|
|
7811
7109
|
|
|
7812
|
-
{
|
|
7813
|
-
`;
|
|
7814
|
-
|
|
7815
7110
|
//#endregion
|
|
7816
|
-
//#region src/react/ui/modals/BuyModal/
|
|
7817
|
-
|
|
7818
|
-
const
|
|
7819
|
-
const
|
|
7820
|
-
const
|
|
7821
|
-
const
|
|
7822
|
-
const
|
|
7823
|
-
const
|
|
7824
|
-
|
|
7825
|
-
|
|
7826
|
-
|
|
7827
|
-
|
|
7828
|
-
|
|
7829
|
-
|
|
7830
|
-
|
|
7831
|
-
|
|
7832
|
-
},
|
|
7833
|
-
className: "overflow-y-auto"
|
|
7111
|
+
//#region src/react/ui/modals/BuyModal/internal/buyModalContext.ts
|
|
7112
|
+
function useBuyModalContext() {
|
|
7113
|
+
const config = useConfig$1();
|
|
7114
|
+
const modalProps = useBuyModalProps();
|
|
7115
|
+
const checkoutModeConfig = config.checkoutMode ?? "trails";
|
|
7116
|
+
const { close } = useBuyModal();
|
|
7117
|
+
const transactionStatusModal = useTransactionStatusModal();
|
|
7118
|
+
const { address: userWalletAddress } = useAccount();
|
|
7119
|
+
const { data: supportedChains = [], isLoading: isLoadingChains } = useSupportedChains();
|
|
7120
|
+
const { collectible, collection, currency, marketOrder, collectionAddress, primarySaleItem, isLoading: isBuyModalDataLoading, isMarket, isShop, error, refetchQueries } = useBuyModalData();
|
|
7121
|
+
const contractType = collection?.type === ContractType$1.ERC1155 ? ContractType$1.ERC1155 : ContractType$1.ERC721;
|
|
7122
|
+
const transactionData = useBuyTransaction({
|
|
7123
|
+
modalProps,
|
|
7124
|
+
primarySalePrice: {
|
|
7125
|
+
amount: primarySaleItem?.priceAmount,
|
|
7126
|
+
currencyAddress: primarySaleItem?.currencyAddress
|
|
7834
7127
|
},
|
|
7835
|
-
|
|
7836
|
-
error,
|
|
7837
|
-
onTryAgain: refetchAll,
|
|
7838
|
-
onClose: close
|
|
7839
|
-
})
|
|
7128
|
+
contractType
|
|
7840
7129
|
});
|
|
7841
|
-
|
|
7842
|
-
|
|
7843
|
-
|
|
7844
|
-
|
|
7130
|
+
const steps = transactionData.data?.steps;
|
|
7131
|
+
const canBeUsedWithTrails = transactionData.data?.canBeUsedWithTrails ?? false;
|
|
7132
|
+
const isLoadingSteps = transactionData.isLoading;
|
|
7133
|
+
const { pendingFeeOptionConfirmation, rejectPendingFeeOption } = useWaasFeeOptions$1(modalProps.chainId, config);
|
|
7134
|
+
const isChainSupported = supportedChains.some((chain) => chain.id === modalProps.chainId);
|
|
7135
|
+
const isLoading = isLoadingSteps || isLoadingChains || isBuyModalDataLoading;
|
|
7136
|
+
const buyStep = steps ? findBuyStep(steps) : void 0;
|
|
7137
|
+
const approvalStep = steps ? findApprovalStep(steps) : void 0;
|
|
7138
|
+
const trailsDestination = useMemo(() => {
|
|
7139
|
+
if (!isMarket || !marketOrder || !buyStep || !userWalletAddress) return;
|
|
7140
|
+
const trailsMarketBuyActions = buildTrailsMarketBuyActions({
|
|
7141
|
+
chainId: modalProps.chainId,
|
|
7142
|
+
buyStep,
|
|
7143
|
+
marketOrder,
|
|
7144
|
+
contractType,
|
|
7145
|
+
recipientAddress: userWalletAddress,
|
|
7146
|
+
approvalStep
|
|
7147
|
+
});
|
|
7148
|
+
if (!trailsMarketBuyActions) return;
|
|
7149
|
+
const destination = encodeDestinationCalls({
|
|
7150
|
+
calls: trailsMarketBuyActions.calls,
|
|
7151
|
+
tokenAddress: trailsMarketBuyActions.paymentTokenAddress,
|
|
7152
|
+
sweepTarget: userWalletAddress
|
|
7153
|
+
});
|
|
7154
|
+
return {
|
|
7155
|
+
recipient: destination.recipient,
|
|
7156
|
+
destinationCalldata: destination.destinationCalldata,
|
|
7157
|
+
paymentTokenAddress: trailsMarketBuyActions.paymentTokenAddress,
|
|
7158
|
+
paymentAmount: trailsMarketBuyActions.paymentAmount
|
|
7159
|
+
};
|
|
7160
|
+
}, [
|
|
7161
|
+
approvalStep,
|
|
7162
|
+
buyStep,
|
|
7163
|
+
contractType,
|
|
7164
|
+
isMarket,
|
|
7165
|
+
marketOrder,
|
|
7166
|
+
modalProps.chainId,
|
|
7167
|
+
userWalletAddress
|
|
7168
|
+
]);
|
|
7169
|
+
const checkoutMode = determineCheckoutMode({
|
|
7170
|
+
checkoutModeConfig,
|
|
7171
|
+
isChainSupported,
|
|
7172
|
+
canBeUsedWithTrails
|
|
7845
7173
|
});
|
|
7846
|
-
|
|
7847
|
-
|
|
7848
|
-
|
|
7849
|
-
|
|
7850
|
-
|
|
7851
|
-
|
|
7852
|
-
|
|
7853
|
-
|
|
7854
|
-
|
|
7855
|
-
|
|
7856
|
-
|
|
7857
|
-
|
|
7858
|
-
|
|
7859
|
-
|
|
7860
|
-
|
|
7861
|
-
|
|
7862
|
-
|
|
7863
|
-
|
|
7864
|
-
|
|
7865
|
-
|
|
7866
|
-
|
|
7867
|
-
|
|
7868
|
-
|
|
7869
|
-
|
|
7870
|
-
|
|
7871
|
-
|
|
7872
|
-
|
|
7873
|
-
|
|
7874
|
-
|
|
7875
|
-
|
|
7876
|
-
|
|
7877
|
-
|
|
7878
|
-
|
|
7879
|
-
|
|
7880
|
-
|
|
7881
|
-
|
|
7882
|
-
|
|
7883
|
-
|
|
7884
|
-
|
|
7885
|
-
|
|
7886
|
-
|
|
7887
|
-
|
|
7888
|
-
|
|
7889
|
-
|
|
7890
|
-
|
|
7891
|
-
|
|
7892
|
-
|
|
7893
|
-
|
|
7894
|
-
|
|
7895
|
-
|
|
7896
|
-
|
|
7174
|
+
const paymentAmount = trailsDestination?.paymentAmount ?? (buyStep ? buyStep.price > 0n ? buyStep.price : buyStep.value : void 0);
|
|
7175
|
+
const formattedAmount = currency?.decimals !== void 0 && paymentAmount !== void 0 ? formatUnits(paymentAmount, currency.decimals) : void 0;
|
|
7176
|
+
const handleTransactionSuccess = (hash) => {
|
|
7177
|
+
if (!collectible) throw new Error("Collectible not found");
|
|
7178
|
+
if (isMarket && !marketOrder) throw new Error("Order not found");
|
|
7179
|
+
if (!currency) throw new Error("Currency not found");
|
|
7180
|
+
const amountRaw = isMarket ? marketOrder?.priceAmount : primarySaleItem?.priceAmount;
|
|
7181
|
+
if (amountRaw == null) throw new Error("Price amount not found");
|
|
7182
|
+
close();
|
|
7183
|
+
transactionStatusModal.show({
|
|
7184
|
+
hash,
|
|
7185
|
+
orderId: isMarket ? marketOrder?.orderId : void 0,
|
|
7186
|
+
price: {
|
|
7187
|
+
amountRaw,
|
|
7188
|
+
currency
|
|
7189
|
+
},
|
|
7190
|
+
collectionAddress,
|
|
7191
|
+
chainId: modalProps.chainId,
|
|
7192
|
+
tokenId: collectible.tokenId,
|
|
7193
|
+
type: TransactionType$1.BUY
|
|
7194
|
+
});
|
|
7195
|
+
};
|
|
7196
|
+
const handleTrailsSuccess = (data) => {
|
|
7197
|
+
handleTransactionSuccess(data.txHash);
|
|
7198
|
+
};
|
|
7199
|
+
const handleClose = () => {
|
|
7200
|
+
if (pendingFeeOptionConfirmation?.id) {
|
|
7201
|
+
console.log("rejecting pending fee option", pendingFeeOptionConfirmation?.id);
|
|
7202
|
+
rejectPendingFeeOption(pendingFeeOptionConfirmation?.id);
|
|
7203
|
+
}
|
|
7204
|
+
close();
|
|
7205
|
+
};
|
|
7206
|
+
const refetchAll = async () => {
|
|
7207
|
+
await refetchQueries();
|
|
7208
|
+
await transactionData.refetch();
|
|
7209
|
+
};
|
|
7210
|
+
return {
|
|
7211
|
+
config,
|
|
7212
|
+
modalProps,
|
|
7213
|
+
close: handleClose,
|
|
7214
|
+
steps,
|
|
7215
|
+
collectible,
|
|
7216
|
+
collection,
|
|
7217
|
+
primarySaleItem,
|
|
7218
|
+
marketOrder,
|
|
7219
|
+
isMarket,
|
|
7220
|
+
isShop,
|
|
7221
|
+
buyStep,
|
|
7222
|
+
trailsDestination,
|
|
7223
|
+
isLoading,
|
|
7224
|
+
checkoutMode,
|
|
7225
|
+
formattedAmount,
|
|
7226
|
+
handleTransactionSuccess,
|
|
7227
|
+
handleTrailsSuccess,
|
|
7228
|
+
error: error || transactionData.error,
|
|
7229
|
+
refetchAll
|
|
7230
|
+
};
|
|
7231
|
+
}
|
|
7232
|
+
|
|
7233
|
+
//#endregion
|
|
7234
|
+
//#region src/react/ui/modals/BuyModal/components/CollectibleMetadataSummary.tsx
|
|
7235
|
+
const CollectibleMetadataSummary = ({ checkoutMode, collectible, collection, chainId, currency, formattedPrice, renderCurrencyPrice, renderPriceUSD, isMarket }) => {
|
|
7236
|
+
if (!collectible) return null;
|
|
7237
|
+
const isTrails = checkoutMode === "trails";
|
|
7238
|
+
const isCryptoPayment = checkoutMode === "crypto";
|
|
7239
|
+
const imageSize = isTrails ? "h-12 w-12" : "h-[84px] w-[84px]";
|
|
7240
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
7241
|
+
className: isTrails ? "flex w-full items-start gap-4 p-6 pb-0" : "flex items-start gap-4",
|
|
7242
|
+
children: [/* @__PURE__ */ jsx(Media, {
|
|
7243
|
+
assets: [
|
|
7244
|
+
collectible.video,
|
|
7245
|
+
collectible.animation_url,
|
|
7246
|
+
collectible.image
|
|
7247
|
+
],
|
|
7248
|
+
name: collectible.name,
|
|
7249
|
+
containerClassName: `${imageSize} shrink-0 rounded-lg overflow-hidden object-cover`
|
|
7250
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
7251
|
+
className: "flex min-w-0 flex-1 flex-col gap-2",
|
|
7252
|
+
children: [isTrails ? /* @__PURE__ */ jsxs("div", {
|
|
7253
|
+
className: "flex flex-col gap-1",
|
|
7254
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
7255
|
+
className: "flex items-center gap-2",
|
|
7256
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
7257
|
+
className: "truncate font-semibold text-sm text-text-100",
|
|
7258
|
+
children: collectible.name || "Unnamed"
|
|
7259
|
+
}), collectible.tokenId !== void 0 && /* @__PURE__ */ jsxs(Text, {
|
|
7260
|
+
className: "shrink-0 font-bold text-text-50 text-xs",
|
|
7261
|
+
children: ["#", collectible.tokenId.toString()]
|
|
7262
|
+
})]
|
|
7263
|
+
}), collection && /* @__PURE__ */ jsxs("div", {
|
|
7264
|
+
className: "flex items-center gap-2",
|
|
7265
|
+
children: [collection.logoURI && /* @__PURE__ */ jsx("img", {
|
|
7266
|
+
src: collection.logoURI,
|
|
7267
|
+
alt: collection.name,
|
|
7268
|
+
className: "h-4 w-4 shrink-0 rounded-full"
|
|
7269
|
+
}), /* @__PURE__ */ jsx(Text, {
|
|
7270
|
+
className: "truncate font-bold text-text-50 text-xs",
|
|
7271
|
+
children: collection.name
|
|
7272
|
+
})]
|
|
7273
|
+
})]
|
|
7274
|
+
}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
|
|
7275
|
+
className: "flex items-center gap-2",
|
|
7276
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
7277
|
+
className: "truncate font-semibold text-sm text-text-100",
|
|
7278
|
+
children: collectible.name
|
|
7279
|
+
}), collectible.tokenId !== void 0 && /* @__PURE__ */ jsxs(Text, {
|
|
7280
|
+
className: "shrink-0 font-bold text-text-50 text-xs",
|
|
7281
|
+
children: ["#", collectible.tokenId.toString()]
|
|
7282
|
+
})]
|
|
7283
|
+
}), collection && /* @__PURE__ */ jsx(Text, {
|
|
7284
|
+
className: "truncate font-bold text-text-50 text-xs",
|
|
7285
|
+
children: collection.name
|
|
7286
|
+
})] }), isCryptoPayment && renderCurrencyPrice && /* @__PURE__ */ jsxs("div", {
|
|
7287
|
+
className: "mt-2 flex flex-col",
|
|
7288
|
+
children: [/* @__PURE__ */ jsx(Tooltip, {
|
|
7289
|
+
message: `${formattedPrice || ""} ${currency?.symbol || ""}`,
|
|
7290
|
+
side: "right",
|
|
7291
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
7292
|
+
className: "flex items-center gap-1",
|
|
7293
|
+
children: [currency?.imageUrl ? /* @__PURE__ */ jsx("img", {
|
|
7294
|
+
src: currency.imageUrl,
|
|
7295
|
+
alt: currency.symbol,
|
|
7296
|
+
className: "h-5 w-5 rounded-full"
|
|
7297
|
+
}) : chainId ? /* @__PURE__ */ jsx(NetworkImage, {
|
|
7298
|
+
chainId,
|
|
7299
|
+
size: "sm"
|
|
7300
|
+
}) : null, /* @__PURE__ */ jsx(Text, {
|
|
7301
|
+
className: "font-bold text-md",
|
|
7302
|
+
children: renderCurrencyPrice()
|
|
7897
7303
|
})]
|
|
7898
7304
|
})
|
|
7899
|
-
|
|
7900
|
-
|
|
7305
|
+
}), isMarket && renderPriceUSD && renderPriceUSD() && /* @__PURE__ */ jsx(Text, {
|
|
7306
|
+
className: "font-bold text-text-50 text-xs",
|
|
7307
|
+
children: renderPriceUSD()
|
|
7308
|
+
})]
|
|
7309
|
+
})]
|
|
7901
7310
|
})]
|
|
7902
7311
|
});
|
|
7903
7312
|
};
|
|
7904
7313
|
|
|
7905
7314
|
//#endregion
|
|
7906
|
-
//#region src/react/ui/
|
|
7907
|
-
const
|
|
7908
|
-
|
|
7909
|
-
|
|
7910
|
-
|
|
7911
|
-
|
|
7912
|
-
|
|
7913
|
-
|
|
7914
|
-
|
|
7915
|
-
|
|
7916
|
-
tokenId,
|
|
7917
|
-
chainId,
|
|
7918
|
-
collectionAddress,
|
|
7919
|
-
filter: { currencies: [price.currency.contractAddress] }
|
|
7920
|
-
});
|
|
7921
|
-
const floorPriceRaw = listing?.priceAmount;
|
|
7922
|
-
const floorPriceFormatted = listing?.priceAmountFormatted;
|
|
7923
|
-
const { data: priceComparison, isLoading: comparisonLoading } = useCurrencyComparePrices({
|
|
7924
|
-
chainId,
|
|
7925
|
-
priceAmountRaw: price.amountRaw?.toString() || "0",
|
|
7926
|
-
priceCurrencyAddress: price.currency.contractAddress,
|
|
7927
|
-
compareToPriceAmountRaw: floorPriceRaw?.toString() || "0",
|
|
7928
|
-
compareToPriceCurrencyAddress: listing?.priceCurrencyAddress || price.currency.contractAddress,
|
|
7929
|
-
query: { enabled: !!floorPriceRaw && !listingLoading && price.amountRaw !== 0n }
|
|
7930
|
-
});
|
|
7931
|
-
if (!floorPriceRaw || listingLoading || price.amountRaw === 0n || comparisonLoading) return null;
|
|
7932
|
-
let floorPriceDifferenceText = "Same as floor price";
|
|
7933
|
-
let showBuyNowButton = false;
|
|
7934
|
-
if (priceComparison) if (priceComparison.status === "same") {
|
|
7935
|
-
floorPriceDifferenceText = "Same as floor price";
|
|
7936
|
-
showBuyNowButton = true;
|
|
7937
|
-
} else if (priceComparison.status === "below") floorPriceDifferenceText = `${priceComparison.percentageDifferenceFormatted}% below floor price`;
|
|
7938
|
-
else {
|
|
7939
|
-
floorPriceDifferenceText = `${priceComparison.percentageDifferenceFormatted}% above floor price`;
|
|
7940
|
-
showBuyNowButton = true;
|
|
7941
|
-
}
|
|
7942
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
7943
|
-
className: "flex w-full flex-wrap items-center justify-between gap-2",
|
|
7944
|
-
children: [/* @__PURE__ */ jsx(Text, {
|
|
7945
|
-
className: "text-left font-body font-medium text-muted text-xs",
|
|
7946
|
-
children: floorPriceDifferenceText
|
|
7947
|
-
}), showBuyNowButton && onBuyNow && /* @__PURE__ */ jsxs(Button, {
|
|
7948
|
-
size: "xs",
|
|
7949
|
-
variant: "text",
|
|
7950
|
-
className: "text-indigo-400 text-xs",
|
|
7951
|
-
onClick: onBuyNow,
|
|
7315
|
+
//#region src/react/ui/components/_internals/ErrorLogBox.tsx
|
|
7316
|
+
const ErrorLogBox = ({ title, message, error, onDismiss }) => {
|
|
7317
|
+
const [showFullError, setShowFullError] = useState(false);
|
|
7318
|
+
const toggleFullError = () => {
|
|
7319
|
+
setShowFullError(!showFullError);
|
|
7320
|
+
};
|
|
7321
|
+
return /* @__PURE__ */ jsx("div", {
|
|
7322
|
+
className: "wrap-anywhere relative max-h-96 overflow-y-auto rounded-lg border border-red-900 bg-[#2b0000] p-3",
|
|
7323
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
7324
|
+
className: "flex items-start gap-3",
|
|
7952
7325
|
children: [
|
|
7953
|
-
|
|
7954
|
-
|
|
7955
|
-
|
|
7956
|
-
|
|
7326
|
+
/* @__PURE__ */ jsx(WarningIcon, {
|
|
7327
|
+
className: "absolute mt-0.5 flex-shrink-0 text-red-500",
|
|
7328
|
+
size: "sm"
|
|
7329
|
+
}),
|
|
7330
|
+
/* @__PURE__ */ jsxs("div", {
|
|
7331
|
+
className: "min-w-0 flex-1",
|
|
7332
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
7333
|
+
className: "relative ml-10 flex flex-col",
|
|
7334
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
7335
|
+
className: "font-bold text-red-400 text-sm",
|
|
7336
|
+
children: title
|
|
7337
|
+
}), /* @__PURE__ */ jsx(Text, {
|
|
7338
|
+
className: "mt-1 text-red-300 text-xs",
|
|
7339
|
+
children: message
|
|
7340
|
+
})]
|
|
7341
|
+
}), error && /* @__PURE__ */ jsxs("div", {
|
|
7342
|
+
className: "mt-2",
|
|
7343
|
+
children: [
|
|
7344
|
+
/* @__PURE__ */ jsxs("button", {
|
|
7345
|
+
onClick: toggleFullError,
|
|
7346
|
+
className: "flex items-center gap-1 text-red-400 text-xs transition-colors hover:text-red-300",
|
|
7347
|
+
type: "button",
|
|
7348
|
+
children: [showFullError ? "Hide full error" : "Show full error", showFullError ? /* @__PURE__ */ jsx(ChevronUpIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-3 w-3" })]
|
|
7349
|
+
}),
|
|
7350
|
+
showFullError && /* @__PURE__ */ jsx("div", { className: "mt-2 h-px bg-red-900" }),
|
|
7351
|
+
showFullError && /* @__PURE__ */ jsx("div", {
|
|
7352
|
+
className: "mt-2 overflow-auto rounded-md bg-red-950 p-2",
|
|
7353
|
+
children: /* @__PURE__ */ jsxs(Text, {
|
|
7354
|
+
className: "whitespace-pre-wrap break-words font-mono text-red-100 text-xs",
|
|
7355
|
+
children: [
|
|
7356
|
+
error.message,
|
|
7357
|
+
error.stack && /* @__PURE__ */ jsxs(Fragment, { children: ["\n\nStack trace:\n", error.stack] }),
|
|
7358
|
+
JSON.stringify(error, null, 2)
|
|
7359
|
+
]
|
|
7360
|
+
})
|
|
7361
|
+
})
|
|
7362
|
+
]
|
|
7363
|
+
})]
|
|
7364
|
+
}),
|
|
7365
|
+
onDismiss && /* @__PURE__ */ jsx("button", {
|
|
7366
|
+
onClick: onDismiss,
|
|
7367
|
+
className: "absolute right-4 flex-shrink-0 text-red-400 transition-colors hover:text-red-300",
|
|
7368
|
+
type: "button",
|
|
7369
|
+
"aria-label": "Dismiss error",
|
|
7370
|
+
children: /* @__PURE__ */ jsx(CloseIcon, { className: "h-3 w-3" })
|
|
7371
|
+
})
|
|
7957
7372
|
]
|
|
7958
|
-
})
|
|
7373
|
+
})
|
|
7959
7374
|
});
|
|
7960
|
-
}
|
|
7375
|
+
};
|
|
7961
7376
|
|
|
7962
7377
|
//#endregion
|
|
7963
|
-
//#region src/react/ui/
|
|
7964
|
-
|
|
7965
|
-
|
|
7966
|
-
|
|
7967
|
-
|
|
7968
|
-
|
|
7969
|
-
|
|
7970
|
-
|
|
7971
|
-
|
|
7972
|
-
|
|
7973
|
-
|
|
7974
|
-
|
|
7975
|
-
|
|
7976
|
-
|
|
7977
|
-
|
|
7978
|
-
|
|
7979
|
-
|
|
7980
|
-
|
|
7981
|
-
|
|
7982
|
-
|
|
7983
|
-
|
|
7984
|
-
|
|
7985
|
-
|
|
7986
|
-
|
|
7987
|
-
|
|
7988
|
-
|
|
7989
|
-
|
|
7990
|
-
|
|
7991
|
-
|
|
7992
|
-
|
|
7993
|
-
|
|
7994
|
-
|
|
7995
|
-
|
|
7996
|
-
|
|
7997
|
-
|
|
7998
|
-
|
|
7999
|
-
|
|
8000
|
-
|
|
8001
|
-
|
|
8002
|
-
|
|
8003
|
-
|
|
8004
|
-
|
|
8005
|
-
|
|
8006
|
-
|
|
8007
|
-
|
|
8008
|
-
|
|
8009
|
-
|
|
8010
|
-
|
|
8011
|
-
|
|
8012
|
-
|
|
8013
|
-
|
|
8014
|
-
|
|
8015
|
-
|
|
8016
|
-
|
|
8017
|
-
|
|
8018
|
-
|
|
8019
|
-
}
|
|
8020
|
-
|
|
8021
|
-
|
|
7378
|
+
//#region src/react/ui/modals/BuyModal/hooks/useExecuteBundledTransactions.ts
|
|
7379
|
+
var FeeOptionInsufficientFundsError = class extends Error {
|
|
7380
|
+
feeOptions;
|
|
7381
|
+
constructor(message, feeOptions) {
|
|
7382
|
+
super(message);
|
|
7383
|
+
this.name = "FeeOptionInsufficientFundsError";
|
|
7384
|
+
this.feeOptions = feeOptions;
|
|
7385
|
+
}
|
|
7386
|
+
};
|
|
7387
|
+
const useExecuteBundledTransactions = ({ chainId, approvalStep }) => {
|
|
7388
|
+
const config = useConfig$1();
|
|
7389
|
+
const [isExecuting, setIsExecuting] = useState(false);
|
|
7390
|
+
const { address, connector } = useAccount();
|
|
7391
|
+
const publicClient = usePublicClient({ chainId });
|
|
7392
|
+
const { data: walletClient } = useWalletClient();
|
|
7393
|
+
const indexerClient = getIndexerClient(chainId, config);
|
|
7394
|
+
const isReady = !!address && !!publicClient && !!walletClient && !!indexerClient && !!connector;
|
|
7395
|
+
const executeBundledTransactions = async ({ step, onBalanceInsufficientForFeeOption, onTransactionFailed }) => {
|
|
7396
|
+
setIsExecuting(true);
|
|
7397
|
+
try {
|
|
7398
|
+
if (!address) throw new Error("Address not found");
|
|
7399
|
+
if (!publicClient) throw new Error("Public client not found");
|
|
7400
|
+
if (!walletClient) throw new Error("Wallet client not found");
|
|
7401
|
+
if (!indexerClient) throw new Error("Indexer client not found");
|
|
7402
|
+
if (!connector) throw new Error("Connector not found");
|
|
7403
|
+
const buildTransaction = (step$1) => {
|
|
7404
|
+
const value = step$1.value ? BigInt(step$1.value) : 0n;
|
|
7405
|
+
return {
|
|
7406
|
+
to: step$1.to,
|
|
7407
|
+
data: step$1.data,
|
|
7408
|
+
chainId,
|
|
7409
|
+
...value > 0n ? { value } : {}
|
|
7410
|
+
};
|
|
7411
|
+
};
|
|
7412
|
+
const approvalData = approvalStep ? buildTransaction(approvalStep) : void 0;
|
|
7413
|
+
const transactionData = buildTransaction(step);
|
|
7414
|
+
const sendTransactionFns = await sendTransactions({
|
|
7415
|
+
chainId,
|
|
7416
|
+
senderAddress: address,
|
|
7417
|
+
publicClient,
|
|
7418
|
+
walletClient,
|
|
7419
|
+
indexerClient,
|
|
7420
|
+
connector,
|
|
7421
|
+
transactions: [...approvalData ? [approvalData] : [], transactionData],
|
|
7422
|
+
transactionConfirmations: 1,
|
|
7423
|
+
waitConfirmationForLastTransaction: false
|
|
7424
|
+
});
|
|
7425
|
+
if (!sendTransactionFns.length) throw new Error("No transactions returned");
|
|
7426
|
+
let txHash;
|
|
7427
|
+
for (const sendTransaction of sendTransactionFns) txHash = await sendTransaction();
|
|
7428
|
+
if (!txHash) throw new Error("Transaction hash not found");
|
|
7429
|
+
return txHash;
|
|
7430
|
+
} catch (error) {
|
|
7431
|
+
if (error instanceof FeeOptionInsufficientFundsError) {
|
|
7432
|
+
if (onBalanceInsufficientForFeeOption) onBalanceInsufficientForFeeOption(error);
|
|
7433
|
+
throw error;
|
|
7434
|
+
}
|
|
7435
|
+
if (onTransactionFailed) onTransactionFailed(error);
|
|
7436
|
+
throw error;
|
|
7437
|
+
} finally {
|
|
7438
|
+
setIsExecuting(false);
|
|
7439
|
+
}
|
|
7440
|
+
};
|
|
7441
|
+
return {
|
|
7442
|
+
executeBundledTransactions,
|
|
7443
|
+
isExecuting,
|
|
7444
|
+
isReady
|
|
7445
|
+
};
|
|
8022
7446
|
};
|
|
8023
7447
|
|
|
8024
7448
|
//#endregion
|
|
8025
|
-
//#region src/react/ui/modals/
|
|
8026
|
-
const
|
|
8027
|
-
|
|
8028
|
-
|
|
8029
|
-
|
|
8030
|
-
|
|
8031
|
-
|
|
8032
|
-
|
|
8033
|
-
|
|
8034
|
-
|
|
8035
|
-
|
|
8036
|
-
|
|
8037
|
-
|
|
8038
|
-
address: "0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2"
|
|
8039
|
-
},
|
|
8040
|
-
listingCurrency: {
|
|
8041
|
-
symbol: "ETH",
|
|
8042
|
-
address: zeroAddress
|
|
8043
|
-
}
|
|
8044
|
-
},
|
|
8045
|
-
"10": {
|
|
8046
|
-
chainId: 10,
|
|
8047
|
-
openseaId: "optimism",
|
|
8048
|
-
name: "Optimism",
|
|
8049
|
-
nativeCurrency: {
|
|
8050
|
-
symbol: "ETH",
|
|
8051
|
-
address: zeroAddress
|
|
8052
|
-
},
|
|
8053
|
-
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
8054
|
-
offerCurrency: {
|
|
8055
|
-
symbol: "WETH",
|
|
8056
|
-
address: "0x4200000000000000000000000000000000000006"
|
|
8057
|
-
},
|
|
8058
|
-
listingCurrency: {
|
|
8059
|
-
symbol: "ETH",
|
|
8060
|
-
address: zeroAddress
|
|
8061
|
-
}
|
|
8062
|
-
},
|
|
8063
|
-
"137": {
|
|
8064
|
-
chainId: 137,
|
|
8065
|
-
openseaId: "matic",
|
|
8066
|
-
name: "Polygon",
|
|
8067
|
-
nativeCurrency: {
|
|
8068
|
-
symbol: "POL",
|
|
8069
|
-
address: zeroAddress
|
|
8070
|
-
},
|
|
8071
|
-
wrappedNativeCurrency: { address: "0x0d500b1d8e8ef31e21c99d1db9a6444d3adf1270" },
|
|
8072
|
-
offerCurrency: {
|
|
8073
|
-
symbol: "WETH",
|
|
8074
|
-
address: "0x7ceb23fd6bc0add59e62ac25578270cff1b9f619"
|
|
8075
|
-
},
|
|
8076
|
-
listingCurrency: {
|
|
8077
|
-
symbol: "WETH",
|
|
8078
|
-
address: "0x7ceb23fd6bc0add59e62ac25578270cff1b9f619"
|
|
8079
|
-
}
|
|
8080
|
-
},
|
|
8081
|
-
"360": {
|
|
8082
|
-
chainId: 360,
|
|
8083
|
-
openseaId: "shape",
|
|
8084
|
-
name: "Shape",
|
|
8085
|
-
nativeCurrency: {
|
|
8086
|
-
symbol: "ETH",
|
|
8087
|
-
address: zeroAddress
|
|
8088
|
-
},
|
|
8089
|
-
wrappedNativeCurrency: { address: "0x4200000000000000000000000000000000000006" },
|
|
8090
|
-
offerCurrency: {
|
|
8091
|
-
symbol: "WETH",
|
|
8092
|
-
address: "0x4200000000000000000000000000000000000006"
|
|
7449
|
+
//#region src/react/ui/modals/BuyModal/hooks/useHasSufficientBalance.ts
|
|
7450
|
+
const useHasSufficientBalance = ({ chainId, value, tokenAddress }) => {
|
|
7451
|
+
const { address } = useAccount();
|
|
7452
|
+
const { data: balanceData, isLoading } = useTokenCurrencyBalance({
|
|
7453
|
+
currencyAddress: tokenAddress,
|
|
7454
|
+
chainId,
|
|
7455
|
+
userAddress: address
|
|
7456
|
+
});
|
|
7457
|
+
const balance = balanceData?.value ?? 0n;
|
|
7458
|
+
return {
|
|
7459
|
+
data: {
|
|
7460
|
+
hasSufficientBalance: balance >= value || value === 0n,
|
|
7461
|
+
balance
|
|
8093
7462
|
},
|
|
8094
|
-
|
|
8095
|
-
|
|
8096
|
-
|
|
7463
|
+
isLoading
|
|
7464
|
+
};
|
|
7465
|
+
};
|
|
7466
|
+
|
|
7467
|
+
//#endregion
|
|
7468
|
+
//#region src/react/ui/modals/BuyModal/internal/cryptoPaymentModalContext.tsx
|
|
7469
|
+
const toErrorWithDetails = (error) => {
|
|
7470
|
+
if (error instanceof Error) return error;
|
|
7471
|
+
if (typeof error === "object" && error !== null) {
|
|
7472
|
+
const errorLike = error;
|
|
7473
|
+
let message = "An unexpected error occurred.";
|
|
7474
|
+
if (typeof errorLike.message === "string") message = errorLike.message;
|
|
7475
|
+
else try {
|
|
7476
|
+
message = JSON.stringify(errorLike);
|
|
7477
|
+
} catch {
|
|
7478
|
+
message = "An unexpected error occurred.";
|
|
8097
7479
|
}
|
|
8098
|
-
|
|
8099
|
-
|
|
8100
|
-
|
|
8101
|
-
|
|
8102
|
-
|
|
8103
|
-
|
|
8104
|
-
|
|
8105
|
-
|
|
8106
|
-
|
|
8107
|
-
|
|
8108
|
-
|
|
8109
|
-
|
|
8110
|
-
|
|
8111
|
-
|
|
8112
|
-
|
|
8113
|
-
|
|
8114
|
-
|
|
7480
|
+
return Object.assign(new Error(message), errorLike);
|
|
7481
|
+
}
|
|
7482
|
+
return new Error(String(error));
|
|
7483
|
+
};
|
|
7484
|
+
function useCryptoPaymentModalContext({ chainId, steps, onSuccess }) {
|
|
7485
|
+
const [isExecuting, setIsExecuting] = useState(false);
|
|
7486
|
+
const [isApproving, setIsApproving] = useState(false);
|
|
7487
|
+
const [error, setError] = useState(null);
|
|
7488
|
+
const { isSequence: isSequenceConnector, isWaaS } = useConnectorMetadata();
|
|
7489
|
+
const buyStep = steps.find((step) => step.id === StepType.buy);
|
|
7490
|
+
if (!buyStep) throw new Error("Buy step not found");
|
|
7491
|
+
const { collectible, currency, marketOrder, primarySaleItem, isMarket, collection, isLoading: isLoadingBuyModalData } = useBuyModalData();
|
|
7492
|
+
const sdkConfig = useConfig$1();
|
|
7493
|
+
const { ensureCorrectChainAsync, currentChainId } = useEnsureCorrectChain();
|
|
7494
|
+
const isOnCorrectChain = currentChainId === chainId;
|
|
7495
|
+
const priceAmount = isMarket ? marketOrder?.priceAmount : primarySaleItem?.priceAmount;
|
|
7496
|
+
const priceCurrencyAddress = isMarket ? marketOrder?.priceCurrencyAddress : primarySaleItem?.currencyAddress;
|
|
7497
|
+
const listedPriceAmount = BigInt(priceAmount || 0);
|
|
7498
|
+
const buyStepPriceAmount = buyStep.price ? BigInt(buyStep.price) : listedPriceAmount;
|
|
7499
|
+
const buyStepValue = buyStep.value ? BigInt(buyStep.value) : buyStepPriceAmount;
|
|
7500
|
+
const requiredBalance = priceCurrencyAddress === zeroAddress ? buyStepValue : buyStepPriceAmount;
|
|
7501
|
+
const isAnyTransactionPending = isApproving || isExecuting;
|
|
7502
|
+
const { data, isLoading: isLoadingBalance } = useHasSufficientBalance({
|
|
7503
|
+
chainId,
|
|
7504
|
+
value: requiredBalance,
|
|
7505
|
+
tokenAddress: priceCurrencyAddress
|
|
7506
|
+
});
|
|
7507
|
+
const hasSufficientBalance = data?.hasSufficientBalance ?? false;
|
|
7508
|
+
const { sendTransactionAsync } = useSendTransaction();
|
|
7509
|
+
const [approvalStep, setApprovalStep] = useState(steps.find((step) => step.id === StepType.tokenApproval));
|
|
7510
|
+
const { executeBundledTransactions, isExecuting: isExecutingBundledTransactions, isReady: isBundledTransactionsReady } = useExecuteBundledTransactions({
|
|
7511
|
+
chainId,
|
|
7512
|
+
approvalStep
|
|
7513
|
+
});
|
|
7514
|
+
const waas = useSelectWaasFeeOptionsStore();
|
|
7515
|
+
const { pendingFeeOptionConfirmation, rejectPendingFeeOption } = useWaasFeeOptions$1(chainId, sdkConfig);
|
|
7516
|
+
const isSponsored = pendingFeeOptionConfirmation?.options?.length === 0;
|
|
7517
|
+
const isFeeSelectionVisible = waas.isVisible || !isSponsored && !!pendingFeeOptionConfirmation?.options;
|
|
7518
|
+
const executeTransaction = async (step) => {
|
|
7519
|
+
const data$1 = step.data;
|
|
7520
|
+
const to = step.to;
|
|
7521
|
+
const value = BigInt(step.value);
|
|
7522
|
+
if (!data$1 || !to) {
|
|
7523
|
+
const errorDetails = /* @__PURE__ */ new Error(`Invalid step: 'data' and 'to' are required:
|
|
7524
|
+
data: ${data$1}
|
|
7525
|
+
to: ${to}
|
|
7526
|
+
|
|
7527
|
+
${JSON.stringify(step)}`);
|
|
7528
|
+
setError({
|
|
7529
|
+
title: "Invalid step",
|
|
7530
|
+
message: "`data` and `to` are required",
|
|
7531
|
+
details: errorDetails
|
|
7532
|
+
});
|
|
7533
|
+
throw errorDetails;
|
|
8115
7534
|
}
|
|
8116
|
-
|
|
8117
|
-
|
|
8118
|
-
|
|
8119
|
-
|
|
8120
|
-
|
|
8121
|
-
|
|
8122
|
-
|
|
8123
|
-
|
|
8124
|
-
|
|
8125
|
-
|
|
8126
|
-
|
|
8127
|
-
|
|
8128
|
-
|
|
8129
|
-
|
|
8130
|
-
|
|
8131
|
-
|
|
8132
|
-
|
|
7535
|
+
if (!await ensureCorrectChainAsync(chainId)) throw new Error("Failed to switch to the required network.");
|
|
7536
|
+
const hash = await sendTransactionAsync({
|
|
7537
|
+
to,
|
|
7538
|
+
data: data$1,
|
|
7539
|
+
value
|
|
7540
|
+
});
|
|
7541
|
+
await waitForTransactionReceipt({
|
|
7542
|
+
txHash: hash,
|
|
7543
|
+
chainId,
|
|
7544
|
+
sdkConfig
|
|
7545
|
+
});
|
|
7546
|
+
return hash;
|
|
7547
|
+
};
|
|
7548
|
+
const executeApproval = async () => {
|
|
7549
|
+
if (!approvalStep) throw new Error("Approval step not found");
|
|
7550
|
+
setError(null);
|
|
7551
|
+
setIsApproving(true);
|
|
7552
|
+
try {
|
|
7553
|
+
await executeTransaction(approvalStep);
|
|
7554
|
+
setApprovalStep(void 0);
|
|
7555
|
+
} catch (error$1) {
|
|
7556
|
+
const errorObj = toErrorWithDetails(error$1);
|
|
7557
|
+
setError({
|
|
7558
|
+
title: "Approval failed",
|
|
7559
|
+
message: getErrorMessage(errorObj),
|
|
7560
|
+
details: errorObj
|
|
7561
|
+
});
|
|
7562
|
+
console.error("Approval transaction failed:", error$1);
|
|
7563
|
+
} finally {
|
|
7564
|
+
setIsApproving(false);
|
|
8133
7565
|
}
|
|
8134
|
-
}
|
|
8135
|
-
|
|
8136
|
-
|
|
8137
|
-
|
|
8138
|
-
|
|
8139
|
-
|
|
8140
|
-
|
|
8141
|
-
|
|
8142
|
-
|
|
8143
|
-
|
|
8144
|
-
|
|
8145
|
-
|
|
8146
|
-
|
|
8147
|
-
|
|
8148
|
-
|
|
8149
|
-
|
|
8150
|
-
|
|
7566
|
+
};
|
|
7567
|
+
const handleBalanceInsufficientForWaasFeeOption = (error$1) => {
|
|
7568
|
+
setError({
|
|
7569
|
+
title: "Insufficient balance for fee option",
|
|
7570
|
+
message: "You do not have enough balance to purchase this item.",
|
|
7571
|
+
details: error$1
|
|
7572
|
+
});
|
|
7573
|
+
console.error("Balance insufficient for fee option:", error$1);
|
|
7574
|
+
};
|
|
7575
|
+
const handleTransactionFailed = (error$1) => {
|
|
7576
|
+
setError({
|
|
7577
|
+
title: "Transaction failed",
|
|
7578
|
+
message: getErrorMessage(error$1),
|
|
7579
|
+
details: error$1
|
|
7580
|
+
});
|
|
7581
|
+
console.error("Transaction failed:", error$1);
|
|
7582
|
+
};
|
|
7583
|
+
const executeBuy = async () => {
|
|
7584
|
+
setError(null);
|
|
7585
|
+
setIsExecuting(true);
|
|
7586
|
+
try {
|
|
7587
|
+
onSuccess(await executeBundledTransactions({
|
|
7588
|
+
step: buyStep,
|
|
7589
|
+
onBalanceInsufficientForFeeOption: handleBalanceInsufficientForWaasFeeOption,
|
|
7590
|
+
onTransactionFailed: handleTransactionFailed
|
|
7591
|
+
}));
|
|
7592
|
+
} catch (error$1) {
|
|
7593
|
+
const errorObj = toErrorWithDetails(error$1);
|
|
7594
|
+
setError({
|
|
7595
|
+
title: "Purchase failed",
|
|
7596
|
+
message: getErrorMessage(errorObj),
|
|
7597
|
+
details: errorObj
|
|
7598
|
+
});
|
|
7599
|
+
console.error("Buy transaction failed:", error$1);
|
|
7600
|
+
} finally {
|
|
7601
|
+
setIsExecuting(false);
|
|
8151
7602
|
}
|
|
8152
|
-
}
|
|
8153
|
-
|
|
8154
|
-
|
|
8155
|
-
|
|
8156
|
-
|
|
8157
|
-
|
|
8158
|
-
|
|
8159
|
-
|
|
8160
|
-
|
|
8161
|
-
|
|
8162
|
-
|
|
8163
|
-
|
|
8164
|
-
|
|
8165
|
-
|
|
8166
|
-
|
|
8167
|
-
|
|
8168
|
-
|
|
7603
|
+
};
|
|
7604
|
+
const dismissError = () => {
|
|
7605
|
+
setError(null);
|
|
7606
|
+
};
|
|
7607
|
+
const formattedPrice = formatPrice(buyStepPriceAmount, currency?.decimals || 0);
|
|
7608
|
+
const isFree = formattedPrice === "0";
|
|
7609
|
+
const renderPriceUSD = () => {
|
|
7610
|
+
const priceUSD = marketOrder?.priceUSDFormatted || marketOrder?.priceUSD;
|
|
7611
|
+
if (!priceUSD) return "";
|
|
7612
|
+
if ((typeof priceUSD === "string" ? Number.parseFloat(priceUSD) : priceUSD) < 1e-4) return /* @__PURE__ */ jsxs("div", {
|
|
7613
|
+
className: "flex items-center",
|
|
7614
|
+
children: [
|
|
7615
|
+
/* @__PURE__ */ jsx(ChevronLeftIcon, { className: "w-3" }),
|
|
7616
|
+
" ",
|
|
7617
|
+
/* @__PURE__ */ jsx(Text, { children: "$0.0001" })
|
|
7618
|
+
]
|
|
7619
|
+
});
|
|
7620
|
+
return `~$${priceUSD}`;
|
|
7621
|
+
};
|
|
7622
|
+
const renderCurrencyPrice = () => {
|
|
7623
|
+
if (isFree) return "Free";
|
|
7624
|
+
if (Number.parseFloat(formattedPrice) < 1e-4) return /* @__PURE__ */ jsxs("div", {
|
|
7625
|
+
className: "flex items-center",
|
|
7626
|
+
children: [/* @__PURE__ */ jsx(ChevronLeftIcon, { className: "w-4" }), /* @__PURE__ */ jsxs(Text, { children: ["0.0001 ", currency?.symbol] })]
|
|
7627
|
+
});
|
|
7628
|
+
return `${formattedPrice} ${currency?.symbol}`;
|
|
7629
|
+
};
|
|
7630
|
+
const feeStep = isWaaS ? {
|
|
7631
|
+
label: "Select Fee",
|
|
7632
|
+
status: isSponsored || !!waas.selectedFeeOption ? "success" : isFeeSelectionVisible ? "selecting" : "idle",
|
|
7633
|
+
isSponsored,
|
|
7634
|
+
isSelecting: isFeeSelectionVisible,
|
|
7635
|
+
selectedOption: waas.selectedFeeOption,
|
|
7636
|
+
show: () => waas.show(),
|
|
7637
|
+
cancel: () => {
|
|
7638
|
+
waas.hide();
|
|
7639
|
+
if (pendingFeeOptionConfirmation?.id) rejectPendingFeeOption(pendingFeeOptionConfirmation.id);
|
|
8169
7640
|
}
|
|
8170
|
-
}
|
|
8171
|
-
|
|
8172
|
-
|
|
8173
|
-
|
|
8174
|
-
|
|
8175
|
-
|
|
8176
|
-
|
|
8177
|
-
address: zeroAddress
|
|
8178
|
-
},
|
|
8179
|
-
wrappedNativeCurrency: { address: "0xe514d9deb7966c8be0ca922de8a064264ea6bcd4" },
|
|
8180
|
-
offerCurrency: {
|
|
8181
|
-
symbol: "WRON",
|
|
8182
|
-
address: "0xe514d9deb7966c8be0ca922de8a064264ea6bcd4"
|
|
7641
|
+
} : void 0;
|
|
7642
|
+
return {
|
|
7643
|
+
data: {
|
|
7644
|
+
collectible,
|
|
7645
|
+
currency,
|
|
7646
|
+
marketOrder,
|
|
7647
|
+
collection
|
|
8183
7648
|
},
|
|
8184
|
-
|
|
8185
|
-
|
|
8186
|
-
|
|
8187
|
-
}
|
|
8188
|
-
},
|
|
8189
|
-
"2741": {
|
|
8190
|
-
chainId: 2741,
|
|
8191
|
-
openseaId: "abstract",
|
|
8192
|
-
name: "Abstract",
|
|
8193
|
-
nativeCurrency: {
|
|
8194
|
-
symbol: "ETH",
|
|
8195
|
-
address: zeroAddress
|
|
7649
|
+
loading: {
|
|
7650
|
+
isLoadingBuyModalData,
|
|
7651
|
+
isLoadingBalance
|
|
8196
7652
|
},
|
|
8197
|
-
|
|
8198
|
-
|
|
8199
|
-
|
|
8200
|
-
address: "0x3439153eb7af838ad19d56e1571fbd09333c2809"
|
|
7653
|
+
chain: {
|
|
7654
|
+
isOnCorrectChain,
|
|
7655
|
+
currentChainId
|
|
8201
7656
|
},
|
|
8202
|
-
|
|
8203
|
-
|
|
8204
|
-
|
|
8205
|
-
|
|
8206
|
-
|
|
8207
|
-
"8333": {
|
|
8208
|
-
chainId: 8333,
|
|
8209
|
-
openseaId: "b3",
|
|
8210
|
-
name: "B3",
|
|
8211
|
-
nativeCurrency: {
|
|
8212
|
-
symbol: "ETH",
|
|
8213
|
-
address: zeroAddress
|
|
7657
|
+
balance: { hasSufficientBalance },
|
|
7658
|
+
transaction: {
|
|
7659
|
+
isApproving,
|
|
7660
|
+
isExecuting,
|
|
7661
|
+
isExecutingBundledTransactions
|
|
8214
7662
|
},
|
|
8215
|
-
|
|
8216
|
-
|
|
8217
|
-
|
|
8218
|
-
address: "0x4200000000000000000000000000000000000006"
|
|
7663
|
+
error: {
|
|
7664
|
+
error,
|
|
7665
|
+
dismissError
|
|
8219
7666
|
},
|
|
8220
|
-
|
|
8221
|
-
|
|
8222
|
-
|
|
8223
|
-
}
|
|
8224
|
-
},
|
|
8225
|
-
"8453": {
|
|
8226
|
-
chainId: 8453,
|
|
8227
|
-
openseaId: "base",
|
|
8228
|
-
name: "Base",
|
|
8229
|
-
nativeCurrency: {
|
|
8230
|
-
symbol: "ETH",
|
|
8231
|
-
address: zeroAddress
|
|
7667
|
+
steps: {
|
|
7668
|
+
approvalStep,
|
|
7669
|
+
feeStep
|
|
8232
7670
|
},
|
|
8233
|
-
|
|
8234
|
-
|
|
8235
|
-
|
|
8236
|
-
address: "0x4200000000000000000000000000000000000006"
|
|
7671
|
+
connector: {
|
|
7672
|
+
isSequenceConnector,
|
|
7673
|
+
isWaaS
|
|
8237
7674
|
},
|
|
8238
|
-
|
|
8239
|
-
|
|
8240
|
-
|
|
8241
|
-
|
|
8242
|
-
},
|
|
8243
|
-
"33139": {
|
|
8244
|
-
chainId: 33139,
|
|
8245
|
-
openseaId: "ape_chain",
|
|
8246
|
-
name: "ApeChain",
|
|
8247
|
-
nativeCurrency: {
|
|
8248
|
-
symbol: "APE",
|
|
8249
|
-
address: zeroAddress
|
|
7675
|
+
flags: { isMarket },
|
|
7676
|
+
permissions: {
|
|
7677
|
+
canApprove: hasSufficientBalance && !isLoadingBalance && !isLoadingBuyModalData && !isAnyTransactionPending && !isFeeSelectionVisible,
|
|
7678
|
+
canBuy: hasSufficientBalance && !isLoadingBalance && !isLoadingBuyModalData && (isSequenceConnector ? true : !approvalStep) && !isAnyTransactionPending && !isFeeSelectionVisible && isBundledTransactionsReady
|
|
8250
7679
|
},
|
|
8251
|
-
|
|
8252
|
-
|
|
8253
|
-
|
|
8254
|
-
|
|
7680
|
+
price: {
|
|
7681
|
+
formattedPrice,
|
|
7682
|
+
renderCurrencyPrice,
|
|
7683
|
+
renderPriceUSD
|
|
8255
7684
|
},
|
|
8256
|
-
|
|
8257
|
-
|
|
8258
|
-
|
|
7685
|
+
actions: {
|
|
7686
|
+
executeApproval,
|
|
7687
|
+
executeBuy
|
|
8259
7688
|
}
|
|
8260
|
-
}
|
|
8261
|
-
|
|
8262
|
-
|
|
8263
|
-
|
|
8264
|
-
|
|
8265
|
-
|
|
8266
|
-
|
|
8267
|
-
|
|
8268
|
-
|
|
8269
|
-
|
|
8270
|
-
|
|
8271
|
-
|
|
8272
|
-
|
|
8273
|
-
|
|
8274
|
-
|
|
8275
|
-
|
|
8276
|
-
|
|
7689
|
+
};
|
|
7690
|
+
}
|
|
7691
|
+
|
|
7692
|
+
//#endregion
|
|
7693
|
+
//#region src/react/ui/modals/BuyModal/components/CryptoPaymentModalSkeleton.tsx
|
|
7694
|
+
const CryptoPaymentModalSkeleton = ({ networkMismatch }) => {
|
|
7695
|
+
return /* @__PURE__ */ jsx("div", {
|
|
7696
|
+
className: "flex w-full flex-col",
|
|
7697
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
7698
|
+
className: "flex flex-col gap-4 p-4",
|
|
7699
|
+
children: [
|
|
7700
|
+
/* @__PURE__ */ jsxs("div", {
|
|
7701
|
+
className: "flex items-start gap-4",
|
|
7702
|
+
children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-[84px] w-[84px] rounded-lg" }), /* @__PURE__ */ jsxs("div", {
|
|
7703
|
+
className: "flex flex-1 flex-col",
|
|
7704
|
+
children: [
|
|
7705
|
+
/* @__PURE__ */ jsxs("div", {
|
|
7706
|
+
className: "flex items-center gap-2",
|
|
7707
|
+
children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-12" })]
|
|
7708
|
+
}),
|
|
7709
|
+
/* @__PURE__ */ jsx(Skeleton, { className: "mt-1 h-3 w-24" }),
|
|
7710
|
+
/* @__PURE__ */ jsxs("div", {
|
|
7711
|
+
className: "mt-2 flex flex-col",
|
|
7712
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
7713
|
+
className: "flex items-center gap-2",
|
|
7714
|
+
children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-4 rounded-full" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-28" })]
|
|
7715
|
+
}), /* @__PURE__ */ jsx(Skeleton, { className: "mt-1 h-3 w-16" })]
|
|
7716
|
+
})
|
|
7717
|
+
]
|
|
7718
|
+
})]
|
|
7719
|
+
}),
|
|
7720
|
+
networkMismatch && /* @__PURE__ */ jsx(Skeleton, { className: "h-[98px] w-full rounded-lg" }),
|
|
7721
|
+
networkMismatch && /* @__PURE__ */ jsx(Skeleton, { className: "h-12 w-full rounded-full" }),
|
|
7722
|
+
/* @__PURE__ */ jsx(Skeleton, { className: "h-12 w-full rounded-full" })
|
|
7723
|
+
]
|
|
7724
|
+
})
|
|
7725
|
+
});
|
|
7726
|
+
};
|
|
7727
|
+
|
|
7728
|
+
//#endregion
|
|
7729
|
+
//#region src/react/ui/modals/BuyModal/components/CryptoPaymentModal.tsx
|
|
7730
|
+
const CryptoPaymentModal = ({ chainId, steps, onSuccess }) => {
|
|
7731
|
+
const { data: { collectible, currency, collection }, loading: { isLoadingBuyModalData, isLoadingBalance }, chain: { isOnCorrectChain, currentChainId }, balance: { hasSufficientBalance }, transaction: { isApproving, isExecuting, isExecutingBundledTransactions }, error: { error, dismissError }, steps: { approvalStep, feeStep }, connector: { isSequenceConnector }, flags: { isMarket }, permissions: { canApprove, canBuy }, price: { formattedPrice, renderCurrencyPrice, renderPriceUSD }, actions: { executeApproval, executeBuy } } = useCryptoPaymentModalContext({
|
|
7732
|
+
chainId,
|
|
7733
|
+
steps,
|
|
7734
|
+
onSuccess
|
|
7735
|
+
});
|
|
7736
|
+
const { ensureCorrectChainAsync } = useEnsureCorrectChain();
|
|
7737
|
+
const [pendingAction, setPendingAction] = useState(null);
|
|
7738
|
+
const [chainSwitchError, setChainSwitchError] = useState(null);
|
|
7739
|
+
const isPendingApprovalReady = pendingAction === "approval" && isOnCorrectChain && canApprove;
|
|
7740
|
+
const isPendingBuyReady = pendingAction === "buy" && isOnCorrectChain && canBuy;
|
|
7741
|
+
const isPendingAction = pendingAction !== null;
|
|
7742
|
+
useEffect(() => {
|
|
7743
|
+
if (!isPendingApprovalReady && !isPendingBuyReady) return;
|
|
7744
|
+
setPendingAction(null);
|
|
7745
|
+
pendingAction === "approval" ? executeApproval() : executeBuy();
|
|
7746
|
+
}, [
|
|
7747
|
+
executeApproval,
|
|
7748
|
+
executeBuy,
|
|
7749
|
+
isPendingApprovalReady,
|
|
7750
|
+
isPendingBuyReady,
|
|
7751
|
+
pendingAction
|
|
7752
|
+
]);
|
|
7753
|
+
const handleChainSwitchError = (error$1) => {
|
|
7754
|
+
setChainSwitchError({
|
|
7755
|
+
title: "Chain switch failed",
|
|
7756
|
+
message: `Failed to switch to ${getPresentableChainName(chainId)}. Please try changing the network in your wallet manually.`,
|
|
7757
|
+
details: error$1
|
|
7758
|
+
});
|
|
7759
|
+
};
|
|
7760
|
+
const dismissChainSwitchError = () => {
|
|
7761
|
+
setChainSwitchError(null);
|
|
7762
|
+
};
|
|
7763
|
+
const executeAction = async (action) => {
|
|
7764
|
+
setPendingAction(null);
|
|
7765
|
+
if (action === "approval") {
|
|
7766
|
+
await executeApproval();
|
|
7767
|
+
return;
|
|
8277
7768
|
}
|
|
8278
|
-
|
|
8279
|
-
|
|
8280
|
-
|
|
8281
|
-
|
|
8282
|
-
|
|
8283
|
-
|
|
8284
|
-
|
|
8285
|
-
address: zeroAddress
|
|
8286
|
-
},
|
|
8287
|
-
wrappedNativeCurrency: { address: "0x722e8bdd2ce80a4422e880164f2079488e115365" },
|
|
8288
|
-
offerCurrency: {
|
|
8289
|
-
symbol: "WETH",
|
|
8290
|
-
address: "0x722e8bdd2ce80a4422e880164f2079488e115365"
|
|
8291
|
-
},
|
|
8292
|
-
listingCurrency: {
|
|
8293
|
-
symbol: "ETH",
|
|
8294
|
-
address: zeroAddress
|
|
7769
|
+
await executeBuy();
|
|
7770
|
+
};
|
|
7771
|
+
const executeWithChainSwitch = async (action) => {
|
|
7772
|
+
dismissChainSwitchError();
|
|
7773
|
+
if (isOnCorrectChain) {
|
|
7774
|
+
await executeAction(action);
|
|
7775
|
+
return;
|
|
8295
7776
|
}
|
|
8296
|
-
|
|
8297
|
-
|
|
8298
|
-
|
|
8299
|
-
|
|
8300
|
-
|
|
8301
|
-
|
|
8302
|
-
|
|
8303
|
-
|
|
8304
|
-
|
|
8305
|
-
|
|
8306
|
-
offerCurrency: {
|
|
8307
|
-
symbol: "WAVAX",
|
|
8308
|
-
address: "0xb31f66aa3c1e785363f0875a1b74e27b85fd66c7"
|
|
8309
|
-
},
|
|
8310
|
-
listingCurrency: {
|
|
8311
|
-
symbol: "AVAX",
|
|
8312
|
-
address: zeroAddress
|
|
7777
|
+
setPendingAction(action);
|
|
7778
|
+
try {
|
|
7779
|
+
if (!await ensureCorrectChainAsync(chainId)) {
|
|
7780
|
+
setPendingAction(null);
|
|
7781
|
+
handleChainSwitchError();
|
|
7782
|
+
}
|
|
7783
|
+
} catch (error$1) {
|
|
7784
|
+
setPendingAction(null);
|
|
7785
|
+
if (error$1 instanceof Error) handleChainSwitchError(error$1);
|
|
7786
|
+
else handleChainSwitchError();
|
|
8313
7787
|
}
|
|
8314
|
-
}
|
|
8315
|
-
|
|
8316
|
-
|
|
8317
|
-
|
|
8318
|
-
|
|
8319
|
-
|
|
8320
|
-
|
|
8321
|
-
|
|
8322
|
-
},
|
|
8323
|
-
|
|
8324
|
-
|
|
8325
|
-
|
|
8326
|
-
|
|
8327
|
-
|
|
8328
|
-
|
|
8329
|
-
|
|
8330
|
-
|
|
7788
|
+
};
|
|
7789
|
+
const isWaitingForChainSwitch = isPendingAction && !isOnCorrectChain;
|
|
7790
|
+
const isPreparingPendingAction = isPendingAction && isOnCorrectChain;
|
|
7791
|
+
const approvalButtonLabel = isApproving ? /* @__PURE__ */ jsxs("div", {
|
|
7792
|
+
className: "flex items-center gap-2",
|
|
7793
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), " Approving Token..."]
|
|
7794
|
+
}) : isWaitingForChainSwitch && pendingAction === "approval" ? /* @__PURE__ */ jsxs("div", {
|
|
7795
|
+
className: "flex items-center gap-2",
|
|
7796
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), " Switching Network..."]
|
|
7797
|
+
}) : isPreparingPendingAction && pendingAction === "approval" ? /* @__PURE__ */ jsxs("div", {
|
|
7798
|
+
className: "flex items-center gap-2",
|
|
7799
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), " Preparing Approval..."]
|
|
7800
|
+
}) : "Approve Token";
|
|
7801
|
+
const buyButtonLabel = isExecuting || isExecutingBundledTransactions ? /* @__PURE__ */ jsxs("div", {
|
|
7802
|
+
className: "flex items-center gap-2",
|
|
7803
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), " Confirming Purchase..."]
|
|
7804
|
+
}) : isWaitingForChainSwitch && pendingAction === "buy" ? /* @__PURE__ */ jsxs("div", {
|
|
7805
|
+
className: "flex items-center gap-2",
|
|
7806
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), " Switching Network..."]
|
|
7807
|
+
}) : isPreparingPendingAction && pendingAction === "buy" ? /* @__PURE__ */ jsxs("div", {
|
|
7808
|
+
className: "flex items-center gap-2",
|
|
7809
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), " Preparing Purchase..."]
|
|
7810
|
+
}) : "Buy now";
|
|
7811
|
+
if (isLoadingBuyModalData || isLoadingBalance) return /* @__PURE__ */ jsx(CryptoPaymentModalSkeleton, { networkMismatch: !isOnCorrectChain && currentChainId !== void 0 });
|
|
7812
|
+
return /* @__PURE__ */ jsx("div", {
|
|
7813
|
+
className: "flex w-full flex-col",
|
|
7814
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
7815
|
+
className: "flex flex-col gap-4 p-4",
|
|
7816
|
+
children: [
|
|
7817
|
+
/* @__PURE__ */ jsx(CollectibleMetadataSummary, {
|
|
7818
|
+
checkoutMode: "crypto",
|
|
7819
|
+
collectible,
|
|
7820
|
+
collection,
|
|
7821
|
+
chainId,
|
|
7822
|
+
currency,
|
|
7823
|
+
formattedPrice,
|
|
7824
|
+
renderCurrencyPrice,
|
|
7825
|
+
renderPriceUSD,
|
|
7826
|
+
isMarket
|
|
7827
|
+
}),
|
|
7828
|
+
!isLoadingBalance && !isLoadingBuyModalData && !hasSufficientBalance && /* @__PURE__ */ jsxs(Text, {
|
|
7829
|
+
className: "text-sm text-warning",
|
|
7830
|
+
children: [
|
|
7831
|
+
"You do not have enough",
|
|
7832
|
+
" ",
|
|
7833
|
+
/* @__PURE__ */ jsx(Text, {
|
|
7834
|
+
className: "font-bold",
|
|
7835
|
+
children: currency?.name
|
|
7836
|
+
}),
|
|
7837
|
+
" to purchase this item"
|
|
7838
|
+
]
|
|
7839
|
+
}),
|
|
7840
|
+
approvalStep && !isSequenceConnector && /* @__PURE__ */ jsx(Button, {
|
|
7841
|
+
onClick: async () => {
|
|
7842
|
+
await executeWithChainSwitch("approval");
|
|
7843
|
+
},
|
|
7844
|
+
disabled: !canApprove || isPendingAction,
|
|
7845
|
+
variant: "primary",
|
|
7846
|
+
size: "lg",
|
|
7847
|
+
className: "w-full",
|
|
7848
|
+
children: approvalButtonLabel
|
|
7849
|
+
}),
|
|
7850
|
+
!isLoadingBalance && !isLoadingBuyModalData && /* @__PURE__ */ jsx(Button, {
|
|
7851
|
+
onClick: async () => {
|
|
7852
|
+
await executeWithChainSwitch("buy");
|
|
7853
|
+
},
|
|
7854
|
+
disabled: !canBuy || isPendingAction,
|
|
7855
|
+
variant: "primary",
|
|
7856
|
+
size: "lg",
|
|
7857
|
+
className: "w-full",
|
|
7858
|
+
children: buyButtonLabel
|
|
7859
|
+
}),
|
|
7860
|
+
feeStep?.isSelecting && /* @__PURE__ */ jsx(selectWaasFeeOptions_default, {
|
|
7861
|
+
chainId,
|
|
7862
|
+
onCancel: feeStep.cancel,
|
|
7863
|
+
titleOnConfirm: "Processing purchase..."
|
|
7864
|
+
}),
|
|
7865
|
+
(chainSwitchError || error) && /* @__PURE__ */ jsx(ErrorLogBox, {
|
|
7866
|
+
title: chainSwitchError?.title ?? error?.title ?? "",
|
|
7867
|
+
message: chainSwitchError?.message ?? error?.message ?? "",
|
|
7868
|
+
error: chainSwitchError?.details ?? error?.details,
|
|
7869
|
+
onDismiss: () => {
|
|
7870
|
+
dismissChainSwitchError();
|
|
7871
|
+
dismissError();
|
|
7872
|
+
}
|
|
7873
|
+
})
|
|
7874
|
+
]
|
|
7875
|
+
})
|
|
7876
|
+
});
|
|
7877
|
+
};
|
|
7878
|
+
|
|
7879
|
+
//#endregion
|
|
7880
|
+
//#region src/react/ui/modals/_internal/components/baseModal/ErrorBoundary.tsx
|
|
7881
|
+
var ErrorBoundary = class extends Component {
|
|
7882
|
+
constructor(props) {
|
|
7883
|
+
super(props);
|
|
7884
|
+
this.state = {
|
|
7885
|
+
hasError: false,
|
|
7886
|
+
error: null,
|
|
7887
|
+
errorInfo: null
|
|
7888
|
+
};
|
|
7889
|
+
}
|
|
7890
|
+
resetErrorBoundary = () => {
|
|
7891
|
+
this.setState({
|
|
7892
|
+
hasError: false,
|
|
7893
|
+
error: null,
|
|
7894
|
+
errorInfo: null
|
|
7895
|
+
});
|
|
7896
|
+
};
|
|
7897
|
+
static getDerivedStateFromError(error) {
|
|
7898
|
+
return {
|
|
7899
|
+
hasError: true,
|
|
7900
|
+
error
|
|
7901
|
+
};
|
|
7902
|
+
}
|
|
7903
|
+
componentDidCatch(error, errorInfo) {
|
|
7904
|
+
console.error("ErrorBoundary caught an error:", error, errorInfo);
|
|
7905
|
+
this.setState({ errorInfo });
|
|
7906
|
+
this.props.onError?.(error, errorInfo);
|
|
7907
|
+
}
|
|
7908
|
+
render() {
|
|
7909
|
+
if (this.state.hasError && this.state.error) {
|
|
7910
|
+
if (this.props.fallback) {
|
|
7911
|
+
if (this.state.errorInfo) return this.props.fallback(this.state.error, this.state.errorInfo);
|
|
7912
|
+
return null;
|
|
7913
|
+
}
|
|
7914
|
+
return /* @__PURE__ */ jsx("div", {
|
|
7915
|
+
className: this.props.className,
|
|
7916
|
+
"data-testid": "error-boundary",
|
|
7917
|
+
children: /* @__PURE__ */ jsx(SmartErrorHandler, {
|
|
7918
|
+
error: this.state.error,
|
|
7919
|
+
onAction: this.props.onAction
|
|
7920
|
+
})
|
|
7921
|
+
});
|
|
8331
7922
|
}
|
|
8332
|
-
|
|
8333
|
-
|
|
8334
|
-
|
|
8335
|
-
|
|
8336
|
-
|
|
8337
|
-
|
|
8338
|
-
|
|
8339
|
-
|
|
7923
|
+
return this.props.children;
|
|
7924
|
+
}
|
|
7925
|
+
};
|
|
7926
|
+
|
|
7927
|
+
//#endregion
|
|
7928
|
+
//#region src/react/ui/modals/_internal/components/baseModal/ErrorModal.tsx
|
|
7929
|
+
/**
|
|
7930
|
+
* ErrorModal - Specialized modal for error states
|
|
7931
|
+
*
|
|
7932
|
+
* Improvements over the original wrapper:
|
|
7933
|
+
* - Built on BaseModal foundation
|
|
7934
|
+
* - Smart error handling integration
|
|
7935
|
+
* - Optional retry functionality
|
|
7936
|
+
* - Fallback to simple message display
|
|
7937
|
+
*/
|
|
7938
|
+
const ErrorModal = ({ onClose, title, chainId, error, message, onRetry, onErrorAction }) => /* @__PURE__ */ jsx(BaseModal, {
|
|
7939
|
+
onClose,
|
|
7940
|
+
title,
|
|
7941
|
+
chainId,
|
|
7942
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
7943
|
+
className: "flex items-center justify-center p-4",
|
|
7944
|
+
"data-testid": "error-modal",
|
|
7945
|
+
children: error ? /* @__PURE__ */ jsx(SmartErrorHandler, {
|
|
7946
|
+
error,
|
|
7947
|
+
onAction: onErrorAction || (onRetry ? () => onRetry() : void 0)
|
|
7948
|
+
}) : /* @__PURE__ */ jsx(Text, {
|
|
7949
|
+
className: "font-body",
|
|
7950
|
+
color: "text80",
|
|
7951
|
+
children: message || "Error loading item details"
|
|
7952
|
+
})
|
|
7953
|
+
})
|
|
7954
|
+
});
|
|
7955
|
+
|
|
7956
|
+
//#endregion
|
|
7957
|
+
//#region src/react/ui/modals/_internal/components/baseModal/LoadingModal.tsx
|
|
7958
|
+
const LoadingModal = ({ onClose, title, chainId, disableAnimation = true, message }) => /* @__PURE__ */ jsx(BaseModal, {
|
|
7959
|
+
onClose,
|
|
7960
|
+
title,
|
|
7961
|
+
chainId,
|
|
7962
|
+
disableAnimation,
|
|
7963
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
7964
|
+
className: "flex flex-col items-center justify-center gap-4 p-4",
|
|
7965
|
+
"data-testid": "loading-modal",
|
|
7966
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "lg" }), message && /* @__PURE__ */ jsx("p", {
|
|
7967
|
+
className: "text-center text-sm text-text-80",
|
|
7968
|
+
children: message
|
|
7969
|
+
})]
|
|
7970
|
+
})
|
|
7971
|
+
});
|
|
7972
|
+
|
|
7973
|
+
//#endregion
|
|
7974
|
+
//#region src/react/ui/modals/BuyModal/components/sequence-checkout/ERC1155QuantityModal.tsx
|
|
7975
|
+
const ERC1155QuantityModal = ({ order, quantityRemaining, unlimitedSupply, salePrice, chainId, cardType }) => {
|
|
7976
|
+
const minQuantity = 1n;
|
|
7977
|
+
const [quantity, setQuantity] = useState(minQuantity);
|
|
7978
|
+
const [localInvalidQuantity, setLocalInvalidQuantity] = useState(false);
|
|
7979
|
+
const maxQuantity = unlimitedSupply ? maxUint256 : quantityRemaining;
|
|
7980
|
+
const invalidQuantity = maxQuantity < minQuantity || localInvalidQuantity;
|
|
7981
|
+
const handleSetQuantity = () => {
|
|
7982
|
+
buyModalStore.send({
|
|
7983
|
+
type: "setQuantity",
|
|
7984
|
+
quantity: Number(quantity)
|
|
7985
|
+
});
|
|
7986
|
+
buyModalStore.send({ type: "openPaymentModal" });
|
|
7987
|
+
};
|
|
7988
|
+
return /* @__PURE__ */ jsx(ActionModal, {
|
|
7989
|
+
chainId,
|
|
7990
|
+
onClose: () => buyModalStore.send({ type: "close" }),
|
|
7991
|
+
title: "Select Quantity",
|
|
7992
|
+
disableAnimation: true,
|
|
7993
|
+
type: "buy",
|
|
7994
|
+
queries: {},
|
|
7995
|
+
primaryAction: {
|
|
7996
|
+
label: "Buy now",
|
|
7997
|
+
onClick: handleSetQuantity,
|
|
7998
|
+
disabled: invalidQuantity
|
|
8340
7999
|
},
|
|
8341
|
-
|
|
8342
|
-
|
|
8343
|
-
|
|
8344
|
-
|
|
8000
|
+
secondaryAction: {
|
|
8001
|
+
label: "Cancel",
|
|
8002
|
+
variant: "secondary",
|
|
8003
|
+
onClick: () => buyModalStore.send({ type: "close" })
|
|
8345
8004
|
},
|
|
8346
|
-
|
|
8347
|
-
|
|
8348
|
-
|
|
8005
|
+
children: () => {
|
|
8006
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
8007
|
+
className: "flex w-full flex-col gap-4",
|
|
8008
|
+
children: [/* @__PURE__ */ jsx(QuantityInput, {
|
|
8009
|
+
quantity,
|
|
8010
|
+
invalidQuantity,
|
|
8011
|
+
onQuantityChange: setQuantity,
|
|
8012
|
+
onInvalidQuantityChange: setLocalInvalidQuantity,
|
|
8013
|
+
maxQuantity
|
|
8014
|
+
}), /* @__PURE__ */ jsx(TotalPrice, {
|
|
8015
|
+
order,
|
|
8016
|
+
quantity,
|
|
8017
|
+
salePrice,
|
|
8018
|
+
chainId,
|
|
8019
|
+
cardType
|
|
8020
|
+
})]
|
|
8021
|
+
});
|
|
8349
8022
|
}
|
|
8350
|
-
}
|
|
8351
|
-
|
|
8352
|
-
|
|
8353
|
-
|
|
8354
|
-
|
|
8355
|
-
|
|
8356
|
-
|
|
8357
|
-
|
|
8023
|
+
});
|
|
8024
|
+
};
|
|
8025
|
+
const TotalPrice = ({ order, quantity, salePrice, chainId, cardType }) => {
|
|
8026
|
+
const isShop = cardType === "shop";
|
|
8027
|
+
const isMarket = cardType === "market";
|
|
8028
|
+
const { data: marketplaceConfig } = useMarketplaceConfig();
|
|
8029
|
+
const { data: currency, isLoading: isCurrencyLoading } = useCurrency({
|
|
8030
|
+
chainId,
|
|
8031
|
+
currencyAddress: order ? order.priceCurrencyAddress : salePrice?.currencyAddress
|
|
8032
|
+
});
|
|
8033
|
+
let error = null;
|
|
8034
|
+
let formattedPrice = "0";
|
|
8035
|
+
if (isMarket && currency && order) try {
|
|
8036
|
+
const marketplaceFeePercentage = (marketplaceConfig?.market?.collections?.find((col) => col.itemsAddress.toLowerCase() === order.collectionContractAddress.toLowerCase() && col.chainId === chainId))?.feePercentage ?? DEFAULT_MARKETPLACE_FEE_PERCENTAGE;
|
|
8037
|
+
formattedPrice = formatPriceWithFee(BigInt(order.priceAmount) * quantity, currency.decimals, marketplaceFeePercentage);
|
|
8038
|
+
} catch (e) {
|
|
8039
|
+
console.error("Error formatting price", e);
|
|
8040
|
+
error = "Unable to calculate total price";
|
|
8041
|
+
}
|
|
8042
|
+
if (isShop && salePrice && currency) formattedPrice = formatPriceWithFee(BigInt(salePrice.amount) * quantity, currency.decimals, 0);
|
|
8043
|
+
return error ? /* @__PURE__ */ jsx(Text, {
|
|
8044
|
+
className: "font-body font-medium text-xs",
|
|
8045
|
+
color: "text50",
|
|
8046
|
+
children: error
|
|
8047
|
+
}) : /* @__PURE__ */ jsxs("div", {
|
|
8048
|
+
className: "flex justify-between",
|
|
8049
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
8050
|
+
className: "font-body font-medium text-xs",
|
|
8051
|
+
color: "text50",
|
|
8052
|
+
children: "Total Price"
|
|
8053
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
8054
|
+
className: "flex items-center gap-0.5",
|
|
8055
|
+
children: !currency || isCurrencyLoading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-12" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
8056
|
+
currency?.imageUrl && /* @__PURE__ */ jsx(TokenImage, {
|
|
8057
|
+
src: currency.imageUrl,
|
|
8058
|
+
size: "xs"
|
|
8059
|
+
}),
|
|
8060
|
+
/* @__PURE__ */ jsx(Text, {
|
|
8061
|
+
className: "font-body font-bold text-text-100 text-xs",
|
|
8062
|
+
children: formattedPrice
|
|
8063
|
+
}),
|
|
8064
|
+
/* @__PURE__ */ jsx(Text, {
|
|
8065
|
+
className: "font-body font-bold text-text-80 text-xs",
|
|
8066
|
+
children: currency?.symbol
|
|
8067
|
+
})
|
|
8068
|
+
] })
|
|
8069
|
+
})]
|
|
8070
|
+
});
|
|
8071
|
+
};
|
|
8072
|
+
|
|
8073
|
+
//#endregion
|
|
8074
|
+
//#region ../api/src/adapters/marketplace/marketplace.gen.ts
|
|
8075
|
+
let StepType$1 = /* @__PURE__ */ function(StepType$2) {
|
|
8076
|
+
StepType$2["unknown"] = "unknown";
|
|
8077
|
+
StepType$2["tokenApproval"] = "tokenApproval";
|
|
8078
|
+
StepType$2["buy"] = "buy";
|
|
8079
|
+
StepType$2["sell"] = "sell";
|
|
8080
|
+
StepType$2["createListing"] = "createListing";
|
|
8081
|
+
StepType$2["createOffer"] = "createOffer";
|
|
8082
|
+
StepType$2["signEIP712"] = "signEIP712";
|
|
8083
|
+
StepType$2["signEIP191"] = "signEIP191";
|
|
8084
|
+
StepType$2["cancel"] = "cancel";
|
|
8085
|
+
return StepType$2;
|
|
8086
|
+
}({});
|
|
8087
|
+
|
|
8088
|
+
//#endregion
|
|
8089
|
+
//#region src/utils/decode/erc20.ts
|
|
8090
|
+
function decodeERC20Approval(calldata) {
|
|
8091
|
+
const decoded = decodeFunctionData({
|
|
8092
|
+
abi: erc20Abi,
|
|
8093
|
+
data: calldata
|
|
8094
|
+
});
|
|
8095
|
+
if (decoded.functionName !== "approve") throw new Error("Not an ERC20 approval transaction");
|
|
8096
|
+
const [spender, value] = decoded.args;
|
|
8097
|
+
return {
|
|
8098
|
+
spender,
|
|
8099
|
+
value
|
|
8100
|
+
};
|
|
8101
|
+
}
|
|
8102
|
+
|
|
8103
|
+
//#endregion
|
|
8104
|
+
//#region src/react/ui/modals/BuyModal/components/sequence-checkout/usePaymentModalParams.ts
|
|
8105
|
+
const getBuyCollectableParams = async ({ address, chainId, collectionAddress, tokenId, successActionButtons, priceCurrencyAddress, customCreditCardProviderCallback, marketplaceKind, orderId, quantity, skipNativeBalanceCheck, nativeTokenAddress, buyAnalyticsId, onRampProvider, checkoutMode, steps, marketplaceType }) => {
|
|
8106
|
+
const checkoutOptions = typeof checkoutMode === "object" ? checkoutMode.options : void 0;
|
|
8107
|
+
const buyStep = steps?.find((step) => step.id === StepType$1.buy);
|
|
8108
|
+
const approveStep = steps?.find((step) => step.id === StepType$1.tokenApproval);
|
|
8109
|
+
const approvedSpenderAddress = approveStep ? decodeERC20Approval(approveStep.data).spender : void 0;
|
|
8110
|
+
if (!buyStep) throw new Error("Buy step not found");
|
|
8111
|
+
const creditCardProviders = customCreditCardProviderCallback ? ["custom"] : checkoutOptions?.nftCheckout || [];
|
|
8112
|
+
const supplementaryAnalyticsInfo = marketplaceType === "market" ? {
|
|
8113
|
+
requestId: orderId,
|
|
8114
|
+
...marketplaceKind && { marketplaceKind },
|
|
8115
|
+
buyAnalyticsId
|
|
8116
|
+
} : { marketplaceType: "shop" };
|
|
8117
|
+
const totalPrice = BigInt(buyStep.price) * BigInt(quantity);
|
|
8118
|
+
return {
|
|
8119
|
+
chain: chainId,
|
|
8120
|
+
collectibles: [{
|
|
8121
|
+
tokenId: tokenId?.toString() ?? "",
|
|
8122
|
+
quantity: quantity.toString()
|
|
8123
|
+
}],
|
|
8124
|
+
currencyAddress: priceCurrencyAddress,
|
|
8125
|
+
price: totalPrice.toString(),
|
|
8126
|
+
targetContractAddress: buyStep.to,
|
|
8127
|
+
approvedSpenderAddress,
|
|
8128
|
+
txData: buyStep.data,
|
|
8129
|
+
collectionAddress,
|
|
8130
|
+
recipientAddress: address,
|
|
8131
|
+
creditCardProviders,
|
|
8132
|
+
supplementaryAnalyticsInfo,
|
|
8133
|
+
onClose: () => {
|
|
8134
|
+
getQueryClient().invalidateQueries({ predicate: (query) => !query.meta?.persistent });
|
|
8135
|
+
buyModalStore.send({ type: "close" });
|
|
8358
8136
|
},
|
|
8359
|
-
|
|
8360
|
-
|
|
8361
|
-
|
|
8362
|
-
|
|
8137
|
+
skipNativeBalanceCheck,
|
|
8138
|
+
nativeTokenAddress,
|
|
8139
|
+
...customCreditCardProviderCallback && { customProviderCallback: () => {
|
|
8140
|
+
customCreditCardProviderCallback(buyStep);
|
|
8141
|
+
buyModalStore.send({ type: "close" });
|
|
8142
|
+
} },
|
|
8143
|
+
onRampProvider,
|
|
8144
|
+
successActionButtons
|
|
8145
|
+
};
|
|
8146
|
+
};
|
|
8147
|
+
const usePaymentModalParams = (args) => {
|
|
8148
|
+
const { marketplaceKind, priceCurrencyAddress, quantity, steps, marketplaceType } = args;
|
|
8149
|
+
const buyModalProps = useBuyModalProps();
|
|
8150
|
+
const { checkoutMode } = useBuyModalContext();
|
|
8151
|
+
const { chainId, collectionAddress, skipNativeBalanceCheck, nativeTokenAddress, onRampProvider, successActionButtons } = buyModalProps;
|
|
8152
|
+
const tokenId = isMarketProps(buyModalProps) ? buyModalProps.tokenId : buyModalProps.item.tokenId;
|
|
8153
|
+
const orderId = isMarketProps(buyModalProps) ? buyModalProps.orderId : "";
|
|
8154
|
+
const customCreditCardProviderCallback = isMarketProps(buyModalProps) ? buyModalProps.customCreditCardProviderCallback : void 0;
|
|
8155
|
+
const buyAnalyticsId = useBuyAnalyticsId();
|
|
8156
|
+
const { address } = useAccount();
|
|
8157
|
+
return useQuery({
|
|
8158
|
+
queryKey: [
|
|
8159
|
+
"buyCollectableParams",
|
|
8160
|
+
buyModalProps,
|
|
8161
|
+
args
|
|
8162
|
+
],
|
|
8163
|
+
queryFn: !!address && !!priceCurrencyAddress && !!quantity && !!steps && (marketplaceType === "market" ? !!marketplaceKind : true) ? () => getBuyCollectableParams({
|
|
8164
|
+
chainId,
|
|
8165
|
+
address,
|
|
8166
|
+
collectionAddress,
|
|
8167
|
+
tokenId,
|
|
8168
|
+
marketplaceKind,
|
|
8169
|
+
orderId,
|
|
8170
|
+
quantity,
|
|
8171
|
+
priceCurrencyAddress,
|
|
8172
|
+
successActionButtons,
|
|
8173
|
+
customCreditCardProviderCallback,
|
|
8174
|
+
skipNativeBalanceCheck,
|
|
8175
|
+
nativeTokenAddress,
|
|
8176
|
+
buyAnalyticsId,
|
|
8177
|
+
onRampProvider,
|
|
8178
|
+
checkoutMode,
|
|
8179
|
+
steps,
|
|
8180
|
+
marketplaceType
|
|
8181
|
+
}) : skipToken,
|
|
8182
|
+
retry: false
|
|
8183
|
+
});
|
|
8184
|
+
};
|
|
8185
|
+
|
|
8186
|
+
//#endregion
|
|
8187
|
+
//#region src/react/ui/modals/BuyModal/components/sequence-checkout/SequenceCheckoutNew.tsx
|
|
8188
|
+
const SequenceCheckout = ({ steps, contractType, primarySaleItem }) => {
|
|
8189
|
+
const modalProps = useBuyModalProps();
|
|
8190
|
+
const isMarket = isMarketProps(modalProps);
|
|
8191
|
+
const isShop = isShopProps(modalProps);
|
|
8192
|
+
const paymentModalState = usePaymentModalState();
|
|
8193
|
+
const { chainId, collectionAddress, hideQuantitySelector } = modalProps;
|
|
8194
|
+
const orderId = isMarket ? modalProps.orderId : "";
|
|
8195
|
+
const marketplaceKind = isMarket ? modalProps.marketplace : void 0;
|
|
8196
|
+
const { data: marketOrders } = useOrders({
|
|
8197
|
+
chainId,
|
|
8198
|
+
input: marketplaceKind && orderId ? [{
|
|
8199
|
+
contractAddress: collectionAddress,
|
|
8200
|
+
orderId,
|
|
8201
|
+
marketplace: marketplaceKind
|
|
8202
|
+
}] : [],
|
|
8203
|
+
query: { enabled: isMarket && !!orderId && !!marketplaceKind }
|
|
8204
|
+
});
|
|
8205
|
+
const marketOrder = marketOrders?.orders[0];
|
|
8206
|
+
const paymentModalParams = usePaymentModalParams({
|
|
8207
|
+
quantity: useQuantity(),
|
|
8208
|
+
marketplaceKind,
|
|
8209
|
+
priceCurrencyAddress: isMarket ? marketOrder?.priceCurrencyAddress : primarySaleItem?.currencyAddress,
|
|
8210
|
+
steps,
|
|
8211
|
+
marketplaceType: isMarket ? "market" : "shop"
|
|
8212
|
+
});
|
|
8213
|
+
if (!hideQuantitySelector && contractType === ContractType$1.ERC1155 && paymentModalState === "idle") {
|
|
8214
|
+
const quantityRemaining = isMarket ? marketOrder?.quantityRemaining : primarySaleItem?.supply;
|
|
8215
|
+
const unlimitedSupply = isShop && primarySaleItem?.unlimitedSupply ? primarySaleItem?.unlimitedSupply : false;
|
|
8216
|
+
return /* @__PURE__ */ jsx(ERC1155QuantityModal, {
|
|
8217
|
+
order: marketOrder,
|
|
8218
|
+
cardType: isMarket ? "market" : "shop",
|
|
8219
|
+
salePrice: isShop ? {
|
|
8220
|
+
amount: primarySaleItem?.priceAmount || 0n,
|
|
8221
|
+
currencyAddress: primarySaleItem?.currencyAddress
|
|
8222
|
+
} : void 0,
|
|
8223
|
+
quantityRemaining: quantityRemaining ?? 0n,
|
|
8224
|
+
unlimitedSupply,
|
|
8225
|
+
chainId
|
|
8226
|
+
});
|
|
8227
|
+
}
|
|
8228
|
+
if (paymentModalState === "closed") return null;
|
|
8229
|
+
return /* @__PURE__ */ jsx(ActionModal, {
|
|
8230
|
+
onClose: () => {
|
|
8231
|
+
buyModalStore.send({ type: "close" });
|
|
8363
8232
|
},
|
|
8364
|
-
|
|
8365
|
-
|
|
8366
|
-
|
|
8367
|
-
|
|
8368
|
-
|
|
8369
|
-
|
|
8370
|
-
chainId: 81457,
|
|
8371
|
-
openseaId: "blast",
|
|
8372
|
-
name: "Blast",
|
|
8373
|
-
nativeCurrency: {
|
|
8374
|
-
symbol: "ETH",
|
|
8375
|
-
address: zeroAddress
|
|
8233
|
+
type: "buy",
|
|
8234
|
+
chainId,
|
|
8235
|
+
queries: { paymentModalParams },
|
|
8236
|
+
title: "Checkout",
|
|
8237
|
+
onErrorDismiss: () => {
|
|
8238
|
+
buyModalStore.send({ type: "close" });
|
|
8376
8239
|
},
|
|
8377
|
-
|
|
8378
|
-
|
|
8379
|
-
symbol: "WETH",
|
|
8380
|
-
address: "0x4300000000000000000000000000000000000004"
|
|
8240
|
+
onErrorAction: () => {
|
|
8241
|
+
buyModalStore.send({ type: "close" });
|
|
8381
8242
|
},
|
|
8382
|
-
|
|
8383
|
-
|
|
8384
|
-
|
|
8243
|
+
children: ({ paymentModalParams: paymentModalParams$1 }) => {
|
|
8244
|
+
if (!steps) return /* @__PURE__ */ jsxs("div", {
|
|
8245
|
+
className: "flex h-24 items-center justify-center gap-4",
|
|
8246
|
+
children: [/* @__PURE__ */ jsx(Spinner, { size: "lg" }), /* @__PURE__ */ jsx(Text, {
|
|
8247
|
+
className: "pulse",
|
|
8248
|
+
children: "Loading checkout"
|
|
8249
|
+
})]
|
|
8250
|
+
});
|
|
8251
|
+
return /* @__PURE__ */ jsx(PaymentModalOpener, { paymentModalParams: paymentModalParams$1 });
|
|
8385
8252
|
}
|
|
8386
|
-
}
|
|
8387
|
-
|
|
8388
|
-
|
|
8389
|
-
|
|
8390
|
-
|
|
8391
|
-
|
|
8392
|
-
|
|
8393
|
-
|
|
8253
|
+
});
|
|
8254
|
+
};
|
|
8255
|
+
const PaymentModalOpener = ({ paymentModalParams }) => {
|
|
8256
|
+
const { openSelectPaymentModal } = useSelectPaymentModal();
|
|
8257
|
+
useEffect(() => {
|
|
8258
|
+
if (paymentModalParams) {
|
|
8259
|
+
openSelectPaymentModal(paymentModalParams);
|
|
8260
|
+
buyModalStore.send({ type: "openPaymentModal" });
|
|
8261
|
+
}
|
|
8262
|
+
}, [paymentModalParams, openSelectPaymentModal]);
|
|
8263
|
+
return null;
|
|
8264
|
+
};
|
|
8265
|
+
var SequenceCheckoutNew_default = SequenceCheckout;
|
|
8266
|
+
|
|
8267
|
+
//#endregion
|
|
8268
|
+
//#region src/react/ui/modals/BuyModal/components/TrailsCss.ts
|
|
8269
|
+
/**
|
|
8270
|
+
* Custom CSS to style the Trails widget to match the Sequence Marketplace SDK design system.
|
|
8271
|
+
*
|
|
8272
|
+
* This CSS overrides the Trails widget's default theme variables with Sequence design tokens.
|
|
8273
|
+
* The CSS is injected into the Trails widget's shadow DOM via the customCss prop.
|
|
8274
|
+
*
|
|
8275
|
+
* Note: The ShadowPortal wraps CSS variables in :root/:host selectors, but we provide
|
|
8276
|
+
* the full CSS string here including both variable declarations and class overrides.
|
|
8277
|
+
*
|
|
8278
|
+
* Color mapping (Sequence Design System -> Trails Variables):
|
|
8279
|
+
* - seq-color-background-primary (#000000 black) -> trails-bg-primary
|
|
8280
|
+
* - seq-color-background-secondary (#18181b zinc-900) -> trails-bg-secondary
|
|
8281
|
+
* - seq-color-background-raised (#27272a zinc-800) -> trails-bg-card, trails-bg-tertiary
|
|
8282
|
+
* - seq-color-background-muted (#09090b zinc-950) -> used for inputs/dropdowns
|
|
8283
|
+
* - seq-color-border-normal (#3f3f46 zinc-700) -> trails-border-primary
|
|
8284
|
+
* - seq-color-border-hover (#52525b zinc-600) -> trails-border-secondary
|
|
8285
|
+
* - seq-color-border-focus (#8b5cf6 violet-500) -> focus borders
|
|
8286
|
+
*/
|
|
8287
|
+
const TRAILS_CUSTOM_CSS = `
|
|
8288
|
+
}
|
|
8289
|
+
|
|
8290
|
+
/* ========================================
|
|
8291
|
+
* CSS Variable Overrides - Match Sequence Design System
|
|
8292
|
+
* These are wrapped in :root/:host by ShadowPortal
|
|
8293
|
+
* ======================================== */
|
|
8294
|
+
|
|
8295
|
+
:root, :host, [data-theme="dark"] {
|
|
8296
|
+
/* Background Colors */
|
|
8297
|
+
--trails-bg-primary: rgb(0 0 0) !important;
|
|
8298
|
+
--trails-bg-secondary: rgb(24 24 27) !important;
|
|
8299
|
+
--trails-bg-secondary-hover: rgb(39 39 42) !important;
|
|
8300
|
+
--trails-bg-secondary-focus-border: rgb(63 63 70) !important;
|
|
8301
|
+
--trails-bg-tertiary: rgb(39 39 42) !important;
|
|
8302
|
+
--trails-bg-card: rgb(24 24 27) !important;
|
|
8303
|
+
--trails-bg-overlay: rgb(0 0 0) !important;
|
|
8304
|
+
|
|
8305
|
+
/* Text Colors */
|
|
8306
|
+
--trails-text-primary: rgb(255 255 255) !important;
|
|
8307
|
+
--trails-text-secondary: rgba(255 255 255 / 0.8) !important;
|
|
8308
|
+
--trails-text-tertiary: rgba(255 255 255 / 0.6) !important;
|
|
8309
|
+
--trails-text-muted: rgb(113 113 122) !important;
|
|
8310
|
+
--trails-text-inverse: rgb(0 0 0) !important;
|
|
8311
|
+
|
|
8312
|
+
/* Border Colors */
|
|
8313
|
+
--trails-border-primary: rgb(63 63 70) !important;
|
|
8314
|
+
--trails-border-secondary: rgb(82 82 91) !important;
|
|
8315
|
+
--trails-border-tertiary: rgb(39 39 42) !important;
|
|
8316
|
+
|
|
8317
|
+
/* Interactive Colors */
|
|
8318
|
+
--trails-hover-bg: rgb(24 24 27) !important;
|
|
8319
|
+
--trails-hover-text: rgb(255 255 255) !important;
|
|
8320
|
+
|
|
8321
|
+
/* Input Field Colors */
|
|
8322
|
+
--trails-input-bg: rgb(0 0 0) !important;
|
|
8323
|
+
--trails-input-border: rgb(39 39 42) !important;
|
|
8324
|
+
--trails-input-text: rgb(255 255 255) !important;
|
|
8325
|
+
--trails-input-placeholder: rgb(113 113 122) !important;
|
|
8326
|
+
--trails-input-focus-border: rgb(139 92 246) !important;
|
|
8327
|
+
|
|
8328
|
+
/* Dropdown Colors */
|
|
8329
|
+
--trails-dropdown-bg: rgb(0 0 0) !important;
|
|
8330
|
+
--trails-dropdown-border: rgb(39 39 42) !important;
|
|
8331
|
+
--trails-dropdown-text: rgb(255 255 255) !important;
|
|
8332
|
+
--trails-dropdown-hover-bg: rgb(24 24 27) !important;
|
|
8333
|
+
--trails-dropdown-selected-bg: rgb(39 39 42) !important;
|
|
8334
|
+
--trails-dropdown-selected-text: rgb(255 255 255) !important;
|
|
8335
|
+
--trails-dropdown-focus-border: rgb(139 92 246) !important;
|
|
8336
|
+
|
|
8337
|
+
/* Modal Button Colors */
|
|
8338
|
+
--trails-modal-button-bg: transparent !important;
|
|
8339
|
+
--trails-modal-button-hover-bg: rgba(255 255 255 / 0.1) !important;
|
|
8340
|
+
--trails-modal-button-text: rgb(255 255 255) !important;
|
|
8341
|
+
--trails-modal-button-shadow: 0 1px 2px 0 rgba(0 0 0 / 0.1) !important;
|
|
8342
|
+
|
|
8343
|
+
/* Token List Colors */
|
|
8344
|
+
--trails-list-bg: rgb(0 0 0) !important;
|
|
8345
|
+
--trails-list-border: rgb(39 39 42) !important;
|
|
8346
|
+
--trails-list-hover-bg: rgb(24 24 27) !important;
|
|
8347
|
+
--trails-list-item-bg: transparent !important;
|
|
8348
|
+
--trails-list-item-selected-bg: rgb(39 39 42) !important;
|
|
8349
|
+
|
|
8350
|
+
/* Widget Border and Radius */
|
|
8351
|
+
--trails-widget-border: none !important;
|
|
8352
|
+
--trails-border-radius-widget: 24px !important;
|
|
8353
|
+
--trails-border-radius-button: 8px !important;
|
|
8354
|
+
--trails-border-radius-input: 8px !important;
|
|
8355
|
+
--trails-border-radius-dropdown: 8px !important;
|
|
8356
|
+
--trails-border-radius-container: 8px !important;
|
|
8357
|
+
--trails-border-radius-list: 8px !important;
|
|
8358
|
+
--trails-border-radius-list-button: 8px !important;
|
|
8359
|
+
--trails-border-radius-large-button: 8px !important;
|
|
8360
|
+
|
|
8361
|
+
/* Status Colors */
|
|
8362
|
+
--trails-success-bg: rgba(34 197 94 / 0.2) !important;
|
|
8363
|
+
--trails-success-text: rgb(34 197 94) !important;
|
|
8364
|
+
--trails-success-border: rgba(34 197 94 / 0.3) !important;
|
|
8365
|
+
|
|
8366
|
+
--trails-warning-bg: rgba(234 179 8 / 0.2) !important;
|
|
8367
|
+
--trails-warning-text: rgb(234 179 8) !important;
|
|
8368
|
+
--trails-warning-border: rgba(234 179 8 / 0.3) !important;
|
|
8369
|
+
|
|
8370
|
+
--trails-error-bg: rgba(239 68 68 / 0.2) !important;
|
|
8371
|
+
--trails-error-text: rgb(239 68 68) !important;
|
|
8372
|
+
--trails-error-border: rgba(239 68 68 / 0.3) !important;
|
|
8373
|
+
|
|
8374
|
+
/* Shadow */
|
|
8375
|
+
--trails-shadow: 0 4px 6px -1px rgba(0 0 0 / 0.1), 0 2px 4px -1px rgba(0 0 0 / 0.06) !important;
|
|
8376
|
+
|
|
8377
|
+
/* Primary Button */
|
|
8378
|
+
--trails-primary: rgb(255 255 255) !important;
|
|
8379
|
+
--trails-primary-hover: rgba(255 255 255 / 0.9) !important;
|
|
8380
|
+
--trails-primary-disabled: rgb(63 63 70) !important;
|
|
8381
|
+
--trails-primary-disabled-text: rgb(113 113 122) !important;
|
|
8382
|
+
|
|
8383
|
+
/* Percentage Button Colors */
|
|
8384
|
+
--trails-percentage-button-bg: rgb(24 24 27) !important;
|
|
8385
|
+
--trails-percentage-button-text: rgb(161 161 170) !important;
|
|
8386
|
+
--trails-percentage-button-hover-bg: rgb(39 39 42) !important;
|
|
8387
|
+
|
|
8388
|
+
/* Font Family */
|
|
8389
|
+
--trails-font-family: 'Inter', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
|
|
8390
|
+
}
|
|
8391
|
+
|
|
8392
|
+
/* ========================================
|
|
8393
|
+
* Direct Tailwind Class Overrides
|
|
8394
|
+
* Override hard-coded Tailwind classes used in Trails components
|
|
8395
|
+
* ======================================== */
|
|
8396
|
+
|
|
8397
|
+
/* White backgrounds -> black */
|
|
8398
|
+
.bg-white,
|
|
8399
|
+
.dark\\:bg-gray-900 {
|
|
8400
|
+
background-color: rgb(0 0 0) !important;
|
|
8401
|
+
}
|
|
8402
|
+
|
|
8403
|
+
/* Gray-800 backgrounds -> black */
|
|
8404
|
+
.bg-gray-800,
|
|
8405
|
+
.dark\\:bg-gray-800 {
|
|
8406
|
+
background-color: rgb(0 0 0) !important;
|
|
8407
|
+
}
|
|
8408
|
+
|
|
8409
|
+
/* Gray-700 backgrounds -> zinc-800 */
|
|
8410
|
+
.bg-gray-700,
|
|
8411
|
+
.dark\\:bg-gray-700 {
|
|
8412
|
+
background-color: rgb(39 39 42) !important;
|
|
8413
|
+
}
|
|
8414
|
+
|
|
8415
|
+
/* Hover states */
|
|
8416
|
+
.hover\\:bg-gray-50:hover {
|
|
8417
|
+
background-color: rgb(24 24 27) !important;
|
|
8418
|
+
}
|
|
8419
|
+
|
|
8420
|
+
.dark\\:hover\\:bg-gray-800:hover {
|
|
8421
|
+
background-color: rgb(24 24 27) !important;
|
|
8422
|
+
}
|
|
8423
|
+
|
|
8424
|
+
.dark\\:hover\\:bg-gray-700:hover {
|
|
8425
|
+
background-color: rgb(39 39 42) !important;
|
|
8426
|
+
}
|
|
8427
|
+
|
|
8428
|
+
/* Focus states */
|
|
8429
|
+
.focus-within\\:\\!bg-white:focus-within {
|
|
8430
|
+
background-color: rgb(0 0 0) !important;
|
|
8431
|
+
}
|
|
8432
|
+
|
|
8433
|
+
.dark\\:focus-within\\:\\!bg-gray-800:focus-within {
|
|
8434
|
+
background-color: rgb(0 0 0) !important;
|
|
8435
|
+
}
|
|
8436
|
+
|
|
8437
|
+
/* Border colors */
|
|
8438
|
+
.border-gray-200 {
|
|
8439
|
+
border-color: rgb(39 39 42) !important;
|
|
8440
|
+
}
|
|
8441
|
+
|
|
8442
|
+
.dark\\:border-gray-700 {
|
|
8443
|
+
border-color: rgb(39 39 42) !important;
|
|
8444
|
+
}
|
|
8445
|
+
|
|
8446
|
+
.border-gray-300 {
|
|
8447
|
+
border-color: rgb(63 63 70) !important;
|
|
8448
|
+
}
|
|
8449
|
+
|
|
8450
|
+
.dark\\:border-gray-600 {
|
|
8451
|
+
border-color: rgb(63 63 70) !important;
|
|
8452
|
+
}
|
|
8453
|
+
|
|
8454
|
+
/* Text colors */
|
|
8455
|
+
.text-gray-900 {
|
|
8456
|
+
color: rgb(255 255 255) !important;
|
|
8457
|
+
}
|
|
8458
|
+
|
|
8459
|
+
.dark\\:text-white {
|
|
8460
|
+
color: rgb(255 255 255) !important;
|
|
8461
|
+
}
|
|
8462
|
+
|
|
8463
|
+
.text-gray-500,
|
|
8464
|
+
.dark\\:text-gray-400 {
|
|
8465
|
+
color: rgb(161 161 170) !important;
|
|
8466
|
+
}
|
|
8467
|
+
|
|
8468
|
+
.text-black,
|
|
8469
|
+
.dark\\:text-blue-300 {
|
|
8470
|
+
color: rgb(255 255 255) !important;
|
|
8471
|
+
}
|
|
8472
|
+
|
|
8473
|
+
/* Primary button gradient - Match Sequence design */
|
|
8474
|
+
.bg-blue-500 {
|
|
8475
|
+
background: linear-gradient(89.69deg, #4411e1 0.27%, #7537f9 99.73%) !important;
|
|
8476
|
+
}
|
|
8477
|
+
|
|
8478
|
+
.hover\\:bg-blue-600:hover {
|
|
8479
|
+
background: linear-gradient(89.69deg, #3a0ec7 0.27%, #6229e0 99.73%) !important;
|
|
8480
|
+
opacity: 0.9;
|
|
8481
|
+
}
|
|
8482
|
+
|
|
8483
|
+
{
|
|
8484
|
+
`;
|
|
8485
|
+
|
|
8486
|
+
//#endregion
|
|
8487
|
+
//#region src/react/ui/modals/BuyModal/components/BuyModalContent.tsx
|
|
8488
|
+
const BuyModalContent = () => {
|
|
8489
|
+
const { modalProps, close, steps, primarySaleItem, marketOrder, collectible, buyStep, trailsDestination, isLoading, collection, checkoutMode, formattedAmount, isMarket, isShop, handleTrailsSuccess, handleTransactionSuccess, error, refetchAll } = useBuyModalContext();
|
|
8490
|
+
const currencyAddress = isShop ? primarySaleItem?.currencyAddress : marketOrder?.priceCurrencyAddress;
|
|
8491
|
+
if (error) return /* @__PURE__ */ jsx(Modal, {
|
|
8492
|
+
isDismissible: true,
|
|
8493
|
+
onClose: close,
|
|
8494
|
+
overlayProps: MODAL_OVERLAY_PROPS,
|
|
8495
|
+
contentProps: {
|
|
8496
|
+
style: {
|
|
8497
|
+
width: "400px",
|
|
8498
|
+
height: "auto"
|
|
8499
|
+
},
|
|
8500
|
+
className: "overflow-y-auto"
|
|
8394
8501
|
},
|
|
8395
|
-
|
|
8396
|
-
|
|
8397
|
-
|
|
8398
|
-
|
|
8502
|
+
children: /* @__PURE__ */ jsx(ModalInitializationError, {
|
|
8503
|
+
error,
|
|
8504
|
+
onTryAgain: refetchAll,
|
|
8505
|
+
onClose: close
|
|
8506
|
+
})
|
|
8507
|
+
});
|
|
8508
|
+
if (typeof checkoutMode === "object" && checkoutMode.mode === "sequence-checkout") return /* @__PURE__ */ jsx(SequenceCheckoutNew_default, {
|
|
8509
|
+
steps,
|
|
8510
|
+
contractType: collection?.type,
|
|
8511
|
+
primarySaleItem
|
|
8512
|
+
});
|
|
8513
|
+
return /* @__PURE__ */ jsxs(Dialog, {
|
|
8514
|
+
open: true,
|
|
8515
|
+
onOpenChange: (open) => !open && close(),
|
|
8516
|
+
children: [/* @__PURE__ */ jsx(DialogOverlay, { style: MODAL_OVERLAY_PROPS.style }), /* @__PURE__ */ jsx(DialogContent, {
|
|
8517
|
+
className: "h-auto w-[450px] overflow-y-auto overflow-x-hidden",
|
|
8518
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
8519
|
+
className: "relative flex grow flex-col items-center",
|
|
8520
|
+
children: [
|
|
8521
|
+
/* @__PURE__ */ jsx(Text, {
|
|
8522
|
+
className: "w-full text-center font-body font-bold text-large text-text-100",
|
|
8523
|
+
children: "Complete Your Purchase"
|
|
8524
|
+
}),
|
|
8525
|
+
isLoading && /* @__PURE__ */ jsx("div", {
|
|
8526
|
+
className: "flex w-full items-center justify-center py-8",
|
|
8527
|
+
children: /* @__PURE__ */ jsx(ProgressiveLoadingMessage, {})
|
|
8528
|
+
}),
|
|
8529
|
+
!isLoading && (checkoutMode === "crypto" || isShop && primarySaleItem?.priceAmount === 0n) && steps && steps.length > 0 && /* @__PURE__ */ jsx(CryptoPaymentModal, {
|
|
8530
|
+
chainId: modalProps.chainId,
|
|
8531
|
+
steps,
|
|
8532
|
+
onSuccess: handleTransactionSuccess
|
|
8533
|
+
}),
|
|
8534
|
+
!isLoading && checkoutMode === "trails" && buyStep && (!isMarket || trailsDestination) && !(isShop && primarySaleItem?.priceAmount === 0n) && /* @__PURE__ */ jsxs("div", {
|
|
8535
|
+
className: "pointer-events-auto w-full",
|
|
8536
|
+
children: [collectible && /* @__PURE__ */ jsx(CollectibleMetadataSummary, {
|
|
8537
|
+
checkoutMode: "trails",
|
|
8538
|
+
collectible,
|
|
8539
|
+
collection
|
|
8540
|
+
}), isMarket && trailsDestination ? /* @__PURE__ */ jsx(TrailsWidget, {
|
|
8541
|
+
toChainId: modalProps.chainId,
|
|
8542
|
+
toAddress: trailsDestination.recipient,
|
|
8543
|
+
toToken: trailsDestination.paymentTokenAddress,
|
|
8544
|
+
toAmount: formattedAmount,
|
|
8545
|
+
toCalldata: trailsDestination.destinationCalldata,
|
|
8546
|
+
renderInline: true,
|
|
8547
|
+
theme: "dark",
|
|
8548
|
+
mode: "pay",
|
|
8549
|
+
customCss: TRAILS_CUSTOM_CSS,
|
|
8550
|
+
onDestinationConfirmation: handleTrailsSuccess,
|
|
8551
|
+
payMessage: "{TO_TOKEN_IMAGE}{TO_AMOUNT}{TO_TOKEN_SYMBOL}{TO_AMOUNT_USD}"
|
|
8552
|
+
}, `market-${marketOrder?.orderId}-${trailsDestination.destinationCalldata}`) : /* @__PURE__ */ jsx(TrailsWidget, {
|
|
8553
|
+
toChainId: modalProps.chainId,
|
|
8554
|
+
toAddress: buyStep.to,
|
|
8555
|
+
toToken: currencyAddress,
|
|
8556
|
+
toAmount: formattedAmount,
|
|
8557
|
+
toCalldata: buyStep.data,
|
|
8558
|
+
renderInline: true,
|
|
8559
|
+
theme: "dark",
|
|
8560
|
+
mode: "pay",
|
|
8561
|
+
customCss: TRAILS_CUSTOM_CSS,
|
|
8562
|
+
onDestinationConfirmation: handleTrailsSuccess,
|
|
8563
|
+
payMessage: "{TO_TOKEN_IMAGE}{TO_AMOUNT}{TO_TOKEN_SYMBOL}{TO_AMOUNT_USD}"
|
|
8564
|
+
}, `direct-${buyStep.to}-${buyStep.data}`)]
|
|
8565
|
+
})
|
|
8566
|
+
]
|
|
8567
|
+
})
|
|
8568
|
+
})]
|
|
8569
|
+
});
|
|
8570
|
+
};
|
|
8571
|
+
const ProgressiveLoadingMessage = () => {
|
|
8572
|
+
const [showSecondaryMessage, setShowSecondaryMessage] = useState(false);
|
|
8573
|
+
const timerRef = useRef(null);
|
|
8574
|
+
if (!timerRef.current) timerRef.current = setTimeout(() => {
|
|
8575
|
+
setShowSecondaryMessage(true);
|
|
8576
|
+
}, 3e3);
|
|
8577
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
8578
|
+
className: "flex items-center gap-4",
|
|
8579
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
8580
|
+
className: cn$1("transition-all duration-300", showSecondaryMessage ? "h-10 w-10" : "h-5 w-5"),
|
|
8581
|
+
children: /* @__PURE__ */ jsx(Spinner, { className: "h-full w-full transition-all duration-150" })
|
|
8582
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
8583
|
+
className: "flex flex-col gap-2",
|
|
8584
|
+
children: [/* @__PURE__ */ jsx("p", {
|
|
8585
|
+
className: "animate-pulse text-text-100",
|
|
8586
|
+
children: "Loading payment options..."
|
|
8587
|
+
}), showSecondaryMessage && /* @__PURE__ */ jsx("p", {
|
|
8588
|
+
className: "text-small text-text-50",
|
|
8589
|
+
children: "This is taking longer than expected."
|
|
8590
|
+
})]
|
|
8591
|
+
})]
|
|
8592
|
+
});
|
|
8593
|
+
};
|
|
8594
|
+
|
|
8595
|
+
//#endregion
|
|
8596
|
+
//#region src/react/ui/modals/BuyModal/components/Modal.tsx
|
|
8597
|
+
const BuyModal = () => {
|
|
8598
|
+
if (!useIsOpen()) return null;
|
|
8599
|
+
return /* @__PURE__ */ jsx(BuyModalWithTrailsProvider, {});
|
|
8600
|
+
};
|
|
8601
|
+
const useTrailsWaasFeeOptions = ({ chainIdOverride } = {}) => {
|
|
8602
|
+
const config = useConfig$1();
|
|
8603
|
+
const { pendingFeeOptionConfirmation, confirmPendingFeeOption, rejectPendingFeeOption } = useWaasFeeOptions$1(chainIdOverride ?? 0, config);
|
|
8604
|
+
return [
|
|
8605
|
+
pendingFeeOptionConfirmation,
|
|
8606
|
+
confirmPendingFeeOption,
|
|
8607
|
+
rejectPendingFeeOption
|
|
8608
|
+
];
|
|
8609
|
+
};
|
|
8610
|
+
const BuyModalWithTrailsProvider = () => {
|
|
8611
|
+
const config = useConfig$1();
|
|
8612
|
+
const wagmiConfig = useConfig();
|
|
8613
|
+
return /* @__PURE__ */ jsx(TrailsProvider, {
|
|
8614
|
+
config: {
|
|
8615
|
+
trailsApiKey: config.projectAccessKey,
|
|
8616
|
+
trailsApiUrl: getTrailsApiUrl(config),
|
|
8617
|
+
sequenceIndexerUrl: getSequenceIndexerUrl(config),
|
|
8618
|
+
sequenceNodeGatewayUrl: getSequenceNodeGatewayUrl(config),
|
|
8619
|
+
sequenceApiUrl: getSequenceApiUrl(config),
|
|
8620
|
+
walletConnectProjectId: config.walletConnectProjectId,
|
|
8621
|
+
adapters: [wagmiAdapter({
|
|
8622
|
+
wagmiConfig,
|
|
8623
|
+
sequence: { useWaasFeeOptions: useTrailsWaasFeeOptions }
|
|
8624
|
+
})]
|
|
8399
8625
|
},
|
|
8400
|
-
|
|
8401
|
-
|
|
8402
|
-
address: zeroAddress
|
|
8403
|
-
}
|
|
8404
|
-
}
|
|
8626
|
+
children: /* @__PURE__ */ jsx(BuyModalContent, {})
|
|
8627
|
+
});
|
|
8405
8628
|
};
|
|
8406
|
-
|
|
8407
|
-
|
|
8408
|
-
|
|
8409
|
-
|
|
8629
|
+
|
|
8630
|
+
//#endregion
|
|
8631
|
+
//#region src/react/ui/modals/_internal/components/floorPriceText/index.tsx
|
|
8632
|
+
function FloorPriceText({ chainId, collectionAddress, tokenId, price, onBuyNow }) {
|
|
8633
|
+
const { data: listing, isLoading: listingLoading } = useCollectibleMarketLowestListing({
|
|
8634
|
+
tokenId,
|
|
8635
|
+
chainId,
|
|
8636
|
+
collectionAddress,
|
|
8637
|
+
filter: { currencies: [price.currency.contractAddress] }
|
|
8638
|
+
});
|
|
8639
|
+
const floorPriceRaw = listing?.priceAmount;
|
|
8640
|
+
const floorPriceFormatted = listing?.priceAmountFormatted;
|
|
8641
|
+
const { data: priceComparison, isLoading: comparisonLoading } = useCurrencyComparePrices({
|
|
8642
|
+
chainId,
|
|
8643
|
+
priceAmountRaw: price.amountRaw?.toString() || "0",
|
|
8644
|
+
priceCurrencyAddress: price.currency.contractAddress,
|
|
8645
|
+
compareToPriceAmountRaw: floorPriceRaw?.toString() || "0",
|
|
8646
|
+
compareToPriceCurrencyAddress: listing?.priceCurrencyAddress || price.currency.contractAddress,
|
|
8647
|
+
query: { enabled: !!floorPriceRaw && !listingLoading && price.amountRaw !== 0n }
|
|
8648
|
+
});
|
|
8649
|
+
if (!floorPriceRaw || listingLoading || price.amountRaw === 0n || comparisonLoading) return null;
|
|
8650
|
+
let floorPriceDifferenceText = "Same as floor price";
|
|
8651
|
+
let showBuyNowButton = false;
|
|
8652
|
+
if (priceComparison) if (priceComparison.status === "same") {
|
|
8653
|
+
floorPriceDifferenceText = "Same as floor price";
|
|
8654
|
+
showBuyNowButton = true;
|
|
8655
|
+
} else if (priceComparison.status === "below") floorPriceDifferenceText = `${priceComparison.percentageDifferenceFormatted}% below floor price`;
|
|
8656
|
+
else {
|
|
8657
|
+
floorPriceDifferenceText = `${priceComparison.percentageDifferenceFormatted}% above floor price`;
|
|
8658
|
+
showBuyNowButton = true;
|
|
8659
|
+
}
|
|
8660
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
8661
|
+
className: "flex w-full flex-wrap items-center justify-between gap-2",
|
|
8662
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
8663
|
+
className: "text-left font-body font-medium text-muted text-xs",
|
|
8664
|
+
children: floorPriceDifferenceText
|
|
8665
|
+
}), showBuyNowButton && onBuyNow && /* @__PURE__ */ jsxs(Button, {
|
|
8666
|
+
size: "xs",
|
|
8667
|
+
variant: "text",
|
|
8668
|
+
className: "text-indigo-400 text-xs",
|
|
8669
|
+
onClick: onBuyNow,
|
|
8670
|
+
children: [
|
|
8671
|
+
"Buy for ",
|
|
8672
|
+
floorPriceFormatted,
|
|
8673
|
+
" ",
|
|
8674
|
+
price.currency.symbol
|
|
8675
|
+
]
|
|
8676
|
+
})]
|
|
8677
|
+
});
|
|
8410
8678
|
}
|
|
8411
8679
|
|
|
8680
|
+
//#endregion
|
|
8681
|
+
//#region src/react/ui/components/_internals/custom-select/CustomSelect.tsx
|
|
8682
|
+
const CustomSelect = ({ items, onValueChange, defaultValue, placeholder = "Select an option", disabled = false, className, testId = "custom-select" }) => {
|
|
8683
|
+
const [selectedItem, setSelectedItem] = useState(defaultValue);
|
|
8684
|
+
const handleValueChange = (item) => {
|
|
8685
|
+
setSelectedItem(item);
|
|
8686
|
+
onValueChange?.(item.value);
|
|
8687
|
+
};
|
|
8688
|
+
return /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
|
|
8689
|
+
asChild: true,
|
|
8690
|
+
disabled,
|
|
8691
|
+
children: /* @__PURE__ */ jsx(Button, {
|
|
8692
|
+
size: "xs",
|
|
8693
|
+
shape: "circle",
|
|
8694
|
+
className: `py-1.5 pl-3 hover:bg-overlay-light ${className || ""}`,
|
|
8695
|
+
"data-testid": `${testId}-trigger`,
|
|
8696
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
8697
|
+
className: "flex items-center justify-center gap-1 truncate pr-3",
|
|
8698
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
8699
|
+
variant: "xsmall",
|
|
8700
|
+
color: "text100",
|
|
8701
|
+
fontWeight: "bold",
|
|
8702
|
+
children: selectedItem ? selectedItem.content : placeholder
|
|
8703
|
+
}), /* @__PURE__ */ jsx(ChevronDownIcon, { size: "xs" })]
|
|
8704
|
+
})
|
|
8705
|
+
})
|
|
8706
|
+
}), /* @__PURE__ */ jsx(DropdownMenuPortal, { children: /* @__PURE__ */ jsx(DropdownMenuContent, {
|
|
8707
|
+
align: "end",
|
|
8708
|
+
side: "bottom",
|
|
8709
|
+
sideOffset: 8,
|
|
8710
|
+
className: "z-[1000] overflow-hidden rounded-xl border border-border-base bg-color-overlay-glass shadow-lg backdrop-blur-md",
|
|
8711
|
+
"data-testid": `${testId}-content`,
|
|
8712
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
8713
|
+
className: "max-h-[240px] overflow-auto",
|
|
8714
|
+
children: items.map((item) => /* @__PURE__ */ jsx(DropdownMenuCheckboxItem, {
|
|
8715
|
+
checked: selectedItem?.value === item.value,
|
|
8716
|
+
onCheckedChange: () => handleValueChange(item),
|
|
8717
|
+
disabled: item.disabled,
|
|
8718
|
+
className: "group relative flex cursor-pointer select-none items-center rounded-lg px-2 py-1.5 outline-none transition-colors hover:bg-background-hover data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>span[data-state='checked']]:hidden",
|
|
8719
|
+
"data-testid": `${testId}-option-${item.value}`,
|
|
8720
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
8721
|
+
className: "flex w-full items-center justify-between",
|
|
8722
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
8723
|
+
className: "flex items-center gap-2 truncate",
|
|
8724
|
+
children: typeof item.content === "string" ? /* @__PURE__ */ jsx(Text, {
|
|
8725
|
+
variant: "small",
|
|
8726
|
+
color: selectedItem?.value === item.value ? "text100" : "text80",
|
|
8727
|
+
className: `truncate ${selectedItem?.value === item.value ? "font-bold" : ""}`,
|
|
8728
|
+
"data-testid": `${testId}-option-text-${item.value}`,
|
|
8729
|
+
children: item.content
|
|
8730
|
+
}) : /* @__PURE__ */ jsx("div", {
|
|
8731
|
+
className: "truncate",
|
|
8732
|
+
"data-testid": `${testId}-option-content-${item.value}`,
|
|
8733
|
+
children: item.content
|
|
8734
|
+
})
|
|
8735
|
+
})
|
|
8736
|
+
})
|
|
8737
|
+
}, item.value))
|
|
8738
|
+
})
|
|
8739
|
+
}) })] });
|
|
8740
|
+
};
|
|
8741
|
+
|
|
8412
8742
|
//#endregion
|
|
8413
8743
|
//#region src/react/ui/modals/_internal/components/currencyOptionsSelect/index.tsx
|
|
8414
8744
|
function CurrencyOptionsSelect({ chainId, collectionAddress, secondCurrencyAsDefault, selectedCurrency, onCurrencyChange, includeNativeCurrency, orderbookKind, modalType }) {
|
|
@@ -8418,7 +8748,7 @@ function CurrencyOptionsSelect({ chainId, collectionAddress, secondCurrencyAsDef
|
|
|
8418
8748
|
includeNativeCurrency
|
|
8419
8749
|
});
|
|
8420
8750
|
let filteredCurrencies = currencies;
|
|
8421
|
-
if (currencies && orderbookKind
|
|
8751
|
+
if (currencies && isOpenSeaOrderbook(orderbookKind) && modalType) {
|
|
8422
8752
|
const openseaCurrency = getOpenseaCurrencyForChain(chainId, modalType);
|
|
8423
8753
|
if (openseaCurrency) filteredCurrencies = currencies.filter((currency) => compareAddress(currency.contractAddress, openseaCurrency.address));
|
|
8424
8754
|
}
|
|
@@ -8455,7 +8785,7 @@ var currencyOptionsSelect_default = CurrencyOptionsSelect;
|
|
|
8455
8785
|
|
|
8456
8786
|
//#endregion
|
|
8457
8787
|
//#region src/react/ui/modals/_internal/components/priceInput/index.tsx
|
|
8458
|
-
function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurrencyChange, checkBalance, secondCurrencyAsDefault, includeNativeCurrency, disabled, orderbookKind,
|
|
8788
|
+
function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurrencyChange, checkBalance, secondCurrencyAsDefault, includeNativeCurrency, disabled, orderbookKind, modalType, feeData }) {
|
|
8459
8789
|
const { address: accountAddress } = useAccount();
|
|
8460
8790
|
const inputRef = useRef(null);
|
|
8461
8791
|
const currency = price?.currency;
|
|
@@ -8469,7 +8799,7 @@ function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurren
|
|
|
8469
8799
|
chainId,
|
|
8470
8800
|
currencyAddress: currencyAddress ?? zeroAddress,
|
|
8471
8801
|
amountRaw: priceAmountRaw?.toString(),
|
|
8472
|
-
query: { enabled: orderbookKind
|
|
8802
|
+
query: { enabled: isOpenSeaOrderbook(orderbookKind) && !!currencyAddress && !!priceAmountRaw }
|
|
8473
8803
|
});
|
|
8474
8804
|
useEffect(() => {
|
|
8475
8805
|
if (inputRef.current) inputRef.current.focus();
|
|
@@ -8512,9 +8842,8 @@ function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurren
|
|
|
8512
8842
|
}),
|
|
8513
8843
|
children
|
|
8514
8844
|
});
|
|
8515
|
-
const openseaLowestPriceCriteriaMet = orderbookKind
|
|
8845
|
+
const openseaLowestPriceCriteriaMet = isOpenSeaOrderbook(orderbookKind) && conversion?.usdAmount !== void 0 && conversion.usdAmount >= .01;
|
|
8516
8846
|
if (checkBalance?.enabled) checkBalance.callback(balanceError);
|
|
8517
|
-
if (setOpenseaLowestPriceCriteriaMet) setOpenseaLowestPriceCriteriaMet(openseaLowestPriceCriteriaMet);
|
|
8518
8847
|
const [value, setValue] = useState("0");
|
|
8519
8848
|
const prevCurrencyDecimals = useRef(currencyDecimals);
|
|
8520
8849
|
const [openseaDecimalError, setOpenseaDecimalError] = useState(null);
|
|
@@ -8542,7 +8871,7 @@ function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurren
|
|
|
8542
8871
|
const newValue = event.target.value;
|
|
8543
8872
|
setValue(newValue);
|
|
8544
8873
|
if (!price || !onPriceChange) return;
|
|
8545
|
-
if (orderbookKind
|
|
8874
|
+
if (isOpenSeaOrderbook(orderbookKind) && modalType === "offer") {
|
|
8546
8875
|
const validation = validateOpenseaOfferDecimals(newValue);
|
|
8547
8876
|
if (!validation.isValid) {
|
|
8548
8877
|
setOpenseaDecimalError(validation.errorMessage || null);
|
|
@@ -8647,12 +8976,12 @@ function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurren
|
|
|
8647
8976
|
})]
|
|
8648
8977
|
})
|
|
8649
8978
|
}),
|
|
8650
|
-
!balanceError && priceAmountRaw !== 0n && !openseaLowestPriceCriteriaMet && orderbookKind
|
|
8979
|
+
!balanceError && priceAmountRaw !== 0n && !openseaLowestPriceCriteriaMet && isOpenSeaOrderbook(orderbookKind) && !isConversionLoading && modalType === "offer" && !openseaDecimalError && /* @__PURE__ */ jsx(Text, {
|
|
8651
8980
|
className: "absolute -bottom-5 font-body font-medium text-xs",
|
|
8652
8981
|
color: "negative",
|
|
8653
8982
|
children: "Lowest price must be at least $0.01"
|
|
8654
8983
|
}),
|
|
8655
|
-
!balanceError && openseaDecimalError && orderbookKind
|
|
8984
|
+
!balanceError && openseaDecimalError && isOpenSeaOrderbook(orderbookKind) && modalType === "offer" && /* @__PURE__ */ jsx(Text, {
|
|
8656
8985
|
className: "font-body font-medium text-xs",
|
|
8657
8986
|
color: "negative",
|
|
8658
8987
|
children: openseaDecimalError
|
|
@@ -8665,7 +8994,7 @@ function PriceInput({ chainId, collectionAddress, price, onPriceChange, onCurren
|
|
|
8665
8994
|
//#region src/react/ui/modals/_internal/helpers/currency.ts
|
|
8666
8995
|
function filterCurrenciesForOrderbook(currencies, orderbookKind, chainId, side) {
|
|
8667
8996
|
if (!currencies || currencies.length === 0) return [];
|
|
8668
|
-
if (orderbookKind
|
|
8997
|
+
if (isOpenSeaOrderbook(orderbookKind)) {
|
|
8669
8998
|
const openseaCurrency = getOpenseaCurrencyForChain(chainId, side);
|
|
8670
8999
|
if (openseaCurrency) return currencies.filter((currency) => compareAddress(currency.contractAddress, openseaCurrency.address));
|
|
8671
9000
|
}
|
|
@@ -8674,7 +9003,7 @@ function filterCurrenciesForOrderbook(currencies, orderbookKind, chainId, side)
|
|
|
8674
9003
|
function getDefaultCurrency(currencies, orderbookKind, modalType) {
|
|
8675
9004
|
if (currencies.length === 0) return null;
|
|
8676
9005
|
if (modalType === "listing") return currencies[0];
|
|
8677
|
-
return orderbookKind !== OrderbookKind.sequence_marketplace_v2 && currencies.length > 1 ? currencies[1] : currencies[0];
|
|
9006
|
+
return normalizeOrderbookKind(orderbookKind) !== OrderbookKind.sequence_marketplace_v2 && currencies.length > 1 ? currencies[1] : currencies[0];
|
|
8678
9007
|
}
|
|
8679
9008
|
|
|
8680
9009
|
//#endregion
|
|
@@ -8800,7 +9129,7 @@ const createListingModalStore = createStore({
|
|
|
8800
9129
|
const useCreateListingModalState = () => {
|
|
8801
9130
|
const { isOpen, tokenId, collectionAddress, chainId, priceInput, currencyAddress, quantityInput, expiryDays, isPriceTouched, isQuantityTouched } = useSelector(createListingModalStore, (state) => state.context);
|
|
8802
9131
|
const { data: marketplaceConfig } = useMarketplaceConfig();
|
|
8803
|
-
const orderbookKind = marketplaceConfig?.market.collections
|
|
9132
|
+
const orderbookKind = findMarketCollection(marketplaceConfig?.market.collections ?? [], collectionAddress, chainId)?.destinationMarketplace;
|
|
8804
9133
|
const closeModal = () => createListingModalStore.send({ type: "close" });
|
|
8805
9134
|
const updatePriceInput = (value) => createListingModalStore.send({
|
|
8806
9135
|
type: "updatePrice",
|
|
@@ -8845,7 +9174,7 @@ const useCreateListingModalState = () => {
|
|
|
8845
9174
|
//#endregion
|
|
8846
9175
|
//#region src/react/ui/modals/CreateListingModal/internal/listing-mutations.ts
|
|
8847
9176
|
const useListingMutations = ({ chainId, collectionAddress, contractType, orderbookKind, listing, currencyDecimals, nftApprovalEnabled = true }) => {
|
|
8848
|
-
const sdkConfig = useConfig();
|
|
9177
|
+
const sdkConfig = useConfig$1();
|
|
8849
9178
|
const { address: ownerAddress } = useAccount();
|
|
8850
9179
|
const publicClient = usePublicClient();
|
|
8851
9180
|
const { show: showTxModal } = useTransactionStatusModal();
|
|
@@ -8977,7 +9306,7 @@ const useListingMutations = ({ chainId, collectionAddress, contractType, orderbo
|
|
|
8977
9306
|
function useCreateListingModalContext() {
|
|
8978
9307
|
const state = useCreateListingModalState();
|
|
8979
9308
|
const { address } = useAccount();
|
|
8980
|
-
const config = useConfig();
|
|
9309
|
+
const config = useConfig$1();
|
|
8981
9310
|
const collectionQuery = useCollectionMetadata({
|
|
8982
9311
|
chainId: state.chainId,
|
|
8983
9312
|
collectionAddress: state.collectionAddress
|
|
@@ -9337,7 +9666,7 @@ const Modal$3 = () => {
|
|
|
9337
9666
|
|
|
9338
9667
|
//#endregion
|
|
9339
9668
|
//#region src/react/ui/modals/MakeOfferModal/internal/helpers/validation.ts
|
|
9340
|
-
function validateOfferForm({ price, quantity, balance, lowestListing, orderbookKind }) {
|
|
9669
|
+
function validateOfferForm({ price, quantity, balance, lowestListing, orderbookKind, usdAmount }) {
|
|
9341
9670
|
const validation = {
|
|
9342
9671
|
price: {
|
|
9343
9672
|
isValid: true,
|
|
@@ -9371,10 +9700,17 @@ function validateOfferForm({ price, quantity, balance, lowestListing, orderbookK
|
|
|
9371
9700
|
error: meetsMinimum ? null : "Offer must be higher than lowest listing for OpenSea"
|
|
9372
9701
|
};
|
|
9373
9702
|
}
|
|
9703
|
+
if (orderbookKind === "opensea" && usdAmount !== void 0) {
|
|
9704
|
+
const meetsMinPrice = usdAmount >= .01;
|
|
9705
|
+
validation.openseaMinPrice = {
|
|
9706
|
+
isValid: meetsMinPrice,
|
|
9707
|
+
error: meetsMinPrice ? null : "Lowest price must be at least $0.01"
|
|
9708
|
+
};
|
|
9709
|
+
}
|
|
9374
9710
|
return validation;
|
|
9375
9711
|
}
|
|
9376
9712
|
function isFormValid(validation) {
|
|
9377
|
-
return validation.price.isValid && validation.quantity.isValid && validation.balance.isValid && (validation.openseaCriteria?.isValid ?? true);
|
|
9713
|
+
return validation.price.isValid && validation.quantity.isValid && validation.balance.isValid && (validation.openseaCriteria?.isValid ?? true) && (validation.openseaMinPrice?.isValid ?? true);
|
|
9378
9714
|
}
|
|
9379
9715
|
|
|
9380
9716
|
//#endregion
|
|
@@ -9440,7 +9776,7 @@ const makeOfferModalStore = createStore({
|
|
|
9440
9776
|
const useMakeOfferModalState = () => {
|
|
9441
9777
|
const { isOpen, tokenId, collectionAddress, chainId, priceInput, currencyAddress, quantityInput, expiryDays, isPriceTouched, isQuantityTouched } = useSelector(makeOfferModalStore, (state) => state.context);
|
|
9442
9778
|
const { data: marketplaceConfig } = useMarketplaceConfig();
|
|
9443
|
-
const orderbookKind = marketplaceConfig?.market.collections
|
|
9779
|
+
const orderbookKind = findMarketCollection(marketplaceConfig?.market.collections ?? [], collectionAddress, chainId)?.destinationMarketplace;
|
|
9444
9780
|
const closeModal = () => makeOfferModalStore.send({ type: "close" });
|
|
9445
9781
|
const updatePriceInput = (value) => makeOfferModalStore.send({
|
|
9446
9782
|
type: "updatePrice",
|
|
@@ -9485,7 +9821,7 @@ const useMakeOfferModalState = () => {
|
|
|
9485
9821
|
//#endregion
|
|
9486
9822
|
//#region src/react/ui/modals/MakeOfferModal/internal/offer-mutations.ts
|
|
9487
9823
|
const useOfferMutations = ({ chainId, collectionAddress, contractType, orderbookKind, offer, currencyDecimals, needsApproval }) => {
|
|
9488
|
-
const sdkConfig = useConfig();
|
|
9824
|
+
const sdkConfig = useConfig$1();
|
|
9489
9825
|
const { address: makerAddress } = useAccount();
|
|
9490
9826
|
const { show: showTxModal } = useTransactionStatusModal();
|
|
9491
9827
|
const analytics = useAnalytics();
|
|
@@ -9610,7 +9946,7 @@ const useOfferMutations = ({ chainId, collectionAddress, contractType, orderbook
|
|
|
9610
9946
|
function useMakeOfferModalContext() {
|
|
9611
9947
|
const state = useMakeOfferModalState();
|
|
9612
9948
|
const { address } = useAccount();
|
|
9613
|
-
const config = useConfig();
|
|
9949
|
+
const config = useConfig$1();
|
|
9614
9950
|
const collectibleQuery = useCollectibleMetadata({
|
|
9615
9951
|
chainId: state.chainId,
|
|
9616
9952
|
collectionAddress: state.collectionAddress,
|
|
@@ -9653,6 +9989,12 @@ function useMakeOfferModalContext() {
|
|
|
9653
9989
|
userAddress: address,
|
|
9654
9990
|
query: { enabled: !!selectedCurrency?.contractAddress && !!address }
|
|
9655
9991
|
});
|
|
9992
|
+
const { data: usdConversion } = useCurrencyConvertToUSD({
|
|
9993
|
+
chainId: state.chainId,
|
|
9994
|
+
currencyAddress: selectedCurrency?.contractAddress ?? zeroAddress,
|
|
9995
|
+
amountRaw: state.priceInput?.toString(),
|
|
9996
|
+
query: { enabled: isOpenSeaOrderbook(state.orderbookKind) && !!selectedCurrency?.contractAddress && !!state.priceInput }
|
|
9997
|
+
});
|
|
9656
9998
|
const expiryDate = useMemo(() => new Date(Date.now() + state.expiryDays * 24 * 60 * 60 * 1e3), [state.expiryDays]);
|
|
9657
9999
|
const priceDnum = [state.priceInput ? BigInt(state.priceInput) : 0n, selectedCurrency?.decimals ?? 0];
|
|
9658
10000
|
const priceRaw = priceDnum[0];
|
|
@@ -9663,7 +10005,8 @@ function useMakeOfferModalContext() {
|
|
|
9663
10005
|
quantity: quantityDnum,
|
|
9664
10006
|
balance: currencyBalanceQuery.data?.value !== void 0 && selectedCurrency?.decimals ? [currencyBalanceQuery.data.value, selectedCurrency.decimals] : void 0,
|
|
9665
10007
|
lowestListing: lowestListingQuery.data?.priceAmount && selectedCurrency?.decimals ? [BigInt(lowestListingQuery.data.priceAmount), selectedCurrency.decimals] : void 0,
|
|
9666
|
-
orderbookKind: state.orderbookKind
|
|
10008
|
+
orderbookKind: state.orderbookKind,
|
|
10009
|
+
usdAmount: usdConversion?.usdAmount
|
|
9667
10010
|
});
|
|
9668
10011
|
const formIsValid = isFormValid(validation);
|
|
9669
10012
|
const spenderAddress = getConduitAddressForOrderbook(state.orderbookKind);
|
|
@@ -9816,13 +10159,15 @@ function useMakeOfferModalContext() {
|
|
|
9816
10159
|
price: validation.price,
|
|
9817
10160
|
quantity: validation.quantity,
|
|
9818
10161
|
balance: validation.balance,
|
|
9819
|
-
openseaCriteria: validation.openseaCriteria
|
|
10162
|
+
openseaCriteria: validation.openseaCriteria,
|
|
10163
|
+
openseaMinPrice: validation.openseaMinPrice
|
|
9820
10164
|
},
|
|
9821
10165
|
errors: {
|
|
9822
10166
|
price: state.isPriceTouched ? validation.price.error : void 0,
|
|
9823
10167
|
quantity: state.isQuantityTouched ? validation.quantity.error : void 0,
|
|
9824
10168
|
balance: state.isPriceTouched ? validation.balance.error : void 0,
|
|
9825
|
-
openseaCriteria: state.isPriceTouched ? validation.openseaCriteria?.error : void 0
|
|
10169
|
+
openseaCriteria: state.isPriceTouched ? validation.openseaCriteria?.error : void 0,
|
|
10170
|
+
openseaMinPrice: state.isPriceTouched ? validation.openseaMinPrice?.error : void 0
|
|
9826
10171
|
}
|
|
9827
10172
|
},
|
|
9828
10173
|
currencies: {
|
|
@@ -9852,7 +10197,7 @@ function useMakeOfferModalContext() {
|
|
|
9852
10197
|
},
|
|
9853
10198
|
get formError() {
|
|
9854
10199
|
if (!this.currencies.isConfigured) return "No ERC-20 currencies are configured for this marketplace";
|
|
9855
|
-
return this.form.errors.price || this.form.errors.quantity || this.form.errors.balance || this.form.errors.openseaCriteria;
|
|
10200
|
+
return this.form.errors.price || this.form.errors.quantity || this.form.errors.balance || this.form.errors.openseaCriteria || this.form.errors.openseaMinPrice;
|
|
9856
10201
|
},
|
|
9857
10202
|
get actions() {
|
|
9858
10203
|
const needsApprovalAction = this.steps.approval && this.steps.approval.status !== "success" && priceRaw > 0n;
|
|
@@ -10113,7 +10458,7 @@ function useTransferModalContext() {
|
|
|
10113
10458
|
const state = useTransferModalState();
|
|
10114
10459
|
const { closeModal } = state;
|
|
10115
10460
|
const { address } = useAccount();
|
|
10116
|
-
const config = useConfig();
|
|
10461
|
+
const config = useConfig$1();
|
|
10117
10462
|
const { isWaaS } = useConnectorMetadata();
|
|
10118
10463
|
const { show: showTransactionStatusModal } = useTransactionStatusModal();
|
|
10119
10464
|
const collectionQuery = useCollectionMetadata({
|
|
@@ -12269,6 +12614,17 @@ const styles = String.raw`/* Modified Tailwind CSS, to avoid issues with shadow
|
|
|
12269
12614
|
--tw-tracking: var(--tracking-normal);
|
|
12270
12615
|
letter-spacing: var(--tracking-normal);
|
|
12271
12616
|
}
|
|
12617
|
+
.text-small {
|
|
12618
|
+
font-family: "Inter", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
12619
|
+
font-size: var(--text-xs);
|
|
12620
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
12621
|
+
--tw-leading: calc(var(--spacing) * 4);
|
|
12622
|
+
line-height: calc(var(--spacing) * 4);
|
|
12623
|
+
--tw-font-weight: var(--font-weight-medium);
|
|
12624
|
+
font-weight: var(--font-weight-medium);
|
|
12625
|
+
--tw-tracking: var(--tracking-wide);
|
|
12626
|
+
letter-spacing: var(--tracking-wide);
|
|
12627
|
+
}
|
|
12272
12628
|
.font-body {
|
|
12273
12629
|
font-family: "Inter", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
12274
12630
|
}
|
|
@@ -12730,6 +13086,10 @@ const styles = String.raw`/* Modified Tailwind CSS, to avoid issues with shadow
|
|
|
12730
13086
|
--tw-duration: 100ms;
|
|
12731
13087
|
transition-duration: 100ms;
|
|
12732
13088
|
}
|
|
13089
|
+
.duration-150 {
|
|
13090
|
+
--tw-duration: 150ms;
|
|
13091
|
+
transition-duration: 150ms;
|
|
13092
|
+
}
|
|
12733
13093
|
.duration-200 {
|
|
12734
13094
|
--tw-duration: 200ms;
|
|
12735
13095
|
transition-duration: 200ms;
|
|
@@ -15572,7 +15932,7 @@ const ShadowRoot = (props) => {
|
|
|
15572
15932
|
//#endregion
|
|
15573
15933
|
//#region src/react/providers/modal-provider.tsx
|
|
15574
15934
|
const ModalProvider = ({ children }) => {
|
|
15575
|
-
const { shadowDom, experimentalShadowDomCssOverride } = useConfig();
|
|
15935
|
+
const { shadowDom, experimentalShadowDomCssOverride } = useConfig$1();
|
|
15576
15936
|
return /* @__PURE__ */ jsxs(Fragment, { children: [children, /* @__PURE__ */ jsx(SequenceCheckoutProvider, { children: /* @__PURE__ */ jsxs(ShadowRoot, {
|
|
15577
15937
|
enabled: shadowDom ?? true,
|
|
15578
15938
|
customCSS: experimentalShadowDomCssOverride,
|
|
@@ -16220,5 +16580,5 @@ function CollectibleCard(props) {
|
|
|
16220
16580
|
}
|
|
16221
16581
|
|
|
16222
16582
|
//#endregion
|
|
16223
|
-
export { useMarketCardDataPaged as $, useCollectibleBalance as $t, useOrderSteps as A, useCollectionMarketItems as At, generateCancelTransaction as B, usePrimarySaleItems as Bt, useBuyModalContext as C, useCollectionActiveOffersCurrencies as Ct, useGetReceiptFromHash as D, useCollectionMetadata as Dt, useRoyalty as E, collectionActiveListingsCurrenciesQueryOptions as Et, generateListingTransaction as F, useCollectionList as Ft, useTransactionType as G, useCollectibleMarketLowestListing as Gt, useEnsureCorrectChain as H, useCollectibleMetadata as Ht, useGenerateListingTransaction as I, useMarketplaceConfig as It, useOpenConnectModal$1 as J, useCollectibleMarketListPaginated as Jt, usePrimarySaleTransactionSteps as K, useCollectibleMarketListingsCount as Kt, useCancelOrder as L, useCollectionBalanceDetails as Lt, useGenerateSellTransaction as M, useCollectionMarketFilteredCount as Mt, generateOfferTransaction as N, collectionMarketDetailPollingOptions as Nt, useTransferTokens as O, useCollectionMarketItemsPaginated as Ot, useGenerateOfferTransaction as P, useCollectionMarketDetailPolling as Pt, usePrimarySale721CardData as Q, useErc721SaleDetails as Qt, useCancelTransactionSteps as R, useCollectibleTokenBalances as Rt, ErrorBoundary as S, useCurrencyComparePrices as St, royaltyQueryOptions as T, useCollectionActiveListingsCurrencies as Tt, useAutoSelectFeeOption as U, useCollectibleMarketOffersCount as Ut, useGenerateCancelTransaction as V, usePrimarySaleItem as Vt, useBuyTransaction as W, useCollectibleMarketOffers as Wt, useFiltersProgressive as X, useCollectibleMarketHighestOffer as Xt, useFilters as Y, useCollectibleMarketList as Yt, usePrimarySale1155CardData as Z, useCollectibleMarketCount as Zt, PriceInput as _, useTokenBalances as _t, MarketCard as a, DatabeatAnalytics as an, ActionModal as at, LoadingModal as b, useCurrency as bt, useCreateListingModal as c, useSellModal as ct, TransferModal as d, useConnectorMetadata as dt, usePrimarySaleCheckoutOptions as en, useMarketCardData as et, useTransferModalContext as f, transactionPreview_default as ft, useCreateListingModalContext as g, useTokenCurrencyBalance as gt, CreateListingModal as h, useTokenMetadata as ht, NonTradableInventoryCard as i, MarketplaceSdkContext as in, selectWaasFeeOptions_default as it, generateSellTransaction as j, useCollectionMarketFloor as jt, useTransactionExecution as k, useCollectionMarketItemsCount as kt, useMakeOfferModal as l, transactionStatusModal_default as lt, useMakeOfferModalContext as m, useTokenMetadataSearch as mt, ShopCard as n, MarketplaceProvider as nn, TransactionDetails as nt, MarketCardPresentation as o, useAnalytics as on, BaseModal as ot, useTransferModal as p, useTokenRanges as pt, useMarketTransactionSteps as q, useCollectibleMarketListings as qt, ShopCardPresentation as r, MarketplaceQueryClientProvider as rn, TokenPreview as rt, ActionButton as s, useSellModalContext as st, CollectibleCard as t, useConfig as tn, SellModal as tt, ModalProvider as u, useTransactionStatusModal as ut, currencyOptionsSelect_default as v, useInventory as vt, useBuyModal as w, collectionActiveOffersCurrenciesQueryOptions as wt, ErrorModal as x, useCurrencyConvertToUSD as xt, FloorPriceText as y, useCurrencyList as yt, useProcessStep as z, usePrimarySaleItemsCount as zt };
|
|
16583
|
+
export { useMarketCardDataPaged as $, useCollectibleBalance as $t, useOrderSteps as A, useCollectionMarketItems as At, generateCancelTransaction as B, usePrimarySaleItems as Bt, useBuyModalContext as C, useCollectionActiveOffersCurrencies as Ct, useGetReceiptFromHash as D, useCollectionMetadata as Dt, useRoyalty as E, collectionActiveListingsCurrenciesQueryOptions as Et, generateListingTransaction as F, useCollectionList as Ft, useTransactionType as G, useCollectibleMarketLowestListing as Gt, useEnsureCorrectChain as H, useCollectibleMetadata as Ht, useGenerateListingTransaction as I, useMarketplaceConfig as It, useOpenConnectModal$1 as J, useCollectibleMarketListPaginated as Jt, usePrimarySaleTransactionSteps as K, useCollectibleMarketListingsCount as Kt, useCancelOrder as L, useCollectionBalanceDetails as Lt, useGenerateSellTransaction as M, useCollectionMarketFilteredCount as Mt, generateOfferTransaction as N, collectionMarketDetailPollingOptions as Nt, useTransferTokens as O, useCollectionMarketItemsPaginated as Ot, useGenerateOfferTransaction as P, useCollectionMarketDetailPolling as Pt, usePrimarySale721CardData as Q, useErc721SaleDetails as Qt, useCancelTransactionSteps as R, useCollectibleTokenBalances as Rt, ErrorBoundary as S, useCurrencyComparePrices as St, royaltyQueryOptions as T, useCollectionActiveListingsCurrencies as Tt, useAutoSelectFeeOption as U, useCollectibleMarketOffersCount as Ut, useGenerateCancelTransaction as V, usePrimarySaleItem as Vt, useBuyTransaction as W, useCollectibleMarketOffers as Wt, useFiltersProgressive as X, useCollectibleMarketHighestOffer as Xt, useFilters as Y, useCollectibleMarketList as Yt, usePrimarySale1155CardData as Z, useCollectibleMarketCount as Zt, PriceInput as _, useTokenBalances as _t, MarketCard as a, DatabeatAnalytics as an, ActionModal as at, LoadingModal as b, useCurrency as bt, useCreateListingModal as c, useSellModal as ct, TransferModal as d, useConnectorMetadata as dt, usePrimarySaleCheckoutOptions as en, useMarketCardData as et, useTransferModalContext as f, transactionPreview_default as ft, useCreateListingModalContext as g, useTokenCurrencyBalance as gt, CreateListingModal as h, useTokenMetadata as ht, NonTradableInventoryCard as i, MarketplaceSdkContext as in, selectWaasFeeOptions_default as it, generateSellTransaction as j, useCollectionMarketFloor as jt, useTransactionExecution as k, useCollectionMarketItemsCount as kt, useMakeOfferModal as l, transactionStatusModal_default as lt, useMakeOfferModalContext as m, useTokenMetadataSearch as mt, ShopCard as n, MarketplaceProvider as nn, TransactionDetails as nt, MarketCardPresentation as o, useAnalytics as on, BaseModal as ot, useTransferModal as p, useTokenRanges as pt, useMarketTransactionSteps as q, useCollectibleMarketListings as qt, ShopCardPresentation as r, MarketplaceQueryClientProvider as rn, TokenPreview as rt, ActionButton as s, useSellModalContext as st, CollectibleCard as t, useConfig$1 as tn, SellModal as tt, ModalProvider as u, useTransactionStatusModal as ut, currencyOptionsSelect_default as v, useInventory as vt, useBuyModal as w, collectionActiveOffersCurrenciesQueryOptions as wt, ErrorModal as x, useCurrencyConvertToUSD as xt, FloorPriceText as y, useCurrencyList as yt, useProcessStep as z, usePrimarySaleItemsCount as zt };
|
|
16224
16584
|
//# sourceMappingURL=react.js.map
|