@sodax/dapp-kit 1.3.1-beta-rc3 → 1.3.1-beta

package/src/hooks/dex/useDecreaseLiquidity.ts

@@ -0,0 +1,78 @@
+import { useMutation, useQueryClient, type UseMutationResult } from '@tanstack/react-query';
+import type {
+  ConcentratedLiquidityDecreaseLiquidityParams,
+  HubTxHash,
+  SpokeProvider,
+  SpokeTxHash,
+} from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export type UseDecreaseLiquidityParams = {
+  params: ConcentratedLiquidityDecreaseLiquidityParams;
+  spokeProvider: SpokeProvider;
+};
+
+/**
+ * React hook that provides a mutation for decreasing liquidity in a concentrated liquidity position.
+ *
+ * This hook returns a mutation for removing liquidity from a position using the provided
+ * `ConcentratedLiquidityDecreaseLiquidityParams` and `SpokeProvider`. The mutation returns a tuple of
+ * the spoke transaction hash and the hub transaction hash upon success.
+ *
+ * @returns {UseMutationResult<[SpokeTxHash, HubTxHash], Error, UseDecreaseLiquidityParams>}
+ *   React Query mutation result:
+ *   - `mutateAsync({ params, spokeProvider })`: Triggers the decrease liquidity mutation.
+ *   - On success, returns `[spokeTxHash, hubTxHash]`.
+ *   - On failure, throws an error.
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: decreaseLiquidity, isPending, error } = useDecreaseLiquidity();
+ *
+ * await decreaseLiquidity({
+ *   params: {
+ *     poolKey,
+ *     tokenId: 123n,
+ *     liquidity: 100000n,
+ *     amount0Min: 0n,
+ *     amount1Min: 0n,
+ *   },
+ *   spokeProvider,
+ * });
+ * ```
+ *
+ * @param {UseDecreaseLiquidityParams} variables
+ *   - `params`: Parameters for the decrease liquidity operation, matching `ConcentratedLiquidityDecreaseLiquidityParams`.
+ *   - `spokeProvider`: The provider instance for the target spoke chain.
+ *
+ * @remarks
+ * - After a successful liquidity decrease, the hook will invalidate DEX pool balances and position info queries.
+ */
+export function useDecreaseLiquidity(): UseMutationResult<[SpokeTxHash, HubTxHash], Error, UseDecreaseLiquidityParams> {
+  const { sodax } = useSodaxContext();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ params, spokeProvider }: UseDecreaseLiquidityParams) => {
+      if (!spokeProvider) {
+        throw new Error('Spoke provider is required');
+      }
+
+      const decreaseResult = await sodax.dex.clService.decreaseLiquidity({
+        params,
+        spokeProvider,
+      });
+
+      if (!decreaseResult.ok) {
+        throw new Error(`Decrease liquidity failed: ${decreaseResult.error?.code || 'Unknown error'}`);
+      }
+
+      return decreaseResult.value;
+    },
+    onSuccess: () => {
+      // Invalidate relevant queries after successful liquidity decrease
+      queryClient.invalidateQueries({ queryKey: ['dex', 'poolBalances'] });
+      queryClient.invalidateQueries({ queryKey: ['dex', 'positionInfo'] });
+    },
+  });
+}

package/src/hooks/dex/useDexAllowance.ts

@@ -0,0 +1,87 @@
+import { type QueryObserverOptions, useQuery, type UseQueryResult } from '@tanstack/react-query';
+import type { SpokeProvider, CreateAssetDepositParams } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export type UseDexAllowanceProps = {
+  params: CreateAssetDepositParams | undefined;
+  spokeProvider: SpokeProvider | null;
+  enabled?: boolean;
+  queryOptions?: QueryObserverOptions<boolean, Error>;
+};
+
+/**
+ * Hook to check if the user has approved sufficient token allowance for DEX deposits.
+ *
+ * This hook automatically queries and tracks the allowance status, indicating whether
+ * the user has granted enough allowance to allow a specific deposit to the DEX. It leverages
+ * React Query for status, caching, and background refetching.
+ *
+ * @param {CreateAssetDepositParams | undefined} params
+ *   The deposit parameters: asset address, poolToken, and raw amount (BigInt), or undefined to disable.
+ * @param {SpokeProvider | undefined} spokeProvider
+ *   The provider interface for the selected chain. When undefined, the query is disabled.
+ * @param {boolean} [enabled]
+ *   Whether the allowance status check is enabled. Defaults to true if both params and spokeProvider are truthy.
+ * @param {QueryObserverOptions<boolean, Error>} [queryOptions]
+ *   Optional react-query options. Any override here (e.g. staleTime, refetchInterval) will merge with defaults.
+ *
+ * @returns {UseQueryResult<boolean, Error>}
+ *   React Query result object: `data` is boolean (true if allowance is sufficient), plus `isLoading`, `error`, etc.
+ *
+ * @example
+ * ```typescript
+ * const { data: isAllowed, isLoading, error } = useDexAllowance({
+ *   params: { asset, amount: parseUnits('100', 18), poolToken },
+ *   spokeProvider,
+ * });
+ * if (isLoading) return <Spinner />;
+ * if (error) return <div>Error: {error.message}</div>;
+ * if (isAllowed) { ... }
+ * ```
+ *
+ * @remarks
+ * - The allowance is checked every 5 seconds as long as enabled, params, and spokeProvider are all defined.
+ * - Returns `false` if allowance cannot be determined or any error occurs in isAllowanceValid.
+ * - Suitable for gating UI actions that require token approval before depositing in the DEX.
+ */
+export function useDexAllowance({
+  params,
+  spokeProvider,
+  queryOptions = {
+    queryKey: [
+      'dex',
+      'allowance',
+      params?.asset,
+      params?.poolToken,
+      params?.amount.toString(),
+      spokeProvider?.chainConfig.chain.id,
+    ],
+    enabled: !!params && !!spokeProvider,
+  },
+}: UseDexAllowanceProps): UseQueryResult<boolean, Error> {
+  const { sodax } = useSodaxContext();
+
+  return useQuery({
+    ...queryOptions,
+    queryFn: async () => {
+      if (!params || !spokeProvider) {
+        throw new Error('Params and spoke provider are required');
+      }
+
+      const allowanceResult = await sodax.dex.assetService.isAllowanceValid({
+        params: {
+          asset: params.asset,
+          amount: params.amount,
+          poolToken: params.poolToken,
+        },
+        spokeProvider,
+      });
+
+      if (!allowanceResult.ok) {
+        return false;
+      }
+
+      return allowanceResult.value;
+    },
+  });
+}

package/src/hooks/dex/useDexApprove.ts

@@ -0,0 +1,55 @@
+import { useMutation, useQueryClient, type UseMutationResult } from '@tanstack/react-query';
+import type { SpokeProvider, CreateAssetDepositParams, SpokeTxHash } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export type UseDexApproveParams = {
+  params: CreateAssetDepositParams;
+  spokeProvider: SpokeProvider;
+};
+
+/**
+ * React hook for performing a DEX token allowance approval transaction.
+ *
+ * Returns a mutation object that allows explicitly triggering a token approval
+ * for a DEX deposit, using the specified approval parameters and spoke provider.
+ * On successful approval, the related allowance query is invalidated and refetched
+ * for consistent UI state.
+ *
+ * @returns {UseMutationResult<SpokeTxHash, Error, UseDexApproveParams>}
+ *   React Query mutation result for the approval operation. Use `mutateAsync` with
+ *   an object of shape `{ params, spokeProvider }` to initiate approval.
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: approve, isPending, error } = useDexApprove();
+ * await approve({ params: { asset, amount, poolToken }, spokeProvider });
+ * ```
+ *
+ * @remarks
+ * - Throws if called without both a valid `params` and `spokeProvider`.
+ * - On approval success, the query for ['dex', 'allowance'] is invalidated/refetched.
+ */
+export function useDexApprove(): UseMutationResult<SpokeTxHash, Error, UseDexApproveParams> {
+  const { sodax } = useSodaxContext();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ params, spokeProvider }: UseDexApproveParams) => {
+      const approveResult = await sodax.dex.assetService.approve({
+        params,
+        spokeProvider,
+        raw: false,
+      });
+
+      if (!approveResult.ok) {
+        throw new Error('Approval failed');
+      }
+
+      return approveResult.value;
+    },
+    onSuccess: () => {
+      // Invalidate allowance query to refetch the new allowance
+      queryClient.invalidateQueries({ queryKey: ['dex', 'allowance'] });
+    },
+  });
+}

package/src/hooks/dex/useDexDeposit.ts

@@ -0,0 +1,64 @@
+import { useMutation, useQueryClient, type UseMutationResult } from '@tanstack/react-query';
+import type { SpokeProvider, CreateAssetDepositParams, SpokeTxHash, HubTxHash } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export type UseDexDepositParams = {
+  params: CreateAssetDepositParams;
+  spokeProvider: SpokeProvider;
+};
+
+/**
+/**
+ * React hook that provides a mutation to perform a deposit into a DEX pool using the provided parameters and SpokeProvider.
+ *
+ * The hook returns a mutation object for executing the deposit (`mutateAsync`), tracking its state (`isPending`), and any resulting error (`error`).
+ * On successful deposit, all queries matching ['dex', 'poolBalances'] are invalidated and refetched.
+ *
+ * @returns {UseMutationResult<[SpokeTxHash, HubTxHash], Error, UseDexDepositParams>}
+ *   React Query mutation result:
+ *   - `mutateAsync({ params, spokeProvider })`: Triggers the deposit with {@link CreateDepositParams} and the target SpokeProvider.
+ *   - `isPending`: True while the deposit transaction is pending.
+ *   - `error`: Error if the mutation fails.
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: deposit, isPending, error } = useDexDeposit();
+ * await deposit({ params: { asset, amount, poolToken }, spokeProvider });
+ * ```
+ *
+ * @remarks
+ * - Throws if called with missing `spokeProvider` or `params`.
+ * - Upon success, automatically refetches up-to-date pool balances.
+ */
+export function useDexDeposit(): UseMutationResult<[SpokeTxHash, HubTxHash], Error, UseDexDepositParams> {
+  const { sodax } = useSodaxContext();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ params, spokeProvider }: UseDexDepositParams) => {
+      if (!spokeProvider) {
+        throw new Error('Spoke provider is required');
+      }
+
+      if (!params) {
+        throw new Error('Deposit params are required');
+      }
+
+      // Perform the deposit operation
+      const depositResult = await sodax.dex.assetService.deposit({
+        params,
+        spokeProvider,
+      });
+
+      if (!depositResult.ok) {
+        throw new Error(`Deposit failed: ${depositResult.error?.code || 'Unknown error'}`);
+      }
+
+      return depositResult.value;
+    },
+    onSuccess: () => {
+      // Refetch pool balances after a successful deposit
+      queryClient.invalidateQueries({ queryKey: ['dex', 'poolBalances'] });
+    },
+  });
+}

package/src/hooks/dex/useDexWithdraw.ts

@@ -0,0 +1,54 @@
+import { useMutation, useQueryClient, type UseMutationResult } from '@tanstack/react-query';
+import type { SpokeProvider, SpokeTxHash, HubTxHash, CreateAssetWithdrawParams } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export type UseDexWithdrawParams = {
+  params: CreateAssetWithdrawParams;
+  spokeProvider: SpokeProvider;
+};
+
+/**
+ * React hook to provide a mutation for withdrawing assets from a DEX pool.
+ *
+ * This hook returns a mutation result object valid for use with React Query.
+ * The mutation function expects an object with the withdrawal parameters and a SpokeProvider,
+ * and triggers the withdrawal operation on the DEX. On success, it invalidates the relevant
+ * ['dex', 'poolBalances'] query to fetch the updated balances.
+ *
+ * @returns {UseMutationResult<[SpokeTxHash, HubTxHash], Error, UseDexWithdrawParams>}
+ *   Mutation result object. Use its properties to:
+ *   - Call `mutateAsync({ params, spokeProvider })` to perform the withdrawal.
+ *   - Track progress with `isPending`.
+ *   - Access any `error` encountered during the mutation.
+ *
+ * @example
+ * const { mutateAsync: withdraw, isPending, error } = useDexWithdraw();
+ * await withdraw({ params, spokeProvider });
+ */
+export function useDexWithdraw(): UseMutationResult<[SpokeTxHash, HubTxHash], Error, UseDexWithdrawParams> {
+  const { sodax } = useSodaxContext();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ params, spokeProvider }: UseDexWithdrawParams) => {
+      if (!spokeProvider) {
+        throw new Error('Spoke provider is required');
+      }
+      // Execute withdraw
+      const withdrawResult = await sodax.dex.assetService.withdraw({
+        params,
+        spokeProvider,
+      });
+
+      if (!withdrawResult.ok) {
+        throw new Error(`Withdraw failed: ${withdrawResult.error.code}`);
+      }
+
+      return withdrawResult.value;
+    },
+    onSuccess: () => {
+      // Invalidate balances query to refetch after withdraw
+      queryClient.invalidateQueries({ queryKey: ['dex', 'poolBalances'] });
+    },
+  });
+}

package/src/hooks/dex/useLiquidityAmounts.ts

@@ -0,0 +1,187 @@
+import { useState, useEffect, useCallback, useMemo } from 'react';
+import { ClService, type PoolData } from '@sodax/sdk';
+
+interface UseLiquidityAmountsResult {
+  liquidityToken0Amount: string;
+  liquidityToken1Amount: string;
+  lastEditedToken: 'token0' | 'token1' | null;
+  setLiquidityToken0Amount: (value: string) => void;
+  setLiquidityToken1Amount: (value: string) => void;
+  handleToken0AmountChange: (value: string) => void;
+  handleToken1AmountChange: (value: string) => void;
+}
+
+/**
+ * Hook for calculating liquidity amounts based on price range.
+ *
+ * This hook manages the state and calculations for liquidity token amounts.
+ * It automatically calculates the corresponding token amount when one is changed,
+ * based on the current price range and pool data.
+ *
+ * @param {string} minPrice - Minimum price for the liquidity range
+ * @param {string} maxPrice - Maximum price for the liquidity range
+ * @param {PoolData | null} poolData - The pool data containing token information
+ * @returns {UseLiquidityAmountsResult} Object containing amounts, state, and handlers
+ *
+ * @example
+ * ```typescript
+ * const {
+ *   liquidityToken0Amount,
+ *   liquidityToken1Amount,
+ *   handleToken0AmountChange,
+ *   handleToken1AmountChange,
+ * } = useLiquidityAmounts(minPrice, maxPrice, poolData);
+ *
+ * <Input
+ *   value={liquidityToken0Amount}
+ *   onChange={(e) => handleToken0AmountChange(e.target.value)}
+ * />
+ * ```
+ */
+export function useLiquidityAmounts(
+  minPrice: string,
+  maxPrice: string,
+  poolData: PoolData | null,
+): UseLiquidityAmountsResult {
+  const [liquidityToken0Amount, setLiquidityToken0Amount] = useState<string>('');
+  const [liquidityToken1Amount, setLiquidityToken1Amount] = useState<string>('');
+  const [lastEditedToken, setLastEditedToken] = useState<'token0' | 'token1' | null>(null);
+
+  // Memoize parsed price values to avoid repeated parsing
+  const { minPriceNum, maxPriceNum, isValidPriceRange } = useMemo(() => {
+    const parsedMin = Number.parseFloat(minPrice);
+    const parsedMax = Number.parseFloat(maxPrice);
+    const isValid = parsedMin > 0 && parsedMax > 0 && parsedMin < parsedMax;
+
+    return {
+      minPriceNum: parsedMin,
+      maxPriceNum: parsedMax,
+      isValidPriceRange: isValid,
+    };
+  }, [minPrice, maxPrice]);
+
+  // Memoize tick calculations - these only depend on prices and pool data
+  const { tickLower, tickUpper, currentTick } = useMemo(() => {
+    if (!poolData || !isValidPriceRange) {
+      return {
+        tickLower: null,
+        tickUpper: null,
+        currentTick: null,
+      };
+    }
+
+    try {
+      const lower = ClService.priceToTick(minPriceNum, poolData.token0, poolData.token1, poolData.tickSpacing);
+      const upper = ClService.priceToTick(maxPriceNum, poolData.token0, poolData.token1, poolData.tickSpacing);
+
+      return {
+        tickLower: lower,
+        tickUpper: upper,
+        currentTick: BigInt(poolData.currentTick),
+      };
+    } catch (err) {
+      console.error('Failed to calculate ticks:', err);
+      return {
+        tickLower: null,
+        tickUpper: null,
+        currentTick: null,
+      };
+    }
+  }, [minPriceNum, maxPriceNum, poolData, isValidPriceRange]);
+
+  // Auto-calculate token1 amount when token0 amount changes
+  const handleToken0AmountChange = useCallback(
+    (value: string): void => {
+      setLiquidityToken0Amount(value);
+      setLastEditedToken('token0');
+
+      // Only calculate if we have all required values
+      if (!value || !poolData || !tickLower || !tickUpper || !currentTick) {
+        return;
+      }
+
+      const amount0 = Number.parseFloat(value);
+
+      if (amount0 <= 0 || !isValidPriceRange) {
+        return;
+      }
+
+      try {
+        const amount0BigInt = BigInt(Math.floor(amount0 * 10 ** poolData.token0.decimals));
+
+        const amount1BigInt = ClService.calculateAmount1FromAmount0(amount0BigInt, tickLower, tickUpper, currentTick);
+
+        const amount1 = Number(amount1BigInt) / 10 ** poolData.token1.decimals;
+        setLiquidityToken1Amount(amount1.toFixed(6));
+      } catch (err) {
+        console.error('Failed to calculate token1 amount:', err);
+      }
+    },
+    [poolData, tickLower, tickUpper, currentTick, isValidPriceRange],
+  );
+
+  // Auto-calculate token0 amount when token1 amount changes
+  const handleToken1AmountChange = useCallback(
+    (value: string): void => {
+      setLiquidityToken1Amount(value);
+      setLastEditedToken('token1');
+
+      // Only calculate if we have all required values
+      if (!value || !poolData || !tickLower || !tickUpper || !currentTick) {
+        return;
+      }
+
+      const amount1 = Number.parseFloat(value);
+
+      if (amount1 <= 0 || !isValidPriceRange) {
+        return;
+      }
+
+      try {
+        const amount1BigInt = BigInt(Math.floor(amount1 * 10 ** poolData.token1.decimals));
+
+        const amount0BigInt = ClService.calculateAmount0FromAmount1(amount1BigInt, tickLower, tickUpper, currentTick);
+
+        const amount0 = Number(amount0BigInt) / 10 ** poolData.token0.decimals;
+        setLiquidityToken0Amount(amount0.toFixed(6));
+      } catch (err) {
+        console.error('Failed to calculate token0 amount:', err);
+      }
+    },
+    [poolData, tickLower, tickUpper, currentTick, isValidPriceRange],
+  );
+
+  // Recalculate amounts when price range changes
+  useEffect(() => {
+    if (!poolData || !tickLower || !tickUpper || !lastEditedToken || !isValidPriceRange) {
+      return;
+    }
+
+    // Recalculate based on which token was last edited
+    if (lastEditedToken === 'token0' && liquidityToken0Amount) {
+      handleToken0AmountChange(liquidityToken0Amount);
+    } else if (lastEditedToken === 'token1' && liquidityToken1Amount) {
+      handleToken1AmountChange(liquidityToken1Amount);
+    }
+  }, [
+    poolData,
+    lastEditedToken,
+    liquidityToken0Amount,
+    liquidityToken1Amount,
+    handleToken0AmountChange,
+    handleToken1AmountChange,
+    tickLower,
+    tickUpper,
+    isValidPriceRange,
+  ]);
+
+  return {
+    liquidityToken0Amount,
+    liquidityToken1Amount,
+    lastEditedToken,
+    setLiquidityToken0Amount,
+    setLiquidityToken1Amount,
+    handleToken0AmountChange,
+    handleToken1AmountChange,
+  };
+}

package/src/hooks/dex/usePoolBalances.ts

@@ -0,0 +1,90 @@
+import { type QueryObserverOptions, useQuery, type UseQueryResult } from '@tanstack/react-query';
+import type { PoolData, PoolKey, SpokeProvider } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export interface UsePoolBalancesResponse {
+  token0Balance: bigint;
+  token1Balance: bigint;
+}
+
+export interface UsePoolBalancesProps {
+  poolData: PoolData | null;
+  poolKey: PoolKey | null;
+  spokeProvider: SpokeProvider | null;
+  enabled?: boolean;
+  queryOptions?: QueryObserverOptions<UsePoolBalancesResponse, Error>;
+}
+
+/**
+ * React hook to query a user's token balances for a DEX pool.
+ *
+ * Given the pool data (with token addresses), the pool's key, and a SpokeProvider,
+ * fetches the user's protocol balances for both token0 and token1 for the specified pool.
+ * Queries are auto-refreshed; advanced options can be customized via `queryOptions`.
+ *
+ * @param {UsePoolBalancesProps} props
+ *   Object containing:
+ *   - `poolData`: {PoolData | null} - Pool info (must include token0 and token1 addresses). Required unless disabling.
+ *   - `poolKey`: {PoolKey | null} - Unique key for the DEX pool. Required unless disabling.
+ *   - `spokeProvider`: {SpokeProvider | null} - Provider instance for the chain. Required unless disabling.
+ *   - `enabled`: {boolean} (optional) - Whether to enable the query. Defaults to `true` if all other arguments are provided.
+ *   - `queryOptions`: {QueryObserverOptions<UsePoolBalancesResponse, Error>} (optional) - Advanced react-query options.
+ *
+ * @returns {UseQueryResult<UsePoolBalancesResponse, Error>}
+ *   React Query result object:
+ *   - `data`: `{ token0Balance: bigint, token1Balance: bigint }` if loaded, undefined otherwise.
+ *   - `isLoading`, `isError`, etc. for status handling.
+ *
+ * @remarks
+ * - Throws an error if any of `poolData`, `poolKey`, or `spokeProvider` is missing when enabled.
+ * - Suitable for tracking current protocol/wallet balances for both pool tokens.
+ * - The hook is designed for use within a React component tree that provides the Sodax context.
+ * - Data are automatically refreshed at the provided or default polling interval (default: refetch every 10s).
+ *
+ * @example
+ * ```typescript
+ * const { data, isLoading } = usePoolBalances({ poolData, poolKey, spokeProvider });
+ * if (data) {
+ *   console.log('Balances:', data.token0Balance, data.token1Balance);
+ * }
+ * ```
+ */
+export function usePoolBalances({
+  poolData,
+  poolKey,
+  spokeProvider,
+  enabled = true,
+  queryOptions = {
+    queryKey: [
+      'dex',
+      'poolBalances',
+      poolData?.poolKey,
+      spokeProvider?.chainConfig.chain.id,
+    ],
+    enabled: enabled && poolData !== null && poolKey !== null && spokeProvider !== null,
+    staleTime: 5000, // Consider data stale after 5 seconds
+    refetchInterval: 10000, // Refetch every 10 seconds
+  },
+}: UsePoolBalancesProps): UseQueryResult<UsePoolBalancesResponse, Error> {
+  const { sodax } = useSodaxContext();
+
+  return useQuery({
+    ...queryOptions,
+    queryFn: async () => {
+      if (!poolData || !spokeProvider || !poolKey) {
+        throw new Error('Pool data, pool key, and spoke provider are required');
+      }
+
+      // Get balances from AssetService
+      const [balance0, balance1] = await Promise.all([
+        sodax.dex.assetService.getDeposit(poolData.token0.address, spokeProvider),
+        sodax.dex.assetService.getDeposit(poolData.token1.address, spokeProvider),
+      ]);
+
+      return {
+        token0Balance: balance0,
+        token1Balance: balance1,
+      };
+    },
+  });
+}

package/src/hooks/dex/usePoolData.ts

@@ -0,0 +1,57 @@
+import { type QueryObserverOptions, useQuery, type UseQueryResult } from '@tanstack/react-query';
+import type { PoolData, PoolKey } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export type UsePoolDataProps = {
+  poolKey: PoolKey | null;
+  enabled?: boolean;
+  queryOptions?: QueryObserverOptions<PoolData, Error>;
+};
+
+/**
+ * React hook to fetch on-chain data for a given DEX pool.
+ *
+ * @param {UsePoolDataProps} props - The props object:
+ *   - `poolKey`: PoolKey | null — The unique identifier for the pool to fetch data for. If null, disables the query.
+ *   - `enabled`: boolean (optional) — Whether the query is enabled. Defaults to enabled if a poolKey is provided, otherwise false.
+ *   - `queryOptions`: QueryObserverOptions<PoolData, Error> (optional) — Additional React Query options (e.g., staleTime, refetchInterval).
+ *
+ * @returns {UseQueryResult<PoolData, Error>} React Query result containing pool data (`data`), loading state (`isLoading`), error (`error`), and status fields.
+ *
+ * @example
+ * ```typescript
+ * const { data: poolData, isLoading, error } = usePoolData({ poolKey });
+ * if (isLoading) return <div>Loading…</div>;
+ * if (error) return <div>Error!</div>;
+ * if (poolData) {
+ *   // poolData is available
+ * }
+ * ```
+ *
+ * @remarks
+ * - Refetches pool data every 30 seconds by default, and may be configured via `queryOptions`.
+ * - If `poolKey` is `null`, the query is disabled and no network request is performed.
+ * - Throws an error if `poolKey` is missing when the query is enabled.
+ */
+export function usePoolData({
+  poolKey,
+  queryOptions = {
+    queryKey: ['dex', 'poolData', poolKey],
+    enabled: poolKey !== null,
+    staleTime: 10000,
+    refetchInterval: 30000,
+  },
+}: UsePoolDataProps): UseQueryResult<PoolData, Error> {
+  const { sodax } = useSodaxContext();
+
+  return useQuery({
+    ...queryOptions,
+    queryFn: async (): Promise<PoolData> => {
+      if (!poolKey) {
+        throw new Error('Pool key is required');
+      }
+      return await sodax.dex.clService.getPoolData(poolKey, sodax.hubProvider.publicClient);
+    },
+    enabled: poolKey !== null,
+  });
+}