feat: add Avalanche and Polygon native token images to E
8000
xplorer
#5813
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
3 Skipped Deployments
|
|
Important Review skippedReview was skipped due to path filters ⛔ Files ignored due to path filters (1)
CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including You can disable this status message by setting the WalkthroughThe changes expand support for Avalanche and Polygon tokens by updating regex patterns and centralizing network-to-image mappings. Surplus start dates for Polygon and Avalanche were updated from May to June 2025. Currency symbol retrieval was refactored to use a mapping object for multiple chains, replacing conditional logic. FAQ data was updated to include Polygon and Avalanche in supported chains. The CoW SDK dependency version was bumped. Changes
Suggested reviewers
Poem
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
| const TOKEN_ICON_FILENAME_REGEX = /(0x\w{40}|eth|xdai)/ | ||
| const TOKEN_ICON_FILENAME_REGEX = /(0x\w{40}|eth|xdai|avax|pol)/ | ||
|
|
||
| console.log(tokensIconsRequire) |
| @@ -75,7 +75,16 @@ export function getImageAddress(address: string, network: Network): string { | |||
| // Well, this address here is the path on `src/assets/tokens/` | |||
| // So these special values will use the local images, | |||
| // because they are native tokens and don't really have an address | |||
| return network === Network.GNOSIS_CHAIN ? 'xdai' : 'eth' | |||
| switch (network) { | |||
There was a problem hiding this comment.
Nitpick, it's better to use Record<Network, string> instead of switch/case. It will protect you from ocassional mistakes
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (3)
apps/explorer/src/utils/miscellaneous.ts (1)
78-87: Prefer a constant map over an inlineswitchfor scalabilityHard-coding network ↔︎ image strings in a
switchworks, but every future network addition will touch this function again.
A single constant map keeps the function O(1) and avoids code churn:- switch (network) { - case Network.GNOSIS_CHAIN: - return 'xdai' - case Network.AVALANCHE: - return 'avax' - case Network.POLYGON: - return 'pol' - default: - return 'eth' - } + const NATIVE_ICON_BY_NETWORK: Record<Network, string> = { + [Network.GNOSIS_CHAIN]: 'xdai', + [Network.AVALANCHE]: 'avax', + [Network.POLYGON]: 'pol', + } as const + + return NATIVE_ICON_BY_NETWORK[network] ?? 'eth'Benefits:
• Single-source of truth (also reusable fromTokenImg.tsx)
• Type-checked keys → compile-time safety when a new enum member is introduced
• Cleaner diff for future PRs.apps/explorer/src/components/common/TokenImg.tsx (2)
43-44: Keep regex patterns in sync withgetImageAddressGood catch adding
avax&pol. Once the mapping inmiscellaneous.tsis refactored into a constant (see previous comment), consider importing that same constant here to avoid future drift between the regex and the mapping.
45-46: Remove unconditionalconsole.logbefore shippingDumping the entire
tokensIconsRequireobject (~hundreds of base-64 URLs) to the console will bloat production logs and slightly impact bundle size. Gate it behind a dev check or drop it entirely:-console.log(tokensIconsRequire) +if (process.env.NODE_ENV === 'development') { + // eslint-disable-next-line no-console + console.debug('Token icons loaded:', tokensIconsRequire) +}
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (2)
apps/explorer/src/assets/img/tokens/avax.pngis excluded by!**/*.pngapps/explorer/src/assets/img/tokens/pol.pngis excluded by!**/*.png
📒 Files selected for processing (2)
apps/explorer/src/components/common/TokenImg.tsx(1 hunks)apps/explorer/src/utils/miscellaneous.ts(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: Cypress
- GitHub Check: Setup
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
libs/common-const/src/gnosis_chain/hack.ts (1)
9-17: Optional: usesatisfies/as constfor compile-time exhaustivenessTypeScript 4.9+ can guarantee every
SupportedChainIdkey is present:-const ChainCurrencySymbolsMap: Record<SupportedChainId, { native: string; wrapped: string }> = { +const ChainCurrencySymbolsMap = { … -} +} as const satisfies Record<SupportedChainId, { native: string; wrapped: string }>This prevents accidental omission when new chains are added.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
apps/cowswap-frontend/src/modules/account/containers/AccountDetails/SurplusCard.tsx(1 hunks)apps/explorer/src/components/common/TokenImg.tsx(1 hunks)apps/explorer/src/utils/miscellaneous.ts(1 hunks)libs/common-const/src/gnosis_chain/hack.ts(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- apps/cowswap-frontend/src/modules/account/containers/AccountDetails/SurplusCard.tsx
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/explorer/src/components/common/TokenImg.tsx
- apps/explorer/src/utils/miscellaneous.ts
🧰 Additional context used
🧬 Code Graph Analysis (1)
libs/common-const/src/gnosis_chain/hack.ts (2)
libs/widget-lib/src/types.ts (1)
SupportedChainId(4-4)libs/common-const/src/tokens.ts (1)
XDAI_SYMBOL(99-99)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: Cypress
- GitHub Check: Setup
| export function getChainCurrencySymbols(chainId?: SupportedChainId): { native: string; wrapped: string } { | ||
| if (!chainId) return ChainCurrencySymbolsMap[SupportedChainId.MAINNET] | ||
|
|
||
| return CURRENCY_SYMBOLS_ETH | ||
| return ChainCurrencySymbolsMap[chainId] |
There was a problem hiding this comment.
Unsafe return type – function may yield undefined for unknown chainId
Record<SupportedChainId, …> is not exhaustive at runtime: callers can pass any number.
ChainCurrencySymbolsMap[chainId] will return undefined, violating the declared return type { native: string; wrapped: string } and crashing on property access.
export function getChainCurrencySymbols(chainId?: SupportedChainId): { native: string; wrapped: string } {
- if (!chainId) return ChainCurrencySymbolsMap[SupportedChainId.MAINNET]
-
- return ChainCurrencySymbolsMap[chainId]
+ const symbols = ChainCurrencySymbolsMap[chainId ?? SupportedChainId.MAINNET]
+ if (!symbols) {
+ // Fallback or throw – choose whichever matches product requirements
+ return CURRENCY_SYMBOLS_ETH
+ // throw new Error(`Unsupported chainId ${chainId}`)
+ }
+ return symbols
}Add an exhaustive test to ensure unknown IDs fall back or throw as intended.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| export function getChainCurrencySymbols(chainId?: SupportedChainId): { native: string; wrapped: string } { | |
| if ( 8000 !chainId) return ChainCurrencySymbolsMap[SupportedChainId.MAINNET] | |
| return CURRENCY_SYMBOLS_ETH | |
| return ChainCurrencySymbolsMap[chainId] | |
| export function getChainCurrencySymbols(chainId?: SupportedChainId): { native: string; wrapped: string } { | |
| const symbols = ChainCurrencySymbolsMap[chainId ?? SupportedChainId.MAINNET] | |
| if (!symbols) { | |
| // Fallback or throw – choose whichever matches product requirements | |
| return CURRENCY_SYMBOLS_ETH | |
| // throw new Error(`Unsupported chainId ${chainId}`) | |
| } | |
| return symbols | |
| } |
🤖 Prompt for AI Agents
In libs/common-const/src/gnosis_chain/hack.ts around lines 19 to 22, the
function getChainCurrencySymbols may return undefined if an unknown chainId is
passed, violating the declared return type. To fix this, add a runtime check to
verify if chainId exists in ChainCurrencySymbolsMap; if not, either throw an
error or return a default fallback value like the MAINNET symbols. Also, add a
test case to cover unknown chainId inputs to ensure the function handles them
safely.
|
Hey @cowdan , thank you!
Thanks |
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
There was a problem hiding this comment.
Hey @cowdan , thank you!
So, eveything lools good:
- Polyscan and Snowtrace naming
- native and wrapped native tokens names
- tooltip details
- and chains info on cow.fi.
However, I have 1 concern: if we merge this PR with changes on Cow.fi before the networks launch, it might be possible that users will see it before the announcement.
WDYT about commenting this change for now and enabling it after the new networks launch?
Thanks
|
In relation to @elena-zh 's comment, should we make use of |
This reverts commit 67b6836.
Hey @elena-zh, as discussed, that commit has been reverted |
I've tried that but having to manage different versions according to which flag is enabled is not worth IMO |
Summary
AvalancheandPolygonnative token images to ExplorerAvalancheandPolygonstart dateAvalancheandPolygonnative tokens messageFixes
Summary by CodeRabbit
Summary by CodeRabbit
- New Features
- Added support for displaying token images for Avalanche (AVAX) and Polygon (POL) networks.
- Chores
- Centralized network-to-token image mappings for better maintainability.
- Updated surplus calculation start dates for Polygon and Avalanche to June 2025.
- Standardized currency symbol mappings across supported chains for consistency.
- Expanded the list of supported blockchain networks in FAQs to include Polygon and Avalanche.
- Updated CoW SDK dependency to the latest release candidate version.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -