@0xsequence/marketplace-sdk 1.2.1 → 2.0.0

package/src/react/_internal/query-builder.ts

@@ -0,0 +1,203 @@
+import {
+	infiniteQueryOptions,
+	type QueryKey,
+	queryOptions,
+} from '@tanstack/react-query';
+import type { Page, SdkConfig } from '../../types';
+import type {
+	StandardInfiniteQueryOptions,
+	StandardQueryOptions,
+} from '../types/query';
+
+export type BaseQueryParams = {
+	config: SdkConfig;
+	query?: StandardQueryOptions;
+};
+
+export type BaseInfiniteQueryParams = {
+	config: SdkConfig;
+	query?: StandardInfiniteQueryOptions;
+};
+
+export type RequiredKeys<T> = {
+	// eslint-disable-next-line @typescript-eslint/no-empty-object-type
+	[K in keyof T]-?: {} extends Pick<T, K> ? never : K;
+}[keyof T];
+
+/**
+ * Validates that a readonly tuple contains ALL required keys from a type
+ * This ensures developers don't forget to list any required parameters
+ *
+ * How it works:
+ * - Checks if every RequiredKey<TParams> exists in the provided tuple
+ * - Returns the tuple type if valid, or 'never' if keys are missing
+ * - Must be used with 'as const' for proper type inference
+ *
+ * Example:
+ * type Keys = RequiredKeys<{a: string, b: number, c?: boolean}>; // 'a' | 'b'
+ * type Valid = EnsureAllRequiredKeys<Params, ['a', 'b']>; // ✅ OK - returns ['a', 'b']
+ * type Invalid = EnsureAllRequiredKeys<Params, ['a']>; // ❌ Error - returns 'never'
+ */
+export type EnsureAllRequiredKeys<
+	TParams,
+	TKeys extends ReadonlyArray<RequiredKeys<TParams>>,
+> = RequiredKeys<TParams> extends TKeys[number] ? TKeys : never;
+
+export type QueryBuilderConfig<TParams extends BaseQueryParams, TData> = {
+	getQueryKey: (params: WithOptionalParams<TParams>) => QueryKey;
+	/**
+	 * Type-safe: Must include ALL required keys from TParams
+	 * Example: ['chainId', 'collectionAddress', 'tokenId', 'config']
+	 */
+	requiredParams: EnsureAllRequiredKeys<
+		TParams,
+		ReadonlyArray<RequiredKeys<TParams>>
+	>;
+	fetcher: (params: TParams) => Promise<TData>;
+	/**
+	 * Optional custom validation beyond truthiness checks
+	 * Example: (params) => (params.orders?.length ?? 0) > 0
+	 */
+	customValidation?: (params: WithOptionalParams<TParams>) => boolean;
+};
+
+export type InfiniteQueryBuilderConfig<
+	TParams extends BaseInfiniteQueryParams,
+	TResponse,
+> = {
+	getQueryKey: (params: WithOptionalInfiniteParams<TParams>) => QueryKey;
+	/**
+	 * Type-safe: Must include ALL required keys from TParams
+	 * Example: ['chainId', 'collectionAddress', 'side', 'config']
+	 */
+	requiredParams: EnsureAllRequiredKeys<
+		TParams,
+		ReadonlyArray<RequiredKeys<TParams>>
+	>;
+	fetcher: (params: TParams, page: Page) => Promise<TResponse>;
+	getPageInfo: (response: TResponse) => Page | undefined;
+	/**
+	 * Optional custom validation beyond truthiness checks
+	 * Example: (params) => (params.orders?.length ?? 0) > 0
+	 */
+	customValidation?: (params: WithOptionalInfiniteParams<TParams>) => boolean;
+};
+
+export type WithOptionalParams<T extends BaseQueryParams> = {
+	[K in keyof T]?: T[K];
+} & Pick<T, 'config'> &
+	Partial<Pick<T, 'query'>>;
+
+export type WithOptionalInfiniteParams<T extends BaseInfiniteQueryParams> = {
+	[K in keyof T]?: T[K];
+} & Pick<T, 'config'> &
+	Partial<Pick<T, 'query'>>;
+
+export function requiredParamsFor<TParams>() {
+	return <const TKeys extends ReadonlyArray<RequiredKeys<TParams>>>(
+		keys: TKeys & (RequiredKeys<TParams> extends TKeys[number] ? TKeys : never),
+	): TKeys => keys;
+}
+
+/**
+ * Type Safety:
+ * - requiredParams must include ALL required fields from TParams
+ * - TypeScript validates this at compile time
+ */
+export function buildQueryOptions<
+	TParams extends BaseQueryParams,
+	TData,
+	const TKeys extends ReadonlyArray<RequiredKeys<TParams>>,
+>(
+	config: {
+		getQueryKey: (params: WithOptionalParams<TParams>) => QueryKey;
+		requiredParams: TKeys &
+			(RequiredKeys<TParams> extends TKeys[number] ? TKeys : never);
+		fetcher: (params: TParams) => Promise<TData>;
+		customValidation?: (params: WithOptionalParams<TParams>) => boolean;
+	},
+	params: WithOptionalParams<TParams>,
+) {
+	// Check if all required params are present
+	const requiredParamsValid = config.requiredParams.every(
+		(key) => key in params && params[key] !== undefined,
+	);
+
+	// Run custom validation if provided
+	const customValid = config.customValidation
+		? config.customValidation(params)
+		: true;
+
+	const enabled = Boolean(
+		requiredParamsValid &&
+			customValid &&
+			params.config &&
+			(params.query?.enabled ?? true),
+	);
+
+	return queryOptions({
+		queryKey: config.getQueryKey(params),
+		queryFn: () => {
+			// TypeScript knows params are valid here because enabled=true only if all required params exist
+			return config.fetcher(params as TParams);
+		},
+		...params.query,
+		enabled,
+	});
+}
+
+/**
+ * Type Safety:
+ * - requiredParams must include ALL required fields from TParams
+ * - TypeScript validates this at compile time
+ */
+export function buildInfiniteQueryOptions<
+	TParams extends BaseInfiniteQueryParams,
+	TResponse,
+	const TKeys extends ReadonlyArray<RequiredKeys<TParams>>,
+>(
+	config: {
+		getQueryKey: (params: WithOptionalInfiniteParams<TParams>) => QueryKey;
+		requiredParams: TKeys &
+			(RequiredKeys<TParams> extends TKeys[number] ? TKeys : never);
+		fetcher: (params: TParams, page: Page) => Promise<TResponse>;
+		getPageInfo: (response: TResponse) => Page | undefined;
+		customValidation?: (params: WithOptionalInfiniteParams<TParams>) => boolean;
+	},
+	params: WithOptionalInfiniteParams<TParams>,
+) {
+	// Check if all required params are present
+	const requiredParamsValid = config.requiredParams.every(
+		(key) => key in params && params[key] !== undefined,
+	);
+
+	// Run custom validation if provided
+	const customValid = config.customValidation
+		? config.customValidation(params)
+		: true;
+
+	const enabled = Boolean(
+		requiredParamsValid &&
+			customValid &&
+			params.config &&
+			(params.query?.enabled ?? true),
+	);
+
+	return infiniteQueryOptions({
+		queryKey: config.getQueryKey(params),
+		queryFn: async ({ pageParam }) => {
+			return config.fetcher(params as TParams, pageParam);
+		},
+		initialPageParam: { page: 1, pageSize: 30 } as Page,
+		getNextPageParam: (lastPage) => {
+			const pageInfo = config.getPageInfo(lastPage);
+			if (!pageInfo?.more) return undefined;
+			return {
+				...pageInfo,
+				page: pageInfo.page + 1,
+			};
+		},
+		...params.query,
+		enabled,
+	});
+}

package/src/react/_internal/types.ts

@@ -1,14 +1,30 @@
-import type { ContractType, CreateReq } from '../../types';
-import type { MarketplaceKind } from './api';
-
-export interface QueryArg {
+import type {
+	ContractType,
+	CreateReq,
+	MarketplaceKind,
+} from '@0xsequence/api-client';
+import type { Hex } from 'viem';
+import type { SdkConfig } from '../../types';
+import type {
+	StandardInfiniteQueryOptions,
+	StandardQueryOptions,
+} from '../types/query';
+import type { RequiredKeys } from './query-builder';
+
+export type QueryArg = {
 	enabled?: boolean;
-}
+};
 
 export type CollectableId = string | number;
 
 export type CollectionType = ContractType.ERC1155 | ContractType.ERC721;
 
+export type Transaction = {
+	to: Hex;
+	data?: Hex;
+	value?: bigint;
+};
+
 type TransactionStep = {
 	exist: boolean;
 	isExecuting: boolean;
@@ -29,44 +45,47 @@ export enum TransactionType {
 	CANCEL = 'CANCEL',
 }
 
-export interface BuyInput {
+export type BuyInput = {
 	orderId: string;
-	collectableDecimals: number;
 	marketplace: MarketplaceKind;
 	quantity: string;
-}
+};
 
-export interface SellInput {
+export type SellInput = {
 	orderId: string;
 	marketplace: MarketplaceKind;
 	quantity?: string;
-}
+};
 
-export interface ListingInput {
+export type ListingInput = {
 	contractType: ContractType;
 	listing: CreateReq;
-}
+};
 
-export interface OfferInput {
+export type OfferInput = {
 	contractType: ContractType;
 	offer: CreateReq;
-}
+};
 
-export interface CancelInput {
+export type CancelInput = {
 	orderId: string;
 	marketplace: MarketplaceKind;
-}
+};
 
 export type ValuesOptional<T> = {
 	[K in keyof T]: T[K] | undefined;
 };
 
-export type RequiredKeys<T> = {
+/**
+ * Makes all properties in T required (removes optionality)
+ * Note: Different from RequiredKeys in query-builder.ts which extracts required key names
+ */
+export type AllRequired<T> = {
 	[K in keyof T]-?: T[K];
 };
 
 export type QueryKeyArgs<T> = {
-	[K in keyof Required<T>]: T[K] | undefined;
+	[K in keyof AllRequired<T>]: T[K] | undefined;
 };
 
 export type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
@@ -76,3 +95,54 @@ export type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
  * Converts optional properties (prop?: T) to explicit union types (prop: T | undefined)
  */
 export type ApiArgs<T> = ValuesOptional<Omit<T, 'config' | 'query'>>;
+
+/**
+ * Wraps API request types with SDK-specific requirements
+ * - Adds config and query fields
+ * - Makes all fields optional including config (hooks use useConfig() as default)
+ * - Works with standard queries
+ */
+export type SdkQueryParams<TApiRequest, TQuery = StandardQueryOptions> = {
+	[K in keyof TApiRequest]?: TApiRequest[K];
+} & {
+	config?: SdkConfig;
+	query?: TQuery;
+};
+
+/**
+ * Wraps API request types with SDK-specific requirements for infinite queries
+ * - Adds config and query fields
+ * - Makes all fields optional including config (hooks use useConfig() as default)
+ */
+export type SdkInfiniteQueryParams<TApiRequest> = SdkQueryParams<
+	TApiRequest,
+	StandardInfiniteQueryOptions
+>;
+
+/**
+ * Makes specified keys required in an object type
+ * Used in fetchers to ensure required params exist
+ */
+export type WithRequired<T, K extends keyof T = keyof T> = T & {
+	[P in K]-?: T[P];
+};
+
+/**
+ * Creates hook params from API request types:
+ * - Required API fields → key required, value can be undefined
+ * - Optional API fields → key optional (key doesn't need to exist)
+ * - SDK fields (config, query) → key optional
+ */
+export type HookParamsFromApiRequest<
+	TApiRequest,
+	TSdkParams extends Record<string, unknown> = Record<string, never>,
+> = {
+	// Required API fields: key required, value can be undefined
+	[K in RequiredKeys<TApiRequest>]: TApiRequest[K] | undefined;
+} & {
+	// Optional API fields: key optional (key doesn't need to exist)
+	[K in Exclude<keyof TApiRequest, RequiredKeys<TApiRequest>>]?: TApiRequest[K];
+} & {
+	// SDK fields: key optional
+	[K in keyof TSdkParams]?: TSdkParams[K];
+};

package/src/react/_internal/utils.ts

@@ -1,57 +1,39 @@
-import type { Address, Hex, TypedData, TypedDataDomain } from 'viem';
-import { type PostRequest, type Signature, type Step, StepType } from './api';
+export {
+	type ApprovalStep,
+	isSignatureStep,
+	isTransactionStep,
+	type SignatureStep,
+	type TransactionStep,
+} from '@0xsequence/api-client';
 
-export interface SignatureStep {
-	id: StepType.signEIP191 | StepType.signEIP712;
-	domain?: TypedDataDomain;
-	types?: TypedData;
-	primaryType?: string;
-	to: Address; // TODO: This should not be here, its wrongly typed in webrpc
-	data: string;
-	value: string;
-	price: string;
-	signature?: Signature;
-	post: PostRequest;
-}
+export const clamp = (val: number, min: number, max: number) =>
+	Math.max(min, Math.min(max, val));
 
-export interface TransactionStep {
-	id:
-		| StepType.tokenApproval
-		| StepType.buy
-		| StepType.sell
-		| StepType.cancel
-		| StepType.createOffer
-		| StepType.createListing;
-	data: Hex;
-	to: Address;
-	value: Hex;
-	price: Hex;
-	maxFeePerGas?: Hex;
-	maxPriorityFeePerGas?: Hex;
-	gas?: Hex;
-}
-export interface ApprovalStep {
-	id: StepType.tokenApproval;
-	data: string;
-	to: Address;
-	value: string;
-	price: string;
-}
+/**
+ * Recursively converts all bigint values to strings in an object
+ * This is needed for React Query keys which must be JSON-serializable
+ */
+export function serializeBigInts<T>(obj: T): T {
+	if (obj === null || obj === undefined) return obj;
 
-export function isSignatureStep(step: Step): step is SignatureStep {
-	return step.id === StepType.signEIP191 || step.id === StepType.signEIP712;
-}
+	if (typeof obj === 'bigint') {
+		return obj.toString() as T;
+	}
 
-export function isTransactionStep(step: Step): step is TransactionStep {
-	return [
-		StepType.tokenApproval,
-		StepType.buy,
-		StepType.sell,
-		StepType.cancel,
-		StepType.createOffer,
-		StepType.createListing,
-	].includes(step.id);
-}
+	if (Array.isArray(obj)) {
+		return obj.map(serializeBigInts) as T;
+	}
 
-export const clamp = (val: number, min: number, max: number) =>
-	Math.max(min, Math.min(max, val));
+	if (typeof obj === 'object') {
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Dynamic object reconstruction requires any
+		const result: any = {};
+		for (const key in obj) {
+			if (Object.hasOwn(obj, key)) {
+				result[key] = serializeBigInts(obj[key]);
+			}
+		}
+		return result as T;
+	}
+
+	return obj;
+}

package/src/react/_internal/wagmi/__tests__/create-config.test.ts

@@ -1,14 +1,17 @@
+import {
+	ContractType,
+	MarketplaceWalletType,
+	OrderbookKind,
+} from '@0xsequence/api-client';
 import { allNetworks } from '@0xsequence/network';
 import { polygon } from 'viem/chains';
 import { beforeEach, describe, expect, it } from 'vitest';
 import { type Config, cookieStorage } from 'wagmi';
-import type { SdkConfig } from '../../../../types';
-import { ContractType, OrderbookKind } from '../../../../types';
 import type {
 	MarketCollection,
 	MarketplaceConfig,
-} from '../../../../types/new-marketplace-types';
-import { MarketplaceWalletType } from '../../api/builder.gen';
+	SdkConfig,
+} from '../../../../types';
 import { createWagmiConfig } from '../create-config';
 
 describe('createWagmiConfig', () => {
@@ -41,6 +44,7 @@ describe('createWagmiConfig', () => {
 				logoUrl: '',
 				fontUrl: '',
 				accessKey: undefined,
+				isTrailsEnabled: true,
 			},
 			market: {
 				enabled: true,
@@ -49,8 +53,10 @@ describe('createWagmiConfig', () => {
 				private: false,
 				collections: [
 					{
+						id: 1,
+						projectId: 12345,
+						marketplaceCollectionType: 'market',
 						contractType: ContractType.ERC721,
-						cardType: 'market',
 						chainId: polygon.id,
 						bannerUrl: '',
 						itemsAddress: '0x1234567890123456789012345678901234567890',

package/src/react/_internal/wagmi/create-config.ts

@@ -1,8 +1,7 @@
 import { allNetworks, findNetworkConfig } from '@0xsequence/network';
 import type { Chain, Transport } from 'viem';
 import { cookieStorage, createConfig, createStorage, http } from 'wagmi';
-import type { Env, SdkConfig } from '../../../types/index';
-import type { MarketplaceConfig } from '../../../types/new-marketplace-types';
+import type { Env, MarketplaceConfig, SdkConfig } from '../../../types';
 import { networkToWagmiChain } from '../../../utils/networkconfigToWagmiChain';
 import { getConnectors } from './get-connectors';
 
@@ -22,6 +21,7 @@ export const createWagmiConfig = (
 		marketplaceConfig,
 		sdkConfig,
 		walletType,
+		ssr,
 	});
 
 	const multiInjectedProviderDiscovery =

package/src/react/_internal/wagmi/get-connectors.ts

@@ -1,3 +1,4 @@
+import { MarketplaceWalletType } from '@0xsequence/api-client';
 import {
 	apple,
 	appleWaas,
@@ -18,22 +19,22 @@ import {
 } from '@0xsequence/connect';
 import React, { type FunctionComponent } from 'react';
 import type { CreateConnectorFn } from 'wagmi';
-import type { Env, SdkConfig } from '../../../types/index';
-import type { MarketplaceConfig } from '../../../types/new-marketplace-types';
+import type { Env, MarketplaceConfig, SdkConfig } from '../../../types';
 import { MissingConfigError } from '../../../utils/_internal/error/transaction';
-import { MarketplaceWalletType } from '../api/builder.gen';
 import { DEFAULT_NETWORK } from '../consts';
 
 export function getConnectors({
 	marketplaceConfig,
 	sdkConfig,
 	walletType,
+	ssr,
 }: {
 	marketplaceConfig: MarketplaceConfig;
 	sdkConfig: SdkConfig;
 	walletType: MarketplaceWalletType;
+	ssr?: boolean;
 }): CreateConnectorFn[] {
-	const connectors = commonConnectors(marketplaceConfig, sdkConfig);
+	const connectors = commonConnectors(marketplaceConfig, sdkConfig, ssr);
 
 	if (walletType === MarketplaceWalletType.UNIVERSAL) {
 		connectors.push(...getUniversalWalletConfigs(sdkConfig, marketplaceConfig));
@@ -51,7 +52,8 @@ export function getConnectors({
 function commonConnectors(
 	marketplaceConfig: MarketplaceConfig,
 	sdkConfig: SdkConfig,
-) {
+	_ssr?: boolean,
+): Wallet[] {
 	const wallets: Wallet[] = [];
 	const { title: appName } = marketplaceConfig.settings;
 	const walletOptions = marketplaceConfig.settings.walletOptions;
@@ -65,9 +67,11 @@ function commonConnectors(
 		);
 	}
 
+	const isBrowser = typeof window !== 'undefined';
 	if (
 		walletConnectProjectId &&
-		walletOptions.connectors.includes('walletconnect')
+		walletOptions.connectors.includes('walletconnect') &&
+		isBrowser
 	) {
 		wallets.push(
 			walletConnect({

package/src/react/hooks/_deprecated/index.ts

@@ -0,0 +1,61 @@
+export {
+	usePrimarySaleCheckoutOptions as useCheckoutOptionsSalesContract,
+	usePrimarySaleCheckoutOptions as useShopCheckoutOptions,
+} from '../checkout';
+export type { UseCollectibleMetadataParams as UseCollectibleDetailParams } from '../collectible';
+export {
+	useCollectibleBalance as useBalanceOfCollectible,
+	useCollectibleMarketCount as useCountOfCollectables,
+	useCollectibleMarketHighestOffer as useHighestOffer,
+	useCollectibleMarketList as useListCollectibles,
+	useCollectibleMarketListings as useListListingsForCollectible,
+	useCollectibleMarketListingsCount as useCountListingsForCollectible,
+	useCollectibleMarketListPaginated as useListCollectiblesPaginated,
+	useCollectibleMarketLowestListing as useLowestListing,
+	useCollectibleMarketOffers as useListOffersForCollectible,
+	useCollectibleMarketOffersCount as useCountOffersForCollectible,
+	useCollectibleMetadata as useCollectible,
+	useCollectibleMetadata as useCollectibleDetail,
+	useCollectibleTokenBalances,
+	usePrimarySaleItems as useCollectiblePrimarySaleList,
+	usePrimarySaleItems as useListPrimarySaleItems,
+	usePrimarySaleItemsCount as useCollectiblePrimarySaleListCount,
+	usePrimarySaleItemsCount as useCountOfPrimarySaleItems,
+} from '../collectible';
+export type { UseCollectionMetadataParams as UseCollectionDetailParams } from '../collection';
+export {
+	useCollectionBalanceDetails,
+	useCollectionList as useListCollections,
+	useCollectionMarketDetailPolling as useCollectionDetailPolling,
+	useCollectionMarketDetailPolling as useCollectionDetailsPolling,
+	useCollectionMarketDetailPolling as useCollectionMarketCollectionDetailPolling,
+	useCollectionMarketFilteredCount as useGetCountOfFilteredOrders,
+	useCollectionMarketFloor as useFloorOrder,
+	useCollectionMarketItems as useListItemsOrdersForCollection,
+	useCollectionMarketItemsCount as useCountItemsOrdersForCollection,
+	useCollectionMarketItemsPaginated as useListItemsOrdersForCollectionPaginated,
+	useCollectionMetadata as useCollection,
+	useCollectionMetadata as useCollectionDetail,
+} from '../collection';
+export type { UseCurrencyParams as UseCurrencyDetailParams } from '../currency';
+export {
+	useCurrency,
+	useCurrency as useCurrencyDetail,
+	useCurrencyComparePrices as useComparePrices,
+	useCurrencyConvertToUSD as useConvertPriceToUSD,
+	useCurrencyList as useMarketCurrencies,
+} from '../currency';
+export { useInventory } from '../inventory';
+export {
+	useTokenBalances as useListBalances,
+	useTokenCurrencyBalance as useCurrencyBalance,
+	useTokenMetadata as useListTokenMetadata,
+	useTokenMetadataSearch as useSearchTokenMetadata,
+	useTokenRanges as useGetTokenRanges,
+} from '../token';
+export {
+	useMarketCardData as useListMarketCardData,
+	useMarketCardData as useMarketplaceListCardData,
+	usePrimarySale721CardData as useList721ShopCardData,
+	usePrimarySale1155CardData as useList1155ShopCardData,
+} from '../ui';

package/src/react/hooks/checkout/index.ts

@@ -0,0 +1 @@
+export * from './primary-sale-checkout-options';