Sign up
View stargazers13Sign up

refactor(web): the command palette's add-project views are components#22707

merged1
refactor/command-palette-project-items
refactor/command-palette-add-project-views
opened3d agobyJJulius Marminge
2 files changed
View on GitHubTwo-way sync enabledPR last imported 3d ago

CommandPalette.tsx is ~3,400 lines: one 2,600-line dialog component builds every item, runs every add-project flow, and renders the results. Layer 4 of a stack that splits it into focused files so each piece reads on its own and the React Compiler caches each piece on its own inputs.

Moves the add-project UI into CommandPaletteAddProject.tsx: the new-project and repository summaries, one CommandPaletteSubmitButton replacing three copies of the tooltip, button and shortcut markup, and NewProjectPublishHostPicker. The picker now owns its open state, so opening it re-renders the picker instead of the whole dialog.

beforeafter
CommandPalette.tsx lines28762742
Renders, open palette + type 10 chars (median of 3)23522352

Measured with the fiber render counter, same browser session and seeded dev DB, swapping only the palette files between this layer and the one below it. Behavior is unchanged.

Tests: vp test run src/reactCompilerCoverage.test.ts -t CommandPalette (0 bailouts, new files included), vp test run src/components/CommandPalette.logic.test.ts, tsc --noEmit for apps/web, vp lint on changed files.

🤖 Generated with Claude Code

Checks

All checks passed

Added 1 commit

  • refactor(web): the command palette's add-project summaries, submit button and host picker are components6e79cfb
MmacroscopeappBot3d ago
Synced from GitHub

Approvability

Verdict: Approved at 6e79cfb

Macroscope's review found this PR approvable — This is a contained web UI refactor that extracts existing add-project summaries, controls, and icons into focused components without changing the underlying project flows or introducing new capability. Runtime impact is limited to component boundaries and picker state ownership.

You can add or adjust custom eligibility rules. Learn more.

CcoderabbitaiBot3d ago
Synced from GitHub

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Path: .coderabbit.config.ts
  • Review profile: CHILL
  • Plan: Team
  • Run ID: 88ee7340-fbb1-45f9-9800-75436d6e91a9
📥 Commits

Reviewing files that changed from the base of the PR and between 7e7936fe093e918a198bcd32dbe84a3fd45d118b and 6e79cfb6e523741013cfb58b0fcf457927146306.

📒 Files selected for processing: 2
  • apps/web/src/components/CommandPalette.tsx
  • apps/web/src/components/CommandPaletteAddProject.tsx

Limit details: You’ve used all 10 included reviews currently available.

📝 Walkthrough

The command palette now uses shared components for project creation and remote repository flows. The new module provides source icons, a host picker, submit buttons, and project and repository summaries.

Changes: Command palette add-project components

Layer / File(s)Summary
Add-project UI components
apps/web/src/components/CommandPaletteAddProject.tsx		Adds source icon helpers, a submit button, a host picker, and project and repository summary components.
Command palette integration
apps/web/src/components/CommandPalette.tsx		Replaces inline picker, submit controls, and summaries with shared components. Removes the corresponding local helpers and obsolete state. Preserves the existing labels, shortcuts, disabled conditions, and submit callbacks.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Refactor

Suggested reviewers: maria-rcks

Merge Risk: ⚪ Minimal · up to 6e79c

The extracted add-project views appear mergeable after normal checks; no user-facing regression was established.

Pre-merge checks: Passed 3 · Failed 1

Failed Failed checks: 1 warning

Check nameStatusExplanationResolution
Description checkWarningThe description explains the refactor and lists focused verification, but it does not provide the required Scope and approval information. It also does not include before/after screenshots for this UI…Add the triaged issue or maintainer approval with the approval comment, include clear before/after screenshots for the UI change, and end the description with the model and harness used to generate the work.
Passed Passed checks: 3 passed
Check nameStatusExplanation
Title checkPassedThe title clearly and concisely describes the main change: extracting the command palette add-project views into components.
Linked Issues checkPassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes checkPassedCheck skipped because no linked issues were found for this pull request.
Full details: Description check

Explanation

The description explains the refactor and lists focused verification, but it does not provide the required Scope and approval information. It also does not include before/after screenshots for this UI change or the required model and harness details for the agent-generated work.

Resolution

Add the triaged issue or maintainer approval with the approval comment, include clear before/after screenshots for the UI change, and end the description with the model and harness used to generate the work.

✨ Finishing Touches
📝 Generate docstrings
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Usage-based review receipt

Note

This review was completed with usage-based billing: files reviewed beyond your plan's included limits are billed at $0.25/file. View usage-based billing.

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