@sodax/dapp-kit 0.0.1-rc.1

package/src/hooks/mm/useRepay.ts

@@ -0,0 +1,56 @@
+import type { SpokeChainId } from '@sodax/sdk';
+import type { ChainId, XToken } from '@sodax/types';
+import { useMutation, type UseMutationResult } from '@tanstack/react-query';
+import { parseUnits } from 'viem';
+import { useSpokeProvider } from '../provider/useSpokeProvider';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+interface RepayResponse {
+  ok: true;
+  value: [`0x${string}`, `0x${string}`];
+}
+
+/**
+ * Hook for repaying borrowed tokens to the Sodax money market.
+ *
+ * This hook provides functionality to repay borrowed tokens back to the money market protocol,
+ * handling the entire repayment process including transaction creation, submission,
+ * and cross-chain communication.
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: repay, isPending, error } = useRepay(hubToken, spokeChainId);
+ * await repay('100');
+ * ```
+ *
+ * @throws {Error} When:
+ *   - spokeProvider is not available
+ *   - Transaction execution fails
+ */
+export function useRepay(hubToken: XToken, spokeChainId: ChainId): UseMutationResult<RepayResponse, Error, string> {
+  const { sodax } = useSodaxContext();
+  const spokeProvider = useSpokeProvider(spokeChainId as SpokeChainId);
+
+  return useMutation<RepayResponse, Error, string>({
+    mutationFn: async (amount: string) => {
+      if (!spokeProvider) {
+        throw new Error('spokeProvider is not found');
+      }
+
+      const response = await sodax.moneyMarket.repayAndSubmit(
+        {
+          token: hubToken.address,
+          amount: parseUnits(amount, hubToken.decimals),
+        },
+        spokeProvider,
+      );
+
+      if (!response.ok) {
+        throw new Error('Failed to repay tokens');
+      }
+
+      console.log('Repay transaction submitted:', response);
+      return response;
+    },
+  });
+}

package/src/hooks/mm/useSupply.ts

@@ -0,0 +1,62 @@
+import type { SpokeChainId } from '@sodax/sdk';
+import type { XToken } from '@sodax/types';
+import { useMutation, type UseMutationResult } from '@tanstack/react-query';
+import { parseUnits } from 'viem';
+import { useSpokeProvider } from '../provider/useSpokeProvider';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+interface SupplyResponse {
+  ok: true;
+  value: [`0x${string}`, `0x${string}`];
+}
+
+/**
+ * Hook for supplying tokens to the Sodax money market.
+ *
+ * This hook provides functionality to supply tokens to the money market protocol,
+ * handling the entire supply process including transaction creation, submission,
+ * and cross-chain communication.
+ *
+ * @param {XToken} spokeToken - The token to supply on the spoke chain. Must be an XToken with valid address and chain information.
+ *
+ * @returns {UseMutationResult<SupplyResponse, Error, string>} A mutation result object with the following properties:
+ *   - mutateAsync: Function to execute the supply transaction
+ *   - isPending: Boolean indicating if a transaction is in progress
+ *   - error: Error object if the last transaction failed, null otherwise
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: supply, isPending, error } = useSupply(spokeToken);
+ * await supply('100');
+ * ```
+ *
+ * @throws {Error} When:
+ *   - spokeProvider is not available
+ */
+export function useSupply(spokeToken: XToken): UseMutationResult<SupplyResponse, Error, string> {
+  const { sodax } = useSodaxContext();
+  const spokeProvider = useSpokeProvider(spokeToken.xChainId as SpokeChainId);
+
+  return useMutation<SupplyResponse, Error, string>({
+    mutationFn: async (amount: string) => {
+      if (!spokeProvider) {
+        throw new Error('spokeProvider is not found');
+      }
+
+      const response = await sodax.moneyMarket.supplyAndSubmit(
+        {
+          token: spokeToken.address,
+          amount: parseUnits(amount, spokeToken.decimals),
+        },
+        spokeProvider,
+      );
+
+      if (!response.ok) {
+        throw new Error('Failed to supply tokens');
+      }
+
+      console.log('Supply transaction submitted:', response);
+      return response;
+    },
+  });
+}

package/src/hooks/mm/useUserReservesData.ts

@@ -0,0 +1,58 @@
+import { allXTokens } from '@/core';
+import { getMoneyMarketConfig, type EvmHubProvider } from '@sodax/sdk';
+import type { HubChainId, SpokeChainId } from '@sodax/types';
+import { useXAccount, useWalletProvider } from '@sodax/wallet-sdk';
+import type { ChainId } from '@sodax/types';
+import { useQuery } from '@tanstack/react-query';
+import { useHubProvider } from '../provider/useHubProvider';
+import { useHubWalletAddress } from './useHubWalletAddress';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export function useUserReservesData(spokeChainId: ChainId) {
+  const { sodax } = useSodaxContext();
+  const hubChainId = (sodax.config?.hubProviderConfig?.chainConfig.chain.id ?? 'sonic') as HubChainId;
+  const hubWalletProvider = useWalletProvider(hubChainId);
+  const hubProvider = useHubProvider();
+  const { address } = useXAccount(spokeChainId);
+  const { data: hubWalletAddress } = useHubWalletAddress(
+    spokeChainId as SpokeChainId,
+    address,
+    hubProvider as EvmHubProvider,
+  );
+
+  const { data: userReserves } = useQuery({
+    queryKey: ['userReserves', hubWalletAddress],
+    queryFn: async () => {
+      if (!hubWalletProvider) {
+        return;
+      }
+
+      if (!hubWalletAddress) {
+        return;
+      }
+
+      const moneyMarketConfig = getMoneyMarketConfig(hubChainId);
+      try {
+        const [res] = await sodax.moneyMarket.getUserReservesData(
+          hubWalletAddress as `0x${string}`,
+          moneyMarketConfig.uiPoolDataProvider,
+          moneyMarketConfig.poolAddressesProvider,
+        );
+
+        return res?.map(r => {
+          return {
+            ...r,
+            token: allXTokens.find(t => t.address === r.underlyingAsset),
+          };
+        });
+      } catch (error) {
+        console.log('error', error);
+        return;
+      }
+    },
+    enabled: !!address && !!hubWalletProvider && !!hubWalletAddress,
+    refetchInterval: 5000,
+  });
+
+  return userReserves;
+}

package/src/hooks/mm/useWithdraw.ts

@@ -0,0 +1,59 @@
+import type { SpokeChainId } from '@sodax/sdk';
+import type { ChainId, XToken } from '@sodax/types';
+import { useMutation, type UseMutationResult } from '@tanstack/react-query';
+import { parseUnits } from 'viem';
+import { useSpokeProvider } from '../provider/useSpokeProvider';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+interface WithdrawResponse {
+  ok: true;
+  value: [`0x${string}`, `0x${string}`];
+}
+
+/**
+ * Hook for withdrawing supplied tokens from the Sodax money market.
+ *
+ * This hook provides functionality to withdraw previously supplied tokens from the money market protocol,
+ * handling the entire withdrawal process including transaction creation, submission,
+ * and cross-chain communication.
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: withdraw, isPending, error } = useWithdraw(hubToken, spokeChainId);
+ * await withdraw('100');
+ * ```
+ *
+ * @throws {Error} When:
+ *   - spokeProvider is not available
+ *   - Transaction execution fails
+ */
+export function useWithdraw(
+  hubToken: XToken,
+  spokeChainId: ChainId,
+): UseMutationResult<WithdrawResponse, Error, string> {
+  const { sodax } = useSodaxContext();
+  const spokeProvider = useSpokeProvider(spokeChainId as SpokeChainId);
+
+  return useMutation<WithdrawResponse, Error, string>({
+    mutationFn: async (amount: string) => {
+      if (!spokeProvider) {
+        throw new Error('spokeProvider is not found');
+      }
+
+      const response = await sodax.moneyMarket.withdrawAndSubmit(
+        {
+          token: hubToken.address,
+          amount: parseUnits(amount, hubToken.decimals),
+        },
+        spokeProvider,
+      );
+
+      if (!response.ok) {
+        throw new Error('Failed to withdraw tokens');
+      }
+
+      console.log('Withdraw transaction submitted:', response);
+      return response;
+    },
+  });
+}

package/src/hooks/provider/index.ts

@@ -0,0 +1,2 @@
+export * from './useHubProvider';
+export * from './useSpokeProvider';

package/src/hooks/provider/useHubProvider.ts

@@ -0,0 +1,27 @@
+import { EvmHubProvider, getHubChainConfig, type HubChainId } from '@sodax/sdk';
+import { getXChainType } from '@sodax/wallet-sdk';
+import { useMemo } from 'react';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+export function useHubProvider(): EvmHubProvider | undefined {
+  const { sodax } = useSodaxContext();
+  const hubChainId = sodax.config?.hubProviderConfig?.chainConfig.chain.id;
+  const hubRpcUrl = sodax.config?.hubProviderConfig?.hubRpcUrl;
+  const xChainType = getXChainType(hubChainId);
+  const hubProvider = useMemo(() => {
+    if (xChainType === 'EVM' && hubChainId && hubRpcUrl) {
+      // @ts-ignore
+      const hubChainCfg = getHubChainConfig(hubChainId);
+
+      if (!hubChainCfg) return undefined;
+
+      return new EvmHubProvider({
+        hubRpcUrl: hubRpcUrl,
+        chainConfig: hubChainCfg,
+      });
+    }
+    return undefined;
+  }, [xChainType, hubChainId, hubRpcUrl]);
+
+  return hubProvider;
+}

package/src/hooks/provider/useSpokeProvider.ts

@@ -0,0 +1,23 @@
+import { EvmSpokeProvider, spokeChainConfig, SuiSpokeProvider } from '@sodax/sdk';
+import type { SpokeChainId } from '@sodax/types';
+import { getXChainType, useWalletProvider } from '@sodax/wallet-sdk';
+import { useMemo } from 'react';
+
+export function useSpokeProvider(spokeChainId: SpokeChainId) {
+  const xChainType = getXChainType(spokeChainId);
+  const walletProvider = useWalletProvider(spokeChainId);
+  const spokeProvider = useMemo(() => {
+    if (!walletProvider) return undefined;
+    if (xChainType === 'EVM') {
+      // @ts-ignore
+      return new EvmSpokeProvider(walletProvider, spokeChainConfig[spokeChainId]);
+    }
+    if (xChainType === 'SUI') {
+      // @ts-ignore
+      return new SuiSpokeProvider(spokeChainConfig[spokeChainId], walletProvider);
+    }
+    return undefined;
+  }, [walletProvider, xChainType, spokeChainId]);
+
+  return spokeProvider;
+}

package/src/hooks/shared/index.ts

@@ -0,0 +1,3 @@
+export * from './useSodaxContext';
+export * from './useAllowance';
+export * from './useApprove';

package/src/hooks/shared/useAllowance.ts

@@ -0,0 +1,31 @@
+import { useQuery } from '@tanstack/react-query';
+import type { SpokeChainId, XToken } from '@sodax/types';
+import { useSodaxContext } from '../shared/useSodaxContext';
+import { useSpokeProvider } from '../provider/useSpokeProvider';
+import { parseUnits } from 'viem';
+
+export function useAllowance(token: XToken, amount: string) {
+  const { sodax } = useSodaxContext();
+  const spokeProvider = useSpokeProvider(token.xChainId as SpokeChainId);
+
+  return useQuery({
+    queryKey: ['allowance', token.address, amount],
+    queryFn: async () => {
+      if (!spokeProvider) {
+        return false;
+      }
+      const allowance = await sodax.moneyMarket.isAllowanceValid(
+        {
+          token: token.address,
+          amount: parseUnits(amount, token.decimals),
+        },
+        spokeProvider,
+      );
+      if (allowance.ok) {
+        return allowance.value;
+      }
+      return false;
+    },
+    enabled: !!spokeProvider,
+  });
+}

package/src/hooks/shared/useApprove.ts

@@ -0,0 +1,53 @@
+import { useSodaxContext } from '../shared/useSodaxContext';
+import { useSpokeProvider } from '../provider/useSpokeProvider';
+import type { SpokeChainId, XToken } from '@sodax/types';
+import { parseUnits } from 'viem';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import type { Address } from '@sodax/sdk';
+
+interface UseApproveReturn {
+  approve: (amount: string) => Promise<boolean>;
+  isLoading: boolean;
+  error: Error | null;
+  resetError: () => void;
+}
+
+export function useApprove(token: XToken): UseApproveReturn {
+  const { sodax } = useSodaxContext();
+  const spokeProvider = useSpokeProvider(token.xChainId as SpokeChainId);
+  const queryClient = useQueryClient();
+
+  const {
+    mutateAsync: approve,
+    isPending,
+    error,
+    reset: resetError,
+  } = useMutation({
+    mutationFn: async (amount: string) => {
+      if (!spokeProvider) {
+        throw new Error('Spoke provider not found');
+      }
+      const allowance = await sodax.moneyMarket.approve(
+        token.address as Address,
+        parseUnits(amount, token.decimals),
+        spokeProvider.chainConfig.addresses.assetManager as Address,
+        spokeProvider,
+      );
+      if (!allowance.ok) {
+        throw new Error('Failed to approve tokens');
+      }
+      return allowance.ok;
+    },
+    onSuccess: () => {
+      // Invalidate allowance query to refetch the new allowance
+      queryClient.invalidateQueries({ queryKey: ['allowance', token.address] });
+    },
+  });
+
+  return {
+    approve,
+    isLoading: isPending,
+    error: error as Error | null,
+    resetError,
+  };
+}

package/src/hooks/shared/useSodaxContext.ts

@@ -0,0 +1,16 @@
+import { SodaxContext, type SodaxContextType } from '@/contexts';
+import { useContext } from 'react';
+
+/**
+ * Hook to access the Sodax context which provides access to the Sodax SDK instance and chain configuration
+ * @throws {Error} If used outside of a SodaxProvider
+ * @returns {SodaxContextType} The Sodax context containing SDK instance and configuration
+ */
+
+export const useSodaxContext = (): SodaxContextType => {
+  const context = useContext(SodaxContext);
+  if (!context) {
+    throw new Error('useSodaxContext must be used within a SodaxProvider');
+  }
+  return context;
+};

package/src/hooks/swap/index.ts

@@ -0,0 +1,3 @@
+export * from './useQuote';
+export * from './useCreateIntentOrder';
+export * from './useStatus';

package/src/hooks/swap/useCreateIntentOrder.ts

@@ -0,0 +1,57 @@
+import { useSodaxContext } from '../shared/useSodaxContext';
+import type {
+  CreateIntentParams,
+  SpokeChainId,
+  IntentExecutionResponse,
+  Result,
+  IntentSubmitErrorCode,
+  Intent,
+  PacketData,
+  IntentSubmitError,
+} from '@sodax/sdk';
+import { useSpokeProvider } from '../provider/useSpokeProvider';
+import { useMutation, type UseMutationResult } from '@tanstack/react-query';
+
+type CreateIntentResult = Result<
+  [IntentExecutionResponse, Intent, PacketData],
+  IntentSubmitError<IntentSubmitErrorCode>
+>;
+
+/**
+ * Hook for creating and submitting an intent order for cross-chain swaps.
+ * Uses React Query's useMutation for better state management and caching.
+ *
+ * @param {SpokeChainId} chainId - The source chain ID where the swap will originate
+ * @returns {UseMutationResult} Mutation result object containing mutation function and state
+ *
+ * @example
+ * ```typescript
+ * const { mutateAsync: createIntent, isPending } = useCreateIntentOrder('0xa4b1.arbitrum');
+ *
+ * const handleSwap = async () => {
+ *   const result = await createIntent({
+ *     token_src: '0x...',
+ *     token_src_blockchain_id: 'arbitrum',
+ *     token_dst: '0x...',
+ *     token_dst_blockchain_id: 'polygon',
+ *     amount: '1000000000000000000',
+ *     min_output_amount: '900000000000000000'
+ *   });
+ * };
+ * ```
+ */
+export function useCreateIntentOrder(
+  chainId: SpokeChainId,
+): UseMutationResult<CreateIntentResult, Error, CreateIntentParams> {
+  const { sodax } = useSodaxContext();
+  const spokeProvider = useSpokeProvider(chainId);
+
+  return useMutation<CreateIntentResult, Error, CreateIntentParams>({
+    mutationFn: async (params: CreateIntentParams) => {
+      if (!spokeProvider) {
+        throw new Error('Spoke provider not found');
+      }
+      return sodax.solver.createAndSubmitIntent(params, spokeProvider);
+    },
+  });
+}

package/src/hooks/swap/useQuote.ts

@@ -0,0 +1,55 @@
+import type { IntentErrorResponse, IntentQuoteRequest, IntentQuoteResponse, Result } from '@sodax/sdk';
+import { useSodaxContext } from '../shared/useSodaxContext';
+import { useQuery, type UseQueryResult } from '@tanstack/react-query';
+
+/**
+ * Hook for fetching a quote for an intent-based swap.
+ *
+ * This hook provides real-time quote data for an intent-based swap.
+ *
+ * @param {IntentQuoteRequest | undefined} payload - The intent quote request parameters. If undefined, the query will be disabled.
+ *
+ * @returns {UseQueryResult<Result<IntentQuoteResponse, IntentErrorResponse> | undefined>} A query result object containing:
+ *   - data: The quote result from the solver
+ *   - isLoading: Boolean indicating if the quote is being fetched
+ *   - error: Error object if the quote request failed
+ *   - refetch: Function to manually trigger a quote refresh
+ *
+ * @example
+ * ```typescript
+ * const { data: quote, isLoading } = useQuote({
+ *   token_src: '0x...',
+ *   token_src_blockchain_id: '1',
+ *   token_dst: '0x...',
+ *   token_dst_blockchain_id: '2',
+ *   amount: '1000000000000000000',
+ *   quote_type: 'exact_input',
+ * });
+ *
+ * if (isLoading) return <div>Loading quote...</div>;
+ * if (quote) {
+ *   console.log('Quote received:', quote);
+ * }
+ * ```
+ *
+ * @remarks
+ * - The quote is automatically refreshed every 3 seconds
+ * - The query is disabled when payload is undefined
+ * - Uses React Query for efficient caching and state management
+ */
+export const useQuote = (
+  payload: IntentQuoteRequest | undefined,
+): UseQueryResult<Result<IntentQuoteResponse, IntentErrorResponse> | undefined> => {
+  const { sodax } = useSodaxContext();
+  return useQuery({
+    queryKey: [payload],
+    queryFn: async () => {
+      if (!payload) {
+        return undefined;
+      }
+      return sodax.solver.getQuote(payload);
+    },
+    enabled: !!payload,
+    refetchInterval: 3000,
+  });
+};

package/src/hooks/swap/useStatus.ts

@@ -0,0 +1,44 @@
+import type { Hex, IntentErrorResponse, IntentStatusResponse, Result } from '@sodax/sdk';
+import { useQuery, type UseQueryResult } from '@tanstack/react-query';
+import { useSodaxContext } from '../shared/useSodaxContext';
+
+/**
+ * Hook for monitoring the status of an intent-based swap.
+ *
+ * This hook provides real-time status updates for an intent-based swap transaction.
+ *
+ * @param {Hex} intent_tx_hash - The transaction hash of the intent order on the hub chain
+ *
+ * @returns {UseQueryResult<Result<IntentStatusResponse, IntentErrorResponse> | undefined>} A query result object containing:
+ *   - data: The status result from the solver
+ *   - isLoading: Boolean indicating if the status is being fetched
+ *   - error: Error object if the status request failed
+ *   - refetch: Function to manually trigger a status refresh
+ *
+ * @example
+ * ```typescript
+ * const { data: status, isLoading } = useStatus('0x...');
+ *
+ * if (isLoading) return <div>Loading status...</div>;
+ * if (status?.ok) {
+ *   console.log('Status:', status.value);
+ * }
+ * ```
+ *
+ * @remarks
+ * - The status is automatically refreshed every 3 seconds
+ * - Uses React Query for efficient caching and state management
+ */
+
+export const useStatus = (
+  intent_tx_hash: Hex,
+): UseQueryResult<Result<IntentStatusResponse, IntentErrorResponse> | undefined> => {
+  const { sodax } = useSodaxContext();
+  return useQuery({
+    queryKey: [intent_tx_hash],
+    queryFn: async () => {
+      return sodax.solver.getStatus({ intent_tx_hash });
+    },
+    refetchInterval: 3000, // 3s
+  });
+};

package/src/index.ts

@@ -0,0 +1,3 @@
+export * from './hooks';
+export * from './providers';
+export * from './core';

package/src/providers/SodaxProvider.tsx

@@ -0,0 +1,16 @@
+import type { ReactNode, ReactElement } from 'react';
+import { Sodax, type SodaxConfig } from '@sodax/sdk';
+import { SodaxContext } from '@/contexts';
+import React from 'react';
+
+interface SodaxProviderProps {
+  children: ReactNode;
+  testnet?: boolean;
+  config: SodaxConfig;
+}
+
+export const SodaxProvider = ({ children, testnet = false, config }: SodaxProviderProps): ReactElement => {
+  const sodax = new Sodax(config);
+
+  return <SodaxContext.Provider value={{ sodax, testnet }}>{children}</SodaxContext.Provider>;
+};

package/src/providers/index.ts

@@ -0,0 +1 @@
+export { SodaxProvider } from './SodaxProvider';