Address code review: fix empty state routing for no-app create-app flow, update docs

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

Author: Copilot

apps/console/src/App.tsx

@@ -250,14 +250,18 @@ export function AppContent() {
   );
 
   if (!dataSource || metadataLoading) return <LoadingScreen />;
-  if (!activeApp) return (
+
+  // Allow create-app route even when no active app exists
+  const isCreateAppRoute = location.pathname.endsWith('/create-app');
+
+  if (!activeApp && !isCreateAppRoute) return (
     <div className="h-screen flex items-center justify-center">
       <Empty>
         <EmptyTitle>No Apps Configured</EmptyTitle>
         <EmptyDescription>No applications have been registered.</EmptyDescription>
         <button
           className="mt-4 inline-flex items-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90"
-          onClick={() => navigate('/apps/_/create-app')}
+          onClick={() => navigate('create-app')}
           data-testid="create-first-app-btn"
         >
           Create Your First App
@@ -266,6 +270,17 @@ export function AppContent() {
     </div>
   );
 
+  // When on create-app without an active app, render a minimal layout with just the wizard
+  if (!activeApp && isCreateAppRoute) {
+    return (
+      <Suspense fallback={<LoadingScreen />}>
+        <Routes>
+          <Route path="create-app" element={<CreateAppPage />} />
+        </Routes>
+      </Suspense>
+    );
+  }
+
   // Expression context for dynamic visibility/disabled/hidden expressions
   const expressionUser = user
     ? { name: user.name, email: user.email, role: user.role ?? 'user' }
@@ -436,7 +451,7 @@ function RootRedirect() {
           {!error && (
             <button
               className="mt-4 inline-flex items-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90"
-              onClick={() => navigate('/apps/_/create-app')}
+              onClick={() => navigate('/apps/_new/create-app')}
               data-testid="create-first-app-btn"
             >
               Create Your First App

content/docs/guide/console-architecture.md

@@ -55,6 +55,8 @@ The console uses React Router DOM v7 with a simple flat route structure:
 | `/apps/:appName/:objectName` | `ObjectView` | Object list with view switcher |
 | `/apps/:appName/:objectName/view/:viewId` | `ObjectView` | Specific view for an object |
 | `/apps/:appName/:objectName/record/:recordId` | `RecordDetailView` | Single-record detail |
+| `/apps/:appName/create-app` | `CreateAppPage` | App creation wizard (4-step) |
+| `/apps/:appName/edit-app/:editAppName` | `EditAppPage` | Edit existing app configuration |
 
 ## Key Patterns
 
@@ -101,7 +103,19 @@ The console's `ObjectView` is a **thin wrapper** around `@object-ui/plugin-view`
 - Passes a `renderListView` callback for multi-view rendering (kanban, calendar, chart)
 - Handles console-specific concerns: URL routing, MetadataInspector, record detail Sheet
 
-### 4. Branding
+### 4. App Creation & Editing
+
+The console integrates the `AppCreationWizard` from `@object-ui/plugin-designer` for creating and editing apps:
+
+- **Create App** — `CreateAppPage` at `/apps/:appName/create-app`. Passes metadata objects as `availableObjects`, handles `onComplete` (converts draft via `wizardDraftToAppSchema()`, navigates to new app), `onCancel` (navigate back), and `onSaveDraft` (localStorage persistence).
+- **Edit App** — `EditAppPage` at `/apps/:appName/edit-app/:editAppName`. Loads existing app config as `initialDraft` and updates on completion.
+
+**Entry Points:**
+- AppSidebar app switcher → "Add App" / "Edit App" buttons
+- CommandPalette (⌘+K) → "Create New App" command in Actions group
+- Empty state CTA → "Create Your First App" button when no apps are configured
+
+### 5. Branding
 
 Per-app branding is applied via `AppShell`'s `branding` prop:
 

content/docs/guide/console.md

@@ -28,6 +28,7 @@ The console opens at **http://localhost:5175** with MSW (Mock Service Worker) pr
 | **Expression Visibility** | Show/hide navigation items using `visible: "${data.role === 'admin'}"`. |
 | **Branding** | Per-app colors, favicons, and logos via `AppShell` branding. |
 | **Command Palette** | `⌘+K` opens a searchable command bar for quick navigation. |
+| **App Creation Wizard** | 4-step wizard (Basic Info → Objects → Navigation → Branding) to create or edit apps. |
 | **Error Boundary** | Graceful error handling with a retry button. |
 
 ## Configuration
@@ -88,6 +89,9 @@ apps/console/
       ConsoleLayout.tsx        # AppShell wrapper
       ObjectView.tsx           # Object list view (wraps plugin-view)
       RecordDetailView.tsx     # Single-record detail view
+    pages/
+      CreateAppPage.tsx        # App creation wizard page
+      EditAppPage.tsx          # Edit existing app page
     context/
       ExpressionProvider.tsx   # Expression evaluation context
     hooks/