[name] Shorten ANS names down to a shorter name (#842)

* [name] Shorten ANS names down to a shorter name * address comments
aptos-labs · Oct 24, 2024 · 47ac11a · 47ac11a
1 parent 59ebadd
commit 47ac11a
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/src/components/HashButton.tsx b/src/components/HashButton.tsx
@@ -18,7 +18,7 @@ import {
 } from "../themes/colors/aptosColorPalette";
 import ChevronRightRoundedIcon from "@mui/icons-material/ChevronRightRounded";
 import ChevronLeftRoundedIcon from "@mui/icons-material/ChevronLeftRounded";
-import {truncateAddress, truncateAddressMiddle} from "../pages/utils";
+import {truncate, truncateAddress, truncateAddressMiddle} from "../pages/utils";
 import {assertNever} from "../utils";
 import {useGetNameFromAddress} from "../api/hooks/useGetANS";
 import ContentCopyIcon from "@mui/icons-material/ContentCopy";
@@ -157,8 +157,8 @@ function AccountHashButtonInner({
           textDecoration: "none",
         }}
       >
-        <Tooltip title={hash} enterDelay={500} enterNextDelay={500}>
-          <span>{name ?? truncateHash}</span>
+        <Tooltip title={name ?? hash} enterDelay={500} enterNextDelay={500}>
+          <span>{name ? truncate(name, 9, 11, "…") : truncateHash}</span>
         </Tooltip>
         <Tooltip title="Copied" open={copyTooltipOpen}>
           <Button

diff --git a/src/pages/utils.tsx b/src/pages/utils.tsx
@@ -68,7 +68,7 @@ export function timestampDisplay(timestamp: moment.Moment): TimestampDisplay {
   };
 }
 
-function truncate(
+export function truncate(
   str: string,
   frontLen: number,
   backLen: number,