[WEB-5129] chore: icons revamp #7958
Conversation
|
Linked to Plane Work Item(s) This comment was auto-generated by Plane |
There was a problem hiding this comment.
Pull Request Overview
This PR migrates cycle and module icons throughout the codebase and updates the dashboard icon design. The changes replace usage of ContrastIcon from Lucide React with a custom CycleIcon component and update the dashboard icon's SVG path.
- Replaces
ContrastIconwithCycleIconacross multiple components - Updates dashboard icon with new SVG path design
- Removes unused
ContrastIconimport from cycle group component
Reviewed Changes
Copilot reviewed 9 out of 9 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| packages/propel/src/icons/dashboard-icon.tsx | Updates dashboard icon SVG path with new design |
| packages/propel/src/icons/cycle/cycle-group-icon.tsx | Replaces ContrastIcon with CycleIcon and removes unused import |
| apps/web/core/components/readonly/cycle.tsx | Updates cycle component to use CycleIcon instead of ContrastIcon |
| apps/web/core/components/issues/issue-layouts/utils.tsx | Replaces ContrastIcon with CycleIcon in issue layout utilities |
| apps/web/core/components/core/activity.tsx | Updates activity component to use CycleIcon with proper props |
| apps/web/core/components/command-palette/actions/project-actions.tsx | Replaces ContrastIcon with CycleIcon in command palette |
| apps/web/ce/hooks/work-item-filters/use-work-item-filters-config.tsx | Updates filter configuration to use CycleIcon and ModuleIcon |
| apps/web/ce/components/issues/issue-layouts/utils.tsx | Updates spreadsheet property icon mapping to use CycleIcon |
| apps/space/core/components/issues/issue-layouts/utils.tsx | Replaces ContrastIcon with CycleIcon in space component |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
|
Note Other AI code review bot(s) detectedCodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review. WalkthroughReplaces cycle-related icons from ContrastIcon to CycleIcon across multiple UI components and mappings, adjusts module icons in a filter config, updates propel cycle group icon mapping, and changes the DashboardIcon SVG path. No function/type signatures or control flow are modified. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (1)
apps/web/core/components/core/activity.tsx (1)
473-473: LGTM! Icon props are correctly used.The CycleIcon implementation accepts
heightandwidthprops (as defined in packages/propel/src/icons/cycle-icon.tsx), not asizeprop. The current usage withheight={12} width={12}is correct for this icon's API.Note: The previous Copilot comment suggesting
size={12}was incorrect, as CycleIcon does not support thesizeprop.
🧹 Nitpick comments (1)
apps/web/ce/hooks/work-item-filters/use-work-item-filters-config.tsx (1)
198-199: LGTM! Module filter icon correctly updated.The migration to
ModuleIconfor both the filter and option icons is correct.Minor observation: Module option icons use
h-3 w-3(Line 199) while cycle option icons useh-3.5 w-3.5(Line 186). If this sizing difference is unintentional, consider aligning them for visual consistency.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
apps/space/core/components/issues/issue-layouts/utils.tsx(2 hunks)apps/web/ce/components/issues/issue-layouts/utils.tsx(2 hunks)apps/web/ce/hooks/work-item-filters/use-work-item-filters-config.tsx(3 hunks)apps/web/core/components/command-palette/actions/project-actions.tsx(2 hunks)apps/web/core/components/core/activity.tsx(2 hunks)apps/web/core/components/issues/issue-layouts/utils.tsx(2 hunks)apps/web/core/components/readonly/cycle.tsx(2 hunks)packages/propel/src/icons/cycle/cycle-group-icon.tsx(2 hunks)packages/propel/src/icons/dashboard-icon.tsx(1 hunks)
🧰 Additional context used
🧬 Code graph analysis (8)
apps/space/core/components/issues/issue-layouts/utils.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
apps/web/ce/hooks/work-item-filters/use-work-item-filters-config.tsx (2)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)packages/propel/src/icons/module-icon.tsx (1)
ModuleIcon(5-42)
apps/web/core/components/readonly/cycle.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
packages/propel/src/icons/cycle/cycle-group-icon.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
apps/web/core/components/command-palette/actions/project-actions.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
apps/web/core/components/core/activity.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
apps/web/core/components/issues/issue-layouts/utils.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
apps/web/ce/components/issues/issue-layouts/utils.tsx (1)
packages/propel/src/icons/cycle-icon.tsx (1)
CycleIcon(5-37)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Build and lint web apps
- GitHub Check: Analyze (javascript)
🔇 Additional comments (9)
apps/space/core/components/issues/issue-layouts/utils.tsx (1)
6-6: LGTM! Clean icon replacement.The import and usage of CycleIcon for the "None" cycle option is correct and aligns with the PR's icon migration objective.
Also applies to: 78-78
packages/propel/src/icons/dashboard-icon.tsx (1)
22-22: LGTM! Dashboard icon path updated.The SVG path data has been updated as part of the icon revamp. The component structure and props remain unchanged.
packages/propel/src/icons/cycle/cycle-group-icon.tsx (1)
4-4: LGTM! Icon mapping updated correctly.The CycleIcon now serves as both the "current" cycle status icon and the fallback icon, replacing ContrastIcon throughout the component. The changes are consistent and correct.
Also applies to: 9-9, 22-22
apps/web/core/components/readonly/cycle.tsx (1)
7-7: LGTM! Icon replacement is correct.The CycleIcon import and usage in the ReadonlyCycle component properly replaces the previous ContrastIcon.
Also applies to: 36-36
apps/web/core/components/issues/issue-layouts/utils.tsx (1)
9-9: LGTM! Consistent icon migration.The CycleIcon usage for the "None" cycle option matches the pattern used in other similar files across the codebase.
Also applies to: 174-174
apps/web/core/components/command-palette/actions/project-actions.tsx (1)
11-11: LGTM! Icon replacement is correct.The CycleIcon import and usage in the "Create new cycle" command palette item properly replaces ContrastIcon.
Also applies to: 38-38
apps/web/ce/components/issues/issue-layouts/utils.tsx (1)
74-74: Confirm map key vs constant referenceThe key
"ContrastIcon"is referenced inconstants/src/issue/common.ts:292. Renaming it to"CycleIcon"will break that usage. Either keep the existing key for backward compatibility, or rename it and update the constant entry accordingly.apps/web/ce/hooks/work-item-filters/use-work-item-filters-config.tsx (2)
15-16: LGTM! Icon imports correctly updated.The migration from
ContrastIconandDiceIcontoCycleIconandModuleIconis correctly reflected in the imports.
185-185: LGTM! Cycle filter icon correctly updated.The
filterIconhas been properly updated to useCycleIcon, whileCycleGroupIconis appropriately retained for individual cycle option rendering.
1 participant
Description
This PR includes the following changes:
Type of Change
Summary by CodeRabbit