01-project-setup-component-architecture

[VatsalUmrania]

No description provided.

[coderabbitai]

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Free

Run ID: 9cb30d87-f43e-41cd-830e-8b9179c128df

📥 Commits

Reviewing files that changed from the base of the PR and between d02f730 and e3931a9.

⛔ Files ignored due to path filters (1)

• bun.lock is excluded by !**/*.lock

📒 Files selected for processing (15)

• .gitignore
• package.json
• packages/cli/package.json
• packages/cli/src/components/border.tsx
• packages/cli/src/components/command-menu/commands.tsx
• packages/cli/src/components/command-menu/filter-commands.tsx
• packages/cli/src/components/command-menu/index.tsx
• packages/cli/src/components/command-menu/types.ts
• packages/cli/src/components/command-menu/use-command-menu.tsx
• packages/cli/src/components/header.tsx
• packages/cli/src/components/input-bar.tsx
• packages/cli/src/components/status-bar.tsx
• packages/cli/src/index.tsx
• packages/cli/tsconfig.json
• tsconfig.base.json

---

📝 Walkthrough

Summary by CodeRabbit

Release Notes

• New Features

  • Introduced a new CLI application with command palette functionality
  • Added searchable command menu with keyboard navigation support
  • Created user interface featuring a header, input bar, and status bar

• Chores

  • Configured workspace and development environment
  • Added TypeScript and build configuration
  • Updated project ignore patterns

Walkthrough

This PR establishes the NightCode CLI application with a complete project structure, TypeScript configuration, and an interactive command-driven UI. The implementation includes a command menu system with text-based filtering and keyboard navigation, composable UI components, and the necessary bootstrapping to launch the CLI renderer.

Changes

NightCode CLI Application

Layer / File(s)	Summary
Project infrastructure and TypeScript configuration .gitignore, package.json, packages/cli/package.json, packages/cli/tsconfig.json, tsconfig.base.json	Root workspace setup with Yarn-style packages/* workspaces, TypeScript base config with strict type-checking and ESNext targets, package manifests for the @nightcode/cli module, and expanded .gitignore covering build outputs, caches, logs, and environment files.
Command menu types and data model packages/cli/src/components/command-menu/types.ts, packages/cli/src/components/command-menu/commands.tsx, packages/cli/src/components/command-menu/filter-commands.tsx	TypeScript types define Command with metadata and optional async actions, CommandContext with exit callback. COMMANDS array holds menu items. getFilteredCommands implements case-insensitive prefix filtering.
CommandMenu component with filtering and selection packages/cli/src/components/command-menu/index.tsx, packages/cli/src/components/command-menu/use-command-menu.tsx	CommandMenu renders a scrollable, selectable list capped at 8 visible items, with selection-dependent styling and mouse/keyboard interaction. useCommandMenu hook manages visibility, text-driven query derivation, filtered memoized commands, keyboard navigation with auto-scrolling, and command resolution that closes the menu.
UI components: Header, StatusBar, border styling packages/cli/src/components/border.tsx, packages/cli/src/components/header.tsx, packages/cli/src/components/status-bar.tsx	Border specs (EmptyBorder and SplitBorder) define character sets for box styling. Header renders centered "Night Code" ASCII branding. StatusBar displays "Build › opus-4-6" status label.
InputBar component with command execution packages/cli/src/components/input-bar.tsx	InputBar integrates textarea with command menu overlay, status bar, and key bindings. Routes input through useCommandMenu, executes resolved commands (invoking actions or inserting values), and handles submission with mutable ref to keep behavior in sync with props and menu state.
App component and CLI renderer initialization packages/cli/src/index.tsx	App component composes Header and InputBar in a centered layout. Bootstrap creates CLI renderer (60 FPS, no Ctrl+C exit), then renders App into the CLI environment using createRoot.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Poem

🐰 A CLI takes shape with menu and command,
where / unlocks secrets close at hand,
React components dance in the terminal's glow,
keyboard and mouse together they flow!
TypeScript stands guard with strictness so keen.

---

Note

🎁 Summarized by CodeRabbit Free

Your organization is on the Free plan. CodeRabbit will generate a high-level summary and a walkthrough for each pull request. For a comprehensive line-by-line review, please upgrade your subscription to CodeRabbit Pro by visiting https://app.coderabbit.ai/login.

_{Comment @coderabbitai help to get the list of available commands and usage tips.}