MPT Object page improvement

package.json

@@ -42,6 +42,7 @@
     "recharts": "^2.15.3",
     "ripple-address-codec": "^5.0.0",
     "ripple-binary-codec": "^2.9.0",
+    "tldts": "^6.1.86",
     "topojson-client": "^3.0.0",
     "usehooks-ts": "^3.1.0",
     "vite": "^7.3.2",

src/containers/Accounts/AccountAsset/assetTables/NFTTable.tsx

@@ -16,9 +16,9 @@ import { XRP_BASE } from '../../../shared/transactionUtils'
 import {
   localizeNumber,
   shortenAccount,
-  shortenDomain,
   shortenNFTTokenID,
 } from '../../../shared/utils'
+import { shortenDomain } from '../../../shared/domainUtils'
 import { XRP_SMALL_BALANCE_CURRENCY_OPTIONS } from '../../../shared/NumberFormattingUtils'
 import { useLanguage } from '../../../shared/hooks'
 import logger from '../../../../rippled/lib/logger'

src/containers/Token/IOU/Header/index.tsx

@@ -18,7 +18,11 @@ import {
   parsePercent,
   parsePrice,
 } from '../../../shared/NumberFormattingUtils'
-import { shortenDomain, stripHttpProtocol } from '../../../shared/utils'
+import {
+  getRegistrableDomain,
+  shortenDomainFromLeft,
+} from '../../../shared/domainUtils'
+import { calculateIouCirculatingSupply } from '../../shared/utils/circulatingSupply'
 
 interface HeaderProps {
   currency: string
@@ -30,27 +34,6 @@ interface HeaderProps {
   isAmmTvlLoading: boolean
 }
 
-const calculateCirculatingSupply = (
-  tokenData: LOSToken,
-  holdersData: TokenHoldersData | undefined,
-): number => {
-  if (tokenData.circ_supply) {
-    return Number(tokenData.circ_supply)
-  }
-  let circSupply = Number(tokenData.supply) || holdersData?.totalSupply || 0
-
-  // For stablecoins, don't subtract large percentage holders from circulating supply
-  if (tokenData.asset_subclass !== 'stablecoin' && holdersData) {
-    holdersData.holders.forEach((holder) => {
-      if (holder.percent >= 20) {
-        circSupply -= holder.balance
-      }
-    })
-  }
-
-  return circSupply
-}
-
 export const Header = ({
   currency,
   tokenData,
@@ -61,7 +44,7 @@ export const Header = ({
   isAmmTvlLoading,
 }: HeaderProps) => {
   const { t } = useTranslation()
-  const circSupply = calculateCirculatingSupply(tokenData, holdersData)
+  const circSupply = calculateIouCirculatingSupply(tokenData, holdersData)
   const xrpRate = Number(xrpUSDRate) || 0
 
   // Memoized formatted overview data
@@ -178,11 +161,10 @@ export const Header = ({
               <DomainLink
                 className="domain-link"
                 domain={tokenData.issuer_domain}
-                displayDomain={shortenDomain(
-                  stripHttpProtocol(tokenData.issuer_domain),
-                  12,
-                  7,
+                displayDomain={shortenDomainFromLeft(
+                  getRegistrableDomain(tokenData.issuer_domain),
                 )}
+                title={tokenData.issuer_domain}
               />
             </div>
           </div>

src/containers/Token/IOU/test/Header/Header.test.tsx

@@ -31,8 +31,6 @@ jest.mock('../../../../shared/utils', () => ({
     return { num: d.toString(), unit: '' }
   },
   formatSmallNumber: (value: number) => value.toFixed(4),
-  shortenDomain: (domain: string) => domain,
-  stripHttpProtocol: (url: string) => url.replace(/^https?:\/\//, ''),
 }))
 
 const TestWrapper = ({ children }: { children: React.ReactNode }) => (