refactor(dashboard) Switch component: drop overrides and cleanup by dave-hawkins · Pull Request #6131 · unkeyed/unkey

dave-hawkins · 2026-05-08T09:07:30Z

Summary

Follow-up to fix(dashboard) Switch component: dark mode and contrast issues #6130.
Five Switch callsites were each hand-rolling track colors, rings, and sizes causing inconsistencies with each other and with the rest of the design system.
Added a size: 'default' | 'sm' prop on the base for the smaller variant a couple of callsites needed,
All five callsites collapse to plain <Switch checked onCheckedChange /> (with size="sm" where applicable). .

Test plan

If you're reviewing this PR, please test each switch manually and confirm each switch appears correctly, and check light and dark modes too just to be safe.

/<workspaceSlug>/projects/<projectId>/settings → Auto deploy card
/<workspaceSlug>/projects/<projectId>/sentinel-policies → per-env toggles on each policy row
/<workspaceSlug>/projects/<projectId>/env-vars → Add panel → Sensitive toggle
/<workspaceSlug>/projects/<projectId>/env-vars → click an existing row → Sensitive toggle
/<workspaceSlug>/apis/<apiId> → Create key → Expiration / Credits / Rate limit toggles

vercel · 2026-05-08T09:07:35Z

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

Project	Deployment	Actions	Updated (UTC)
dashboard	Ready	Preview, Comment	Jun 9, 2026 6:50am
design	Ready	Preview, Comment	Jun 9, 2026 6:50am

coderabbitai · 2026-05-08T09:07:38Z

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: 02b339a4-2c63-40e8-9ed5-211b82432bda

📥 Commits

Reviewing files that changed from the base of the PR and between 77b6091 and 46e2a0f.

📒 Files selected for processing (6)

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/env-vars/components/add/add-env-var-expandable.tsx
web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/env-vars/components/list/env-var-edit-row.tsx
web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/sentinel-policies/components/list/row.tsx
web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/build-settings/auto-deploy-settings.tsx
web/apps/dashboard/components/dashboard/metadata/protection-switch.tsx
web/apps/dashboard/components/ui/switch.tsx

📝 Walkthrough

Walkthrough

The Switch component's public API is refactored to accept a size prop ("default" or "sm") instead of a thumbClassName string override. The root and thumb elements now use data-size attributes and Tailwind group-data-[size=...] selectors for size-aware styling. Five callsites remove custom className and thumbClassName props, adopting the new API.

Changes

Switch Component Size Prop Refactoring

Layer / File(s)	Summary
Switch component props definition `web/apps/dashboard/components/ui/switch.tsx`	The exported `Switch` component's props type replaces optional `thumbClassName` with optional `size` ("default" \| "sm"), with a default value of `"default"` in the implementation.
Switch component size-aware styling `web/apps/dashboard/components/ui/switch.tsx`	`SwitchPrimitives.Root` now applies `data-size` and size-specific utility classes instead of reading `thumbClassName`. `SwitchPrimitives.Thumb` is rewritten to use `group-data-[size=...]` selectors for dimensions and checked-state translation, removing the `thumbClassName` override mechanism.
Callsite updates to new Switch API `web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/env-vars/components/add/add-env-var-expandable.tsx`, `web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/env-vars/components/list/env-var-edit-row.tsx`, `web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/sentinel-policies/components/list/row.tsx`, `web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/build-settings/auto-deploy-settings.tsx`, `web/apps/dashboard/components/dashboard/metadata/protection-switch.tsx`	Five `Switch` callsites remove custom `className` and `thumbClassName` styling. Two callsites adopt `size="sm"` explicitly; three rely on default styling or prop spreads.

🎯 2 (Simple) | ⏱️ ~12 minutes

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% 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 clearly and concisely summarizes the main refactoring change: simplifying the Switch component by removing custom overrides and cleanup.
Description check	✅ Passed	The description provides sufficient context: references the related issue, explains the motivation (inconsistencies), describes the implementation approach (size prop), and includes a detailed test plan for each affected location.
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 refactor-switch-callsites

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 and usage tips.}

Five callsites were hand-rolling track colors, rings, and sizes — inconsistent and at odds with the rest of the design system, where ring is reserved for focus indicators. Move size variation onto a 'sm' prop on the base Switch and delete every per-callsite override. - drop thumbClassName (no callers, didn't match shadcn pattern) - add size: 'default' | 'sm' driven by data-size attr - collapse env-vars/sensitive, env-vars/secret, sentinel-policies/row, auto-deploy, and metadata/protection-switch to bare props

dave-hawkins changed the title ~~refactor(dashboard) Switch component: drop per-callsite overrides~~ refactor(dashboard) Switch component: drop overrides and cleanup May 8, 2026

Base automatically changed from fix-switch-dark-mode-thumb to main May 8, 2026 10:28

dave-hawkins force-pushed the refactor-switch-callsites branch from e22e7bb to 4ca5cf5 Compare May 8, 2026 10:36

vercel Bot deployed to Preview May 8, 2026 10:42 View deployment

dave-hawkins requested review from chronark and ogzhanolguncu May 8, 2026 13:14

vercel Bot deployed to Preview May 13, 2026 15:16 View deployment

vercel Bot deployed to Preview May 20, 2026 06:40 View deployment

chronark approved these changes May 20, 2026

View reviewed changes

ogzhanolguncu approved these changes Jun 1, 2026

View reviewed changes

dave-hawkins enabled auto-merge June 1, 2026 10:34

vercel Bot deployed to Preview – design June 1, 2026 10:34 View deployment

vercel Bot deployed to Preview – dashboard June 1, 2026 10:35 View deployment

vercel Bot deployed to Preview – design June 9, 2026 06:33 View deployment

vercel Bot deployed to Preview – dashboard June 9, 2026 06:34 View deployment

dave-hawkins force-pushed the refactor-switch-callsites branch from d56a705 to c9573f6 Compare June 9, 2026 06:42

vercel Bot deployed to Preview – design June 9, 2026 06:42 View deployment

vercel Bot deployed to Preview – dashboard June 9, 2026 06:43 View deployment

dave-hawkins force-pushed the refactor-switch-callsites branch from c9573f6 to 27a33ac Compare June 9, 2026 06:48

vercel Bot deployed to Preview – design June 9, 2026 06:48 View deployment

vercel Bot deployed to Preview – dashboard June 9, 2026 06:50 View deployment

dave-hawkins added this pull request to the merge queue Jun 9, 2026

Merged via the queue into main with commit b3e3631 Jun 9, 2026
14 checks passed

dave-hawkins deleted the refactor-switch-callsites branch June 9, 2026 06:53

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor(dashboard) Switch component: drop overrides and cleanup#6131

refactor(dashboard) Switch component: drop overrides and cleanup#6131
dave-hawkins merged 1 commit into
mainfrom
refactor-switch-callsites

dave-hawkins commented May 8, 2026 •

edited

Loading

Uh oh!

vercel Bot commented May 8, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented May 8, 2026 •

edited

Loading

Walkthrough

Changes

❌ Failed checks (1 warning)

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

dave-hawkins commented May 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Test plan

Uh oh!

vercel Bot commented May 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented May 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

❌ Failed checks (1 warning)

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

dave-hawkins commented May 8, 2026 •

edited

Loading

vercel Bot commented May 8, 2026 •

edited

Loading

coderabbitai Bot commented May 8, 2026 •

edited

Loading