@mezo-org/passport 0.4.0-dev.8 → 0.4.0-dev.80

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/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,
-  })
-}