SHARD-2738: populate token dropdown, fix conversion errors

[urnotsam]

PR Type

Bug fix, Enhancement

---

Description

• Fix ERC-20 token balance formatting and null checks throughout frontend

• Improve robustness for missing or null contract info in token handling

• Display correct ERC-20 token count and fallback names in dropdown

• Update backend token query to handle missing contract info gracefully

---

Changes walkthrough 📝

	Relevant files
Bug fix	useAccountDetailHook.ts Improve token balance formatting and null safety                  src/frontend/account/AccountDetail/useAccountDetailHook.ts Use formatUnits from ethers for balance formatting Add null checks for contractInfo and tokens array Default decimals to 18 if missing +5/-5      Token.tsx Use formatUnits and add null checks in Token page                src/frontend/token/Token.tsx Replace utils.formatUnits with formatUnits for balance/supply Add null checks for decimals and contract info Ensure consistent formatting for token values +5/-9      Ovewview.tsx Null-safe contract name display in transaction overview    src/frontend/transaction/TransactionDetail/Overview/Ovewview.tsx Add null-safe access for contractInfo.name in token display Fallback to contract address if name is missing +1/-1      calculateValue.ts Use formatUnits and null checks in value calculation          src/frontend/utils/calculateValue.ts Use formatUnits for ERC-20/EVM_Internal value formatting Add null checks for decimals in contract info Ensure fallback to 18 decimals if missing +4/-4      account.ts Null-safe contract info in token query backend                      src/storage/account.ts Add null-safe assignment for contractInfo and contractType Ensure backend handles missing contract info gracefully +2/-2
Enhancement	TokenDropdown.tsx Fix token count and fallback name in dropdown                        src/frontend/account/TokenDropdown/TokenDropdown.tsx Display correct ERC-20 token count in dropdown label Fallback to contract address if token name is missing Add null-safe access for contractInfo +7/-2

---

Need help?

Type /help how to ... in the comments thread for any questions about PR-Agent usage.

Check out the documentation for more information.

[github-actions]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 3 🔵🔵🔵⚪⚪

🏅 Score: 87

🧪 No relevant tests

🔒 No security concerns identified

⚡ Recommended focus areas for review Null Checks Robustness The new code adds null checks for contractInfo and its decimals property before formatting balances. Ensure that all possible null or undefined cases are handled gracefully to avoid runtime errors, especially when token data is incomplete or malformed. if (tokens && tokens.length > 0) { tokens.forEach( (item: { contractType: ContractType; contractInfo: { decimals: string } | null; balance: BigNumberish }) => { if (item.contractType === ContractType.ERC_20) { const decimalsValue = item.contractInfo?.decimals ? parseInt(item.contractInfo.decimals) : 18 item.balance = formatUnits(item.balance, decimalsValue) } Token Name Fallback The dropdown now falls back to displaying the contract address if the token name is missing. Confirm that this fallback logic is consistent and user-friendly across all UI components where token names are displayed. <MenuItem key={index} label={row.balance} label2={row?.contractInfo?.name || row.contractAddress} className={styles.menuItem} /> Backend Token Query Consistency The backend now sets contractInfo and contractType to null if missing. Verify that all frontend consumers of this API can handle these null values without breaking or displaying confusing information. contractInfo: accountExist?.contractInfo || null, contractType: accountExist?.contractType || null, balance: tokenValue,

[github-actions]

Suggestion: Ensure that row.contractInfo is not null before accessing name to avoid potential runtime errors if contractInfo is null. This prevents possible crashes when rendering the dropdown. [possible issue, importance: 7]

Suggested change

	label2={row?.contractInfo?.name || row.contractAddress}
	label2={row?.contractInfo && row.contractInfo.name ? row.contractInfo.name : row.contractAddress}

[github-actions]

Suggestion: Returning null for contractType may cause issues if downstream code expects a valid contract type. Consider only including tokens with a valid contractType to avoid propagating invalid data. [possible issue, importance: 6]

Suggested change

	contractInfo: accountExist?.contractInfo || null,
	contractType: accountExist?.contractType || null,
	if (accountExist && accountExist.contractType) {
	filterTokens.push({
	contractAddress: contractAddress,
	contractInfo: accountExist?.contractInfo || null,
	contractType: accountExist.contractType,
	balance: tokenValue,
	})
	}