@0xsequence/marketplace-sdk 0.3.2 → 0.3.4

package/src/react/_internal/transaction-machine/logger.ts

@@ -0,0 +1,66 @@
+export class TransactionLogger {
+	constructor(
+		private readonly context: string,
+		private readonly enabled: boolean = true,
+	) {}
+
+	private formatData(data: unknown): unknown {
+		if (data instanceof Error) {
+			return {
+				name: data.name,
+				message: data.message,
+				cause:
+					data.cause instanceof Error
+						? this.formatData(data.cause)
+						: data.cause,
+				stack: data.stack?.split('\n').slice(0, 3),
+			};
+		}
+
+		if (Array.isArray(data)) {
+			return data.map((item) => this.formatData(item));
+		}
+
+		if (typeof data === 'object' && data !== null) {
+			return Object.fromEntries(
+				Object.entries(data).map(([key, value]) => [
+					key,
+					this.formatData(value),
+				]),
+			);
+		}
+
+		return data;
+	}
+
+	private log(
+		level: 'debug' | 'error' | 'info',
+		message: string,
+		data?: unknown,
+	) {
+		if (!this.enabled) return;
+		console[level](
+			`[${this.context}] ${message}`,
+			data ? this.formatData(data) : '',
+		);
+	}
+
+	debug(message: string, data?: unknown) {
+		this.log('debug', message, data);
+	}
+
+	error(message: string, error: unknown) {
+		this.log('error', message, error);
+	}
+
+	info(message: string, data?: unknown) {
+		this.log('info', message, data);
+	}
+
+	state(from: string, to: string) {
+		this.info(`State transition: ${from} -> ${to}`);
+	}
+}
+
+export const createLogger = (context: string, enabled = true) =>
+	new TransactionLogger(context, enabled);

package/src/react/_internal/transaction-machine/useTransactionMachine.ts

@@ -2,10 +2,16 @@ import { useSelectPaymentModal } from '@0xsequence/kit-checkout';
 import type { Hash } from 'viem';
 import { useAccount, useSwitchChain, useWalletClient } from 'wagmi';
 import { getPublicRpcClient } from '../../../utils';
+import {
+	NoMarketplaceConfigError,
+	NoWalletConnectedError,
+	TransactionError,
+} from '../../../utils/_internal/error/transaction';
 import { useConfig, useMarketplaceConfig } from '../../hooks';
 import { useSwitchChainModal } from '../../ui/modals/_internal/components/switchChainModal';
 import { WalletKind } from '../api';
 import {
+	type Input,
 	type TransactionConfig,
 	TransactionMachine,
 } from './execute-transaction';
@@ -18,49 +24,93 @@ export type UseTransactionMachineConfig = Omit<
 export const useTransactionMachine = (
 	config: UseTransactionMachineConfig,
 	onSuccess?: (hash: Hash) => void,
-	onError?: (error: Error) => void,
+	onError?: (error: TransactionError) => void,
 	onTransactionSent?: (hash: Hash) => void,
 ) => {
-	const { data: walletClient } = useWalletClient();
+	const { data: walletClient, isLoading: walletClientIsLoading } =
+		useWalletClient();
 	const { show: showSwitchChainModal } = useSwitchChainModal();
 	const sdkConfig = useConfig();
-	const { data: marketplaceConfig, error: marketplaceError } =
-		useMarketplaceConfig();
+	const {
+		data: marketplaceConfig,
+		error: marketplaceError,
+		isLoading: marketplaceConfigIsLoading,
+	} = useMarketplaceConfig();
 	const { openSelectPaymentModal } = useSelectPaymentModal();
 	const { chains } = useSwitchChain();
 
-	const { connector } = useAccount();
+	const { connector, isConnected } = useAccount();
 	const walletKind =
 		connector?.id === 'sequence' ? WalletKind.sequence : WalletKind.unknown;
 
+	if (!isConnected) {
+		// No wallet connected, TODO: add some sort of state for this
+		return { machine: null, error: null, isLoading: false };
+	}
+
+	if (walletClientIsLoading || marketplaceConfigIsLoading) {
+		return { machine: null, error: null, isLoading: true };
+	}
+
 	if (marketplaceError) {
-		throw marketplaceError; //TODO: Add error handling
+		const error = new TransactionError('Marketplace config error', {
+			cause: marketplaceError,
+		});
+		onError?.(error);
+		return { machine: null, error };
 	}
 
-	if (!walletClient || !marketplaceConfig) return null;
+	if (!walletClient) {
+		const error = new NoWalletConnectedError();
+		onError?.(error);
+		return { machine: null, error };
+	}
 
-	return new TransactionMachine(
+	if (!marketplaceConfig) {
+		const error = new NoMarketplaceConfigError();
+		onError?.(error);
+		return { machine: null, error };
+	}
+
+	const machine = new TransactionMachine(
 		{
 			config: { sdkConfig, marketplaceConfig, walletKind, chains, ...config },
 			onSuccess,
-			onError,
 			onTransactionSent,
 		},
 		walletClient,
 		getPublicRpcClient(config.chainId),
 		openSelectPaymentModal,
-		async (chainId) => {
-			return new Promise<void>((resolve, reject) => {
+		async (chainId) =>
+			new Promise((resolve, reject) => {
 				showSwitchChainModal({
 					chainIdToSwitchTo: Number(chainId),
-					onSuccess: () => {
-						resolve();
-					},
-					onError: (error) => {
-						reject(error);
-					},
+					onSuccess: resolve,
+					onError: reject,
 				});
-			});
-		},
+			}),
 	);
+
+	return {
+		machine: {
+			getTransactionSteps: async (props: Input) => {
+				try {
+					return await machine.getTransactionSteps(props);
+				} catch (e) {
+					const error = e as TransactionError;
+					onError?.(error);
+				}
+			},
+			start: async (props: Input) => {
+				try {
+					await machine.start(props);
+				} catch (e) {
+					const error = e as TransactionError;
+					onError?.(error);
+				}
+			},
+		},
+		error: null,
+		isLoading: false,
+	};
 };

package/src/react/_internal/wagmi/embedded.ts

@@ -9,6 +9,7 @@ import {
 } from '@0xsequence/kit';
 import type { CreateConnectorFn } from 'wagmi';
 import type { MarketplaceConfig, SdkConfig } from '../../../types';
+import { MissingConfigError } from '../../../utils/_internal/error/transaction';
 import { DEFAULT_NETWORK } from '../consts';
 
 export function getWaasConnectors(
@@ -19,8 +20,7 @@ export function getWaasConnectors(
 
 	const waasConfigKey = sdkConfig.wallet?.embedded?.waasConfigKey;
 
-	if (!waasConfigKey)
-		throw new Error('waasConfigKey is required for embedded wallet');
+	if (!waasConfigKey) throw new MissingConfigError('waasConfigKey');
 
 	const walletConnectProjectId = sdkConfig.wallet?.walletConnectProjectId;
 	const { googleClientId, appleClientId, appleRedirectURI } =

package/src/react/hooks/index.ts

@@ -11,7 +11,9 @@ export * from './useHighestOffer';
 export * from './useListBalances';
 export * from './useListCollectibles';
 export * from './useListOffersForCollectible';
+export * from './useCountOffersForCollectible';
 export * from './useListListingsForCollectible';
+export * from './useCountListingsForCollectible';
 export * from './useLowestListing';
 export * from './useMarketplaceConfig';
 export * from './useRoyaltyPercentage';

package/src/react/hooks/options/marketplaceConfigOptions.ts

@@ -1,5 +1,9 @@
 import { queryOptions } from '@tanstack/react-query';
 import type { Env, MarketplaceConfig, SdkConfig } from '../../../types';
+import {
+	MarketplaceConfigFetchError,
+	ProjectNotFoundError,
+} from '../../../utils/_internal/error/transaction';
 import { builderMarketplaceApi, configKeys } from '../../_internal';
 
 const fetchBuilderConfig = async (projectId: string, env: Env) => {
@@ -12,10 +16,10 @@ const fetchBuilderConfig = async (projectId: string, env: Env) => {
 		//@ts-ignore
 		switch (json.code) {
 			case 3000: // Throws 3000 if the project is not found
-				throw new Error(`Project id: ${projectId} not found, ${url}`);
+				throw new ProjectNotFoundError(projectId, url);
 			default:
 				//@ts-ignore
-				throw new Error(`Failed to fetch marketplace config: ${json.msg}`);
+				throw new MarketplaceConfigFetchError(json.msg);
 		}
 	}
 	return json as MarketplaceConfig;

package/src/react/hooks/useBuyCollectable.tsx

@@ -1,15 +1,19 @@
+import type { Hash } from 'viem';
+import type { TransactionErrorTypes } from '../../utils/_internal/error/transaction';
 import {
 	type BuyInput,
 	TransactionType,
 } from '../_internal/transaction-machine/execute-transaction';
 import {
-	useTransactionMachine,
 	type UseTransactionMachineConfig,
+	useTransactionMachine,
 } from '../_internal/transaction-machine/useTransactionMachine';
 
+type UseBuyOrderError = TransactionErrorTypes;
+
 interface UseBuyOrderArgs extends Omit<UseTransactionMachineConfig, 'type'> {
-	onSuccess?: (hash: string) => void;
-	onError?: (error: Error) => void;
+	onSuccess?: (hash: Hash) => void;
+	onError?: (error: UseBuyOrderError) => void;
 	onTransactionSent?: (hash: string) => void;
 }
 
@@ -19,7 +23,7 @@ export const useBuyCollectable = ({
 	onTransactionSent,
 	...config
 }: UseBuyOrderArgs) => {
-	const machine = useTransactionMachine(
+	const { machine, error, isLoading } = useTransactionMachine(
 		{
 			...config,
 			type: TransactionType.BUY,
@@ -30,9 +34,11 @@ export const useBuyCollectable = ({
 	);
 
 	return {
-		buy: (props: BuyInput) => machine?.start({ props }),
-		onError,
-		onSuccess,
-		onTransactionSent,
+		buy: (props: BuyInput) => {
+			if (!machine || isLoading) return;
+			machine.start(props);
+		},
+		isLoading,
+		error,
 	};
 };

package/src/react/hooks/useCancelOrder.tsx

@@ -3,8 +3,8 @@ import {
 	TransactionType,
 } from '../_internal/transaction-machine/execute-transaction';
 import {
-	useTransactionMachine,
 	type UseTransactionMachineConfig,
+	useTransactionMachine,
 } from '../_internal/transaction-machine/useTransactionMachine';
 
 interface UseCancelOrderArgs extends Omit<UseTransactionMachineConfig, 'type'> {
@@ -19,7 +19,7 @@ export const useCancelOrder = ({
 	onTransactionSent,
 	...config
 }: UseCancelOrderArgs) => {
-	const machine = useTransactionMachine(
+	const { machine, isLoading } = useTransactionMachine(
 		{
 			...config,
 			type: TransactionType.CANCEL,
@@ -30,9 +30,10 @@ export const useCancelOrder = ({
 	);
 
 	return {
-		cancel: (props: CancelInput) => machine?.start({ props }),
+		cancel: (props: CancelInput) => machine?.start(props),
 		onError,
 		onSuccess,
 		onTransactionSent,
+		isLoading,
 	};
 };

package/src/react/hooks/useCheckoutOptions.tsx

@@ -1,4 +1,6 @@
 import { queryOptions, useQuery } from '@tanstack/react-query';
+import type { Hex } from 'viem';
+import { useAccount } from 'wagmi';
 import { z } from 'zod';
 import type { SdkConfig } from '../../types';
 import {
@@ -9,8 +11,6 @@ import {
 	getMarketplaceClient,
 } from '../_internal';
 import { useConfig } from './useConfig';
-import { useAccount } from 'wagmi';
-import type { Hex } from 'viem';
 
 const UseCheckoutOptionsSchema = z.object({
 	chainId: ChainIdSchema.pipe(z.coerce.string()),

package/src/react/hooks/useConfig.tsx

@@ -2,14 +2,13 @@
 
 import { useContext } from 'react';
 
+import { MarketplaceSdkProviderNotFoundError } from '../../utils/_internal/error/context';
 import { MarketplaceSdkContext } from '../provider';
 
 export function useConfig() {
 	const context = useContext(MarketplaceSdkContext);
 	if (!context) {
-		throw new Error(
-			'Marketplace SDK must be used within a MarketplaceSdkProvider',
-		);
+		throw new MarketplaceSdkProviderNotFoundError();
 	}
 	return context;
 }

package/src/react/hooks/useCountListingsForCollectible.tsx

@@ -0,0 +1,64 @@
+import { queryOptions, useQuery } from '@tanstack/react-query';
+import { z } from 'zod';
+import type { SdkConfig } from '../../types';
+import {
+	AddressSchema,
+	ChainIdSchema,
+	QueryArgSchema,
+	collectableKeys,
+	getMarketplaceClient,
+} from '../_internal';
+import { countListingsForCollectibleArgsSchema } from '../_internal/api/zod-schema';
+import { useConfig } from './useConfig';
+
+const UseCountListingsForCollectibleArgsSchema =
+	countListingsForCollectibleArgsSchema
+		.omit({
+			contractAddress: true,
+			tokenId: true,
+		})
+		.extend({
+			collectionAddress: AddressSchema,
+			collectibleId: z.string(),
+			chainId: ChainIdSchema.pipe(z.coerce.string()),
+			query: QueryArgSchema,
+		});
+
+export type UseCountListingsForCollectibleArgs = z.infer<
+	typeof UseCountListingsForCollectibleArgsSchema
+>;
+
+export type UseCountListingsForCollectibleReturn = Awaited<
+	ReturnType<typeof fetchCountListingsForCollectible>
+>;
+
+const fetchCountListingsForCollectible = async (
+	args: UseCountListingsForCollectibleArgs,
+	config: SdkConfig,
+) => {
+	const parsedArgs = UseCountListingsForCollectibleArgsSchema.parse(args);
+	const marketplaceClient = getMarketplaceClient(parsedArgs.chainId, config);
+	return marketplaceClient.getCountOfListingsForCollectible({
+		...parsedArgs,
+		contractAddress: parsedArgs.collectionAddress,
+		tokenId: parsedArgs.collectibleId,
+	});
+};
+
+export const countListingsForCollectibleOptions = (
+	args: UseCountListingsForCollectibleArgs,
+	config: SdkConfig,
+) => {
+	return queryOptions({
+		...args.query,
+		queryKey: [...collectableKeys.listingsCount, args, config],
+		queryFn: () => fetchCountListingsForCollectible(args, config),
+	});
+};
+
+export const useCountListingsForCollectible = (
+	args: UseCountListingsForCollectibleArgs,
+) => {
+	const config = useConfig();
+	return useQuery(countListingsForCollectibleOptions(args, config));
+};

package/src/react/hooks/useCountOffersForCollectible.tsx

@@ -0,0 +1,64 @@
+import { queryOptions, useQuery } from '@tanstack/react-query';
+import { z } from 'zod';
+import type { SdkConfig } from '../../types';
+import {
+	AddressSchema,
+	ChainIdSchema,
+	QueryArgSchema,
+	collectableKeys,
+	getMarketplaceClient,
+} from '../_internal';
+import { countOffersForCollectibleArgsSchema } from '../_internal/api/zod-schema';
+import { useConfig } from './useConfig';
+
+const UseCountOffersForCollectibleArgsSchema =
+	countOffersForCollectibleArgsSchema
+		.omit({
+			contractAddress: true,
+			tokenId: true,
+		})
+		.extend({
+			collectionAddress: AddressSchema,
+			collectibleId: z.string(),
+			chainId: ChainIdSchema.pipe(z.coerce.string()),
+			query: QueryArgSchema,
+		});
+
+export type UseCountOffersForCollectibleArgs = z.infer<
+	typeof UseCountOffersForCollectibleArgsSchema
+>;
+
+export type UseCountOffersForCollectibleReturn = Awaited<
+	ReturnType<typeof fetchCountOffersForCollectible>
+>;
+
+const fetchCountOffersForCollectible = async (
+	args: UseCountOffersForCollectibleArgs,
+	config: SdkConfig,
+) => {
+	const parsedArgs = UseCountOffersForCollectibleArgsSchema.parse(args);
+	const marketplaceClient = getMarketplaceClient(parsedArgs.chainId, config);
+	return marketplaceClient.getCountOfOffersForCollectible({
+		...parsedArgs,
+		contractAddress: parsedArgs.collectionAddress,
+		tokenId: parsedArgs.collectibleId,
+	});
+};
+
+export const countOffersForCollectibleOptions = (
+	args: UseCountOffersForCollectibleArgs,
+	config: SdkConfig,
+) => {
+	return queryOptions({
+		...args.query,
+		queryKey: [...collectableKeys.offersCount, args, config],
+		queryFn: () => fetchCountOffersForCollectible(args, config),
+	});
+};
+
+export const useCountOffersForCollectible = (
+	args: UseCountOffersForCollectibleArgs,
+) => {
+	const config = useConfig();
+	return useQuery(countOffersForCollectibleOptions(args, config));
+};

package/src/react/hooks/useCreateListing.tsx

@@ -1,19 +1,20 @@
-import { useState, useCallback } from 'react';
+import { useCallback, useState } from 'react';
 import type { Hash } from 'viem';
+import type { TransactionError } from '../../utils/_internal/error/transaction';
 import {
 	type ListingInput,
-	TransactionType,
 	type TransactionSteps,
+	TransactionType,
 } from '../_internal/transaction-machine/execute-transaction';
 import {
-	useTransactionMachine,
 	type UseTransactionMachineConfig,
+	useTransactionMachine,
 } from '../_internal/transaction-machine/useTransactionMachine';
 
 interface UseCreateListingArgs
 	extends Omit<UseTransactionMachineConfig, 'type'> {
 	onSuccess?: (hash: Hash) => void;
-	onError?: (error: Error) => void;
+	onError?: (error: TransactionError) => void;
 	onTransactionSent?: (hash: Hash) => void;
 }
 
@@ -26,7 +27,7 @@ export const useCreateListing = ({
 	const [isLoading, setIsLoading] = useState(false);
 	const [steps, setSteps] = useState<TransactionSteps | null>(null);
 
-	const machine = useTransactionMachine(
+	const { machine, isLoading: isMachineLoading } = useTransactionMachine(
 		{
 			...config,
 			type: TransactionType.LISTING,
@@ -40,26 +41,24 @@ export const useCreateListing = ({
 		async (props: ListingInput) => {
 			if (!machine) return;
 			setIsLoading(true);
-			try {
-				const generatedSteps = await machine.getTransactionSteps(props);
-				setSteps(generatedSteps);
-			} catch (error) {
-				onError?.(error as Error);
-			} finally {
+			const generatedSteps = await machine.getTransactionSteps(props);
+			if (!generatedSteps) {
 				setIsLoading(false);
+				return;
 			}
+			setSteps(generatedSteps);
+			setIsLoading(false);
 		},
 		[machine, onError],
 	);
 
 	return {
-		createListing: (props: ListingInput) => machine?.start({ props }),
+		createListing: (props: ListingInput) => machine?.start(props),
 		getListingSteps: (props: ListingInput) => ({
 			isLoading,
 			steps,
 			refreshSteps: () => loadSteps(props),
 		}),
-		onError,
-		onSuccess,
+		isLoading: isMachineLoading,
 	};
 };

package/src/react/hooks/useCurrencies.tsx

@@ -1,18 +1,19 @@
 import { queryOptions, useQuery } from '@tanstack/react-query';
 import { z } from 'zod';
-import { useConfig } from './useConfig';
+import type { MarketplaceConfig, SdkConfig } from '../../types';
+import { CollectionNotFoundError } from '../../utils/_internal/error/transaction';
 import {
-	ChainIdSchema,
 	AddressSchema,
-	QueryArgSchema,
-	getMarketplaceClient,
+	type ChainId,
+	ChainIdSchema,
 	type Currency,
-	getQueryClient,
+	QueryArgSchema,
 	configKeys,
 	currencyKeys,
-	type ChainId,
+	getMarketplaceClient,
+	getQueryClient,
 } from '../_internal';
-import type { SdkConfig, MarketplaceConfig } from '../../types';
+import { useConfig } from './useConfig';
 
 const ChainIdCoerce = ChainIdSchema.transform((val) => val.toString());
 
@@ -48,7 +49,7 @@ const selectCurrencies = (data: Currency[], args: UseCurrenciesArgs) => {
 		);
 
 		if (!collection) {
-			throw new Error("Collection doesn't exist");
+			throw new CollectionNotFoundError(argsParsed.collectionAddress!);
 		}
 
 		return data.filter(

package/src/react/hooks/useCurrency.tsx

@@ -1,17 +1,17 @@
 import { queryOptions, useQuery } from '@tanstack/react-query';
 import { z } from 'zod';
-import { useConfig } from './useConfig';
+import type { SdkConfig } from '../../types';
 import {
-	ChainIdSchema,
 	AddressSchema,
-	QueryArgSchema,
-	getMarketplaceClient,
+	type ChainId,
+	ChainIdSchema,
 	type Currency,
+	QueryArgSchema,
 	currencyKeys,
-	type ChainId,
+	getMarketplaceClient,
 	getQueryClient,
 } from '../_internal';
-import type { SdkConfig } from '../../types';
+import { useConfig } from './useConfig';
 
 const ChainIdCoerce = ChainIdSchema.transform((val) => val.toString());
 

package/src/react/hooks/useGenerateBuyTransaction.tsx

@@ -1,17 +1,17 @@
 import { queryOptions, useQuery } from '@tanstack/react-query';
+import type { Hex } from 'viem';
+import { useAccount } from 'wagmi';
 import { z } from 'zod';
 import type { SdkConfig } from '../../types';
 import {
 	AddressSchema,
 	ChainIdSchema,
-	getMarketplaceClient,
 	MarketplaceKind,
 	QueryArgSchema,
 	WalletKind,
+	getMarketplaceClient,
 } from '../_internal';
 import { useConfig } from './useConfig';
-import { useAccount } from 'wagmi';
-import type { Hex } from 'viem';
 
 export const UseGenerateBuyTransactionArgsSchema = z.object({
 	chainId: ChainIdSchema.pipe(z.coerce.string()),