@0xsquid/react-hooks 1.0.0

package/src/core/constants.ts

@@ -0,0 +1,549 @@
+import { ChainType } from "@0xsquid/sdk/dist/types";
+import { CoinbaseWalletConnector } from "@wagmi/connectors/coinbaseWallet";
+import { InjectedConnector } from "@wagmi/connectors/injected";
+import { MetaMaskConnector } from "@wagmi/connectors/metaMask";
+import { WalletConnectConnector } from "@wagmi/connectors/walletConnect";
+import { SquidConfigState } from "@/hooks/store/useSquidStore";
+import { walletIcons } from "@/assets/images/icons/wallets";
+import { ExodusConnector } from "@/connectors/ExodusConnector";
+import { squidApiBaseUrl } from "./externalLinks";
+import type { SlippageOption } from "./types/config";
+import type { ConnectorID, TypedWindow, Wallet } from "./types/wallet";
+import { WindowWalletFlag } from "./types/wallet";
+
+export const nativeEvmTokenAddress =
+  "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee";
+export const maxPriceImpact = 30;
+export const limitTradeSizeUsd = 10000000;
+export const defaultSlippage: SlippageOption = 1.5;
+export const chainIdResetValue = -1;
+export const destinationAddressResetValue = "null";
+export const widgetHeight = 684;
+export const widgetWidth = 440;
+export const gasRefundMultiplier = 25;
+export const transparentClass = "tw-bg-opacity-80";
+export const subTransparentClass = "tw-bg-opacity-50";
+export const backendVersion = "v2";
+
+// We need that because it's the chain id where the fallback address will be
+// Fallback address is used if a cosmos swap fails, funds will end up on the fallback address
+export const osmosisChainId = {
+  mainnet: "osmosis-1",
+  testnet: "osmo-test-5",
+};
+
+export const widgetHeaderSize = {
+  height: 60,
+  paddingY: 16,
+};
+
+export const defaultValues: SquidConfigState = {
+  config: {
+    integratorId: "squid-swap-widget-v2",
+    companyName: "Squid",
+    slippage: defaultSlippage,
+    infiniteApproval: false,
+    enableExpress: true,
+    apiUrl: squidApiBaseUrl,
+    comingSoonChainIds: [],
+    onChainQuoting: false,
+    priceImpactWarnings: {
+      warning: 3,
+      critical: 5,
+    },
+  },
+};
+
+export enum PriorityConnectors {
+  Safe = "safe",
+  LedgerLive = "ledgerLive",
+}
+
+export const wallets: Wallet[] = [
+  {
+    name: "Trust Wallet",
+    type: ChainType.EVM,
+    connectorId: "trustwallet",
+    connectorName: "Trust Wallet",
+    windowFlag: WindowWalletFlag.TrustWallet,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Trust Wallet",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.trustwallet &&
+            (window as TypedWindow)?.trustwallet
+              ? (window as TypedWindow)?.trustwallet
+              : undefined,
+        },
+      }),
+    icon: walletIcons.trustwallet,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Metamask",
+    type: ChainType.EVM,
+    connectorId: "metaMask",
+    connectorName: "MetaMask",
+    connector: (chains) => new MetaMaskConnector({ chains }),
+    icon: walletIcons.metamask,
+    windowFlag: WindowWalletFlag.MetaMask,
+    canSwitchWallets: true,
+  },
+  {
+    name: "Coinbase Wallet",
+    type: ChainType.EVM,
+    connectorId: "coinbaseWallet",
+    connectorName: "Coinbase Wallet",
+    windowFlag: WindowWalletFlag.Coinbase,
+    connector: (chains) =>
+      new CoinbaseWalletConnector({
+        chains,
+        options: { appName: "Coinbase" },
+      }),
+    icon: walletIcons.coinbase,
+    canSwitchWallets: false,
+  },
+
+  {
+    name: "XDEFI Wallet",
+    type: ChainType.EVM,
+    connectorId: "xdefi",
+    connectorName: "XDefi",
+    windowFlag: WindowWalletFlag.Xdefi,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "XDefi",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.xfi &&
+            (window as TypedWindow)?.xfi.ethereum
+              ? (window as TypedWindow)?.xfi.ethereum
+              : undefined,
+        },
+      }),
+    icon: walletIcons.xdefi,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Rabby",
+    type: ChainType.EVM,
+    connectorId: "rabby",
+    connectorName: "Rabby",
+    windowFlag: WindowWalletFlag.Rabby,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Rabby",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.ethereum &&
+            ((window as any)?.ethereum.isRabby as any)
+              ? ((window as TypedWindow)?.ethereum as any)
+              : undefined,
+        },
+      }),
+    icon: walletIcons.rabby,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Injected",
+    type: ChainType.EVM,
+    connectorId: "injected",
+    connectorName: "Injected",
+    windowFlag: WindowWalletFlag.Injected,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+      }),
+    icon: walletIcons.injected,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Zerion",
+    type: ChainType.EVM,
+    connectorId: "zerion",
+    connectorName: "Zerion",
+    windowFlag: WindowWalletFlag.Zerion,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Zerion",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.ethereum &&
+            ((window as any)?.ethereum?.isZerion as any)
+              ? ((window as any)?.zerionWallet as any)
+              : undefined,
+        },
+      }),
+    icon: walletIcons.zerion,
+    canSwitchWallets: false,
+  },
+  {
+    name: "WalletConnect",
+    type: ChainType.EVM,
+    connectorId: "walletConnect",
+    connectorName: "WalletConnect",
+    windowFlag: WindowWalletFlag.WalletConnect,
+    connector: (chains) =>
+      new WalletConnectConnector({
+        chains,
+        options: {
+          showQrModal: true,
+          projectId: "db6a4f6ff58e4172b2fd52f01360bc49",
+        },
+      }),
+    icon: walletIcons.walletConnect,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Blockchain.com",
+    type: ChainType.EVM,
+    connectorId: "blockchaindotcom",
+    connectorName: "Blockchain.com",
+    windowFlag: WindowWalletFlag.BlockchainDotCom,
+    connector: (chains) =>
+      new WalletConnectConnector({
+        chains,
+        options: {
+          showQrModal: true,
+          projectId: "db6a4f6ff58e4172b2fd52f01360bc49",
+        },
+      }),
+    icon: walletIcons.blockchainDotCom,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Cosmostation",
+    type: ChainType.EVM,
+    connectorId: "cosmostation",
+    connectorName: "Cosmostation",
+    windowFlag: WindowWalletFlag.CosmostationEVM,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Cosmostation",
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.cosmostation
+              ? (window as TypedWindow)?.cosmostation.ethereum
+              : undefined,
+        },
+      }),
+    icon: walletIcons.cosmostation,
+    canSwitchWallets: false,
+  },
+  {
+    name: "BitGet Wallet",
+    type: ChainType.EVM,
+    connectorId: "bitget",
+    connectorName: "BitGet Wallet",
+    windowFlag: WindowWalletFlag.BitGet,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "BitGet Wallet",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.bitkeep &&
+            (window as TypedWindow)?.bitkeep.ethereum
+              ? (window as TypedWindow)?.bitkeep.ethereum
+              : undefined,
+        },
+      }),
+    icon: walletIcons.bitget,
+    canSwitchWallets: false,
+  },
+  {
+    name: "OKX Wallet",
+    type: ChainType.EVM,
+    connectorId: "okx",
+    connectorName: "okx",
+    windowFlag: WindowWalletFlag.OKX,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "OKX",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.ethereum &&
+            (window as TypedWindow)?.okxwallet
+              ? (window as TypedWindow)?.okxwallet
+              : undefined,
+        },
+      }),
+    icon: walletIcons.okx,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Coin98",
+    type: ChainType.EVM,
+    connectorId: "coin98",
+    connectorName: "Coin98",
+    windowFlag: WindowWalletFlag.Coin98,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Coin98",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" && (window as TypedWindow)?.coin98
+              ? (window as TypedWindow)?.coin98.provider
+              : undefined,
+        },
+      }),
+    icon: walletIcons.coin98,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Defi Connect",
+    type: ChainType.EVM,
+    connectorId: "deficonnect",
+    connectorName: "Defi Connect",
+    windowFlag: WindowWalletFlag.DefiConnect,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Defi Connect",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.deficonnectProvider
+              ? (window as TypedWindow)?.deficonnectProvider
+              : undefined,
+        },
+      }),
+    icon: walletIcons.defiConnect,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Keplr",
+    type: ChainType.COSMOS,
+    windowFlag: WindowWalletFlag.Keplr,
+    icon: walletIcons.keplr,
+    canSwitchWallets: false,
+    connectorId: "keplr",
+    connectorName: "Keplr",
+  },
+  {
+    name: "XDEFI Wallet",
+    type: ChainType.COSMOS,
+    connectorId: "xdeficosmos",
+    connectorName: "XDefi",
+    windowFlag: WindowWalletFlag.XdefiCosmos,
+    icon: walletIcons.xdefi,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Leap",
+    type: ChainType.COSMOS,
+    windowFlag: WindowWalletFlag.Leap,
+    icon: walletIcons.leap,
+    canSwitchWallets: false,
+    connectorId: "leap",
+    connectorName: "Leap",
+  },
+  {
+    name: "Cosmostation",
+    type: ChainType.COSMOS,
+    connectorId: "cosmostationCosmos",
+    connectorName: "Cosmostation Cosmos",
+    windowFlag: WindowWalletFlag.CosmostationCosmos,
+    connector: (chains) =>
+      new InjectedConnector({
+        chains,
+        options: {
+          name: "Cosmostation",
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow)?.cosmostation
+              ? (window as TypedWindow)?.cosmostation.ethereum
+              : undefined,
+        },
+      }),
+    icon: walletIcons.cosmostation,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Fetch.ai",
+    type: ChainType.COSMOS,
+    connectorId: "fetchai",
+    connectorName: "Fetch.ai",
+    windowFlag: WindowWalletFlag.FetchAi,
+    icon: walletIcons.fetchai,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Cosmos Extension",
+    type: ChainType.COSMOS,
+    connectorId: "snapper",
+    connectorName: "Cosmos Extension",
+    windowFlag: WindowWalletFlag.Snapper,
+    icon: walletIcons.metamask,
+    canSwitchWallets: false,
+  },
+  {
+    name: "Exodus",
+    type: ChainType.EVM,
+    connectorId: "exodus",
+    connectorName: "Exodus",
+    windowFlag: WindowWalletFlag.Exodus,
+    connector: (chains) =>
+      new ExodusConnector({
+        chains,
+        options: {
+          name: "Exodus",
+          shimDisconnect: true,
+          getProvider: () =>
+            typeof window !== "undefined" &&
+            (window as TypedWindow).exodus?.ethereum &&
+            ((window as any).exodus.ethereum.isExodus as any)
+              ? ((window as TypedWindow).exodus.ethereum as any)
+              : undefined,
+        },
+      }),
+    icon: walletIcons.exodus,
+    canSwitchWallets: false,
+  },
+];
+
+export const axelarSuccessStatuses = [
+  "destination_executed",
+  "executed",
+  "express_executed",
+];
+
+export const axelarEndStatuses = [
+  ...axelarSuccessStatuses,
+  "error_fetching_status",
+  "error",
+];
+
+export const walletStoreLinks: {
+  [key in ConnectorID]: {
+    chrome: string;
+    firefox: string;
+  };
+} = {
+  leap: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/leap-cosmos-wallet/fcfcfllfndlomdhbehjjcoimbgofdncg",
+    firefox: "",
+  },
+  keplr: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/keplr/dmkamcknogkgcdfhhbddcghachkejeap",
+    firefox:
+      "https://addons.mozilla.org/en-US/firefox/addon/keplr/?utm_source=addons.mozilla.org&utm_medium=referral&utm_content=search",
+  },
+  metaMask: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn",
+    firefox:
+      "https://addons.mozilla.org/en-US/firefox/addon/ether-metamask/?utm_source=addons.mozilla.org&utm_medium=referral&utm_content=search",
+  },
+  walletConnect: {
+    chrome: "",
+    firefox: "",
+  },
+  blockchaindotcom: {
+    chrome: "",
+    firefox: "",
+  },
+  coinbaseWallet: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/coinbase-wallet-extension/hnfanknocfeofbddgcijnmhnfnkdnaad",
+    firefox: "",
+  },
+  cosmostation: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/cosmostation-wallet/fpkhgmpbidmiogeglndfbkegfdlnajnf",
+    firefox: "",
+  },
+  cosmostationCosmos: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/cosmostation-wallet/fpkhgmpbidmiogeglndfbkegfdlnajnf",
+    firefox: "",
+  },
+  xdefi: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/xdefi-wallet/hmeobnfnfcmdkdcmlblgagmfpfboieaf",
+    firefox: "",
+  },
+  xdeficosmos: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/xdefi-wallet/hmeobnfnfcmdkdcmlblgagmfpfboieaf",
+    firefox: "",
+  },
+  bitget: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/bitget-wallet-formerly-bi/jiidiaalihmmhddjgbnbgdfflelocpak",
+    firefox: "",
+  },
+  trustwallet: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/trust-wallet/egjidjbpglichdcondbcbdnbeeppgdph",
+    firefox: "",
+  },
+  fetchai: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/fetch-wallet/ellkdbaphhldpeajbepobaecooaoafpg",
+    firefox: "",
+  },
+  coin98: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/coin98-wallet/aeachknmefphepccionboohckonoeemg",
+    firefox: "",
+  },
+  rabby: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/rabby-wallet/acmacodkjbdgmoleebolmdjonilkdbch",
+    firefox: "",
+  },
+  okx: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/okx-wallet/mcohilncbfahbmgdjkbpemcciiolgcge",
+    firefox: "",
+  },
+  injected: {
+    chrome: "",
+    firefox: "",
+  },
+  zerion: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/zerion-wallet-for-web3-nf/klghhnkeealcohjjanjjdaeeggmfmlpl",
+    firefox: "",
+  },
+  deficonnect: {
+    chrome:
+      "https://chrome.google.com/webstore/detail/cryptocom-wallet-extensio/hifafgmccdpekplomjjkcfgodnhcellj",
+    firefox: "",
+  },
+  snapper: {
+    chrome: "https://metamask.mysticlabs.xyz/",
+    firefox: "",
+  },
+  exodus: {
+    chrome:
+      "https://chromewebstore.google.com/detail/exodus-web3-wallet/aholpfdialjgjfhomihkjbmgjidlcdno",
+    firefox: "",
+  },
+};

package/src/core/externalLinks.ts

@@ -0,0 +1,26 @@
+// Squid Links
+export const squidMainLink = "https://www.squidrouter.com/";
+export const squidDocLink = "https://docs.widget.squidrouter.com/";
+export const squidApiBaseUrl = "https://v2.api.squidrouter.com";
+export const squidDiscordLink = "https://discord.gg/squidrouter";
+export const squidSupportLink = "https://support.squidrouter.com";
+
+export const squidHelpLink = `${squidDocLink}troubleshooting#additional-support`;
+export const squidInfiniteApprovalLink = `${squidDocLink}settings#infinite-approval`;
+export const squidSlippageToleranceLink = `${squidDocLink}settings#slippage-tolerance`;
+export const squidAxlUSDCWarningLink = `${squidDocLink}troubleshooting#you-received-axlusdc-unexpectedly`;
+export const squidTrackingDataUnavailableLink = `${squidDocLink}troubleshooting#tracking-data-unavailable`;
+export const squidGasFeesRefundLink = `${squidDocLink}gas-fees#gas-refunds`;
+
+// Axelar Links
+export const axelarTokenDataUrl =
+  "https://axelar-mainnet.s3.us-east-2.amazonaws.com/mainnet-config.json";
+export const axelarMainLink = "https://axelar.network/";
+export const axelarPoweredByLink =
+  "https://axelar.network/?utm_source=dynamic&utm_medium=referral&utm_campaign=squidrouter-widget";
+
+// Other links
+export const defaultFiatOnRamp = {
+  name: "Kado",
+  link: "https://app.kado.money?apiKey=4dcd0735-f55e-4063-a862-734158decbfe",
+};

package/src/core/index.ts

@@ -0,0 +1 @@
+export { wallets } from "./constants";

package/src/core/multicall3.ts

@@ -0,0 +1,22 @@
+export const multicallAddress = "0xcA11bde05977b3631167028862bE2a173976CA11";
+export const multicallAbi = [
+  {
+    inputs: [
+      {
+        internalType: "address",
+        name: "account",
+        type: "address",
+      },
+    ],
+    name: "getEthBalance",
+    outputs: [
+      {
+        internalType: "uint256",
+        name: "",
+        type: "uint256",
+      },
+    ],
+    stateMutability: "view",
+    type: "function",
+  },
+];

package/src/core/numbers.ts

@@ -0,0 +1,44 @@
+/* eslint-disable prefer-const */
+import type { BigNumberish } from "ethers";
+import { ethers } from "ethers";
+import take from "lodash/take";
+import takeWhile from "lodash/takeWhile";
+
+export const roundNumericValue = (
+  value: string = "0",
+  precision: number = 2,
+  useComaEvery3Digits = true,
+  significantFigures: number = 0
+): string => {
+  let newValue = value;
+
+  const temp = newValue?.toString() ?? "";
+  let [integers, decimals] = temp.split(".");
+
+  // toLocaleString is supported on all modern browsers
+  // We might monitor and have a polyfill if some people are not
+  // Seeing the comas.
+  if (useComaEvery3Digits && integers !== "0") {
+    integers = parseInt(integers, 10).toLocaleString("en-US").toString();
+  }
+
+  if (significantFigures && decimals) {
+    const zeros = takeWhile(decimals?.toString(), (c) => c === "0").length;
+    return `${integers}.${take(decimals, zeros + significantFigures).join("")}`;
+  }
+
+  return decimals
+    ? `${integers}.${take(decimals, precision).join("")}`
+    : integers;
+};
+
+export function formatUnitsRounded(
+  value: BigNumberish,
+  decimals?: string | BigNumberish,
+  maxDecimalDigits?: number
+) {
+  const dc = decimals ?? "0";
+  return ethers.FixedNumber.from(ethers.utils.formatUnits(value, dc))
+    .round(maxDecimalDigits ?? ethers.BigNumber.from(dc).toNumber())
+    .toString();
+}

package/src/core/providers/CosmosProvider.tsx

@@ -0,0 +1,55 @@
+import type { Wallet } from "@/core/types/wallet";
+import { useCosmos } from "@/hooks/cosmos/useCosmos";
+import type { ChainData } from "@0xsquid/sdk/dist/types";
+import type { OfflineSigner } from "@cosmjs/proto-signing";
+import type { Keplr } from "@keplr-wallet/types";
+import type { UseMutationResult } from "@tanstack/react-query";
+import type { ReactNode } from "react";
+import React from "react";
+
+interface ICosmsosContextData {
+  connectCosmos?: UseMutationResult<
+    void,
+    unknown,
+    { chain: ChainData; wallet?: Wallet; direction?: "from" | "to" },
+    unknown
+  >;
+
+  cosmosConnectedWallet?: Wallet;
+  keplrTypeWallet?: Keplr;
+  cosmosChainId?: string;
+  setCosmosChainId?: React.Dispatch<React.SetStateAction<string | undefined>>;
+  isConnected?: boolean;
+  onCosmosChainChange?: (chainId: string) => void;
+  isInstalled?: boolean;
+  cosmosSigner?: OfflineSigner;
+  cosmosAddress?: string;
+  getCosmosWalletInfos?: UseMutationResult<
+    string | undefined,
+    unknown,
+    {
+      chainId: string;
+      cosmosWalletObject?: Keplr | undefined;
+    },
+    unknown
+  >;
+  getCosmosAddressForChain: (chainId?: string) => Promise<string | undefined>;
+}
+
+export const CosmosContext = React.createContext<ICosmsosContextData>({
+  getCosmosAddressForChain: async () => "",
+});
+
+export const CosmosProvider: React.FC<{
+  children?: ReactNode;
+}> = ({ children }) => {
+  return (
+    <CosmosContext.Provider value={useCosmos()}>
+      {children}
+    </CosmosContext.Provider>
+  );
+};
+
+export function useCosmosContext() {
+  return React.useContext(CosmosContext);
+}