fix(frontend): route 5 Lucide icons through design-system wrapper - #86
Merged
Conversation
Re-export Building2, MapPin, Layers, GitBranch, Cpu from
design-system/icons.tsx and switch EquipmentPicker to use
the centralized wrapper, restoring DESIGN_PLAN §7 compliance.
Visual rendering is pixel-identical: LevelIcon still passes
strokeWidth={1.75} explicitly, which overrides the wrapper default.
Closes #81
There was a problem hiding this comment.
Pull request overview
This PR aligns the ISA-95 equipment tree UI with the frontend design-system guidelines by ensuring Lucide icons are consumed exclusively through the centralized design-system/icons wrapper.
Changes:
- Re-export
Building2,MapPin,Layers,GitBranch, andCpuviafrontend/src/design-system/icons.tsx. - Update
EquipmentPicker.tsxto useIcons.*for tree level icons instead of importing directly fromlucide-react.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| frontend/src/design-system/icons.tsx | Adds wrapped exports for five additional Lucide icons so they are themed/styled consistently via the DS wrapper. |
| frontend/src/app/EquipmentPicker.tsx | Removes direct lucide-react imports and routes level-to-icon mapping through Icons.*. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
M6.3 follow-up flagged by
dev-frontend-treeduring the ISA-95 tree view refactor (PR #71, commit aa67504):EquipmentPicker.tsxwas importing 5 icons directly fromlucide-react, bypassing the centralizeddesign-system/icons.tsxwrapper and breaking DESIGN_PLAN §7.This PR re-exports
Building2,MapPin,Layers,GitBranch,Cputhrough the wrapper (same pattern asChevronDown,Search,X,Check,RefreshCw), then switchesEquipmentPicker.tsxtoIcons.*.Changes
frontend/src/design-system/icons.tsx— +10 lines: 5Raw*imports + 5 styled exports, alphabetical.frontend/src/app/EquipmentPicker.tsx— removes thelucide-reactdirect import block, routesLEVEL_ICONmap throughIcons.*.Visual impact
Strictly pixel-identical.
LevelIconstill passesstrokeWidth={1.75}explicitly, which overrides the wrapper default via{...props}spread — final rendered strokeWidth unchanged.Heads-up for later: the wrapper default is
1.75, the DESIGN_PLAN §7 says1.5. Discrepancy to reconcile once this is merged (either update the doc to match code, or rebase the wrapper to1.5— but that changes every icon's look project-wide, out of scope here).Test plan
npm run typecheck— greennpm run check— green (biome, 53 files)npm run build— green (vite 7.3.2, 2495 modules, 1.66s)grep -n 'from "lucide-react"' frontend/src/app/EquipmentPicker.tsx— emptyCloses #81