From 6cd21943115b3ac24925e867e945312c78645d8e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Vuka=C5=A1in=20Manojlovi=C4=87?= Date: Thu, 8 Jan 2026 11:46:14 +0100 Subject: [PATCH] Improve utils/lib code organization --- .../block-state-tracker/block-card.tsx | 2 +- .../block-time-tracker/block-time.tsx | 2 +- .../components/hot-accounts-bubble-map.tsx | 2 +- frontend/components/hot-slots-bubble-map.tsx | 2 +- .../cumulative-transfer-counter.tsx | 2 +- .../swap-transfer-tracker/swap-row.tsx | 2 +- .../swap-transfer-tracker/transfer-row.tsx | 2 +- frontend/components/tps-tracker/tps-chart.tsx | 2 +- frontend/hooks/use-swap-events.ts | 2 +- frontend/hooks/use-transfer-events.ts | 2 +- frontend/{utils => lib}/abi-decode.ts | 0 frontend/lib/amount.ts | 22 ------------------- frontend/{utils => lib}/ui.ts | 17 ++++++++++++++ 13 files changed, 27 insertions(+), 32 deletions(-) rename frontend/{utils => lib}/abi-decode.ts (100%) delete mode 100644 frontend/lib/amount.ts rename frontend/{utils => lib}/ui.ts (62%) diff --git a/frontend/components/block-state-tracker/block-card.tsx b/frontend/components/block-state-tracker/block-card.tsx index 23cf9ff..6d880f4 100644 --- a/frontend/components/block-state-tracker/block-card.tsx +++ b/frontend/components/block-state-tracker/block-card.tsx @@ -5,9 +5,9 @@ import { Check } from 'lucide-react' import { ExternalLink } from '@/components/ui/external-link' import { BLOCK_STATE_CONFIG } from '@/constants/block-state' import { formatTimeDisplay } from '@/lib/timestamp' +import { formatBlockNumber } from '@/lib/ui' import { cn } from '@/lib/utils' import type { Block, BlockState } from '@/types/block' -import { formatBlockNumber } from '@/utils/ui' interface BlockCardProps { block: Block diff --git a/frontend/components/block-time-tracker/block-time.tsx b/frontend/components/block-time-tracker/block-time.tsx index dc3bd60..3bbe358 100644 --- a/frontend/components/block-time-tracker/block-time.tsx +++ b/frontend/components/block-time-tracker/block-time.tsx @@ -7,9 +7,9 @@ import { } from '@/components/ui/tooltip' import { EXPLORER_URL } from '@/constants/common' import { calculateBarMetrics, fromNsToMsPrecise } from '@/lib/block-metrics' +import { formatBlockNumber } from '@/lib/ui' import { cn } from '@/lib/utils' import type { Block } from '@/types/block' -import { formatBlockNumber } from '@/utils/ui' import { ExternalLink } from '../ui/external-link' interface BlockTimeProps { diff --git a/frontend/components/hot-accounts-bubble-map.tsx b/frontend/components/hot-accounts-bubble-map.tsx index 2a4219c..074404b 100644 --- a/frontend/components/hot-accounts-bubble-map.tsx +++ b/frontend/components/hot-accounts-bubble-map.tsx @@ -5,8 +5,8 @@ import { BubbleMap } from '@/components/ui/bubble-map' import { ExplorerLink } from '@/components/ui/bubble-map/explorer-link' import { useContractLabels } from '@/hooks/use-contract-labels' import { useEvents } from '@/hooks/use-events' +import { formatIntNumber } from '@/lib/ui' import { shortenHex } from '@/lib/utils' -import { formatIntNumber } from '@/utils/ui' interface HotAccount { id: string diff --git a/frontend/components/hot-slots-bubble-map.tsx b/frontend/components/hot-slots-bubble-map.tsx index c8efac5..cad8fbb 100644 --- a/frontend/components/hot-slots-bubble-map.tsx +++ b/frontend/components/hot-slots-bubble-map.tsx @@ -5,8 +5,8 @@ import { BubbleMap } from '@/components/ui/bubble-map' import { ExplorerLink } from '@/components/ui/bubble-map/explorer-link' import { useContractLabels } from '@/hooks/use-contract-labels' import { useEvents } from '@/hooks/use-events' +import { formatIntNumber } from '@/lib/ui' import { shortenHex } from '@/lib/utils' -import { formatIntNumber } from '@/utils/ui' interface HotSlot { id: string diff --git a/frontend/components/swap-transfer-tracker/cumulative-transfer-counter.tsx b/frontend/components/swap-transfer-tracker/cumulative-transfer-counter.tsx index 31d716e..09db234 100644 --- a/frontend/components/swap-transfer-tracker/cumulative-transfer-counter.tsx +++ b/frontend/components/swap-transfer-tracker/cumulative-transfer-counter.tsx @@ -3,7 +3,7 @@ import { TrendingUp } from 'lucide-react' import { formatUnits } from 'viem' import { StatCard } from '@/components/ui/stat-card' -import { formatAmount } from '@/utils/ui' +import { formatAmount } from '@/lib/ui' interface CumulativeTransferCounterProps { cumulativeTransferred: bigint diff --git a/frontend/components/swap-transfer-tracker/swap-row.tsx b/frontend/components/swap-transfer-tracker/swap-row.tsx index 9869291..de42432 100644 --- a/frontend/components/swap-transfer-tracker/swap-row.tsx +++ b/frontend/components/swap-transfer-tracker/swap-row.tsx @@ -4,8 +4,8 @@ import { motion } from 'framer-motion' import { ExternalLink } from '@/components/ui/external-link' import { EXPLORER_URL } from '@/constants/common' import { getSwapProviderConfig } from '@/constants/swap-provider-config' -import { formatTokenAmount } from '@/lib/amount' import { formatTimeDisplay } from '@/lib/timestamp' +import { formatTokenAmount } from '@/lib/ui' import { cn, shortenHex } from '@/lib/utils' import type { SwapData } from '@/types/swap' import { TokenBadge } from './token-badge' diff --git a/frontend/components/swap-transfer-tracker/transfer-row.tsx b/frontend/components/swap-transfer-tracker/transfer-row.tsx index 6c16350..a726280 100644 --- a/frontend/components/swap-transfer-tracker/transfer-row.tsx +++ b/frontend/components/swap-transfer-tracker/transfer-row.tsx @@ -3,8 +3,8 @@ import { motion } from 'framer-motion' import { ExternalLink } from '@/components/ui/external-link' import { EXPLORER_URL } from '@/constants/common' -import { formatTokenAmount } from '@/lib/amount' import { formatTimeDisplay } from '@/lib/timestamp' +import { formatTokenAmount } from '@/lib/ui' import { cn, shortenHex } from '@/lib/utils' import type { TransferData } from '@/types/transfer' import { TokenBadge } from './token-badge' diff --git a/frontend/components/tps-tracker/tps-chart.tsx b/frontend/components/tps-tracker/tps-chart.tsx index ddd3454..160af77 100644 --- a/frontend/components/tps-tracker/tps-chart.tsx +++ b/frontend/components/tps-tracker/tps-chart.tsx @@ -15,8 +15,8 @@ import { } from '@/components/ui/tooltip' import { useTps } from '@/hooks/use-tps' import { formatRelativeTime, formatTimeHMS } from '@/lib/timestamp' +import { formatIntNumber } from '@/lib/ui' import { cn } from '@/lib/utils' -import { formatIntNumber } from '@/utils/ui' const chartConfig = { tps: { diff --git a/frontend/hooks/use-swap-events.ts b/frontend/hooks/use-swap-events.ts index 37181b1..b43a8e0 100644 --- a/frontend/hooks/use-swap-events.ts +++ b/frontend/hooks/use-swap-events.ts @@ -9,9 +9,9 @@ import { type SwapProvider, } from '@/constants/swap-provider-config' import { useEvents } from '@/hooks/use-events' +import { parseTopicsString } from '@/lib/abi-decode' import type { SerializableEventData } from '@/types/events' import type { SwapData } from '@/types/swap' -import { parseTopicsString } from '@/utils/abi-decode' const MAX_SWAPS = 50 diff --git a/frontend/hooks/use-transfer-events.ts b/frontend/hooks/use-transfer-events.ts index c50dd0f..c54110a 100644 --- a/frontend/hooks/use-transfer-events.ts +++ b/frontend/hooks/use-transfer-events.ts @@ -8,9 +8,9 @@ import { WMON_ADDRESS, } from '@/constants/transfer-config' import { useEvents } from '@/hooks/use-events' +import { parseTopicsString } from '@/lib/abi-decode' import type { SerializableEventData } from '@/types/events' import type { TransferData } from '@/types/transfer' -import { parseTopicsString } from '@/utils/abi-decode' const MAX_TRANSFERS = 50 diff --git a/frontend/utils/abi-decode.ts b/frontend/lib/abi-decode.ts similarity index 100% rename from frontend/utils/abi-decode.ts rename to frontend/lib/abi-decode.ts diff --git a/frontend/lib/amount.ts b/frontend/lib/amount.ts deleted file mode 100644 index 4c477c9..0000000 --- a/frontend/lib/amount.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { formatUnits } from 'viem' -import { getTokenDecimals } from '@/constants/swap-provider-config' - -export function formatTokenAmount( - amount: string, - tokenSymbol: string, - tokenAddress?: string, -): string { - // Use address for decimals lookup if available, fallback to symbol - const decimals = getTokenDecimals(tokenAddress ?? tokenSymbol) - const absAmount = amount.startsWith('-') ? amount.slice(1) : amount - const formatted = formatUnits(BigInt(absAmount), decimals) - const num = Number(formatted) - - if (num === 0) return '0' - if (num < 0.001) return '<0.001' - if (num < 1) return num.toFixed(3) - if (num < 1000) return num.toFixed(2) - if (num < 1_000_000) return `${(num / 1000).toFixed(2)}K` - if (num < 1_000_000_000) return `${(num / 1_000_000).toFixed(2)}M` - return `${(num / 1_000_000_000).toFixed(2)}B` -} diff --git a/frontend/utils/ui.ts b/frontend/lib/ui.ts similarity index 62% rename from frontend/utils/ui.ts rename to frontend/lib/ui.ts index 0570867..f33559e 100644 --- a/frontend/utils/ui.ts +++ b/frontend/lib/ui.ts @@ -1,3 +1,6 @@ +import { formatUnits } from 'viem' +import { getTokenDecimals } from '@/constants/swap-provider-config' + export function formatBlockNumber(num: number): string { const str = num.toString() if (str.length <= 9) { @@ -25,3 +28,17 @@ export function formatAmount(amount: number) { if (amount < 1_000_000_000) return `${(amount / 1_000_000).toFixed(2)}M` return `${(amount / 1_000_000_000).toFixed(2)}B` } + +export function formatTokenAmount( + amount: string, + tokenSymbol: string, + tokenAddress?: string, +): string { + // Use address for decimals lookup if available, fallback to symbol + const decimals = getTokenDecimals(tokenAddress ?? tokenSymbol) + const absAmount = amount.startsWith('-') ? amount.slice(1) : amount + const formatted = formatUnits(BigInt(absAmount), decimals) + const num = Number(formatted) + + return formatAmount(num) +}