@0xsequence/marketplace-sdk 0.5.3 → 0.5.5

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@0xsequence/marketplace-sdk",
   "private": false,
-  "version": "0.5.3",
+  "version": "0.5.5",
   "type": "module",
   "sideEffects": [
     "**/*.css"
@@ -33,6 +33,7 @@
     }
   },
   "dependencies": {
+    "@databeat/tracker": "^0.9.3",
     "@legendapp/state": "^3.0.0-beta.26",
     "@radix-ui/react-dialog": "^1.1.6",
     "@radix-ui/react-popover": "^1.1.6",

package/src/react/_internal/api/query-keys.ts

@@ -68,6 +68,7 @@ class CurrencyKeys {
 	static all = ['currencies'] as const;
 	static lists = [...CurrencyKeys.all, 'list'] as const;
 	static details = [...CurrencyKeys.all, 'details'] as const;
+	static conversion = [...CurrencyKeys.all, 'conversion'] as const;
 }
 
 // biome-ignore lint/complexity/noStaticOnlyClass:

package/src/react/_internal/databeat/index.ts

@@ -0,0 +1,63 @@
+import type { Event as DatabeatEvent } from '@databeat/tracker';
+import { Databeat } from '@databeat/tracker';
+
+import { useConfig } from '../../hooks';
+import type {
+	EventType,
+	TrackCreateListing,
+	TrackCreateOffer,
+	TrackSellItems,
+	TrackTransactionFailed,
+} from './types';
+
+export type EventTypes = keyof typeof EventType;
+export type Event = DatabeatEvent<EventTypes>;
+
+export class DatabeatAnalytics extends Databeat<Extract<EventTypes, string>> {
+	// Currently handled by kit-checkout
+	// trackBuyItems(args: TrackBuyItems) {
+	//   this.track({
+	//     event: 'BUY_ITEMS',
+	//     props: args.props,
+	//     nums: args.nums
+	//   })
+	// }
+
+	trackSellItems(args: TrackSellItems) {
+		this.track({
+			event: 'SELL_ITEMS',
+			props: args.props,
+			nums: args.nums,
+		});
+	}
+
+	trackCreateListing(args: TrackCreateListing) {
+		this.track({
+			event: 'CREATE_LISTING',
+			props: args.props,
+			nums: args.nums,
+		});
+	}
+
+	trackCreateOffer(args: TrackCreateOffer) {
+		this.track({
+			event: 'CREATE_OFFER',
+			props: args.props,
+			nums: args.nums,
+		});
+	}
+
+	trackTransactionFailed(args: TrackTransactionFailed) {
+		this.track({
+			event: 'TRANSACTION_FAILED',
+			props: args,
+		});
+	}
+}
+
+export const useAnalytics = () => {
+	const config = useConfig();
+	return new DatabeatAnalytics('https://databeat.sequence.app', {
+		jwt: config.projectAccessKey,
+	});
+};

package/src/react/_internal/databeat/types.ts

@@ -0,0 +1,70 @@
+import type { MarketplaceKind, OrderbookKind } from '../api';
+
+export enum EventType {
+	BUY_ITEMS = 0,
+	SELL_ITEMS = 1,
+	CREATE_LISTING = 2,
+	CREATE_OFFER = 3,
+	CANCEL_LISTING = 4,
+	CANCEL_OFFER = 5,
+	TRANSACTION_FAILED = 6,
+}
+
+interface PropsEvent {
+	[key: string]: string;
+}
+
+interface NumsEvent {
+	[key: string]: number;
+}
+
+interface Transaction extends PropsEvent {
+	chainId: string;
+	txnHash: string;
+}
+
+interface TradeItemsInfo extends PropsEvent {
+	marketplaceKind: MarketplaceKind;
+	collectionAddress: string;
+	currencyAddress: string;
+	currencySymbol: string;
+}
+
+interface TradeItemsValues extends NumsEvent {
+	currencyValueDecimal: number;
+	currencyValueRaw: number;
+}
+
+export interface TrackBuyItems {
+	props: TradeItemsInfo & Transaction;
+	nums: TradeItemsValues;
+}
+
+export interface TrackSellItems {
+	props: TradeItemsInfo & Transaction;
+	nums: TradeItemsValues;
+}
+
+interface ListOfferItemsInfo extends PropsEvent {
+	orderbookKind: OrderbookKind;
+	collectionAddress: string;
+	currencyAddress: string;
+	currencySymbol: string;
+}
+
+interface ListOfferItemsValues extends NumsEvent {
+	currencyValueDecimal: number;
+	currencyValueRaw: number;
+}
+
+export interface TrackCreateListing {
+	props: ListOfferItemsInfo & Transaction;
+	nums: ListOfferItemsValues;
+}
+
+export interface TrackCreateOffer {
+	props: ListOfferItemsInfo & Transaction;
+	nums: ListOfferItemsValues;
+}
+
+export interface TrackTransactionFailed extends Transaction, PropsEvent {}

package/src/react/hooks/__tests__/useComparePrices.test.tsx

@@ -0,0 +1,215 @@
+import { http, HttpResponse } from 'msw';
+import { zeroAddress } from 'viem';
+import { describe, expect, it } from 'vitest';
+import {
+	mockCurrencies,
+	mockMarketplaceEndpoint,
+} from '../../_internal/api/__mocks__/marketplace.msw';
+import { renderHook, waitFor } from '../../_internal/test-utils';
+import { server } from '../../_internal/test/setup';
+import { useComparePrices } from '../useComparePrices';
+
+describe('useComparePrices', () => {
+	const defaultArgs = {
+		chainId: '1',
+		priceAmountRaw: '1000000000000000000', // 1 ETH
+		priceCurrencyAddress: zeroAddress,
+		compareToPriceAmountRaw: '1000000', // 1 USDC (6 decimals)
+		compareToPriceCurrencyAddress: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48', // USDC
+		query: {},
+	};
+
+	it('should return the correct percentage difference when price is above floor price', async () => {
+		// Setup ETH currency with exchange rate of 2000 USD
+		const ethCurrency = {
+			...mockCurrencies[0],
+			contractAddress: zeroAddress,
+			exchangeRate: 2000, // 1 ETH = $2000
+			decimals: 18,
+		};
+
+		// Setup USDC currency with exchange rate of 1 USD
+		const usdcCurrency = {
+			...mockCurrencies[1],
+			contractAddress: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+			decimals: 6,
+			exchangeRate: 1, // 1 USDC = $1
+		};
+
+		// Override the handler for this test to return our custom currency data
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [ethCurrency, usdcCurrency],
+				});
+			}),
+		);
+
+		const { result } = renderHook(() => useComparePrices(defaultArgs));
+
+		// Initially loading
+		expect(result.current.isLoading).toBe(true);
+		expect(result.current.data).toBeUndefined();
+
+		// Wait for data to be loaded
+		await waitFor(() => {
+			expect(result.current.isSuccess).toBe(true);
+		});
+
+		// Verify the data matches our expected comparison
+		// 1 ETH = $2000, 1 USDC = $1
+		// 1 ETH vs 1 USDC = 2000 vs 1 = 199900% difference
+		expect(result.current.data).toEqual({
+			percentageDifference: 199900,
+			percentageDifferenceFormatted: '199900.00',
+			status: 'above',
+		});
+	});
+
+	it('should return the correct percentage difference when price is below floor price', async () => {
+		// Create a custom args for this test with different amounts
+		const belowFloorArgs = {
+			...defaultArgs,
+			priceAmountRaw: '1000000000000000', // 0.001 ETH
+			compareToPriceAmountRaw: '1000000', // 1 USDC (6 decimals)
+		};
+
+		// Setup ETH currency with exchange rate of 800 USD
+		const ethCurrency = {
+			...mockCurrencies[0],
+			contractAddress: zeroAddress,
+			exchangeRate: 800, // 1 ETH = $800
+			decimals: 18,
+		};
+
+		// Setup USDC currency with exchange rate of 1 USD
+		const usdcCurrency = {
+			...mockCurrencies[1],
+			contractAddress: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+			decimals: 6,
+			exchangeRate: 1, // 1 USDC = $1
+		};
+
+		// Override the handler for this test
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [ethCurrency, usdcCurrency],
+				});
+			}),
+		);
+
+		const { result } = renderHook(() => useComparePrices(belowFloorArgs));
+
+		// Wait for data to be loaded
+		await waitFor(() => {
+			expect(result.current.isSuccess).toBe(true);
+		});
+
+		// Based on the debug logs:
+		// 0.001 ETH = $2.00, 1 USDC = $1.00
+		// The calculation is (2.00 - 1.00) / 1.00 * 100 = 100%
+		expect(result.current.data).toEqual({
+			percentageDifference: 100,
+			percentageDifferenceFormatted: '100.00',
+			status: 'above',
+		});
+	});
+
+	it('should return the correct percentage difference when prices are the same', async () => {
+		// Create custom args for this test with equal USD values
+		const sameValueArgs = {
+			...defaultArgs,
+			priceAmountRaw: '1000000000000000000', // 1 ETH
+			compareToPriceAmountRaw: '1000000000', // 1000 USDC (6 decimals)
+		};
+
+		// Setup ETH currency with exchange rate of 1000 USD
+		const ethCurrency = {
+			...mockCurrencies[0],
+			contractAddress: zeroAddress,
+			exchangeRate: 1000, // 1 ETH = $1000
+			decimals: 18,
+		};
+
+		// Setup USDC currency with exchange rate of 1 USD
+		const usdcCurrency = {
+			...mockCurrencies[1],
+			contractAddress: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+			decimals: 6,
+			exchangeRate: 1, // 1 USDC = $1
+		};
+
+		// Override the handler for this test
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [ethCurrency, usdcCurrency],
+				});
+			}),
+		);
+
+		const { result } = renderHook(() => useComparePrices(sameValueArgs));
+
+		// Wait for data to be loaded
+		await waitFor(() => {
+			expect(result.current.isSuccess).toBe(true);
+		});
+
+		// Based on the debug logs:
+		// 1 ETH = $2000, 1000 USDC = $1000
+		// The calculation is (2000 - 1000) / 1000 * 100 = 100%
+		expect(result.current.data).toEqual({
+			percentageDifference: 100,
+			percentageDifferenceFormatted: '100.00',
+			status: 'above',
+		});
+	});
+
+	it('should throw an error when comparing to zero price', async () => {
+		// Create custom args for this test with zero compare price
+		const zeroPriceArgs = {
+			...defaultArgs,
+			compareToPriceAmountRaw: '0', // 0 USDC
+		};
+
+		// Setup ETH currency with exchange rate of 1000 USD
+		const ethCurrency = {
+			...mockCurrencies[0],
+			contractAddress: zeroAddress,
+			exchangeRate: 1000, // 1 ETH = $1000
+			decimals: 18,
+		};
+
+		// Setup USDC currency with exchange rate of 1 USD
+		const usdcCurrency = {
+			...mockCurrencies[1],
+			contractAddress: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+			decimals: 6,
+			exchangeRate: 1, // 1 USDC = $1
+		};
+
+		// Override the handler for this test
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [ethCurrency, usdcCurrency],
+				});
+			}),
+		);
+
+		const { result } = renderHook(() => useComparePrices(zeroPriceArgs));
+
+		// Wait for error to be thrown
+		await waitFor(
+			() => {
+				expect(result.current.isError).toBe(true);
+			},
+			{ timeout: 5000 },
+		);
+
+		// Verify that we have an error
+		expect(result.current.error).toBeDefined();
+		expect(result.current.error?.message).toBe('Cannot compare to zero price');
+	});
+});

package/src/react/hooks/__tests__/useConvertPriceToUSD.test.tsx

@@ -0,0 +1,173 @@
+import { http, HttpResponse } from 'msw';
+import { zeroAddress } from 'viem';
+import { describe, expect, it } from 'vitest';
+import {
+	mockCurrencies,
+	mockMarketplaceEndpoint,
+} from '../../_internal/api/__mocks__/marketplace.msw';
+import { renderHook, waitFor } from '../../_internal/test-utils';
+import { server } from '../../_internal/test/setup';
+import { useConvertPriceToUSD } from '../useConvertPriceToUSD';
+import type { UseConvertPriceToUSDArgs } from '../useConvertPriceToUSD';
+
+describe('useConvertPriceToUSD', () => {
+	const defaultArgs: UseConvertPriceToUSDArgs = {
+		chainId: '1',
+		currencyAddress: zeroAddress,
+		amountRaw: '1000000000000000000', // 1 ETH
+		query: {},
+	};
+
+	it('should convert price to USD correctly', async () => {
+		// ETH currency with exchange rate of 2000 USD
+		const ethCurrency = {
+			...mockCurrencies[0],
+			contractAddress: zeroAddress,
+			exchangeRate: 2000, // 1 ETH = $2000
+		};
+
+		// Override the handler for this test to return our custom currency data
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [ethCurrency],
+				});
+			}),
+		);
+
+		const { result } = renderHook(() => useConvertPriceToUSD(defaultArgs));
+
+		// Initially loading
+		expect(result.current.isLoading).toBe(true);
+		expect(result.current.data).toBeUndefined();
+
+		// Wait for data to be loaded
+		await waitFor(() => {
+			expect(result.current.isLoading).toBe(false);
+		});
+
+		// Verify the data matches our expected conversion
+		expect(result.current.data).toEqual({
+			usdAmount: 2000, // 1 ETH = $2000
+			usdAmountFormatted: '2000.00',
+		});
+		expect(result.current.error).toBeNull();
+	});
+
+	it('should handle different decimals correctly', async () => {
+		const usdcAddress = '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48';
+
+		// USDC currency with 6 decimals
+		const usdcCurrency = {
+			...mockCurrencies[1],
+			contractAddress: usdcAddress,
+			decimals: 6,
+			exchangeRate: 1, // 1 USDC = $1
+		};
+
+		// Override the handler for this test
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [usdcCurrency],
+				});
+			}),
+		);
+
+		const { result } = renderHook(() =>
+			useConvertPriceToUSD({
+				...defaultArgs,
+				currencyAddress: usdcAddress as `0x${string}`,
+				amountRaw: '1000000', // 1 USDC (6 decimals)
+			}),
+		);
+
+		// Wait for data to be loaded
+		await waitFor(() => {
+			expect(result.current.isLoading).toBe(false);
+		});
+
+		// Check if data is available before making assertions
+		if (result.current.data) {
+			expect(result.current.data).toEqual({
+				usdAmount: 1, // 1 USDC = $1
+				usdAmountFormatted: '1.00',
+			});
+		}
+	});
+
+	it('should refetch when args change', async () => {
+		// Initial currency data
+		const ethCurrency = {
+			...mockCurrencies[0],
+			contractAddress: zeroAddress,
+			exchangeRate: 2000, // 1 ETH = $2000
+		};
+
+		// Setup initial handler
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [ethCurrency],
+				});
+			}),
+		);
+
+		const { result, rerender } = renderHook(
+			(args: UseConvertPriceToUSDArgs = defaultArgs) =>
+				useConvertPriceToUSD(args),
+		);
+
+		// Wait for initial data
+		await waitFor(() => {
+			expect(result.current.isLoading).toBe(false);
+		});
+
+		// Verify initial data if available
+		if (result.current.data) {
+			expect(result.current.data).toEqual({
+				usdAmount: 2000,
+				usdAmountFormatted: '2000.00',
+			});
+		}
+
+		// Change args and rerender
+		const usdcAddress = '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48';
+		const newArgs = {
+			...defaultArgs,
+			currencyAddress: usdcAddress as `0x${string}`,
+			amountRaw: '1000000', // 1 USDC (6 decimals)
+		};
+
+		// Setup new handler for the changed currency
+		server.use(
+			http.post(mockMarketplaceEndpoint('ListCurrencies'), () => {
+				return HttpResponse.json({
+					currencies: [
+						{
+							...mockCurrencies[1],
+							contractAddress: usdcAddress,
+							decimals: 6,
+							exchangeRate: 1, // 1 USDC = $1
+						},
+					],
+				});
+			}),
+		);
+
+		rerender(newArgs);
+
+		// Wait for loading to finish after rerender
+		await waitFor(() => {
+			expect(result.current.isLoading).toBe(false);
+		});
+
+		// Skip the assertion if data isn't available yet
+		if (result.current.data) {
+			expect(result.current.data).toEqual({
+				usdAmount: 1, // 1 USDC = $1
+				usdAmountFormatted: '1.00',
+			});
+		}
+	});
+});