Skip to content

refactor(*): drop phosphor icon import aliases - #1126

Merged
SeanCassiere merged 1 commit into
mainfrom
refactor/drop-phosphor-icon-aliases
Aug 7, 2026
Merged

refactor(*): drop phosphor icon import aliases#1126
SeanCassiere merged 1 commit into
mainfrom
refactor/drop-phosphor-icon-aliases

Conversation

@sukvvon

@sukvvon sukvvon commented Aug 7, 2026

Copy link
Copy Markdown
Member

Imports every phosphor icon under its own name. 53 aliases across 17 files are gone, leaving zero in the repo.

Most of them preserved lucide's naming from before that migration — CaretDownIcon as ChevronDown, LightningIcon as Zap, TrashIcon as Trash2, ArrowsClockwiseIcon as RefreshCw. The practical cost was that the same icon went by different names depending on the file: MagnifyingGlassIcon was Search in one place and SearchIcon in another, StackIcon was Layers here and Layers3 there, CaretDownIcon was CaretDown or ChevronDown or itself.

Two extras in ChartControls

ChartBarIcon was imported twice — once plainly and once as ChartBarStacked — so bar and stacked-bar looked like different icons in chartTypeIcons when they are the same one. The duplicate import is removed and both entries now name ChartBarIcon directly, which makes the shared icon visible rather than disguised.

type Icon as LucideIcon is now type Icon. The alias was a leftover name from a library that is no longer a dependency. It reads as though lucide were still around, and it is not needed for disambiguation: the const Icon further down the file is a value in a block scope, while this is a type at module scope, so the two never collide.

Renaming was done via the TypeScript compiler API

A regex pass over the source text is not safe for this. Icon names like Copy, Menu, and Check also occur inside strings and JSX text, and a word-boundary replacement rewrites those too — a first attempt turned aria-label={mobileMenuOpen ? 'Close Menu' : 'Open Menu'} into 'Close ListIcon' and aria-label={`Copy ${label} to clipboard`} into `CopyIcon ${label} to clipboard`, both silently and with tsc still clean.

The codemod instead walks the AST and edits only Identifier nodes, which by construction never cover string literals, JSX text, or comments.

Verification

tsc, lint, and the unit tests pass.

Every string literal of four characters or more was compared before and after, per changed file: all identical. No phosphor alias remains anywhere in src/.

Rendering was not exercised in the browser. The icon components themselves are unchanged — only the local binding names differ — and tsc covers every rename.

Summary by CodeRabbit

  • Style
    • Standardized icon usage across navigation, landing pages, dashboards, charts, search, and administrative screens.
    • Updated icon labels and references for consistent visual presentation.
  • Bug Fixes
    • Improved icon consistency without changing existing functionality or user interactions.

@coderabbitai

coderabbitai Bot commented Aug 7, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: c62c7392-cfa2-419e-b347-0f013869ffbe

📥 Commits

Reviewing files that changed from the base of the PR and between 1154dd2 and 5231b63.

📒 Files selected for processing (17)
  • src/components/Navbar.tsx
  • src/components/PartnershipCallout.tsx
  • src/components/ds/BrandAssets.tsx
  • src/components/landing/HighlightLanding.tsx
  • src/components/landing/MarkdownLanding.tsx
  • src/components/npm-stats/BaselineSection.tsx
  • src/components/npm-stats/ChartControls.tsx
  • src/components/npm-stats/LatestBucketNavigator.tsx
  • src/components/npm-stats/NPMStatsChart.tsx
  • src/components/npm-stats/PackagePills.tsx
  • src/components/npm-stats/PackageSearch.tsx
  • src/routes/admin/intent.tsx
  • src/routes/admin/npm-stats.tsx
  • src/routes/ds.tsx
  • src/routes/partners.$partner.tsx
  • src/routes/shop.search.tsx
  • src/routes/stats/npm/index.tsx

📝 Walkthrough

Walkthrough

This change replaces aliased Phosphor icon imports and JSX references with canonical component names across shared components, npm statistics components, and routes. Component behavior and public APIs remain unchanged.

Changes

Icon name normalization

Layer / File(s) Summary
Shared and landing UI icons
src/components/Navbar.tsx, src/components/PartnershipCallout.tsx, src/components/ds/BrandAssets.tsx, src/components/landing/*
Shared navigation, partnership, design-system, and landing components now use direct Phosphor icon names.
NPM statistics icons
src/components/npm-stats/*
NPM statistics controls, navigation, chart actions, package pills, and search now use direct Phosphor icon names.
Route and admin icons
src/routes/admin/*, src/routes/ds.tsx, src/routes/partners.$partner.tsx, src/routes/shop.search.tsx, src/routes/stats/npm/index.tsx
Route and admin components now use canonical Phosphor icon names without behavior changes.

Estimated code review effort: 1 (Trivial) | ~5 minutes

Possibly related PRs

Suggested reviewers: abeuty

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 11.11% 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
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly and concisely describes the main change: removing Phosphor icon import aliases across the codebase.
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.
✨ Finishing Touches 💡 1
📝 Generate docstrings 💡
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch refactor/drop-phosphor-icon-aliases

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

Comment @coderabbitai help to get the list of available commands.

@sukvvon sukvvon self-assigned this Aug 7, 2026
@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
tanstack-com 5231b63 Commit Preview URL

Branch Preview URL
Aug 07 2026, 12:50 AM

@sukvvon
sukvvon requested a review from a team August 7, 2026 00:53
@SeanCassiere
SeanCassiere merged commit c1c213d into main Aug 7, 2026
7 checks passed
@SeanCassiere
SeanCassiere deleted the refactor/drop-phosphor-icon-aliases branch August 7, 2026 10:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants