chore: Enforce consistent SVG asset import naming

[Danziger]

Summary

Decided to implement this after #7206 so that SVG assets are imported with consistent naming so that it's a bit more obvious what they are (they are simple paths / URLs, but some looked like components when written in CamelCase, some other ones where in UPPER_CASE...).

This commit fixes the linting issues (renames SVG imports): 0e35c94

To Test

Nothing to test.

Summary by CodeRabbit

• Refactor
  • Unified SVG/image import naming and updated all icon/image references for consistent asset handling across the app.
• Chores
  • Added lint rules and a codemod (with tests) to enforce the new import naming convention.
• Bug Fixes
  • No user-facing behavioral or visual changes; UI interactions remain unchanged.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
cowfi	Ready	Preview	May 18, 2026 9:19pm
explorer-dev	Ready	Preview	May 18, 2026 9:19pm
storybook	Ready	Preview	May 18, 2026 9:19pm
swap-dev	Ready	Preview	May 18, 2026 9:19pm
widget-configurator	Ready	Preview	May 18, 2026 9:19pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
cosmos	Ignored		May 18, 2026 9:19pm
sdk-tools	Ignored	Preview	May 18, 2026 9:19pm

[coderabbitai]

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

• @coderabbitai resume to resume automatic reviews.
• @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

• ▶️ Resume reviews
• 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 2b2160b3-c682-46ce-8171-a47094b10fdc

📥 Commits

Reviewing files that changed from the base of the PR and between 2e98018 and 5afd7dd.

📒 Files selected for processing (12)

• apps/cowswap-frontend/src/common/pure/AddressInputPanel/ReceiverPanelHeader.container.tsx
• apps/cowswap-frontend/src/common/pure/NewModal/index.tsx
• apps/cowswap-frontend/src/modules/affiliate/containers/AffiliateFeedbackButton.container.tsx
• apps/cowswap-frontend/src/modules/affiliate/containers/AffiliatePartnerCodeInfo.tsx
• apps/cowswap-frontend/src/modules/affiliate/containers/AffiliateTraderCodeInfo.tsx
• apps/cowswap-frontend/src/modules/affiliate/pure/AffiliateNotificationIcon.tsx
• apps/cowswap-frontend/src/modules/swap/containers/BottomBanners/BottomBanners.container.tsx
• apps/cowswap-frontend/src/modules/tokensList/pure/TokenTags/index.tsx
• apps/storybook/src/main.ts
• apps/storybook/src/preview.tsx
• apps/widget-configurator/src/app/embedDialog/index.tsx
• libs/ui/src/containers/Footer/index.tsx

💤 Files with no reviewable changes (2)

• apps/storybook/src/preview.tsx
• apps/storybook/src/main.ts

✅ Files skipped from review due to trivial changes (7)

• apps/cowswap-frontend/src/modules/affiliate/pure/AffiliateNotificationIcon.tsx
• apps/cowswap-frontend/src/modules/affiliate/containers/AffiliateFeedbackButton.container.tsx
• apps/cowswap-frontend/src/common/pure/NewModal/index.tsx
• apps/cowswap-frontend/src/modules/tokensList/pure/TokenTags/index.tsx
• apps/cowswap-frontend/src/common/pure/AddressInputPanel/ReceiverPanelHeader.container.tsx
• apps/cowswap-frontend/src/modules/affiliate/containers/AffiliateTraderCodeInfo.tsx
• apps/cowswap-frontend/src/modules/swap/containers/BottomBanners/BottomBanners.container.tsx

🚧 Files skipped from review as they are similar to previous changes (3)

• apps/cowswap-frontend/src/modules/affiliate/containers/AffiliatePartnerCodeInfo.tsx
• libs/ui/src/containers/Footer/index.tsx
• apps/widget-configurator/src/app/embedDialog/index.tsx

---

Walkthrough

Standardizes many image/SVG import bindings to icon*Src/img*Src/svg*Src, updates all usages (inline SVGs, , CSS backgrounds, and data constants), and adds linting and a codemod with tests to automate and validate the renames.

Changes

Tooling & Codemod

Layer / File(s)	Summary
Lint rule eslint.config.js	Adds no-restricted-syntax checks enforcing naming patterns for .svg import bindings (icon*Src / svg*Src / img*Src).
Codemod implementation tools/codemods/rename-svg-import-bindings.mjs	New Node ESM codemod that rewrites asset imports (svg/png/jpg/jpeg/webp/gif) into canonical binding names, updates identifier occurrences outside strings/comments, and ensures per-file uniqueness via path-based qualifiers and numeric suffixes.
Codemod tests / runner tools/codemods/rename-svg-import-bindings.test.mjs	Standalone test runner validating prefix selection, legacy→new mapping, identifier replacement excluding strings/comments, collision handling, template-literal cases, and re-export updates.

Repository-wide Asset Renames

Layer / File(s)	Summary
Import renames (wiring) apps/*/app/(main)/*.tsx, apps/*/components/*, apps/*/data/*, apps/cowswap-frontend/src/**, apps/explorer/src/**, libs/ui/src/**, libs/wallet/src/assets.ts, apps/widget-configurator/src/app/embedDialog/index.tsx	Replaces legacy asset import identifiers (IMG_*, ICON_*, IMAGE_*, etc.) with standardized icon*Src / img*Src / svg*Src bindings across many files.
Core usage updates **/*.tsx, **/*.ts, styled files (e.g., *.styled.ts, *.styled.tsx)	Updates all src props for inline SVG renderers (react-inlinesvg/LazySVG/SVG), <img src=...>, and CSS background-image: url(...) to use the new import identifiers; no other prop shapes or logic changed.
Data constants / mappings apps/*/data/**/*.ts(x), libs/ui/src/containers/Footer/footer.constants.ts, apps/explorer/src/components/common/LogoWrapper.ts	Updated exported constant objects and arrays (icon/logo/image fields) to reference the renamed imports while preserving shapes and values.
Re-exports / library exports libs/wallet/src/assets.ts	Updated exported asset identifiers to new canonical names (e.g., svgCoinbaseSrc, imgMetamaskSrc, iconWalletConnectSrc).
Stories / fixtures **/*.stories.tsx	Storybook fixtures and component stories updated to use new asset binding names.
Small UI adjustments apps/explorer/src/components/layout/GenericLayout/Footer/index.tsx	Minor spacing change introduced alongside logo src updates (explicit ' ' inserted).

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~45 minutes

• kernelwhisperer
• shoom3301
• elena-zh

"I hopped across imports, tail held high,
I renamed each icon beneath the sky,
A codemod chewed the old names neat,
Linter nodded, bindings sweet,
A rabbit's dance—refactor complete!" 🐰✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 13.16% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'chore: Enforce consistent SVG asset import naming' clearly and concisely summarizes the main change—enforcing consistent naming conventions for SVG asset imports across the codebase.
Description check	✅ Passed	The description includes a clear summary explaining the motivation (follow-up to PR #7206), the rationale (making SVG assets obviously be paths/URLs, not components), and explicitly states 'Nothing to test,' which appropriately sets expectations.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/173-svg-import-naming

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[cloudflare-workers-and-pages]

Deploying swap-dev with    Cloudflare Pages

Latest commit:	5afd7dd
Status:	✅  Deploy successful!
Preview URL:	https://4f76c2f3.swap-dev-5u6.pages.dev
Branch Preview URL:	https://feat-173-svg-import-naming.swap-dev-5u6.pages.dev

View logs