feat: improve useTotalFiatBalance hook

iotaledger · Jan 13, 2025 · 65b6f6c · 65b6f6c
1 parent fd0ab04
commit 65b6f6c
Show file tree

Hide file tree

Showing 7 changed files with 35 additions and 18 deletions.
diff --git a/apps/apps-backend/src/constants.ts b/apps/apps-backend/src/constants.ts
@@ -1,6 +1,8 @@
 // Copyright (c) 2024 IOTA Stiftung
 // SPDX-License-Identifier: Apache-2.0
 
+import { FiatTokenName } from '@iota/core';
+
 export const tokenPriceKey = (coinName: string) => `tokenPrice${coinName}`;
 export const TOKEN_PRICE_CURRENCY = 'usd';
-export const TOKEN_PRICE_COINS = ['iota'];
+export const TOKEN_PRICE_COINS = [FiatTokenName.Iota];
diff --git a/apps/apps-backend/src/prices/prices.controller.ts b/apps/apps-backend/src/prices/prices.controller.ts
@@ -5,6 +5,7 @@ import { Controller, Get, Inject, Param } from '@nestjs/common';
 import { Cache, CACHE_MANAGER } from '@nestjs/cache-manager';
 import { CoinGeckoService } from '../coingecko/coingecko.service';
 import { TOKEN_PRICE_COINS, tokenPriceKey } from '../constants';
+import { FiatTokenName } from '@iota/core';
 
 const ONE_HOUR_IN_MS = 1000 * 60 * 60;
 
@@ -16,9 +17,7 @@ export class PricesController {
     ) {}
 
     @Get('cetus/:coin')
-    async getTokenPrice(@Param('coin') coin: string) {
-        coin = coin.toLowerCase();
-
+    async getTokenPrice(@Param('coin') coin: FiatTokenName) {
         if (!TOKEN_PRICE_COINS.includes(coin)) {
             throw new Error('Invalid coin');
         }

diff --git a/apps/core/src/enums/fiatTokenName.enums.ts b/apps/core/src/enums/fiatTokenName.enums.ts
@@ -0,0 +1,6 @@
+// Copyright (c) 2024 IOTA Stiftung
+// SPDX-License-Identifier: Apache-2.0
+
+export enum FiatTokenName {
+    Iota = 'iota',
+}
diff --git a/apps/core/src/enums/index.ts b/apps/core/src/enums/index.ts
@@ -4,3 +4,4 @@
 export * from './theme.enums';
 export * from './explorerLinkType.enums';
 export * from './features.enums';
+export * from './fiatTokenName.enums';
diff --git a/apps/core/src/hooks/useTokenPrice.ts b/apps/core/src/hooks/useTokenPrice.ts
@@ -7,22 +7,23 @@ import BigNumber from 'bignumber.js';
 
 import { useAppsBackend } from './useAppsBackend';
 import { useCoinMetadata } from './useFormatCoin';
+import { FiatTokenName } from '../enums';
 
 type TokenPriceResponse = { price: string | null };
 
-export function useTokenPrice(coinType: string) {
+export function useTokenPrice(tokenName: FiatTokenName) {
     const { request } = useAppsBackend();
     return useQuery({
-        queryKey: ['apps-backend', 'token-price', coinType],
-        queryFn: () => request<TokenPriceResponse>(`cetus/${coinType}`),
+        queryKey: ['apps-backend', 'token-price', tokenName],
+        queryFn: () => request<TokenPriceResponse>(`cetus/${tokenName}`),
 
         // These values are set to one minute to prevent displaying stale data, as token prices can change frequently.
         staleTime: 60 * 1000,
         gcTime: 60 * 1000,
     });
 }
 
-export function useBalanceInUSD(coinType: string, balance: bigint | string | number) {
+export function useBalanceInUSD(coinType: FiatTokenName, balance: bigint | string | number) {
     const { data: coinMetadata } = useCoinMetadata(coinType);
     const { data: tokenPrice } = useTokenPrice(coinType);
     if (!tokenPrice || !coinMetadata || !tokenPrice.price) return null;

diff --git a/apps/core/src/hooks/useTotalFiatBalance.ts b/apps/core/src/hooks/useTotalFiatBalance.ts
@@ -6,16 +6,22 @@ import { useBalance } from './useBalance';
 import { useTokenPrice } from './useTokenPrice';
 import { CoinFormat, formatBalance, useCoinMetadata } from './useFormatCoin';
 import { IOTA_TYPE_ARG } from '@iota/iota-sdk/utils';
+import { FiatTokenName } from '../enums';
 
-export function useTotalFiatBalance() {
-    const { data: { price } = {} } = useTokenPrice('iota');
+export function useTotalFiatBalance(): string {
+    const { data: { price } = {} } = useTokenPrice(FiatTokenName.Iota);
     const address = useCurrentAccount()?.address;
-    const { data: coinBalance } = useBalance(address!);
-    const totalBalance = Number(coinBalance?.totalBalance);
+
+    if (!address) {
+        return '';
+    }
+
+    const { data: coinBalance } = useBalance(address);
+    const totalBalance = Number(coinBalance?.totalBalance || 0);
     const queryResult = useCoinMetadata(IOTA_TYPE_ARG);
-    const iotaToFiat = totalBalance && price ? Number(totalBalance) * Number(price) : 0;
-    const formatted = formatBalance(iotaToFiat, queryResult.data?.decimals ?? 0, CoinFormat.FULL);
-    return price ? `${coinToFiat(formatted, price)}` : null;
+    const iotaToFiat = totalBalance && price ? totalBalance * Number(price || 0) : 0;
+    const formatted = formatBalance(iotaToFiat, queryResult.data?.decimals || 0, CoinFormat.FULL);
+    return price ? `${coinToFiat(formatted, price)}` : '';
 }
 
 function coinToFiat(coinBalance: string, coinPrice: string): string {

diff --git a/apps/wallet-dashboard/components/account-balance/AccountBalance.tsx b/apps/wallet-dashboard/components/account-balance/AccountBalance.tsx
@@ -58,9 +58,11 @@ export function AccountBalance() {
                             <span className="text-headline-lg text-neutral-10 dark:text-neutral-92">
                                 {formatted} {symbol}
                             </span>
-                            <span className="text-body-md text-neutral-10 dark:text-neutral-92">
-                                {fiatBalance}
-                            </span>
+                            {fiatBalance && (
+                                <span className="text-body-md text-neutral-10 dark:text-neutral-92">
+                                    {fiatBalance}
+                                </span>
+                            )}
                         </div>
                         <div className="flex w-full max-w-56 gap-xs">
                             <Button