From 405a01e27703fc6db7fada7671b2b95e737e58a2 Mon Sep 17 00:00:00 2001 From: jipstavenuiter Date: Tue, 23 Dec 2025 16:58:01 +0100 Subject: [PATCH] fix: standardize address and transaction hash formatting --- components/Account/index.tsx | 7 +-- components/AccountCell/index.tsx | 4 +- components/Claim/index.tsx | 6 +- components/DelegatingView/index.tsx | 7 +-- components/DelegatingWidget/Header.tsx | 3 +- components/HistoryView/index.tsx | 68 +++++------------------ components/OrchestratorList/index.tsx | 4 +- components/PerformanceList/index.tsx | 4 +- components/Profile/index.tsx | 5 +- components/Search/index.tsx | 11 ++-- components/StakeTransactions/index.tsx | 15 +---- components/TransactionsList/index.tsx | 3 +- components/TreasuryVotingWidget/index.tsx | 4 +- components/TxConfirmedDialog/index.tsx | 12 +--- components/TxStartedDialog/index.tsx | 10 ++-- components/VotingWidget/index.tsx | 11 +--- hooks/useSwr.tsx | 3 +- layouts/main.tsx | 9 +-- lib/api/ens.ts | 13 +++++ lib/utils.test.ts | 11 ++-- lib/utils.tsx | 31 +++++++++++ pages/migrate/broadcaster.tsx | 10 +--- pages/migrate/delegator/index.tsx | 10 +--- pages/migrate/orchestrator.tsx | 10 +--- pages/treasury/[proposal].tsx | 8 +-- 25 files changed, 119 insertions(+), 160 deletions(-) diff --git a/components/Account/index.tsx b/components/Account/index.tsx index 9f74de7a..e295376b 100644 --- a/components/Account/index.tsx +++ b/components/Account/index.tsx @@ -1,3 +1,4 @@ +import { formatAddress } from "@lib/utils"; import { Box, Flex, Link as A } from "@livepeer/design-system"; import { useAccountAddress, useEnsData } from "hooks"; import Link from "next/link"; @@ -52,11 +53,7 @@ const Account = () => { > - - {ens?.name - ? ens.name - : accountAddress.replace(accountAddress.slice(6, 38), "…")} - + {ens?.name ? ens.name : formatAddress(accountAddress)} diff --git a/components/AccountCell/index.tsx b/components/AccountCell/index.tsx index f9dc8d59..43f86c15 100644 --- a/components/AccountCell/index.tsx +++ b/components/AccountCell/index.tsx @@ -1,4 +1,4 @@ -import { textTruncate } from "@lib/utils"; +import { formatAddress, textTruncate } from "@lib/utils"; import { Box, Flex } from "@livepeer/design-system"; import { useEnsData } from "hooks"; import { QRCodeCanvas } from "qrcode.react"; @@ -88,7 +88,7 @@ const Index = ({ active, address }) => { {identity?.name ? textTruncate(identity.name, 12, "…") - : address.replace(address.slice(5, 36), "…")} + : formatAddress(address)} diff --git a/components/Claim/index.tsx b/components/Claim/index.tsx index da0b0dbf..016dbc52 100644 --- a/components/Claim/index.tsx +++ b/components/Claim/index.tsx @@ -1,6 +1,7 @@ import { LAYOUT_MAX_WIDTH } from "@layouts/constants"; import { l2Migrator } from "@lib/api/abis/bridge/L2Migrator"; import { getL2MigratorAddress } from "@lib/api/contracts"; +import { formatAddress } from "@lib/utils"; import { Box, Button, Container, Flex, Text } from "@livepeer/design-system"; import { ArrowTopRightIcon } from "@modulz/radix-icons"; import { constants, ethers } from "ethers"; @@ -202,10 +203,7 @@ const Claim = () => { borderBottom: "1px solid rgba(255,255,255, .2)", }} > - {migrationParams.delegate.replace( - migrationParams.delegate.slice(6, 38), - "…" - )} + {formatAddress(migrationParams.delegate)} diff --git a/components/DelegatingView/index.tsx b/components/DelegatingView/index.tsx index 83279309..0f32a1b9 100644 --- a/components/DelegatingView/index.tsx +++ b/components/DelegatingView/index.tsx @@ -1,7 +1,7 @@ import { ExplorerTooltip } from "@components/ExplorerTooltip"; import Stat from "@components/Stat"; import { bondingManager } from "@lib/api/abis/main/BondingManager"; -import { checkAddressEquality } from "@lib/utils"; +import { checkAddressEquality, formatAddress } from "@lib/utils"; import { Box, Button, Flex, Link as A, Text } from "@livepeer/design-system"; import { QuestionMarkCircledIcon } from "@modulz/radix-icons"; import { AccountQueryResult, OrchestratorsSortedQueryResult } from "apollo"; @@ -167,10 +167,7 @@ const Index = ({ delegator, transcoders, protocol, currentRound }: Props) => { {delegateIdentity?.name ? delegateIdentity?.name - : delegator?.delegate?.id.replace( - delegator?.delegate?.id.slice(7, 37), - "…" - )} + : formatAddress(delegator?.delegate?.id)} } />{" "} diff --git a/components/DelegatingWidget/Header.tsx b/components/DelegatingWidget/Header.tsx index 60cda370..b808c216 100644 --- a/components/DelegatingWidget/Header.tsx +++ b/components/DelegatingWidget/Header.tsx @@ -1,4 +1,5 @@ import { EnsIdentity } from "@lib/api/types/get-ens"; +import { formatAddress } from "@lib/utils"; import { Box, Flex, Heading } from "@livepeer/design-system"; import { QRCodeCanvas } from "qrcode.react"; @@ -58,7 +59,7 @@ const Header = ({ {delegateProfile?.name ? delegateProfile.name - : transcoder?.id.replace(transcoder.id.slice(7, 37), "…")} + : formatAddress(transcoder?.id)} - Delegated with{" "} - {event.newDelegate.id.replace( - event.newDelegate.id.slice(7, 37), - "…" - )} + Delegated with {formatAddress(event.newDelegate.id)} - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -271,10 +265,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -312,8 +303,7 @@ function renderSwitch(event, i: number) { > - Redelegated with{" "} - {event.delegate.id.replace(event.delegate.id.slice(7, 37), "…")} + Redelegated with {formatAddress(event.delegate.id)} - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -378,8 +365,7 @@ function renderSwitch(event, i: number) { > - Undelegated from{" "} - {event.delegate.id.replace(event.delegate.id.slice(7, 37), "…")} + Undelegated from {formatAddress(event.delegate.id)} - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -463,10 +446,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -526,10 +506,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -593,10 +570,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -655,10 +629,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -717,10 +688,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -780,10 +748,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} @@ -848,10 +813,7 @@ function renderSwitch(event, i: number) { }} > - {event.transaction.id.replace( - event.transaction.id.slice(6, 62), - "…" - )} + {formatTransactionHash(event.transaction.id)} diff --git a/components/OrchestratorList/index.tsx b/components/OrchestratorList/index.tsx index a4c3f6e7..2e277352 100644 --- a/components/OrchestratorList/index.tsx +++ b/components/OrchestratorList/index.tsx @@ -11,7 +11,7 @@ import { ROIInflationChange, ROITimeHorizon, } from "@lib/roi"; -import { textTruncate } from "@lib/utils"; +import { formatAddress, textTruncate } from "@lib/utils"; import { Badge, Box, @@ -309,7 +309,7 @@ const OrchestratorList = ({ ) : ( - {row.values.id.replace(row.values.id.slice(7, 37), "…")} + {formatAddress(row.values.id)} )} {/* {(row?.original?.daysSinceChangeParams ?? diff --git a/components/PerformanceList/index.tsx b/components/PerformanceList/index.tsx index 5bd94283..27959666 100644 --- a/components/PerformanceList/index.tsx +++ b/components/PerformanceList/index.tsx @@ -4,7 +4,7 @@ import Table from "@components/Table"; import { Pipeline } from "@lib/api/types/get-available-pipelines"; import { AllPerformanceMetrics } from "@lib/api/types/get-performance"; import { Region } from "@lib/api/types/get-regions"; -import { textTruncate } from "@lib/utils"; +import { formatAddress, textTruncate } from "@lib/utils"; import { Badge, Box, Flex, Link as A, Skeleton } from "@livepeer/design-system"; import { QuestionMarkCircledIcon } from "@modulz/radix-icons"; import { OrchestratorsQueryResult } from "apollo"; @@ -154,7 +154,7 @@ const PerformanceList = ({ ) : ( - {row.values.id.replace(row.values.id.slice(7, 37), "…")} + {formatAddress(row.values.id)} )} {typeof row.values.scores != "undefined" && diff --git a/components/Profile/index.tsx b/components/Profile/index.tsx index 2f5f1522..233226d9 100644 --- a/components/Profile/index.tsx +++ b/components/Profile/index.tsx @@ -1,6 +1,7 @@ import { ExplorerTooltip } from "@components/ExplorerTooltip"; import ShowMoreRichText from "@components/ShowMoreRichText"; import { EnsIdentity } from "@lib/api/types/get-ens"; +import { formatAddress } from "@lib/utils"; import { Box, Flex, Heading, Link as A, Text } from "@livepeer/design-system"; import { CheckIcon, @@ -107,9 +108,7 @@ const Index = ({ account, isMyAccount = false, identity }: Props) => { fontWeight: 700, }} > - {identity?.name - ? identity.name - : account.replace(account.slice(5, 39), "…")} + {identity?.name ? identity.name : formatAddress(account)} diff --git a/components/Search/index.tsx b/components/Search/index.tsx index 28853e7e..ad2f8d96 100644 --- a/components/Search/index.tsx +++ b/components/Search/index.tsx @@ -1,4 +1,5 @@ import Spinner from "@components/Spinner"; +import { formatAddress } from "@lib/utils"; import { Box, Dialog, @@ -182,14 +183,10 @@ const Index = ({ css = {}, ...props }) => { {result.item.name - ? `${result.item.name} (${result.item.id.replace( - result.item.id.slice(5, 39), - "…" + ? `${result.item.name} (${formatAddress( + result.item.id )})` - : result.item.id.replace( - result.item.id.slice(7, 37), - "…" - )} + : formatAddress(result.item.id, 8, 6)} diff --git a/components/StakeTransactions/index.tsx b/components/StakeTransactions/index.tsx index a9fba43b..529f227e 100644 --- a/components/StakeTransactions/index.tsx +++ b/components/StakeTransactions/index.tsx @@ -5,6 +5,7 @@ import { parseEther } from "viem"; import { abbreviateNumber, + formatAddress, getHint, simulateNewActiveSetOrder, } from "../../lib/utils"; @@ -66,11 +67,7 @@ const Index = ({ delegator, transcoders, currentRound, isMyAccount }) => { > - Undelegating from{" "} - {lock.delegate.id.replace( - lock.delegate.id.slice(7, 37), - "…" - )} + Undelegating from {formatAddress(lock.delegate.id)} Tokens will be available for withdrawal in approximately{" "} @@ -140,13 +137,7 @@ const Index = ({ delegator, transcoders, currentRound, isMyAccount }) => { justifyContent: "space-between", }} > - - Undelegated from{" "} - {lock.delegate.id.replace( - lock.delegate.id.slice(7, 37), - "…" - )} - + Undelegated from {formatAddress(lock.delegate.id)} {isMyAccount && ( diff --git a/components/TransactionsList/index.tsx b/components/TransactionsList/index.tsx index 7fdb1e05..f887da8a 100644 --- a/components/TransactionsList/index.tsx +++ b/components/TransactionsList/index.tsx @@ -1,5 +1,6 @@ import Table from "@components/Table"; import dayjs from "@lib/dayjs"; +import { formatTransactionHash } from "@lib/utils"; import { Badge, Box, Flex, Link as A, Text } from "@livepeer/design-system"; import { ArrowTopRightIcon } from "@modulz/radix-icons"; import { EventsQueryResult } from "apollo"; @@ -79,7 +80,7 @@ const Transaction = (props: { id: string | undefined }) => { } > - {props.id ? props.id.replace(props.id.slice(6, 62), "…") : "N/A"} + {props.id ? formatTransactionHash(props.id) : "N/A"} { }} > - Delegate vote ({shortenAddress(vote.delegate!.address)}) + Delegate vote ({formatAddress(vote.delegate!.address)}) {vote.delegate!.hasVoted ? "Voted" : "Not voted"} diff --git a/components/TxConfirmedDialog/index.tsx b/components/TxConfirmedDialog/index.tsx index 59e3d099..41414e55 100644 --- a/components/TxConfirmedDialog/index.tsx +++ b/components/TxConfirmedDialog/index.tsx @@ -23,7 +23,7 @@ import { MdReceipt } from "react-icons/md"; import { Address } from "viem"; import { useReadContract } from "wagmi"; -import { fromWei, txMessages } from "../../lib/utils"; +import { formatAddress, fromWei, txMessages } from "../../lib/utils"; const Index = () => { const router = useRouter(); @@ -196,10 +196,7 @@ const TransactionContent = ({ }} > You've successfully redelegated to orchestrator{" "} - {tx.inputData.delegate.replace( - tx.inputData.delegate.slice(7, 37), - "…" - )} + {formatAddress(tx.inputData.delegate)} @@ -226,10 +223,7 @@ const TransactionContent = ({ You've successfully checkpointed{" "} {!isOrchestrator ? "your stake" - : `your orchestrator (${targetAddress?.replace( - targetAddress?.slice(7, 37) ?? "", - "…" - )}) stake!`} + : `your orchestrator (${formatAddress(targetAddress)}) stake!`} diff --git a/components/TxStartedDialog/index.tsx b/components/TxStartedDialog/index.tsx index 3c80c857..6b8df896 100644 --- a/components/TxStartedDialog/index.tsx +++ b/components/TxStartedDialog/index.tsx @@ -1,4 +1,4 @@ -import { fromWei, txMessages } from "@lib/utils"; +import { formatAddress, fromWei, txMessages } from "@lib/utils"; import { Badge, Box, @@ -90,7 +90,7 @@ function Table({ tx, account }: { tx: TransactionStatus; account: string }) { }} > - Your account {account?.replace(account?.slice(7, 37), "…")} + Your account {formatAddress(account)} @@ -107,8 +107,7 @@ function Inputs({ tx }: { tx: TransactionStatus }) { return ( <> - Delegate{" "} - {inputData.to.replace(inputData.to.slice(7, 37), "…")} + Delegate {formatAddress(inputData.to)} {Number(inputData.amount) > 0 ? ( @@ -134,8 +133,7 @@ function Inputs({ tx }: { tx: TransactionStatus }) { return ( <> - Delegate{" "} - {inputData.delegate.replace(inputData.delegate.slice(7, 37), "…")} + Delegate {formatAddress(inputData.delegate)} ); diff --git a/components/VotingWidget/index.tsx b/components/VotingWidget/index.tsx index bb02a577..73f07e59 100644 --- a/components/VotingWidget/index.tsx +++ b/components/VotingWidget/index.tsx @@ -1,5 +1,6 @@ import { PollExtended } from "@lib/api/polls"; import dayjs from "@lib/dayjs"; +import { abbreviateNumber, formatAddress, fromWei } from "@lib/utils"; import { Box, Button, @@ -19,7 +20,6 @@ import numbro from "numbro"; import { useEffect, useMemo, useState } from "react"; import { CopyToClipboard } from "react-copy-to-clipboard"; -import { abbreviateNumber, fromWei } from "../../lib/utils"; import Check from "../../public/img/check.svg"; import Copy from "../../public/img/copy.svg"; import VoteButton from "../VoteButton"; @@ -239,11 +239,7 @@ const Index = ({ data }: { data: Props }) => { > My Delegate Vote{" "} - {delegate && - `(${delegate?.id?.replace( - delegate?.id?.slice(5, 39), - "…" - )})`} + {delegate && `(${formatAddress(delegate?.id)})`} {data?.delegateVote?.choiceID @@ -258,8 +254,7 @@ const Index = ({ data }: { data: Props }) => { }} > - My Vote ( - {accountAddress.replace(accountAddress.slice(5, 39), "…")}) + My Vote ({formatAddress(accountAddress)}) { const fallbackIdentity: EnsIdentity = { id: address ?? "", - idShort: address?.replace(address?.slice(6, 38), "…") ?? "", + idShort: formatAddress(address), name: null, }; diff --git a/layouts/main.tsx b/layouts/main.tsx index 4c7abe46..cff6bb08 100644 --- a/layouts/main.tsx +++ b/layouts/main.tsx @@ -11,7 +11,7 @@ import TxSummaryDialog from "@components/TxSummaryDialog"; import URLVerificationBanner from "@components/URLVerificationBanner"; import { IS_L2 } from "@lib/chains"; import { globalStyles } from "@lib/globalStyles"; -import { EMPTY_ADDRESS } from "@lib/utils"; +import { EMPTY_ADDRESS, formatAddress } from "@lib/utils"; import { Badge, Box, @@ -870,13 +870,10 @@ const ContractAddressesPopover = ({ activeChain }: { activeChain?: Chain }) => { }} size="2" > - {contractAddresses?.[ - key as keyof typeof contractAddresses - ]?.address?.replace( + {formatAddress( contractAddresses?.[ key as keyof typeof contractAddresses - ]?.address?.slice(7, 37) ?? "", - "…" + ]?.address )} diff --git a/lib/api/ens.ts b/lib/api/ens.ts index 293a4e1d..777fd7a8 100644 --- a/lib/api/ens.ts +++ b/lib/api/ens.ts @@ -1,4 +1,5 @@ import { l1Provider } from "@lib/chains"; +import { formatAddress } from "@lib/utils"; import sanitizeHtml from "sanitize-html"; import { EnsIdentity } from "./types/get-ens"; @@ -100,3 +101,15 @@ export const nl2br = (str, is_xhtml = true) => { "$1" + breakTag + "$2" ); }; + +export const getEnsForVotes = async (address: string | null | undefined) => { + const idShort = formatAddress(address); + + const name = address ? await l1Provider.lookupAddress(address) : null; + + return { + id: address ?? "", + idShort: idShort ?? "", + name, + }; +}; diff --git a/lib/utils.test.ts b/lib/utils.test.ts index e125fbbd..02312d45 100644 --- a/lib/utils.test.ts +++ b/lib/utils.test.ts @@ -6,12 +6,12 @@ import { avg, checkAddressEquality, EMPTY_ADDRESS, + formatAddress, fromWei, getDelegatorStatus, getHint, getPercentChange, isImageUrl, - shortenAddress, simulateNewActiveSetOrder, textTruncate, toWei, @@ -336,19 +336,18 @@ describe("isImageUrl", () => { }); }); -describe("shortenAddress", () => { +describe("formatAddress", () => { it("shortens a normal ethereum address", () => { const addr = "0x1234567890abcdef1234567890abcdef12345678"; - const shortened = shortenAddress(addr); + const shortened = formatAddress(addr); // Implementation: replace address.slice(5, 39) with "…" - const expected = addr.slice(0, 5) + "…" + addr.slice(39); + const expected = addr.slice(0, 6) + "…" + addr.slice(-4); expect(shortened).toBe(expected); }); it("returns empty string for falsy address", () => { - // @ts-expect-error testing runtime behavior - expect(shortenAddress(null)).toBe(""); + expect(formatAddress(null)).toBe(""); }); }); diff --git a/lib/utils.tsx b/lib/utils.tsx index 97bdbbf4..ebc36e87 100644 --- a/lib/utils.tsx +++ b/lib/utils.tsx @@ -279,3 +279,34 @@ export const isImageUrl = (url: string): boolean => { */ export const shortenAddress = (address: string) => address?.replace(address.slice(5, 39), "…") ?? ""; + +export const lptFormatter = new Intl.NumberFormat("en-US", { + minimumFractionDigits: 2, + maximumFractionDigits: 2, +}); + +export const formatLpt = (w: string) => { + return `${lptFormatter.format(parseFloat(w) / 1e18)} LPT`; +}; + +export const formatAddress = ( + addr: string | null | undefined, + startLength = 6, + endLength = 4 +): string => { + if (!addr) return ""; + if (addr.endsWith(".xyz")) { + return addr.length > 21 ? `${addr.slice(0, 6)}...${addr.slice(-6)}` : addr; + } + if (addr.endsWith(".eth") && addr.length < 21) { + return addr; + } + return addr.length > 21 + ? `${addr.slice(0, startLength)}…${addr.slice(-endLength)}` + : addr; +}; + +export const formatTransactionHash = (id: string | null | undefined) => { + if (!id) return ""; + return id.replace(id.slice(6, 62), "…"); +}; diff --git a/pages/migrate/broadcaster.tsx b/pages/migrate/broadcaster.tsx index edf73b05..244b97db 100644 --- a/pages/migrate/broadcaster.tsx +++ b/pages/migrate/broadcaster.tsx @@ -12,6 +12,7 @@ import { l2Provider, l2PublicClient, } from "@lib/chains"; +import { formatAddress, formatTransactionHash } from "@lib/utils"; import { Box, Button, @@ -887,12 +888,7 @@ function MigrationFields({ migrationParams, css = {} }) { Address - - {migrationParams.l1Addr.replace( - migrationParams.l1Addr.slice(6, 38), - "…" - )} - + {formatAddress(migrationParams.l1Addr)} Deposit @@ -927,7 +923,7 @@ function ReceiptLink({ label, hash, chainId }) { rel="noopener noreferrer" href={`${CHAIN_INFO[chainId].explorer}tx/${hash}`} > - {hash.replace(hash.slice(6, 62), "…")} + {formatTransactionHash(hash)} diff --git a/pages/migrate/delegator/index.tsx b/pages/migrate/delegator/index.tsx index 8c9bc534..c17bdf04 100644 --- a/pages/migrate/delegator/index.tsx +++ b/pages/migrate/delegator/index.tsx @@ -11,6 +11,7 @@ import { l2Provider, l2PublicClient, } from "@lib/chains"; +import { formatAddress, formatTransactionHash } from "@lib/utils"; import { Box, Button, @@ -884,12 +885,7 @@ function MigrationFields({ migrationParams, css = {} }) { Address - - {migrationParams.l1Addr.replace( - migrationParams.l1Addr.slice(6, 38), - "…" - )} - + {formatAddress(migrationParams.l1Addr)} @@ -922,7 +918,7 @@ function ReceiptLink({ label, hash, chainId }) { rel="noopener noreferrer" href={`${CHAIN_INFO[chainId].explorer}tx/${hash}`} > - {hash.replace(hash.slice(6, 62), "…")} + {formatTransactionHash(hash)} diff --git a/pages/migrate/orchestrator.tsx b/pages/migrate/orchestrator.tsx index f862439a..3805aaab 100644 --- a/pages/migrate/orchestrator.tsx +++ b/pages/migrate/orchestrator.tsx @@ -6,6 +6,7 @@ import { l1Migrator } from "@lib/api/abis/bridge/L1Migrator"; import { nodeInterface } from "@lib/api/abis/bridge/NodeInterface"; import { getL1MigratorAddress } from "@lib/api/contracts"; import { isL2ChainId, l1PublicClient, l2PublicClient } from "@lib/chains"; +import { formatAddress, formatTransactionHash } from "@lib/utils"; import { Box, Button, @@ -869,12 +870,7 @@ function MigrationFields({ migrationParams, css = {} }) { Address - - {migrationParams.delegate.replace( - migrationParams.delegate.slice(6, 38), - "…" - )} - + {formatAddress(migrationParams.delegate)} Self stake @@ -917,7 +913,7 @@ function ReceiptLink({ label, hash, chainId }) { rel="noopener noreferrer" href={`${CHAIN_INFO[chainId].explorer}tx/${hash}`} > - {hash.replace(hash.slice(6, 62), "…")} + {formatTransactionHash(hash)} diff --git a/pages/treasury/[proposal].tsx b/pages/treasury/[proposal].tsx index 412237b1..2cd5e17f 100644 --- a/pages/treasury/[proposal].tsx +++ b/pages/treasury/[proposal].tsx @@ -10,7 +10,7 @@ import { livepeerToken } from "@lib/api/abis/main/LivepeerToken"; import { getProposalExtended } from "@lib/api/treasury"; import { CHAIN_INFO, DEFAULT_CHAIN, DEFAULT_CHAIN_ID } from "@lib/chains"; import dayjs from "@lib/dayjs"; -import { abbreviateNumber, fromWei, shortenAddress } from "@lib/utils"; +import { abbreviateNumber, formatAddress, fromWei } from "@lib/utils"; import { Badge, Box, @@ -198,7 +198,7 @@ const Proposal = () => { Proposed by{" "} - {proposerId?.name ?? shortenAddress(proposal.proposer.id)} + {proposerId?.name ?? formatAddress(proposal.proposer.id)} @@ -458,7 +458,7 @@ const Proposal = () => { size="2" > {width <= 640 - ? shortenAddress(action.lptTransfer.receiver) + ? formatAddress(action.lptTransfer.receiver) : action.lptTransfer.receiver} @@ -516,7 +516,7 @@ const Proposal = () => { size="2" > {action.contract - ? `${action.contract?.name} (${shortenAddress( + ? `${action.contract?.name} (${formatAddress( action.target )})` : action.target}