Files
NomadArch/tasks/done/051-command-palette-refactor.md
Gemini AI 157449a9ad restore: recover deleted documentation, CI/CD, and infrastructure files
Restored from origin/main (b4663fb):
- .github/ workflows and issue templates
- .gitignore (proper exclusions)
- .opencode/agent/web_developer.md
- AGENTS.md, BUILD.md, PROGRESS.md
- dev-docs/ (9 architecture/implementation docs)
- docs/screenshots/ (4 UI screenshots)
- images/ (CodeNomad icons)
- package-lock.json (dependency lockfile)
- tasks/ (25+ project task files)

Also restored original source files that were modified:
- packages/ui/src/App.tsx
- packages/ui/src/lib/logger.ts
- packages/ui/src/stores/instances.ts
- packages/server/src/server/routes/workspaces.ts
- packages/server/src/workspaces/manager.ts
- packages/server/src/workspaces/runtime.ts
- packages/server/package.json

Kept new additions:
- Install-*.bat/.sh (enhanced installers)
- Launch-*.bat/.sh (new launchers)
- README.md (SEO optimized with GLM 4.7)
2025-12-23 13:03:48 +04:00

1.6 KiB

Task 051 - Command Palette & Keyboard Hint Refactor

Goal

Align the command palette modal and keyboard hint UI with the shared token system, removing bespoke gray/black overlay styling.

Prerequisites

  • Task 050 complete (selector helpers available for reuse).

Acceptance Criteria

  • src/components/command-palette.tsx uses token-backed utilities for overlay, surface, list items, and focus states.
  • src/components/keyboard-hint.tsx and any inline <kbd> styling leverage reusable helpers (.kbd etc.) from components.css.
  • Legacy utility combos in these components (bg-gray-*, dark:bg-gray-*, text-gray-*) are eliminated.
  • Palette overlay opacity, search field, section headers, and highlighted items match existing behavior in both themes.

Steps

  1. Extract repeated modal/dropdown patterns into helpers (overlay, surface, list item) if not already present.
  2. Update command palette markup to use the helpers and token-aware Tailwind classes.
  3. Refactor keyboard-hint.tsx to rely on shared .kbd styling and tokens.
  4. Verify keyboard navigation, highlighted items, and section headers visually.

Testing Checklist

  • Run npm run build.
  • In dev mode, open the command palette, search, navigate with arrow keys, and confirm highlight/focus styling.

Dependencies

  • Depends on Task 050.
  • Blocks folder selection advanced settings refactor (which reuses keyboard hints).

Estimated Time

0.75 hours

Notes

  • Branch suggestion: feature/task-051-command-palette-refactor.
  • Include GIF/screenshots if overlay opacity or highlight timing needed adjustment.