From 98ae602602a8be94cca324f6d843ae65ce646c7b Mon Sep 17 00:00:00 2001 From: hazae41 <4405263+hazae41@users.noreply.github.com> Date: Sat, 2 Nov 2024 23:28:16 +0700 Subject: [PATCH] fix display --- .../service_worker/entities/tokens/data.ts | 18 +++- src/mods/foreground/entities/tokens/data.ts | 18 +++- src/mods/foreground/entities/wallets/card.tsx | 4 +- src/mods/foreground/entities/wallets/page.tsx | 83 ++++++++----------- src/mods/foreground/home/page.tsx | 4 +- 5 files changed, 71 insertions(+), 56 deletions(-) diff --git a/src/mods/background/service_worker/entities/tokens/data.ts b/src/mods/background/service_worker/entities/tokens/data.ts index 0a5938e9..793df45e 100644 --- a/src/mods/background/service_worker/entities/tokens/data.ts +++ b/src/mods/background/service_worker/entities/tokens/data.ts @@ -186,8 +186,22 @@ export namespace BgToken { } export function schema(account: ZeroHexString, block: string, context: BgEthereumContext, storage: IDBQueryStorage) { - const fetcher = async (request: RpcRequestPreinit, more: FetcherMore) => - await BgEthereumContext.fetchOrFail(context, request, more).then(f => f.mapSync(x => new ZeroHexFixedInit(x, context.chain.token.decimals))) + const fetcher = async (request: RpcRequestPreinit, more: FetcherMore) => { + try { + const fetched = await BgEthereumContext.fetchOrFail(context, request, more) + + if (fetched.isErr()) + return fetched + if (!ZeroHexString.Unknown.is(fetched.get())) + throw new Error("Invalid response") + + const fixed = new ZeroHexFixedInit(fetched.get(), context.chain.token.decimals) + + return new Data(fixed) + } catch (e: unknown) { + return new Fail(Catched.wrap(e)) + } + } const indexer = async (states: States) => { if (block !== "pending") diff --git a/src/mods/foreground/entities/tokens/data.ts b/src/mods/foreground/entities/tokens/data.ts index 3b4cf190..4bc59e3e 100644 --- a/src/mods/foreground/entities/tokens/data.ts +++ b/src/mods/foreground/entities/tokens/data.ts @@ -102,8 +102,22 @@ export namespace FgToken { if (block == null) return - const fetcher = async (request: RpcRequestPreinit, more: FetcherMore = {}) => - await fetchOrFail(request, context).then(f => f.mapSync(x => new ZeroHexFixedInit(x, context.chain.token.decimals))) + const fetcher = async (request: RpcRequestPreinit, more: FetcherMore = {}) => { + try { + const fetched = await fetchOrFail(request, context) + + if (fetched.isErr()) + return fetched + if (!ZeroHexString.Unknown.is(fetched.get())) + throw new Error("Invalid response") + + const fixed = new ZeroHexFixedInit(fetched.get(), context.chain.token.decimals) + + return new Data(fixed) + } catch (e: unknown) { + return new Fail(Catched.wrap(e)) + } + } const indexer = async (states: States) => { if (block !== "pending") diff --git a/src/mods/foreground/entities/wallets/card.tsx b/src/mods/foreground/entities/wallets/card.tsx index 3cdb2740..24a977b1 100644 --- a/src/mods/foreground/entities/wallets/card.tsx +++ b/src/mods/foreground/entities/wallets/card.tsx @@ -15,7 +15,7 @@ import { useEnsReverseNoFetch } from "../names/data" import { useTotalWalletPricedBalance } from "../unknown/data" import { useWalletDataContext } from "./context" import { useEthereumContext } from "./data" -import { useCompactDisplayUsdOrZeroOrError } from "./page" +import { useCompactDisplayUsd } from "./page" export function RawWalletDataCard(props: { index?: number } & { href?: string } & { privateKey?: string } & { flip?: boolean } & { unflip?: () => void }) { const wallet = useWalletDataContext().getOrThrow() @@ -59,7 +59,7 @@ export function RawWalletCard(props: { type?: WalletData["type"] } & { uuid: str const onClickCopyEthereumAddress = useMouseCancel(copyEthereumAddress.run) const totalBalanceQuery = useTotalWalletPricedBalance(finalAddress, "usd") - const totalBalanceDisplay = useCompactDisplayUsdOrZeroOrError(totalBalanceQuery.current) + const totalBalanceDisplay = useCompactDisplayUsd(totalBalanceQuery.current) const [preflip = false, setPreflip] = useState(flip) const [postflip, setPostflip] = useState(false) diff --git a/src/mods/foreground/entities/wallets/page.tsx b/src/mods/foreground/entities/wallets/page.tsx index c6005dd0..7fc43ee7 100644 --- a/src/mods/foreground/entities/wallets/page.tsx +++ b/src/mods/foreground/entities/wallets/page.tsx @@ -49,63 +49,50 @@ export function WalletPage(props: UUIDProps) { } -export function useDisplay(result: Nullable>) { +export function useDisplayRaw(result: Nullable>) { return useMemo(() => { if (result == null) - return "0.00" - if (result.isErr()) - return "0.00" - const number = Number(Fixed.from(result.getOrThrow()).move(5).toString()) + return "???" + return result.andThenSync(fixed => Result.runAndDoubleWrapSync(() => { + const fixed5 = Fixed.from(fixed).move(5) + const float = Number(fixed5.toString()) - return number.toLocaleString(undefined) + return float.toLocaleString(undefined) + })).getOr("Error") }, [result]) } -export function useDisplayUsdOrNull(result: Nullable>) { +export function useDisplayUsd(result: Nullable>) { return useMemo(() => { if (result == null) - return - if (result.isErr()) - return - const number = Number(Fixed.from(result.getOrThrow()).move(2).toString()) - - return number.toLocaleString(undefined, { - style: "currency", - currency: "USD", - notation: "standard" - }) - }, [result]) -} + return "???" + return result.andThenSync(fixed => Result.runAndDoubleWrapSync(() => { + const fixed2 = Fixed.from(fixed).move(2) + const float = Number(fixed2.toString()) -export function useDisplayUsdOrZeroOrError(result: Nullable>) { - return useMemo(() => { - if (result == null) - return "0.00" - if (result.isErr()) - return "Error" - const number = Number(Fixed.from(result.getOrThrow()).move(2).toString()) - - return number.toLocaleString(undefined, { - style: "currency", - currency: "USD", - notation: "standard" - }) + const style = "currency" + const currency = "USD" + const notation = "standard" + + return float.toLocaleString(undefined, { style, currency, notation }) + })).getOr("Error") }, [result]) } -export function useCompactDisplayUsdOrZeroOrError(result: Nullable>) { +export function useCompactDisplayUsd(result: Nullable>) { return useMemo(() => { if (result == null) - return "0.00" - if (result.isErr()) - return "Error" - const number = Number(Fixed.from(result.getOrThrow()).move(2).toString()) - - return number.toLocaleString(undefined, { - style: "currency", - currency: "USD", - notation: "compact" - }) + return "???" + return result.andThenSync(fixed => Result.runAndDoubleWrapSync(() => { + const fixed2 = Fixed.from(fixed).move(2) + const float = Number(fixed2.toString()) + + const style = "currency" + const currency = "USD" + const notation = "compact" + + return float.toLocaleString(undefined, { style, currency, notation }) + })).getOr("Error") }, [result]) } @@ -596,10 +583,10 @@ function NativeTokenRow(props: { token: NativeTokenData } & { chain: ChainData } const [prices, setPrices] = useState(new Array>(token.pairs?.length ?? 0)) const balanceQuery = useNativeBalance(wallet.address, "pending", context, prices) - const balanceDisplay = useDisplay(balanceQuery.current) + const balanceDisplay = useDisplayRaw(balanceQuery.current) const balanceUsdFixed = useNativePricedBalance(wallet.address, "usd", context) - const balanceUsdDisplay = useDisplayUsdOrNull(balanceUsdFixed.current) + const balanceUsdDisplay = useDisplayUsd(balanceUsdFixed.current) const onPrice = useCallback(([index, data]: [number, Nullable]) => { setPrices(prices => { @@ -696,10 +683,10 @@ function ContractTokenRow(props: { token: ContractTokenData } & { chain: ChainDa const [prices, setPrices] = useState(new Array>(token.pairs?.length ?? 0)) const balanceQuery = useContractBalance(wallet.address, token, "pending", context, prices) - const balanceDisplay = useDisplay(balanceQuery.current) + const balanceDisplay = useDisplayRaw(balanceQuery.current) const balanceUsdFixed = useContractPricedBalance(wallet.address, token, "usd", context) - const balanceUsdDisplay = useDisplayUsdOrNull(balanceUsdFixed.current) + const balanceUsdDisplay = useDisplayUsd(balanceUsdFixed.current) const onPrice = useCallback(([index, data]: [number, Nullable]) => { setPrices(prices => { @@ -749,7 +736,7 @@ export function PriceResolver(props: { index: number } & { address: string } & O return null } -function ClickableTokenRow(props: { token: TokenData } & { chain: ChainData } & { balanceDisplay: string } & { balanceUsdDisplay?: string } & AnchorProps) { +function ClickableTokenRow(props: { token: TokenData } & { chain: ChainData } & { balanceDisplay: string } & { balanceUsdDisplay: string } & AnchorProps) { const { token, chain, balanceDisplay, balanceUsdDisplay, ...others } = props const tokenId = token.type === "native" diff --git a/src/mods/foreground/home/page.tsx b/src/mods/foreground/home/page.tsx index 20b4d6aa..51b98192 100644 --- a/src/mods/foreground/home/page.tsx +++ b/src/mods/foreground/home/page.tsx @@ -6,14 +6,14 @@ import { useBackgroundContext } from "@/mods/foreground/background/context" import { useCallback, useEffect, useState } from "react" import { useTotalPricedBalance } from "../entities/unknown/data" import { useUserContext } from "../entities/users/context" -import { useDisplayUsdOrZeroOrError } from "../entities/wallets/page" +import { useDisplayUsd } from "../entities/wallets/page" export function HomePage() { const userData = useUserContext().getOrThrow() const background = useBackgroundContext().getOrThrow() const totalPricedBalanceQuery = useTotalPricedBalance("usd") - const totalPricedBalanceDisplay = useDisplayUsdOrZeroOrError(totalPricedBalanceQuery.current) + const totalPricedBalanceDisplay = useDisplayUsd(totalPricedBalanceQuery.current) useEffect(() => { background.requestOrThrow({