Add cli

[Arjun544]

Summary by CodeRabbit

• New Features

  • Added a responsive code preview workspace with project file explorer, tabs, breadcrumbs, and syntax-highlighted code.
  • Added light and dark editor themes.
  • Added file copying, tab management, folder navigation, and sync status indicators.
  • Added a mobile preview button and mobile file explorer controls.

• Bug Fixes

  • Improved folder interaction feedback with a pointer cursor.
  • Updated the code preview page title.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
flutter-init	Error		Aug 11, 2026 4:26am

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 09a53e11-068b-4936-8efb-8441fd31479d

📥 Commits

Reviewing files that changed from the base of the PR and between 46d8e78 and 2344224.

📒 Files selected for processing (16)

• app/components/wizard/CodeEditorWorkspace.tsx
• app/components/wizard/WizardShell.tsx
• app/components/wizard/code-editor/EditorBreadcrumb.tsx
• app/components/wizard/code-editor/EditorColumn.tsx
• app/components/wizard/code-editor/EditorPane.tsx
• app/components/wizard/code-editor/EditorTabs.tsx
• app/components/wizard/code-editor/ExplorerPane.tsx
• app/components/wizard/code-editor/FileTreeView.tsx
• app/components/wizard/code-editor/HighlightedPane.tsx
• app/components/wizard/code-editor/SyncStatus.tsx
• app/components/wizard/code-editor/ThemePicker.tsx
• app/components/wizard/code-editor/TitleBar.tsx
• app/components/wizard/code-editor/WorkspaceLayout.tsx
• app/components/wizard/code-editor/useScaffoldPreview.ts
• app/create/code/page.tsx
• components/animate-ui/components/radix/files.tsx

---

📝 Walkthrough

Walkthrough

The PR extracts the code editor workspace into reusable components, adds useScaffoldPreview for scaffold generation and editor state, updates responsive preview actions, and adjusts page metadata and folder-trigger styling.

Changes

Code preview workspace

Layer / File(s)	Summary
Scaffold preview state and generation app/components/wizard/code-editor/useScaffoldPreview.ts	The hook generates and caches scaffold files, handles regeneration and stale requests, rebuilds the file tree, and manages folders, tabs, pinned paths, loading, synchronization, and errors.
Extracted editor components app/components/wizard/code-editor/*	The editor UI now uses separate components for exploration, file trees, tabs, breadcrumbs, panes, syntax highlighting, themes, synchronization, the title bar, and responsive layout.
Workspace composition and preview actions app/components/wizard/CodeEditorWorkspace.tsx, app/components/wizard/WizardShell.tsx, app/create/code/page.tsx, components/animate-ui/components/radix/files.tsx	CodeEditorWorkspace wires hook state into the extracted components. WizardShell updates desktop and mobile preview actions. The code page metadata and folder-trigger cursor class are updated.

Estimated code review effort: 4 (Complex) | ~45 minutes

Sequence Diagram(s)

sequenceDiagram
  participant WizardShell
  participant CodeEditorWorkspace
  participant useScaffoldPreview
  participant GenerateAPI
  participant EditorColumn
  WizardShell->>CodeEditorWorkspace: open code preview
  CodeEditorWorkspace->>useScaffoldPreview: provide configuration and validity state
  useScaffoldPreview->>GenerateAPI: submit scaffold generation request
  GenerateAPI-->>useScaffoldPreview: return generated scaffold archive
  useScaffoldPreview-->>CodeEditorWorkspace: return files, tree, tabs, and sync state
  CodeEditorWorkspace->>EditorColumn: render active file and editor actions

Loading

Possibly related PRs

• Arjun544/flutter_init#49: Both modify CodeEditorWorkspace.tsx for the live code-preview editor.
• Arjun544/flutter_init#52: Both restructure CodeEditorWorkspace.tsx and WizardShell.tsx for the code-preview workspace.

✨ Finishing Touches 💡 1

🛠️ Fix failing CI checks 💡

• Create stacked PR
• Commit on current branch

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch add_cli

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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