improvement(enrichments): align enrichments sidebar with design system

[waleedlatif1]

Summary

• Replaced X and Mail lucide-react imports with emcn icon equivalents in enrichments sidebar and work-email enrichment
• Replaced Button-abused list items with plain buttons using correct hover token (surface-hover) and transition-colors

Type of Change

• Improvement

Testing

Tested manually

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

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

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
docs	Skipped		May 29, 2026 11:34pm

[cursor]

PR Summary

Low Risk
Presentation-only changes (icons, buttons, link hover styles) with no logic, API, or data-handling impact.

Overview
Aligns enrichments UI and one enrichment definition with the emcn design system: X (and Mail for Work Email) now come from @/components/emcn/icons instead of lucide-react.

In enrichments-sidebar, close controls and catalog rows stop using ghost Button components and become plain <button> elements with transition-colors and hover-hover:bg-[var(--surface-hover)] (replacing surface-3 on list items). cell-render URL links use the same hover pattern (hover-hover:text-[var(--text-secondary)]) instead of opacity-only hover.

^{Reviewed by Cursor Bugbot for commit d76ffe2. Configure here.}

[greptile-apps]

Greptile Summary

This PR aligns the enrichments sidebar UI with the design system by migrating icon imports from lucide-react to the project's emcn icon set and replacing <Button variant='ghost'> wrappers on icon-only actions with plain <button> elements using the correct surface-hover token and transition-colors.

• Replaced X and Mail lucide-react imports with @/components/emcn/icons equivalents across enrichments-sidebar.tsx, enrichment-config.tsx, and work-email.ts.
• Migrated close buttons (both the catalog and unavailable-enrichment states) and enrichment list items in enrichments-sidebar.tsx to plain <button> elements with hover-hover:bg-[var(--surface-hover)] and transition-colors.
• Updated the email link hover effect in cell-render.tsx from hover:opacity-70 to transition-colors hover-hover:text-[var(--text-secondary)].

Confidence Score: 5/5

Safe to merge — purely cosmetic changes with no logic or API impact.

All changes are icon-import swaps and CSS class replacements with no logic, data flow, or API changes. The only observation is that the close/back buttons inside enrichment-config.tsx were not migrated to the new plain-button pattern, leaving a minor visual inconsistency within the same sidebar flow.

enrichment-config.tsx — header close and back buttons still use the old Button component pattern.

Important Files Changed

Filename	Overview
apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/enrichments-sidebar/enrichments-sidebar.tsx	Replaced lucide-react X with emcn icon, removed Button import, and migrated close buttons and enrichment list items to plain button elements with correct design-system hover tokens (surface-hover).
apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/enrichments-sidebar/enrichment-config.tsx	Replaced lucide-react X import with emcn icon equivalent; the header close and back buttons still use Button component with old hover approach, inconsistent with the sidebar migration.
apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/cells/cell-render.tsx	Updated link hover effect from opacity-70 to transition-colors with hover-hover:text-[var(--text-secondary)], aligning with design token usage.
apps/sim/enrichments/work-email/work-email.ts	Replaced lucide-react Mail import with the emcn icon equivalent, no logic changes.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[EnrichmentsSidebar open] --> B{editGroup?}
    B -->|yes + found| C[EnrichmentConfig panel\nBack + Close: Button ghost - NOT migrated]
    B -->|yes + not found| D[Error state\nClose: plain button migrated]
    B -->|no| E[Catalog list\nClose: plain button migrated\nList items: plain button migrated]
    E -->|select enrichment| C

Loading

_{Reviews (2): Last reviewed commit: "fix(enrichments): consistent close butto..." | Re-trigger Greptile}

[waleedlatif1]

Fixed in the follow-up commit — the error-state close button is now consistent with the catalog-view pattern (plain <button> with surface-hover and transition-colors). Button import cleaned up as well.

[waleedlatif1]

@greptile

[waleedlatif1]

@cursor review

[cursor]

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

^{Reviewed by Cursor Bugbot for commit d76ffe2. Configure here.}