@0xsquid/react-hooks 1.0.4 → 1.0.5

package/src/services/internal/configService.ts

@@ -1,261 +0,0 @@
-import { defaultValues } from "@/core/constants";
-import type { AppConfig } from "@/core/types/config";
-import type { ChainData, Token } from "@0xsquid/sdk/dist/types";
-import { ChainType } from "@0xsquid/sdk/dist/types";
-import get from "lodash/get";
-import { shareSubgraphId } from "./assetsService";
-
-export const getConfigWithDefaults = (
-  config: AppConfig | undefined
-): AppConfig => {
-  return {
-    integratorId: get(
-      config,
-      "integratorId",
-      defaultValues.config.integratorId
-    ),
-    companyName: get(config, "companyName", defaultValues.config.companyName),
-    slippage: get(config, "slippage", defaultValues.config.slippage),
-    advanced: get(config, "advanced", defaultValues.config.advanced),
-    internalSameChainSwapAllowed: get(
-      config,
-      "internalSameChainSwapAllowed",
-      defaultValues.config.internalSameChainSwapAllowed
-    ),
-    hideAnimations: get(
-      config,
-      "hideAnimations",
-      defaultValues.config.hideAnimations
-    ),
-    infiniteApproval: get(
-      config,
-      "infiniteApproval",
-      defaultValues.config.infiniteApproval
-    ),
-    enableExpress: get(
-      config,
-      "enableExpress",
-      defaultValues.config.enableExpress
-    ),
-    collectFees: get(config, "collectFees", defaultValues.config.collectFees),
-    enableGetGasOnDestination: get(
-      config,
-      "enableGetGasOnDestination",
-      defaultValues.config.enableGetGasOnDestination
-    ),
-    apiUrl: get(config, "apiUrl", defaultValues.config.apiUrl),
-    showOnRampLink: get(
-      config,
-      "showOnRampLink",
-      defaultValues.config.showOnRampLink
-    ),
-    priceImpactWarnings: get(
-      config,
-      "priceImpactWarnings",
-      defaultValues.config.priceImpactWarnings
-    ),
-    initialAssets: get(
-      config,
-      "initialAssets",
-      defaultValues.config.initialAssets
-    ),
-    defaultTokensPerChain: get(
-      config,
-      "defaultTokensPerChain",
-      defaultValues.config.defaultTokensPerChain
-    ),
-    preferDex: get(config, "preferDex", defaultValues.config.preferDex),
-    favTokens: get(config, "favTokens", defaultValues.config.favTokens),
-    comingSoonChainIds: get(
-      config,
-      "comingSoonChainIds",
-      defaultValues.config.comingSoonChainIds
-    ),
-    availableChains: get(
-      config,
-      "availableChains",
-      defaultValues.config.availableChains
-    ),
-    onChainQuoting: get(
-      config,
-      "onChainQuoting",
-      defaultValues.config.onChainQuoting
-    ),
-    disabledChains: get(
-      config,
-      "disabledChains",
-      defaultValues.config.disabledChains
-    ),
-  };
-};
-
-export const randomIntFromInterval = (min: number, max: number) => {
-  return Math.floor(Math.random() * (max - min + 1) + min);
-};
-
-export const getTokensForChain = (
-  tokens: Token[],
-  chainId: number | string | undefined
-) => {
-  return chainId ? tokens.filter((t) => t.chainId === chainId) : tokens;
-};
-
-export const getFirstAvailableChainId = (
-  config: AppConfig,
-  direction: "from" | "to",
-  chains: ChainData[] | undefined = []
-) => {
-  // available chains are those that are not coming soon or disabled chains
-  const availableChains = chains.filter(
-    (c) =>
-      !config.comingSoonChainIds?.find((id) => id === c.chainId) &&
-      !config.disabledChains?.[
-        direction === "from" ? "source" : "destination"
-      ]?.some((id) => id === c.chainId)
-  );
-
-  if (
-    direction === "from" &&
-    config.initialAssets?.from &&
-    availableChains.some(
-      (c) => c.chainId === String(config.initialAssets?.from?.chainId)
-    )
-  ) {
-    return config.initialAssets.from.chainId;
-  }
-
-  if (
-    direction === "to" &&
-    config.initialAssets?.to &&
-    availableChains.some(
-      (c) => c.chainId === String(config.initialAssets?.to?.chainId)
-    )
-  ) {
-    return config.initialAssets.to.chainId;
-  }
-
-  return availableChains.length > 0 ? availableChains[0].chainId : undefined;
-};
-
-export const getDefaultTokenAddressForChain = (
-  tokens: Token[],
-  config: AppConfig,
-  chainId: number | string | undefined,
-  unavailableTokenAddress?: string
-): string | undefined => {
-  const chainIdDefaultToken = config.defaultTokensPerChain?.find(
-    (token) => token.chainId == chainId
-  );
-
-  if (
-    chainIdDefaultToken &&
-    chainIdDefaultToken.address !== unavailableTokenAddress
-  ) {
-    return chainIdDefaultToken.address;
-  }
-
-  const filteredTokens = chainId
-    ? tokens.filter(
-        (t) => t.chainId === chainId && t.address !== unavailableTokenAddress
-      )
-    : tokens;
-
-  return filteredTokens.length > 0 ? filteredTokens[0].address : undefined;
-};
-
-/**
- * Retrieves the initial token address for a specific chain and direction.
- * If no initial assets are set in config, returns the default token address for the chain.
- *
- * @param tokens - The list of tokens.
- * @param config - The application configuration.
- * @param chainId - The ID of the chain.
- * @param direction - The direction ("from" or "to").
- * @returns The initial token address if found; otherwise, the default token address.
- */
-export const getInitialOrDefaultTokenAddressForChain = ({
-  chainId,
-  config,
-  direction,
-  tokens,
-  unavailableTokenAddress,
-}: {
-  tokens: Token[];
-  config: AppConfig;
-  chainId: number | string | undefined;
-  direction: "from" | "to";
-  unavailableTokenAddress?: string;
-}): string | undefined => {
-  if (
-    direction === "from" &&
-    config.initialAssets?.from &&
-    config.initialAssets.from.chainId === chainId
-  ) {
-    return config.initialAssets.from.address;
-  }
-
-  if (
-    direction === "to" &&
-    config.initialAssets?.to &&
-    config.initialAssets.to.chainId === chainId
-  ) {
-    return config.initialAssets.to.address;
-  }
-
-  return getDefaultTokenAddressForChain(
-    tokens,
-    config,
-    chainId,
-    unavailableTokenAddress
-  );
-};
-
-/**
- * Filter tokens for destination chain
- *
- * Case 1: fromToken.bridgeOnly = true
- * Destination token list shows only tokens with the same commonKey as fromToken
- *
- * Case 2: fromToken.bridgeOnly = false
- * Destination token list shows all tokens with bridgeOnly = false
- * OR Destination token list shows all tokens with the same commonKey as fromToken
- * @param tokens
- * @param selectedDestinationChain
- * @param selectedSourceChainID
- * @param selectedSourceToken
- * @returns
- */
-export const filterTokensForDestination = <T extends Token>(
-  tokens: T[],
-  selectedDestinationChain: ChainData | undefined,
-  selectedSourceToken: Token | undefined
-): T[] => {
-  let filteredTokens = [];
-
-  if (selectedSourceToken?.subGraphOnly) {
-    filteredTokens = tokens.filter(
-      (t) =>
-        shareSubgraphId(t, selectedSourceToken) &&
-        t.chainId === selectedDestinationChain?.chainId
-    );
-  }
-
-  filteredTokens = tokens.filter(
-    (t) => !t.subGraphOnly || shareSubgraphId(t, selectedSourceToken as Token)
-  );
-
-  // We don't want to show the same source token & chain in the destination list
-  // except for Cosmos swaps
-  return filteredTokens.filter((t) => {
-    const areSameToken =
-      t.address === selectedSourceToken?.address &&
-      t.chainId === selectedSourceToken.chainId;
-
-    // only return tokens that are on the same chain as the destination chain
-    const isValidChain = t.chainId === selectedDestinationChain?.chainId;
-    const isCosmosSwap =
-      selectedDestinationChain?.chainType === ChainType.COSMOS;
-
-    return isValidChain && (isCosmosSwap || !areSameToken);
-  });
-};

package/src/services/internal/eventService.ts

@@ -1,93 +0,0 @@
-import type { EventListenerFunction, WidgetEventMap } from "@/core/types/event";
-import type { RouteResponse } from "@0xsquid/sdk/dist/types";
-
-export class WidgetEvents extends EventTarget {
-  private static instance: WidgetEvents;
-
-  private constructor() {
-    super();
-  }
-
-  // Singleton, because we need to access this service outside the widget
-  public static getInstance(): WidgetEvents {
-    if (!WidgetEvents.instance) {
-      WidgetEvents.instance = new WidgetEvents();
-    }
-    return WidgetEvents.instance;
-  }
-
-  /**
-   * Overriding the addEventListener method to make it easier to use with typescript
-   * @param type
-   * @param listener
-   * @param options
-   */
-  listenToWidget<T extends keyof WidgetEventMap>(
-    type: T,
-    listener: EventListenerFunction<T>,
-    options?: boolean | AddEventListenerOptions
-  ) {
-    super.addEventListener(type, listener as unknown as EventListener, options);
-  }
-
-  /**
-   * Overriding the removeEventListener method to make it easier to use with typescript
-   * @param type
-   * @param listener
-   * @param options
-   */
-  removeWidgetListener<T extends keyof WidgetEventMap>(
-    type: T,
-    listener: EventListenerFunction<T>,
-    options?: boolean | EventListenerOptions
-  ) {
-    super.removeEventListener(
-      type,
-      listener as unknown as EventListener,
-      options
-    );
-  }
-
-  /**
-   * Dispatch an event of the widget
-   * To be listened from an integrator website
-   * For example to display a success message when transaction is done
-   * @param name
-   * @param data
-   */
-  dispatch<T extends keyof WidgetEventMap>(name: T, data: WidgetEventMap[T]) {
-    this.dispatchEvent(new CustomEvent(name, { detail: data }));
-  }
-
-  /**
-   * Will dispatch the main axelar status of transaction
-   * This will be called every time the status is received by backend
-   * (Using interval to check status)
-   * @param status
-   */
-  dispatchSwapStatus(status: string) {
-    this.dispatch("swapStatus", { status });
-  }
-
-  /**
-   * Dispatch event when user executes a swap
-   * Only when we have the tx hash received
-   * @param route
-   */
-  dispatchSwapExecuteCall(route: RouteResponse["route"], txHash: string) {
-    this.dispatch("swap", { route, txHash });
-  }
-
-  /**
-   * Dispatch event when user changes chain/token
-   * @param swapParams
-   */
-  dispatchSwapParamsChanged(swapParams: {
-    fromChainId?: string;
-    toChainId?: string;
-    fromTokenAddress?: string;
-    toTokenAddress?: string;
-  }) {
-    this.dispatch("swapParamsChanged", { ...swapParams });
-  }
-}

package/src/services/internal/priceService.ts

@@ -1,10 +0,0 @@
-import { BigNumber as BN } from "bignumber.js";
-
-export const convertTokenAmountToUSD = (
-  tokenAmount: string,
-  priceUSD?: string
-) => {
-  return BN(tokenAmount)
-    .multipliedBy(priceUSD ?? "0")
-    .toFixed();
-};

package/src/services/internal/transactionService.ts

@@ -1,255 +0,0 @@
-import type {
-  TransactionHistoryStore,
-  TransactionParams,
-  TransactionStatus,
-} from "@/core/types/transaction";
-import { TransactionType } from "@/core/types/transaction";
-import { usePersistStore } from "@/hooks/store/useSquidStore";
-import type { ChainData } from "@0xsquid/sdk/dist/types";
-
-/**
- * Helper to find the desired transaction history in array
- * @param transactionID
- * @returns
- */
-export const findHistoryItem = (
-  transactionID: string | undefined
-): TransactionHistoryStore | undefined => {
-  // TODO: This works but could be improved, persistStore shouldnt be used directly
-  // Or move this inside a callback hook
-  return usePersistStore
-    .getState()
-    .transactionsHistory?.find((th) => th.transactionId === transactionID);
-};
-
-/**
- * Will return the same object but with the desired transaction history
- * Status changed
- * @param transactionID
- * @param status
- * @param transactionsHistory
- * @param statusResponse
- * @returns
- */
-export const updateTransactionHistoryStatus = (
-  transactionID: string | undefined,
-  status: TransactionStatus,
-  transactionsHistory: TransactionHistoryStore[] | undefined,
-  statusResponse: any | undefined
-): TransactionHistoryStore[] => {
-  return (
-    transactionsHistory?.map((th) => {
-      // Use the status response from the query if available, if not, use the one from the store
-      statusResponse = statusResponse ?? th.statusResponse;
-
-      // If the transaction is already in the store and had a different status, update status
-      if (th.transactionId === transactionID && th.status !== status) {
-        return {
-          ...th,
-          status,
-          statusResponse,
-          axelarUrl: statusResponse?.axelarTransactionUrl,
-          sourceTxExplorerUrl: statusResponse?.fromChain?.transactionUrl,
-        };
-      }
-      return {
-        ...th,
-        axelarUrl: statusResponse?.axelarTransactionUrl,
-        sourceTxExplorerUrl: statusResponse?.fromChain?.transactionUrl,
-      };
-    }) ?? []
-  );
-};
-
-export const replaceTransactionAtNonce = (
-  nonce: number,
-  fromAddress: string,
-  transactionsHistory: TransactionHistoryStore[] | undefined,
-  TransactionHistoryStore: TransactionHistoryStore
-): TransactionHistoryStore[] => {
-  const newTransactionsHistory: TransactionHistoryStore[] =
-    transactionsHistory ?? [];
-  // Find the transaction with the same nonce and from address
-  const transactionIndex = transactionsHistory?.findIndex(
-    (th) => th.nonce === nonce && th.fromAddress === fromAddress
-  );
-  // If found, replace it with the new transaction
-  if (transactionIndex !== undefined && transactionIndex !== -1) {
-    newTransactionsHistory[transactionIndex] = TransactionHistoryStore;
-  }
-
-  return newTransactionsHistory;
-};
-
-export const formatTransactionHistoryDate = (
-  transaction: TransactionHistoryStore | undefined
-): { month: string; day: string } | undefined => {
-  if (!transaction?.timestamp) return undefined;
-
-  try {
-    const date = new Date(Number(transaction.timestamp));
-
-    // Format date to: MMM DD. Examples:
-    // Jan 01
-    // May 12
-    const month = new Intl.DateTimeFormat("en-US", { month: "short" }).format(
-      date
-    );
-    const day = date.toLocaleString("en-US", { day: "2-digit" });
-
-    return { month, day };
-  } catch (error) {
-    console.error("Error formatting date:", error);
-    return undefined;
-  }
-};
-
-export const getAxelarExplorerTxUrl = (
-  urlPrefix: string | undefined,
-  routeType: string | undefined,
-  txID: string
-): string | undefined => {
-  if (!urlPrefix) {
-    return undefined;
-  }
-  const txType = (routeType as TransactionType) ?? TransactionType.BRIDGE;
-  if (
-    txType === TransactionType.CALL_BRIDGE ||
-    txType === TransactionType.BRIDGE
-  ) {
-    return `${urlPrefix}transfer/${txID}`;
-  }
-  return `${urlPrefix}gmp/${txID}`;
-};
-
-export const getSourceExplorerTxUrl = (
-  chain: ChainData | undefined,
-  txID: string
-): string | undefined => {
-  if (!chain || !chain.blockExplorerUrls[0]) {
-    return undefined;
-  }
-
-  let txSuffix: string;
-
-  switch (chain.chainId) {
-    case "agoric-3":
-      txSuffix = "/transactions/";
-      break;
-    default:
-      txSuffix = "/tx/";
-  }
-
-  if (chain.blockExplorerUrls[0].endsWith("/")) {
-    txSuffix = txSuffix.slice(1);
-  }
-
-  return `${chain.blockExplorerUrls[0]}${txSuffix}${txID}`;
-};
-
-export const getMainExplorerUrl = (transaction?: TransactionParams) => {
-  // The most accurate one is coming from squid /status api
-  if (transaction?.statusResponse?.axelarTransactionUrl) {
-    return transaction?.statusResponse.axelarTransactionUrl;
-  }
-
-  // If not, we can try to get it from the source chain
-  if (transaction?.sourceTxExplorerUrl) {
-    return transaction?.sourceTxExplorerUrl;
-  }
-
-  // If not, we can try to guess it from the transaction type
-  if (transaction && transaction?.transactionId) {
-    return getAxelarExplorerTxUrl(
-      transaction.statusResponse?.axelarTransactionUrl,
-      transaction.routeType,
-      transaction.transactionId
-    );
-  }
-
-  return undefined;
-};
-
-/**
- * A CCTP Transaction is one that is not using Axelar, but using Circle Mint & Burn mechanism
- * Squid API is using a different status endpoint to track status of CCTP transactions
- * @param transaction
- * @returns
- */
-export const isCCTPBridge = (transaction: TransactionParams | undefined) => {
-  return (
-    transaction?.fromChain?.chainId.includes("noble") ||
-    transaction?.toChain?.chainId.includes("noble")
-  );
-};
-
-export const formatDistance = (
-  date: number | Date,
-  baseDate: number | Date,
-  options?: {
-    includeSeconds?: boolean | undefined;
-    addSuffix?: boolean | undefined;
-    locale?: Locale | undefined;
-  }
-): string => {
-  const {
-    includeSeconds = false,
-    addSuffix = false,
-    locale = { locale: "en-US" },
-  } = options || {};
-
-  const elapsedMilliseconds = Math.abs(
-    new Date(date).getTime() - new Date(baseDate).getTime()
-  );
-
-  const seconds = Math.round(elapsedMilliseconds / 1000);
-  const minutes = Math.round(seconds / 60);
-  const hours = Math.round(minutes / 60);
-  const days = Math.round(hours / 24);
-  const months = Math.round(days / 30.44);
-  const years = Math.round(days / 365.25);
-
-  const rtf = new Intl.RelativeTimeFormat(locale.locale, { numeric: "auto" });
-
-  let formatted = "";
-
-  if (includeSeconds && seconds < 45) {
-    const unit = addSuffix ? "second" : "seconds";
-    formatted = rtf.format(-seconds, unit);
-  } else if (minutes < 60) {
-    formatted = rtf.format(-minutes, "minutes");
-  } else if (hours < 24) {
-    formatted = rtf.format(-hours, "hours");
-  } else if (days < 30) {
-    formatted = rtf.format(-days, "days");
-  } else if (months < 12) {
-    formatted = rtf.format(-months, "months");
-  } else {
-    formatted = rtf.format(-years, "years");
-  }
-
-  // remove "ago" from the string
-  // before: "2 minutes ago"
-  // after: "2 minutes"
-  return addSuffix ? formatted : formatted.replace(/\b(?:ago)\b/, "").trim();
-};
-
-export const formatSeconds = (
-  seconds: number,
-  secondsTemplate: string = " seconds",
-  minutesTemplate: string = " minutes"
-) => {
-  let duration = "";
-  if (seconds < 60) {
-    duration = `${seconds.toString()}${secondsTemplate}`;
-  } else {
-    duration = formatDistance(0, seconds * 1000, { includeSeconds: true });
-  }
-  return duration
-    .replace(" minutes", minutesTemplate)
-    .replace(" minute", minutesTemplate);
-};
-
-interface Locale {
-  locale?: string;
-}