@mezo-org/passport 0.4.0-dev.9 → 0.5.1-dev.0

package/dist/src/hooks/useDropdownData.js

@@ -1,73 +0,0 @@
-import { useBitcoinAccount } from "@mezo-org/orangekit";
-import { useGetCurrentAccount } from ".";
-import { getCryptoAsset, isBitcoinLikeCryptoAsset, isUsdLikeCryptoAsset, } from "../utils/cryptoAssets";
-import { fromFixedPoint } from "../utils/numbers";
-import { useAssetsUsdConversion } from "./useAssetsUSDConversion";
-import useWalletAccount from "./useWalletAccount";
-/**
- * Formats crypto asset to balance details (balance in USD and decimals)
- * @param type The type of crypto asset
- * @param balance The balance of crypto asset
- * @param btcUsdConversionRate The USD conversion rate
- * @returns The balance details
- */
-export function formatCryptoAsset(type, balance, btcUsdConversionRate) {
-    const { decimals } = getCryptoAsset(type);
-    const nativeBalance = fromFixedPoint(balance, decimals, 4);
-    let balanceInUsd = 0;
-    if (isBitcoinLikeCryptoAsset(type)) {
-        balanceInUsd = nativeBalance * btcUsdConversionRate;
-    }
-    if (isUsdLikeCryptoAsset(type)) {
-        balanceInUsd = nativeBalance;
-    }
-    return {
-        type,
-        balance: nativeBalance,
-        balanceInUsd,
-        decimals,
-    };
-}
-/**
- * Aggregates dropdown data for Dropdown component.
- * @param options - Options for the dropdown data.
- * @param options.evmNativeAssets - Native assets for EVM wallet.
- * @param options.matsnetAssets - Matsnet tokens. Rendered as separate section.
- * @returns Dropdown data.
- */
-export default function useDropdownData(options) {
-    const { evmNativeAssets = [], matsnetAssets = [] } = options || {};
-    const { btcBalance } = useBitcoinAccount();
-    const { address, networkFamily, isConnected } = useWalletAccount();
-    const { data: passportAccount } = useGetCurrentAccount();
-    const { data: assetsUsdConversion } = useAssetsUsdConversion();
-    if (!address || !isConnected || !passportAccount) {
-        return null;
-    }
-    const mezoId = passportAccount.mezoId;
-    const nativeAssets = networkFamily === "bitcoin"
-        ? [
-            {
-                type: "btc",
-                balance: BigInt(btcBalance?.total ?? 0),
-            },
-        ]
-        : evmNativeAssets;
-    const btcUsdConversionRate = Number(assetsUsdConversion?.btcUsd ?? 0);
-    const formattedNativeAssets = nativeAssets.map((asset) => formatCryptoAsset(asset.type, asset.balance, btcUsdConversionRate));
-    const totalBalanceInUsd = formattedNativeAssets.reduce((sum, value) => sum + value.balanceInUsd, 0);
-    const matsBalance = passportAccount.mats.totalMats;
-    const matsnetFormattedAssets = matsnetAssets.map((asset) => formatCryptoAsset(asset.type, asset.balance, btcUsdConversionRate));
-    return {
-        mezoId,
-        address,
-        walletType: networkFamily,
-        totalBalanceInUsd,
-        formattedNativeAssets,
-        matsnet: {
-            mats: matsBalance,
-            formattedAssets: matsnetFormattedAssets,
-        },
-    };
-}
-//# sourceMappingURL=useDropdownData.js.map

package/dist/src/hooks/useDropdownData.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useDropdownData.js","sourceRoot":"","sources":["../../../src/hooks/useDropdownData.ts"],"names":[],"mappings":"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"}

package/dist/src/utils/cryptoAssets.d.ts

@@ -1,28 +0,0 @@
-import { IconProps } from "@mezo-org/mezo-clay";
-import { FC } from "react";
-export type CryptoAssetKey = "btc" | "eth" | "tbtc" | "wbtc" | "mbtc" | "musd";
-export type CryptoAsset = {
-    name: string;
-    symbol: string;
-    icon: FC<IconProps>;
-    decimals: number;
-};
-/**
- * Gets details of given crypto asset
- * @param key The key of crypto asset
- * @returns The crypto asset details
- */
-export declare function getCryptoAsset(key: CryptoAssetKey): CryptoAsset;
-/**
- * Checks if given crypto asset is Bitcoin-like
- * @param key The key of crypto asset
- * @returns True if crypto asset is Bitcoin-like
- */
-export declare function isBitcoinLikeCryptoAsset(key: CryptoAssetKey): boolean;
-/**
- * Checks if given crypto asset is USD-like
- * @param key The key of crypto asset
- * @returns True if crypto asset is USD-like
- */
-export declare function isUsdLikeCryptoAsset(key: CryptoAssetKey): boolean;
-//# sourceMappingURL=cryptoAssets.d.ts.map

package/dist/src/utils/cryptoAssets.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cryptoAssets.d.ts","sourceRoot":"","sources":["../../../src/utils/cryptoAssets.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,SAAS,EAGV,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAiB,EAAE,EAAE,MAAM,OAAO,CAAA;AAEzC,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;AAE9E,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,EAAE,CAAC,SAAS,CAAC,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAmDD;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,GAAG,EAAE,cAAc,eAEjD;AAED;;;;GAIG;AACH,wBAAgB,wBAAwB,CAAC,GAAG,EAAE,cAAc,WAE3D;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,cAAc,WAEvD"}

package/dist/src/utils/cryptoAssets.js

@@ -1,73 +0,0 @@
-import { BitcoinCircle, EthCircle, MUsdCircle, TBtcCircle, } from "@mezo-org/mezo-clay";
-import { createElement } from "react";
-const CRYPTO_ASSETS = {
-    btc: {
-        name: "Bitcoin",
-        symbol: "BTC",
-        icon: BitcoinCircle,
-        decimals: 8,
-    },
-    eth: {
-        name: "Ethereum",
-        symbol: "ETH",
-        icon: EthCircle,
-        decimals: 18,
-    },
-    tbtc: {
-        name: "Threshold Bitcoin",
-        symbol: "tBTC",
-        icon: TBtcCircle,
-        decimals: 18,
-    },
-    wbtc: {
-        name: "Wrapped Bitcoin",
-        symbol: "wBTC",
-        icon: (props) => createElement(BitcoinCircle, {
-            ...props,
-            symbolColor: "#FF8A00",
-            color: "#000000",
-        }),
-        decimals: 8,
-    },
-    mbtc: {
-        name: "Matsnet Bitcoin",
-        symbol: "BTC",
-        icon: (props) => createElement(BitcoinCircle, {
-            ...props,
-            symbolColor: "#000000",
-            color: "#FFC907",
-        }),
-        decimals: 18,
-    },
-    musd: {
-        name: "Mezo USD",
-        symbol: "MUSD",
-        icon: MUsdCircle,
-        decimals: 18,
-    },
-};
-/**
- * Gets details of given crypto asset
- * @param key The key of crypto asset
- * @returns The crypto asset details
- */
-export function getCryptoAsset(key) {
-    return CRYPTO_ASSETS[key];
-}
-/**
- * Checks if given crypto asset is Bitcoin-like
- * @param key The key of crypto asset
- * @returns True if crypto asset is Bitcoin-like
- */
-export function isBitcoinLikeCryptoAsset(key) {
-    return ["btc", "tbtc", "wbtc", "mbtc"].includes(key);
-}
-/**
- * Checks if given crypto asset is USD-like
- * @param key The key of crypto asset
- * @returns True if crypto asset is USD-like
- */
-export function isUsdLikeCryptoAsset(key) {
-    return ["musd"].includes(key);
-}
-//# sourceMappingURL=cryptoAssets.js.map

package/dist/src/utils/cryptoAssets.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cryptoAssets.js","sourceRoot":"","sources":["../../../src/utils/cryptoAssets.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,SAAS,EAET,UAAU,EACV,UAAU,GACX,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,aAAa,EAAM,MAAM,OAAO,CAAA;AAWzC,MAAM,aAAa,GAAwC;IACzD,GAAG,EAAE;QACH,IAAI,EAAE,SAAS;QACf,MAAM,EAAE,KAAK;QACb,IAAI,EAAE,aAAa;QACnB,QAAQ,EAAE,CAAC;KACZ;IACD,GAAG,EAAE;QACH,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,KAAK;QACb,IAAI,EAAE,SAAS;QACf,QAAQ,EAAE,EAAE;KACb;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,mBAAmB;QACzB,MAAM,EAAE,MAAM;QACd,IAAI,EAAE,UAAU;QAChB,QAAQ,EAAE,EAAE;KACb;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,iBAAiB;QACvB,MAAM,EAAE,MAAM;QACd,IAAI,EAAE,CAAC,KAAK,EAAE,EAAE,CACd,aAAa,CAAC,aAAa,EAAE;YAC3B,GAAG,KAAK;YACR,WAAW,EAAE,SAAS;YACtB,KAAK,EAAE,SAAS;SACjB,CAAC;QACJ,QAAQ,EAAE,CAAC;KACZ;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,iBAAiB;QACvB,MAAM,EAAE,KAAK;QACb,IAAI,EAAE,CAAC,KAAK,EAAE,EAAE,CACd,aAAa,CAAC,aAAa,EAAE;YAC3B,GAAG,KAAK;YACR,WAAW,EAAE,SAAS;YACtB,KAAK,EAAE,SAAS;SACjB,CAAC;QACJ,QAAQ,EAAE,EAAE;KACb;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,MAAM;QACd,IAAI,EAAE,UAAU;QAChB,QAAQ,EAAE,EAAE;KACb;CACF,CAAA;AAED;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAC,GAAmB;IAChD,OAAO,aAAa,CAAC,GAAG,CAAC,CAAA;AAC3B,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,wBAAwB,CAAC,GAAmB;IAC1D,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA;AACtD,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,oBAAoB,CAAC,GAAmB;IACtD,OAAO,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA;AAC/B,CAAC"}

package/dist/src/utils/cryptoAssets.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=cryptoAssets.test.d.ts.map

package/dist/src/utils/cryptoAssets.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cryptoAssets.test.d.ts","sourceRoot":"","sources":["../../../src/utils/cryptoAssets.test.ts"],"names":[],"mappings":""}

package/dist/src/utils/cryptoAssets.test.js

@@ -1,49 +0,0 @@
-import { BitcoinCircle, EthCircle, MUsdCircle, TBtcCircle, } from "@mezo-org/mezo-clay";
-import { getCryptoAsset } from "./cryptoAssets";
-describe("getCryptoAsset", () => {
-    it("returns the correct asset for 'btc'", () => {
-        const asset = getCryptoAsset("btc");
-        expect(asset.name).toBe("Bitcoin");
-        expect(asset.symbol).toBe("BTC");
-        expect(asset.decimals).toBe(8);
-        expect(asset.icon).toBe(BitcoinCircle);
-    });
-    it("returns the correct asset for 'eth'", () => {
-        const asset = getCryptoAsset("eth");
-        expect(asset.name).toBe("Ethereum");
-        expect(asset.symbol).toBe("ETH");
-        expect(asset.decimals).toBe(18);
-        expect(asset.icon).toBe(EthCircle);
-    });
-    it("returns the correct asset for 'tbtc'", () => {
-        const asset = getCryptoAsset("tbtc");
-        expect(asset.name).toBe("Threshold Bitcoin");
-        expect(asset.symbol).toBe("tBTC");
-        expect(asset.decimals).toBe(18);
-        expect(asset.icon).toBe(TBtcCircle);
-    });
-    it("returns the correct asset for 'wbtc'", () => {
-        const asset = getCryptoAsset("wbtc");
-        expect(asset.name).toBe("Wrapped Bitcoin");
-        expect(asset.symbol).toBe("wBTC");
-        expect(asset.decimals).toBe(8);
-        // FIXME: Test should expect the exact icon component
-        expect(asset.icon).toEqual(expect.any(Function));
-    });
-    it("returns the correct asset for 'mbtc'", () => {
-        const asset = getCryptoAsset("mbtc");
-        expect(asset.name).toBe("Matsnet Bitcoin");
-        expect(asset.symbol).toBe("BTC");
-        expect(asset.decimals).toBe(18);
-        // FIXME: Test should expect the exact icon component
-        expect(asset.icon).toEqual(expect.any(Function));
-    });
-    it("returns the correct asset for 'musd'", () => {
-        const asset = getCryptoAsset("musd");
-        expect(asset.name).toBe("Mezo USD");
-        expect(asset.symbol).toBe("mUSD");
-        expect(asset.decimals).toBe(18);
-        expect(asset.icon).toBe(MUsdCircle);
-    });
-});
-//# sourceMappingURL=cryptoAssets.test.js.map

package/dist/src/utils/cryptoAssets.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cryptoAssets.test.js","sourceRoot":"","sources":["../../../src/utils/cryptoAssets.test.ts"],"names":[],"mappings":"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"}

package/src/components/Dropdown/AccountAddress.tsx

@@ -1,111 +0,0 @@
-import {
-  Block,
-  Copy03 as CopyIcon,
-  LinkExternal02 as LinkIcon,
-  ParagraphSmall,
-  useStyletron,
-} from "@mezo-org/mezo-clay"
-import React from "react"
-import { useCopyToClipboard } from "usehooks-ts"
-import { usePassportContext } from "../../hooks/usePassportContext"
-import { getAddressExplorerUrl, trimAddress } from "../../utils/address"
-import { getCryptoAsset } from "../../utils/cryptoAssets"
-
-type AccountAddressProps = {
-  address: string
-  type: "bitcoin" | "evm"
-}
-
-// TODO: Add visual feedback on copy
-
-export default function AccountAddress(props: AccountAddressProps) {
-  const { address, type } = props
-
-  const { environment } = usePassportContext()
-  const blockExplorerUrl = getAddressExplorerUrl(
-    address,
-    type,
-    environment === "testnet",
-  )
-  const trimmedAddress = trimAddress(address)
-  const { icon: accountIcon } = getCryptoAsset(
-    type === "bitcoin" ? "btc" : "eth",
-  )
-
-  const [, theme] = useStyletron()
-
-  const [, copy] = useCopyToClipboard()
-
-  return (
-    <Block
-      as="button"
-      onClick={() => copy(address)}
-      display="flex"
-      alignItems="center"
-      backgroundColor="transparent"
-      padding={`${theme.sizing.scale600} ${theme.sizing.scale500}`}
-      overrides={{
-        Block: {
-          style: {
-            borderWidth: 0,
-            cursor: "pointer",
-            ":hover": {
-              backgroundColor: theme.colors.backgroundTertiary,
-            },
-          },
-        },
-      }}
-    >
-      <Block as={accountIcon} size={theme.sizing.scale600} />
-      <Block
-        as="a"
-        marginLeft={theme.sizing.scale300}
-        href={blockExplorerUrl}
-        target="_blank"
-        overrides={{
-          Block: {
-            style: {
-              color: "inherit",
-              textDecoration: "none",
-              ":hover": {
-                textDecoration: "underline",
-              },
-            },
-          },
-        }}
-      >
-        <ParagraphSmall
-          display="flex"
-          alignItems="center"
-          margin={0}
-          color={theme.colors.gray800}
-        >
-          {trimmedAddress}
-          <LinkIcon
-            display="inline"
-            size={theme.sizing.scale550}
-            overrides={{
-              Svg: {
-                style: {
-                  stroke: "currentColor",
-                  marginLeft: theme.sizing.scale200,
-                },
-              },
-            }}
-          />
-        </ParagraphSmall>
-      </Block>
-      <CopyIcon
-        size={theme.sizing.scale550}
-        overrides={{
-          Svg: {
-            style: {
-              marginLeft: "auto",
-              stroke: "currentColor",
-            },
-          },
-        }}
-      />
-    </Block>
-  )
-}

package/src/components/Dropdown/AccountAssets.tsx

@@ -1,110 +0,0 @@
-import {
-  Block,
-  LabelSmall,
-  ParagraphSmall,
-  useStyletron,
-} from "@mezo-org/mezo-clay"
-import React, { useMemo } from "react"
-import { CryptoAssetKey, getCryptoAsset } from "../../utils/cryptoAssets"
-import { formatUsd } from "../../utils/currency"
-
-type AccountAssetsProps = {
-  label: string | React.ReactNode
-  assets: {
-    type: CryptoAssetKey
-    decimals: number
-    balance: number
-    balanceInUsd: number
-  }[]
-}
-
-export default function AccountAssets(props: AccountAssetsProps) {
-  const { label, assets } = props
-
-  const [, theme] = useStyletron()
-
-  const assetsData = useMemo(
-    () =>
-      assets.map((token) => {
-        const { name, symbol, icon } = getCryptoAsset(token.type)
-
-        return {
-          ...token,
-          icon,
-          label: name,
-          symbol,
-        }
-      }),
-    [assets],
-  )
-
-  const labelContent =
-    typeof label === "string" ? (
-      <ParagraphSmall margin={0} color={theme.colors.gray800}>
-        {label}
-      </ParagraphSmall>
-    ) : (
-      label
-    )
-
-  if (assetsData.length === 0) {
-    return null
-  }
-
-  return (
-    <Block padding={`0 ${theme.sizing.scale500}`}>
-      <Block margin={`${theme.sizing.scale400} 0`}>{labelContent}</Block>
-
-      <Block
-        as="ul"
-        marginBottom={theme.sizing.scale600}
-        padding={0}
-        display="flex"
-        flexDirection="column"
-        overrides={{
-          Block: {
-            style: {
-              gap: theme.sizing.scale100,
-            },
-          },
-        }}
-      >
-        {assetsData.map((asset) => (
-          <Block
-            as="li"
-            key={`${asset.type}-${asset.balance}`}
-            display="flex"
-            justifyContent="space-between"
-            alignItems="center"
-            margin={`${theme.sizing.scale100} 0`}
-          >
-            <asset.icon
-              size={theme.sizing.scale800}
-              overrides={{
-                Svg: {
-                  style: {
-                    marginRight: theme.sizing.scale500,
-                  },
-                },
-              }}
-            />
-
-            <Block flex={1}>
-              <LabelSmall margin={0}>{asset.label}</LabelSmall>
-              <ParagraphSmall margin={0} color={theme.colors.gray500}>
-                {asset.symbol}
-              </ParagraphSmall>
-            </Block>
-
-            <Block display="flex" alignItems="end" flexDirection="column">
-              <LabelSmall margin={0}>{asset.balance}</LabelSmall>
-              <ParagraphSmall margin={0} color={theme.colors.gray500}>
-                {formatUsd(asset.balanceInUsd)}
-              </ParagraphSmall>
-            </Block>
-          </Block>
-        ))}
-      </Block>
-    </Block>
-  )
-}

package/src/components/Dropdown/AccountBalance.tsx

@@ -1,38 +0,0 @@
-import {
-  Block,
-  HeadingSmall,
-  ParagraphSmall,
-  useStyletron,
-} from "@mezo-org/mezo-clay"
-import React from "react"
-import { formatUsd } from "../../utils/currency"
-
-type AccountBalanceProps = {
-  amount: number
-}
-
-export default function AccountBalance(props: AccountBalanceProps) {
-  const { amount } = props
-
-  const formattedUsdBalance = formatUsd(amount)
-
-  const [, theme] = useStyletron()
-
-  return (
-    <Block
-      padding={theme.sizing.scale500}
-      overrides={{
-        Block: {
-          style: {
-            borderBottom: `1px solid ${theme.colors.backgroundPrimary}`,
-          },
-        },
-      }}
-    >
-      <ParagraphSmall margin={0} color={theme.colors.gray800}>
-        Available balance
-      </ParagraphSmall>
-      <HeadingSmall margin={0}>{formattedUsdBalance}</HeadingSmall>
-    </Block>
-  )
-}

package/src/components/Dropdown/WelcomeBlock.tsx

@@ -1,92 +0,0 @@
-import {
-  Block,
-  HeadingSmall,
-  LabelSmall,
-  Mats,
-  useStyletron,
-} from "@mezo-org/mezo-clay"
-import React from "react"
-import DefaultAvatar from "../../assets/DefaultAvatar"
-import { formatHumanReadableNumber } from "../../utils/numbers"
-
-const DOT_DELIMITER_REGEX = /(?=\.)/
-
-type WelcomeBlockProps = {
-  mezoId: string
-  matsBalance: number
-}
-
-export default function WelcomeBlock(props: WelcomeBlockProps) {
-  const { mezoId, matsBalance } = props
-
-  const [name, nameSuffix] = mezoId.split(DOT_DELIMITER_REGEX)
-  const [, theme] = useStyletron()
-
-  return (
-    <Block
-      display="flex"
-      alignItems="center"
-      padding={`${theme.sizing.scale600} 0`}
-      marginBottom={theme.sizing.scale300}
-      overrides={{
-        Block: {
-          style: {
-            gap: theme.sizing.scale600,
-          },
-        },
-      }}
-    >
-      <Block
-        as={DefaultAvatar}
-        width={theme.sizing.scale1200}
-        height={theme.sizing.scale1200}
-        overrides={{
-          Block: {
-            style: {
-              borderRadius: "100%",
-            },
-          },
-        }}
-      />
-
-      <Block
-        display="flex"
-        flexDirection="column"
-        overrides={{
-          Block: {
-            style: {
-              gap: theme.sizing.scale100,
-            },
-          },
-        }}
-      >
-        <HeadingSmall as="span">
-          <Block as="span">{name}</Block>
-          <Block as="span" color={theme.colors.gray500}>
-            {nameSuffix}
-          </Block>
-        </HeadingSmall>
-
-        <LabelSmall
-          display="flex"
-          alignItems="center"
-          margin={0}
-          color={theme.colors.contentTertiary}
-          overrides={{
-            Block: {
-              style: {
-                gap: theme.sizing.scale300,
-              },
-            },
-          }}
-        >
-          <Mats
-            color={theme.colors.contentPrimary}
-            size={theme.sizing.scale600}
-          />
-          {formatHumanReadableNumber(matsBalance, 0)}
-        </LabelSmall>
-      </Block>
-    </Block>
-  )
-}

package/src/hooks/useAssetsUSDConversion.ts

@@ -1,31 +0,0 @@
-import { UseBaseQueryOptions, useQuery } from "@tanstack/react-query"
-import { ONE_MINUTE_MS } from "../utils/time"
-import { QUERY_KEYS } from "./constants"
-import { usePortalApiClient } from "./usePortalApiClient"
-
-type AssetsUsdConversion = {
-  btcUsd: string
-  ethUsd: string
-}
-
-export function useAssetsUsdConversion(
-  useQueryOptions: Partial<UseBaseQueryOptions<AssetsUsdConversion>> = {},
-) {
-  const portalApiClient = usePortalApiClient()
-
-  return useQuery({
-    queryKey: [QUERY_KEYS.ASSETS_USD_CONVERSION],
-    queryFn: async () => {
-      const { currentUsdPerBtc, currentUsdPerEth } =
-        await portalApiClient.getPortalStatistics()
-
-      return {
-        btcUsd: currentUsdPerBtc,
-        ethUsd: currentUsdPerEth,
-      }
-    },
-    staleTime: 30 * ONE_MINUTE_MS,
-    retry: 1,
-    ...useQueryOptions,
-  })
-}