feat(api): add workspace member management endpoints (#556)

Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>

.env.example

@@ -79,7 +79,7 @@ OIDC_CLIENT_ID=your-client-id-here
 OIDC_CLIENT_SECRET=your-client-secret-here
 # Redirect URI must match what's configured in Authentik
 # Development: http://localhost:3001/auth/oauth2/callback/authentik
-# Production: https://api.mosaicstack.dev/auth/oauth2/callback/authentik
+# Production: https://mosaic-api.woltje.com/auth/oauth2/callback/authentik
 OIDC_REDIRECT_URI=http://localhost:3001/auth/oauth2/callback/authentik
 
 # Authentik PostgreSQL Database
@@ -314,17 +314,19 @@ COORDINATOR_ENABLED=true
 # TTL is in seconds, limits are per TTL window
 
 # Global rate limit (applies to all endpoints unless overridden)
-RATE_LIMIT_TTL=60                    # Time window in seconds
+# Time window in seconds
-RATE_LIMIT_GLOBAL_LIMIT=100          # Requests per window
+RATE_LIMIT_TTL=60
+# Requests per window
+RATE_LIMIT_GLOBAL_LIMIT=100
 
-# Webhook endpoints (/stitcher/webhook, /stitcher/dispatch)
+# Webhook endpoints (/stitcher/webhook, /stitcher/dispatch) — requests per minute
-RATE_LIMIT_WEBHOOK_LIMIT=60          # Requests per minute
+RATE_LIMIT_WEBHOOK_LIMIT=60
 
-# Coordinator endpoints (/coordinator/*)
+# Coordinator endpoints (/coordinator/*) — requests per minute
-RATE_LIMIT_COORDINATOR_LIMIT=100     # Requests per minute
+RATE_LIMIT_COORDINATOR_LIMIT=100
 
-# Health check endpoints (/coordinator/health)
+# Health check endpoints (/coordinator/health) — requests per minute (higher for monitoring)
-RATE_LIMIT_HEALTH_LIMIT=300          # Requests per minute (higher for monitoring)
+RATE_LIMIT_HEALTH_LIMIT=300
 
 # Storage backend for rate limiting (redis or memory)
 # redis: Uses Valkey for distributed rate limiting (recommended for production)
@@ -359,17 +361,17 @@ RATE_LIMIT_STORAGE=redis
 # a single workspace.
 MATRIX_HOMESERVER_URL=http://synapse:8008
 MATRIX_ACCESS_TOKEN=
-MATRIX_BOT_USER_ID=@mosaic-bot:matrix.example.com
+MATRIX_BOT_USER_ID=@mosaic-bot:matrix.woltje.com
-MATRIX_SERVER_NAME=matrix.example.com
+MATRIX_SERVER_NAME=matrix.woltje.com
-# MATRIX_CONTROL_ROOM_ID=!roomid:matrix.example.com
+# MATRIX_CONTROL_ROOM_ID=!roomid:matrix.woltje.com
 # MATRIX_WORKSPACE_ID=your-workspace-uuid
 
 # ======================
 # Matrix / Synapse Deployment
 # ======================
 # Domains for Traefik routing to Matrix services
-MATRIX_DOMAIN=matrix.example.com
+MATRIX_DOMAIN=matrix.woltje.com
-ELEMENT_DOMAIN=chat.example.com
+ELEMENT_DOMAIN=chat.woltje.com
 
 # Synapse database (created automatically by synapse-db-init in the swarm compose)
 SYNAPSE_POSTGRES_DB=synapse

.mosaic/orchestrator/mission.json

@@ -0,0 +1,80 @@
+{
+  "schema_version": 1,
+  "mission_id": "ms21-multi-tenant-rbac-data-migration-20260228",
+  "name": "MS21 Multi-Tenant RBAC Data Migration",
+  "description": "Build multi-tenant user/workspace/team management, break-glass auth, RBAC UI enforcement, and migrate jarvis-brain data into Mosaic Stack",
+  "project_path": "/home/jwoltje/src/mosaic-stack",
+  "created_at": "2026-02-28T17:10:22Z",
+  "status": "active",
+  "task_prefix": "MS21",
+  "quality_gates": "pnpm lint && pnpm build && pnpm test",
+  "milestone_version": "0.0.21",
+  "milestones": [
+    {
+      "id": "phase-1",
+      "name": "Schema and Admin API",
+      "status": "pending",
+      "branch": "schema-and-admin-api",
+      "issue_ref": "",
+      "started_at": "",
+      "completed_at": ""
+    },
+    {
+      "id": "phase-2",
+      "name": "Break-Glass Authentication",
+      "status": "pending",
+      "branch": "break-glass-authentication",
+      "issue_ref": "",
+      "started_at": "",
+      "completed_at": ""
+    },
+    {
+      "id": "phase-3",
+      "name": "Data Migration",
+      "status": "pending",
+      "branch": "data-migration",
+      "issue_ref": "",
+      "started_at": "",
+      "completed_at": ""
+    },
+    {
+      "id": "phase-4",
+      "name": "Admin UI",
+      "status": "pending",
+      "branch": "admin-ui",
+      "issue_ref": "",
+      "started_at": "",
+      "completed_at": ""
+    },
+    {
+      "id": "phase-5",
+      "name": "RBAC UI Enforcement",
+      "status": "pending",
+      "branch": "rbac-ui-enforcement",
+      "issue_ref": "",
+      "started_at": "",
+      "completed_at": ""
+    },
+    {
+      "id": "phase-6",
+      "name": "Verification",
+      "status": "pending",
+      "branch": "verification",
+      "issue_ref": "",
+      "started_at": "",
+      "completed_at": ""
+    }
+  ],
+  "sessions": [
+    {
+      "session_id": "sess-001",
+      "runtime": "unknown",
+      "started_at": "2026-02-28T17:48:51Z",
+      "ended_at": "",
+      "ended_reason": "",
+      "milestone_at_end": "",
+      "tasks_completed": [],
+      "last_task_id": ""
+    }
+  ]
+}

.mosaic/orchestrator/session.lock

@@ -0,0 +1,8 @@
+{
+  "session_id": "sess-001",
+  "runtime": "unknown",
+  "pid": 2396592,
+  "started_at": "2026-02-28T17:48:51Z",
+  "project_path": "/tmp/ms21-api-003",
+  "milestone_id": ""
+}

.woodpecker/api.yml

@@ -24,6 +24,13 @@ variables:
     pnpm install --frozen-lockfile
   - &use_deps |
     corepack enable
+  - &turbo_env
+    TURBO_API:
+      from_secret: turbo_api
+    TURBO_TOKEN:
+      from_secret: turbo_token
+    TURBO_TEAM:
+      from_secret: turbo_team
   - &kaniko_setup |
     mkdir -p /kaniko/.docker
     echo "{\"auths\":{\"git.mosaicstack.dev\":{\"username\":\"$GITEA_USER\",\"password\":\"$GITEA_TOKEN\"}}}" > /kaniko/.docker/config.json
@@ -52,17 +59,6 @@ steps:
     depends_on:
       - install
 
-  lint:
-    image: *node_image
-    environment:
-      SKIP_ENV_VALIDATION: "true"
-    commands:
-      - *use_deps
-      - pnpm --filter "@mosaic/api" lint
-    depends_on:
-      - prisma-generate
-      - build-shared
-
   prisma-generate:
     image: *node_image
     environment:
@@ -73,26 +69,27 @@ steps:
     depends_on:
       - install
 
-  build-shared:
+  lint:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/shared" build
+      - pnpm turbo lint --filter=@mosaic/api
     depends_on:
-      - install
+      - prisma-generate
 
   typecheck:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/api" typecheck
+      - pnpm turbo typecheck --filter=@mosaic/api
     depends_on:
       - prisma-generate
-      - build-shared
 
   prisma-migrate:
     image: *node_image
@@ -124,6 +121,7 @@ steps:
     environment:
       SKIP_ENV_VALIDATION: "true"
       NODE_ENV: "production"
+      <<: *turbo_env
     commands:
       - *use_deps
       - pnpm turbo build --filter=@mosaic/api

.woodpecker/orchestrator.yml

@@ -24,6 +24,13 @@ variables:
     pnpm install --frozen-lockfile
   - &use_deps |
     corepack enable
+  - &turbo_env
+    TURBO_API:
+      from_secret: turbo_api
+    TURBO_TOKEN:
+      from_secret: turbo_token
+    TURBO_TEAM:
+      from_secret: turbo_team
   - &kaniko_setup |
     mkdir -p /kaniko/.docker
     echo "{\"auths\":{\"git.mosaicstack.dev\":{\"username\":\"$GITEA_USER\",\"password\":\"$GITEA_TOKEN\"}}}" > /kaniko/.docker/config.json
@@ -48,9 +55,10 @@ steps:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/orchestrator" lint
+      - pnpm turbo lint --filter=@mosaic/orchestrator
     depends_on:
       - install
 
@@ -58,9 +66,10 @@ steps:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/orchestrator" typecheck
+      - pnpm turbo typecheck --filter=@mosaic/orchestrator
     depends_on:
       - install
 
@@ -68,9 +77,10 @@ steps:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/orchestrator" test
+      - pnpm turbo test --filter=@mosaic/orchestrator
     depends_on:
       - install
 
@@ -81,6 +91,7 @@ steps:
     environment:
       SKIP_ENV_VALIDATION: "true"
       NODE_ENV: "production"
+      <<: *turbo_env
     commands:
       - *use_deps
       - pnpm turbo build --filter=@mosaic/orchestrator

.woodpecker/web.yml

@@ -24,6 +24,13 @@ variables:
     pnpm install --frozen-lockfile
   - &use_deps |
     corepack enable
+  - &turbo_env
+    TURBO_API:
+      from_secret: turbo_api
+    TURBO_TOKEN:
+      from_secret: turbo_token
+    TURBO_TEAM:
+      from_secret: turbo_team
   - &kaniko_setup |
     mkdir -p /kaniko/.docker
     echo "{\"auths\":{\"git.mosaicstack.dev\":{\"username\":\"$GITEA_USER\",\"password\":\"$GITEA_TOKEN\"}}}" > /kaniko/.docker/config.json
@@ -44,46 +51,38 @@ steps:
     depends_on:
       - install
 
-  build-shared:
-    image: *node_image
-    environment:
-      SKIP_ENV_VALIDATION: "true"
-    commands:
-      - *use_deps
-      - pnpm --filter "@mosaic/shared" build
-      - pnpm --filter "@mosaic/ui" build
-    depends_on:
-      - install
-
   lint:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/web" lint
+      - pnpm turbo lint --filter=@mosaic/web
     depends_on:
-      - build-shared
+      - install
 
   typecheck:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/web" typecheck
+      - pnpm turbo typecheck --filter=@mosaic/web
     depends_on:
-      - build-shared
+      - install
 
   test:
     image: *node_image
     environment:
       SKIP_ENV_VALIDATION: "true"
+      <<: *turbo_env
     commands:
       - *use_deps
-      - pnpm --filter "@mosaic/web" test
+      - pnpm turbo test --filter=@mosaic/web
     depends_on:
-      - build-shared
+      - install
 
   # === Build ===
 
@@ -92,6 +91,7 @@ steps:
     environment:
       SKIP_ENV_VALIDATION: "true"
       NODE_ENV: "production"
+      <<: *turbo_env
     commands:
       - *use_deps
       - pnpm turbo build --filter=@mosaic/web

AGENTS.md

@@ -46,6 +46,21 @@ pnpm lint
 pnpm build
 ```
 
+## Versioning Protocol (HARD GATE)
+
+**This project is ALPHA. All versions MUST be `0.0.x`.**
+
+- The `0.1.0` release is FORBIDDEN until Jason explicitly authorizes it.
+- Every milestone bump increments the patch: `0.0.20` → `0.0.21` → `0.0.22`, etc.
+- ALL package.json files in the monorepo MUST stay in sync at the same version.
+- Use `scripts/version-bump.sh <version>` to bump — it enforces the alpha constraint and updates all packages atomically.
+- The script rejects any version >= `0.1.0`.
+- When creating a release tag, the tag MUST match the package version: `v0.0.x`.
+
+**Milestone-to-version mapping** is defined in the PRD (`docs/PRD.md`) under "Delivery/Milestone Intent". Agents MUST use the version from that table when tagging a milestone release.
+
+**Violation of this protocol is a blocking error.** If an agent attempts to set a version >= `0.1.0`, stop and escalate.
+
 ## Standards and Quality
 
 - Enforce strict typing and no unsafe shortcuts.

apps/api/Dockerfile

@@ -18,6 +18,12 @@ COPY turbo.json ./
 # ======================
 FROM base AS deps
 
+# Install build tools for native addons (node-pty requires node-gyp compilation)
+# and OpenSSL for Prisma engine detection
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    python3 make g++ openssl \
+    && rm -rf /var/lib/apt/lists/*
+
 # Copy all package.json files for workspace resolution
 COPY packages/shared/package.json ./packages/shared/
 COPY packages/ui/package.json ./packages/ui/
@@ -25,7 +31,11 @@ COPY packages/config/package.json ./packages/config/
 COPY apps/api/package.json ./apps/api/
 
 # Install dependencies (no cache mount — Kaniko builds are ephemeral in CI)
-RUN pnpm install --frozen-lockfile
+# Then explicitly rebuild node-pty from source since pnpm may skip postinstall
+# scripts or fail to find prebuilt binaries for this Node.js version
+RUN pnpm install --frozen-lockfile \
+    && cd node_modules/.pnpm/node-pty@*/node_modules/node-pty \
+    && npx node-gyp rebuild 2>&1 || true
 
 # ======================
 # Builder stage
@@ -58,7 +68,11 @@ FROM node:24-slim AS production
 ADD https://github.com/Yelp/dumb-init/releases/download/v1.2.5/dumb-init_1.2.5_x86_64 /usr/local/bin/dumb-init
 
 # Single RUN to minimize Kaniko filesystem snapshots (each RUN = full snapshot)
-RUN rm -rf /usr/local/lib/node_modules/npm /usr/local/bin/npm /usr/local/bin/npx \
+# - openssl: Prisma engine detection requires libssl
+# - No build tools needed here — native addons are compiled in the deps stage
+RUN apt-get update && apt-get install -y --no-install-recommends openssl \
+    && rm -rf /var/lib/apt/lists/* \
+    && rm -rf /usr/local/lib/node_modules/npm /usr/local/bin/npm /usr/local/bin/npx \
     && chmod 755 /usr/local/bin/dumb-init \
     && groupadd -g 1001 nodejs && useradd -m -u 1001 -g nodejs nestjs
 

apps/api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mosaic/api",
-  "version": "0.0.1",
+  "version": "0.0.20",
   "private": true,
   "scripts": {
     "build": "nest build",
@@ -66,6 +66,7 @@
     "marked-gfm-heading-id": "^4.1.3",
     "marked-highlight": "^2.2.3",
     "matrix-bot-sdk": "^0.8.0",
+    "node-pty": "^1.0.0",
     "ollama": "^0.6.3",
     "openai": "^6.17.0",
     "reflect-metadata": "^0.2.2",

apps/api/prisma/migrations/20260225000000_add_terminal_sessions/migration.sql

@@ -0,0 +1,23 @@
+-- CreateEnum
+CREATE TYPE "TerminalSessionStatus" AS ENUM ('ACTIVE', 'CLOSED');
+
+-- CreateTable
+CREATE TABLE "terminal_sessions" (
+    "id" UUID NOT NULL,
+    "workspace_id" UUID NOT NULL,
+    "name" TEXT NOT NULL DEFAULT 'Terminal',
+    "status" "TerminalSessionStatus" NOT NULL DEFAULT 'ACTIVE',
+    "created_at" TIMESTAMPTZ NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "closed_at" TIMESTAMPTZ,
+
+    CONSTRAINT "terminal_sessions_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE INDEX "terminal_sessions_workspace_id_idx" ON "terminal_sessions"("workspace_id");
+
+-- CreateIndex
+CREATE INDEX "terminal_sessions_workspace_id_status_idx" ON "terminal_sessions"("workspace_id", "status");
+
+-- AddForeignKey
+ALTER TABLE "terminal_sessions" ADD CONSTRAINT "terminal_sessions_workspace_id_fkey" FOREIGN KEY ("workspace_id") REFERENCES "workspaces"("id") ON DELETE CASCADE ON UPDATE CASCADE;

apps/api/prisma/migrations/20260227000000_add_personality_tone_formality/migration.sql

@@ -0,0 +1,3 @@
+-- AlterTable: add tone and formality_level columns to personalities
+ALTER TABLE "personalities" ADD COLUMN "tone" TEXT NOT NULL DEFAULT 'neutral';
+ALTER TABLE "personalities" ADD COLUMN "formality_level" "FormalityLevel" NOT NULL DEFAULT 'NEUTRAL';

apps/api/prisma/schema.prisma

@@ -3,6 +3,7 @@
 
 generator client {
   provider        = "prisma-client-js"
+  binaryTargets   = ["native", "debian-openssl-3.0.x"]
   previewFeatures = ["postgresqlExtensions"]
 }
 
@@ -206,6 +207,11 @@ enum CredentialScope {
   SYSTEM
 }
 
+enum TerminalSessionStatus {
+  ACTIVE
+  CLOSED
+}
+
 // ============================================
 // MODELS
 // ============================================
@@ -221,6 +227,14 @@ model User {
   createdAt      DateTime @default(now()) @map("created_at") @db.Timestamptz
   updatedAt      DateTime @updatedAt @map("updated_at") @db.Timestamptz
 
+  // MS21: Admin, local auth, and invitation fields
+  deactivatedAt   DateTime?  @map("deactivated_at") @db.Timestamptz
+  isLocalAuth     Boolean    @default(false) @map("is_local_auth")
+  passwordHash    String?    @map("password_hash")
+  invitedBy       String?    @map("invited_by") @db.Uuid
+  invitationToken String?    @unique @map("invitation_token")
+  invitedAt       DateTime?  @map("invited_at") @db.Timestamptz
+
   // Relations
   ownedWorkspaces        Workspace[]             @relation("WorkspaceOwner")
   workspaceMemberships   WorkspaceMember[]
@@ -297,6 +311,7 @@ model Workspace {
   federationEventSubscriptions FederationEventSubscription[]
   llmUsageLogs                 LlmUsageLog[]
   userCredentials              UserCredential[]
+  terminalSessions             TerminalSession[]
 
   @@index([ownerId])
   @@map("workspaces")
@@ -1061,6 +1076,10 @@ model Personality {
   displayName String  @map("display_name")
   description String? @db.Text
 
+  // Tone and formality
+  tone           String         @default("neutral")
+  formalityLevel FormalityLevel @default(NEUTRAL) @map("formality_level")
+
   // System prompt
   systemPrompt String @map("system_prompt") @db.Text
 
@@ -1507,3 +1526,23 @@ model LlmUsageLog {
   @@index([conversationId])
   @@map("llm_usage_logs")
 }
+
+// ============================================
+// TERMINAL MODULE
+// ============================================
+
+model TerminalSession {
+  id          String                @id @default(uuid()) @db.Uuid
+  workspaceId String                @map("workspace_id") @db.Uuid
+  name        String                @default("Terminal")
+  status      TerminalSessionStatus @default(ACTIVE)
+  createdAt   DateTime              @default(now()) @map("created_at") @db.Timestamptz
+  closedAt    DateTime?             @map("closed_at") @db.Timestamptz
+
+  // Relations
+  workspace Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+
+  @@index([workspaceId])
+  @@index([workspaceId, status])
+  @@map("terminal_sessions")
+}

apps/api/prisma/seed.ts

@@ -65,6 +65,136 @@ async function main() {
     },
   });
 
+  // ============================================
+  // WIDGET DEFINITIONS (global, not workspace-scoped)
+  // ============================================
+  const widgetDefs = [
+    {
+      name: "TasksWidget",
+      displayName: "Tasks",
+      description: "View and manage your tasks",
+      component: "TasksWidget",
+      defaultWidth: 2,
+      defaultHeight: 2,
+      minWidth: 1,
+      minHeight: 2,
+      maxWidth: 4,
+      maxHeight: null,
+      configSchema: {},
+    },
+    {
+      name: "CalendarWidget",
+      displayName: "Calendar",
+      description: "View upcoming events and schedule",
+      component: "CalendarWidget",
+      defaultWidth: 2,
+      defaultHeight: 2,
+      minWidth: 2,
+      minHeight: 2,
+      maxWidth: 4,
+      maxHeight: null,
+      configSchema: {},
+    },
+    {
+      name: "QuickCaptureWidget",
+      displayName: "Quick Capture",
+      description: "Quickly capture notes and tasks",
+      component: "QuickCaptureWidget",
+      defaultWidth: 2,
+      defaultHeight: 1,
+      minWidth: 2,
+      minHeight: 1,
+      maxWidth: 4,
+      maxHeight: 2,
+      configSchema: {},
+    },
+    {
+      name: "AgentStatusWidget",
+      displayName: "Agent Status",
+      description: "Monitor agent activity and status",
+      component: "AgentStatusWidget",
+      defaultWidth: 2,
+      defaultHeight: 2,
+      minWidth: 1,
+      minHeight: 2,
+      maxWidth: 3,
+      maxHeight: null,
+      configSchema: {},
+    },
+    {
+      name: "ActiveProjectsWidget",
+      displayName: "Active Projects & Agent Chains",
+      description: "View active projects and running agent sessions",
+      component: "ActiveProjectsWidget",
+      defaultWidth: 2,
+      defaultHeight: 3,
+      minWidth: 2,
+      minHeight: 2,
+      maxWidth: 4,
+      maxHeight: null,
+      configSchema: {},
+    },
+    {
+      name: "TaskProgressWidget",
+      displayName: "Task Progress",
+      description: "Live progress of orchestrator agent tasks",
+      component: "TaskProgressWidget",
+      defaultWidth: 2,
+      defaultHeight: 2,
+      minWidth: 1,
+      minHeight: 2,
+      maxWidth: 3,
+      maxHeight: null,
+      configSchema: {},
+    },
+    {
+      name: "OrchestratorEventsWidget",
+      displayName: "Orchestrator Events",
+      description: "Recent orchestration events with stream/Matrix visibility",
+      component: "OrchestratorEventsWidget",
+      defaultWidth: 2,
+      defaultHeight: 2,
+      minWidth: 1,
+      minHeight: 2,
+      maxWidth: 4,
+      maxHeight: null,
+      configSchema: {},
+    },
+  ];
+
+  for (const wd of widgetDefs) {
+    await prisma.widgetDefinition.upsert({
+      where: { name: wd.name },
+      update: {
+        displayName: wd.displayName,
+        description: wd.description,
+        component: wd.component,
+        defaultWidth: wd.defaultWidth,
+        defaultHeight: wd.defaultHeight,
+        minWidth: wd.minWidth,
+        minHeight: wd.minHeight,
+        maxWidth: wd.maxWidth,
+        maxHeight: wd.maxHeight,
+        configSchema: wd.configSchema,
+      },
+      create: {
+        name: wd.name,
+        displayName: wd.displayName,
+        description: wd.description,
+        component: wd.component,
+        defaultWidth: wd.defaultWidth,
+        defaultHeight: wd.defaultHeight,
+        minWidth: wd.minWidth,
+        minHeight: wd.minHeight,
+        maxWidth: wd.maxWidth,
+        maxHeight: wd.maxHeight,
+        configSchema: wd.configSchema,
+      },
+    });
+  }
+
+  console.log(`Seeded ${widgetDefs.length} widget definitions`);
+
   // Use transaction for atomic seed data reset and creation
   await prisma.$transaction(async (tx) => {
     // Delete existing seed data for idempotency (avoids duplicates on re-run)

apps/api/src/admin/admin.controller.spec.ts

@@ -0,0 +1,258 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { Test, TestingModule } from "@nestjs/testing";
+import { AdminController } from "./admin.controller";
+import { AdminService } from "./admin.service";
+import { AuthGuard } from "../auth/guards/auth.guard";
+import { AdminGuard } from "../auth/guards/admin.guard";
+import { WorkspaceMemberRole } from "@prisma/client";
+import type { ExecutionContext } from "@nestjs/common";
+
+describe("AdminController", () => {
+  let controller: AdminController;
+  let service: AdminService;
+
+  const mockAdminService = {
+    listUsers: vi.fn(),
+    inviteUser: vi.fn(),
+    updateUser: vi.fn(),
+    deactivateUser: vi.fn(),
+    createWorkspace: vi.fn(),
+    updateWorkspace: vi.fn(),
+  };
+
+  const mockAuthGuard = {
+    canActivate: vi.fn((context: ExecutionContext) => {
+      const request = context.switchToHttp().getRequest();
+      request.user = {
+        id: "550e8400-e29b-41d4-a716-446655440001",
+        email: "admin@example.com",
+        name: "Admin User",
+      };
+      return true;
+    }),
+  };
+
+  const mockAdminGuard = {
+    canActivate: vi.fn(() => true),
+  };
+
+  const mockAdminId = "550e8400-e29b-41d4-a716-446655440001";
+  const mockUserId = "550e8400-e29b-41d4-a716-446655440002";
+  const mockWorkspaceId = "550e8400-e29b-41d4-a716-446655440003";
+
+  const mockAdminUser = {
+    id: mockAdminId,
+    email: "admin@example.com",
+    name: "Admin User",
+  };
+
+  const mockUserResponse = {
+    id: mockUserId,
+    name: "Test User",
+    email: "test@example.com",
+    emailVerified: false,
+    image: null,
+    createdAt: new Date("2026-01-01"),
+    deactivatedAt: null,
+    isLocalAuth: false,
+    invitedAt: null,
+    invitedBy: null,
+    workspaceMemberships: [],
+  };
+
+  const mockWorkspaceResponse = {
+    id: mockWorkspaceId,
+    name: "Test Workspace",
+    ownerId: mockAdminId,
+    settings: {},
+    createdAt: new Date("2026-01-01"),
+    updatedAt: new Date("2026-01-01"),
+    memberCount: 1,
+  };
+
+  beforeEach(async () => {
+    const module: TestingModule = await Test.createTestingModule({
+      controllers: [AdminController],
+      providers: [
+        {
+          provide: AdminService,
+          useValue: mockAdminService,
+        },
+      ],
+    })
+      .overrideGuard(AuthGuard)
+      .useValue(mockAuthGuard)
+      .overrideGuard(AdminGuard)
+      .useValue(mockAdminGuard)
+      .compile();
+
+    controller = module.get<AdminController>(AdminController);
+    service = module.get<AdminService>(AdminService);
+
+    vi.clearAllMocks();
+  });
+
+  it("should be defined", () => {
+    expect(controller).toBeDefined();
+  });
+
+  describe("listUsers", () => {
+    it("should return paginated users", async () => {
+      const paginatedResult = {
+        data: [mockUserResponse],
+        meta: { total: 1, page: 1, limit: 50, totalPages: 1 },
+      };
+      mockAdminService.listUsers.mockResolvedValue(paginatedResult);
+
+      const result = await controller.listUsers({ page: 1, limit: 50 });
+
+      expect(result).toEqual(paginatedResult);
+      expect(service.listUsers).toHaveBeenCalledWith(1, 50);
+    });
+
+    it("should use default pagination", async () => {
+      const paginatedResult = {
+        data: [],
+        meta: { total: 0, page: 1, limit: 50, totalPages: 0 },
+      };
+      mockAdminService.listUsers.mockResolvedValue(paginatedResult);
+
+      await controller.listUsers({});
+
+      expect(service.listUsers).toHaveBeenCalledWith(undefined, undefined);
+    });
+  });
+
+  describe("inviteUser", () => {
+    it("should invite a user", async () => {
+      const inviteDto = { email: "new@example.com" };
+      const invitationResponse = {
+        userId: "new-id",
+        invitationToken: "token",
+        email: "new@example.com",
+        invitedAt: new Date(),
+      };
+      mockAdminService.inviteUser.mockResolvedValue(invitationResponse);
+
+      const result = await controller.inviteUser(inviteDto, mockAdminUser);
+
+      expect(result).toEqual(invitationResponse);
+      expect(service.inviteUser).toHaveBeenCalledWith(inviteDto, mockAdminId);
+    });
+
+    it("should invite a user with workspace and role", async () => {
+      const inviteDto = {
+        email: "new@example.com",
+        workspaceId: mockWorkspaceId,
+        role: WorkspaceMemberRole.ADMIN,
+      };
+      mockAdminService.inviteUser.mockResolvedValue({
+        userId: "new-id",
+        invitationToken: "token",
+        email: "new@example.com",
+        invitedAt: new Date(),
+      });
+
+      await controller.inviteUser(inviteDto, mockAdminUser);
+
+      expect(service.inviteUser).toHaveBeenCalledWith(inviteDto, mockAdminId);
+    });
+  });
+
+  describe("updateUser", () => {
+    it("should update a user", async () => {
+      const updateDto = { name: "Updated Name" };
+      mockAdminService.updateUser.mockResolvedValue({
+        ...mockUserResponse,
+        name: "Updated Name",
+      });
+
+      const result = await controller.updateUser(mockUserId, updateDto);
+
+      expect(result.name).toBe("Updated Name");
+      expect(service.updateUser).toHaveBeenCalledWith(mockUserId, updateDto);
+    });
+
+    it("should deactivate a user via update", async () => {
+      const deactivatedAt = "2026-02-28T00:00:00.000Z";
+      const updateDto = { deactivatedAt };
+      mockAdminService.updateUser.mockResolvedValue({
+        ...mockUserResponse,
+        deactivatedAt: new Date(deactivatedAt),
+      });
+
+      const result = await controller.updateUser(mockUserId, updateDto);
+
+      expect(result.deactivatedAt).toEqual(new Date(deactivatedAt));
+    });
+  });
+
+  describe("deactivateUser", () => {
+    it("should soft-delete a user", async () => {
+      mockAdminService.deactivateUser.mockResolvedValue({
+        ...mockUserResponse,
+        deactivatedAt: new Date(),
+      });
+
+      const result = await controller.deactivateUser(mockUserId);
+
+      expect(result.deactivatedAt).toBeDefined();
+      expect(service.deactivateUser).toHaveBeenCalledWith(mockUserId);
+    });
+  });
+
+  describe("createWorkspace", () => {
+    it("should create a workspace", async () => {
+      const createDto = { name: "New Workspace", ownerId: mockAdminId };
+      mockAdminService.createWorkspace.mockResolvedValue(mockWorkspaceResponse);
+
+      const result = await controller.createWorkspace(createDto);
+
+      expect(result).toEqual(mockWorkspaceResponse);
+      expect(service.createWorkspace).toHaveBeenCalledWith(createDto);
+    });
+
+    it("should create workspace with settings", async () => {
+      const createDto = {
+        name: "New Workspace",
+        ownerId: mockAdminId,
+        settings: { feature: true },
+      };
+      mockAdminService.createWorkspace.mockResolvedValue({
+        ...mockWorkspaceResponse,
+        settings: { feature: true },
+      });
+
+      const result = await controller.createWorkspace(createDto);
+
+      expect(result.settings).toEqual({ feature: true });
+    });
+  });
+
+  describe("updateWorkspace", () => {
+    it("should update a workspace", async () => {
+      const updateDto = { name: "Updated Workspace" };
+      mockAdminService.updateWorkspace.mockResolvedValue({
+        ...mockWorkspaceResponse,
+        name: "Updated Workspace",
+      });
+
+      const result = await controller.updateWorkspace(mockWorkspaceId, updateDto);
+
+      expect(result.name).toBe("Updated Workspace");
+      expect(service.updateWorkspace).toHaveBeenCalledWith(mockWorkspaceId, updateDto);
+    });
+
+    it("should update workspace settings", async () => {
+      const updateDto = { settings: { notifications: false } };
+      mockAdminService.updateWorkspace.mockResolvedValue({
+        ...mockWorkspaceResponse,
+        settings: { notifications: false },
+      });
+
+      const result = await controller.updateWorkspace(mockWorkspaceId, updateDto);
+
+      expect(result.settings).toEqual({ notifications: false });
+    });
+  });
+});

apps/api/src/admin/admin.controller.ts

@@ -0,0 +1,64 @@
+import {
+  Controller,
+  Get,
+  Post,
+  Patch,
+  Delete,
+  Body,
+  Param,
+  Query,
+  UseGuards,
+  ParseUUIDPipe,
+} from "@nestjs/common";
+import { AdminService } from "./admin.service";
+import { AuthGuard } from "../auth/guards/auth.guard";
+import { AdminGuard } from "../auth/guards/admin.guard";
+import { CurrentUser } from "../auth/decorators/current-user.decorator";
+import type { AuthUser } from "@mosaic/shared";
+import { InviteUserDto } from "./dto/invite-user.dto";
+import { UpdateUserDto } from "./dto/update-user.dto";
+import { CreateWorkspaceDto } from "./dto/create-workspace.dto";
+import { UpdateWorkspaceDto } from "./dto/update-workspace.dto";
+import { QueryUsersDto } from "./dto/query-users.dto";
+
+@Controller("admin")
+@UseGuards(AuthGuard, AdminGuard)
+export class AdminController {
+  constructor(private readonly adminService: AdminService) {}
+
+  @Get("users")
+  async listUsers(@Query() query: QueryUsersDto) {
+    return this.adminService.listUsers(query.page, query.limit);
+  }
+
+  @Post("users/invite")
+  async inviteUser(@Body() dto: InviteUserDto, @CurrentUser() user: AuthUser) {
+    return this.adminService.inviteUser(dto, user.id);
+  }
+
+  @Patch("users/:id")
+  async updateUser(
+    @Param("id", new ParseUUIDPipe({ version: "4" })) id: string,
+    @Body() dto: UpdateUserDto
+  ) {
+    return this.adminService.updateUser(id, dto);
+  }
+
+  @Delete("users/:id")
+  async deactivateUser(@Param("id", new ParseUUIDPipe({ version: "4" })) id: string) {
+    return this.adminService.deactivateUser(id);
+  }
+
+  @Post("workspaces")
+  async createWorkspace(@Body() dto: CreateWorkspaceDto) {
+    return this.adminService.createWorkspace(dto);
+  }
+
+  @Patch("workspaces/:id")
+  async updateWorkspace(
+    @Param("id", new ParseUUIDPipe({ version: "4" })) id: string,
+    @Body() dto: UpdateWorkspaceDto
+  ) {
+    return this.adminService.updateWorkspace(id, dto);
+  }
+}

apps/api/src/admin/admin.module.ts

@@ -0,0 +1,13 @@
+import { Module } from "@nestjs/common";
+import { AdminController } from "./admin.controller";
+import { AdminService } from "./admin.service";
+import { PrismaModule } from "../prisma/prisma.module";
+import { AuthModule } from "../auth/auth.module";
+
+@Module({
+  imports: [PrismaModule, AuthModule],
+  controllers: [AdminController],
+  providers: [AdminService],
+  exports: [AdminService],
+})
+export class AdminModule {}

apps/api/src/admin/admin.service.spec.ts

@@ -0,0 +1,471 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { Test, TestingModule } from "@nestjs/testing";
+import { AdminService } from "./admin.service";
+import { PrismaService } from "../prisma/prisma.service";
+import { BadRequestException, ConflictException, NotFoundException } from "@nestjs/common";
+import { WorkspaceMemberRole } from "@prisma/client";
+
+describe("AdminService", () => {
+  let service: AdminService;
+
+  const mockPrismaService = {
+    user: {
+      findMany: vi.fn(),
+      findUnique: vi.fn(),
+      count: vi.fn(),
+      create: vi.fn(),
+      update: vi.fn(),
+    },
+    workspace: {
+      findUnique: vi.fn(),
+      create: vi.fn(),
+      update: vi.fn(),
+    },
+    workspaceMember: {
+      create: vi.fn(),
+    },
+    $transaction: vi.fn(),
+  };
+
+  const mockAdminId = "550e8400-e29b-41d4-a716-446655440001";
+  const mockUserId = "550e8400-e29b-41d4-a716-446655440002";
+  const mockWorkspaceId = "550e8400-e29b-41d4-a716-446655440003";
+
+  const mockUser = {
+    id: mockUserId,
+    name: "Test User",
+    email: "test@example.com",
+    emailVerified: false,
+    image: null,
+    createdAt: new Date("2026-01-01"),
+    updatedAt: new Date("2026-01-01"),
+    deactivatedAt: null,
+    isLocalAuth: false,
+    passwordHash: null,
+    invitedBy: null,
+    invitationToken: null,
+    invitedAt: null,
+    authProviderId: null,
+    preferences: {},
+    workspaceMemberships: [
+      {
+        workspaceId: mockWorkspaceId,
+        userId: mockUserId,
+        role: WorkspaceMemberRole.MEMBER,
+        joinedAt: new Date("2026-01-01"),
+        workspace: { id: mockWorkspaceId, name: "Test Workspace" },
+      },
+    ],
+  };
+
+  const mockWorkspace = {
+    id: mockWorkspaceId,
+    name: "Test Workspace",
+    ownerId: mockAdminId,
+    settings: {},
+    createdAt: new Date("2026-01-01"),
+    updatedAt: new Date("2026-01-01"),
+    matrixRoomId: null,
+  };
+
+  beforeEach(async () => {
+    const module: TestingModule = await Test.createTestingModule({
+      providers: [
+        AdminService,
+        {
+          provide: PrismaService,
+          useValue: mockPrismaService,
+        },
+      ],
+    }).compile();
+
+    service = module.get<AdminService>(AdminService);
+
+    vi.clearAllMocks();
+
+    mockPrismaService.$transaction.mockImplementation(async (fn: (tx: unknown) => unknown) => {
+      return fn(mockPrismaService);
+    });
+  });
+
+  it("should be defined", () => {
+    expect(service).toBeDefined();
+  });
+
+  describe("listUsers", () => {
+    it("should return paginated users with memberships", async () => {
+      mockPrismaService.user.findMany.mockResolvedValue([mockUser]);
+      mockPrismaService.user.count.mockResolvedValue(1);
+
+      const result = await service.listUsers(1, 50);
+
+      expect(result.data).toHaveLength(1);
+      expect(result.data[0]?.id).toBe(mockUserId);
+      expect(result.data[0]?.workspaceMemberships).toHaveLength(1);
+      expect(result.meta).toEqual({
+        total: 1,
+        page: 1,
+        limit: 50,
+        totalPages: 1,
+      });
+    });
+
+    it("should use default pagination when not provided", async () => {
+      mockPrismaService.user.findMany.mockResolvedValue([]);
+      mockPrismaService.user.count.mockResolvedValue(0);
+
+      await service.listUsers();
+
+      expect(mockPrismaService.user.findMany).toHaveBeenCalledWith(
+        expect.objectContaining({
+          skip: 0,
+          take: 50,
+        })
+      );
+    });
+
+    it("should calculate pagination correctly", async () => {
+      mockPrismaService.user.findMany.mockResolvedValue([]);
+      mockPrismaService.user.count.mockResolvedValue(150);
+
+      const result = await service.listUsers(3, 25);
+
+      expect(mockPrismaService.user.findMany).toHaveBeenCalledWith(
+        expect.objectContaining({
+          skip: 50,
+          take: 25,
+        })
+      );
+      expect(result.meta.totalPages).toBe(6);
+    });
+  });
+
+  describe("inviteUser", () => {
+    it("should create a user with invitation token", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+      const createdUser = {
+        id: "new-user-id",
+        email: "new@example.com",
+        name: "new",
+        invitationToken: "some-token",
+      };
+      mockPrismaService.user.create.mockResolvedValue(createdUser);
+
+      const result = await service.inviteUser({ email: "new@example.com" }, mockAdminId);
+
+      expect(result.email).toBe("new@example.com");
+      expect(result.invitationToken).toBeDefined();
+      expect(result.userId).toBe("new-user-id");
+      expect(mockPrismaService.user.create).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            email: "new@example.com",
+            invitedBy: mockAdminId,
+            invitationToken: expect.any(String),
+          }),
+        })
+      );
+    });
+
+    it("should add user to workspace when workspaceId provided", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+      mockPrismaService.workspace.findUnique.mockResolvedValue(mockWorkspace);
+      const createdUser = { id: "new-user-id", email: "new@example.com", name: "new" };
+      mockPrismaService.user.create.mockResolvedValue(createdUser);
+
+      await service.inviteUser(
+        {
+          email: "new@example.com",
+          workspaceId: mockWorkspaceId,
+          role: WorkspaceMemberRole.ADMIN,
+        },
+        mockAdminId
+      );
+
+      expect(mockPrismaService.workspaceMember.create).toHaveBeenCalledWith({
+        data: {
+          workspaceId: mockWorkspaceId,
+          userId: "new-user-id",
+          role: WorkspaceMemberRole.ADMIN,
+        },
+      });
+    });
+
+    it("should throw ConflictException if email already exists", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+
+      await expect(service.inviteUser({ email: "test@example.com" }, mockAdminId)).rejects.toThrow(
+        ConflictException
+      );
+    });
+
+    it("should throw NotFoundException if workspace does not exist", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+      mockPrismaService.workspace.findUnique.mockResolvedValue(null);
+
+      await expect(
+        service.inviteUser({ email: "new@example.com", workspaceId: "non-existent" }, mockAdminId)
+      ).rejects.toThrow(NotFoundException);
+    });
+
+    it("should use email prefix as default name", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+      const createdUser = { id: "new-user-id", email: "jane.doe@example.com", name: "jane.doe" };
+      mockPrismaService.user.create.mockResolvedValue(createdUser);
+
+      await service.inviteUser({ email: "jane.doe@example.com" }, mockAdminId);
+
+      expect(mockPrismaService.user.create).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            name: "jane.doe",
+          }),
+        })
+      );
+    });
+
+    it("should use provided name when given", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+      const createdUser = { id: "new-user-id", email: "j@example.com", name: "Jane Doe" };
+      mockPrismaService.user.create.mockResolvedValue(createdUser);
+
+      await service.inviteUser({ email: "j@example.com", name: "Jane Doe" }, mockAdminId);
+
+      expect(mockPrismaService.user.create).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            name: "Jane Doe",
+          }),
+        })
+      );
+    });
+  });
+
+  describe("updateUser", () => {
+    it("should update user fields", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.user.update.mockResolvedValue({
+        ...mockUser,
+        name: "Updated Name",
+      });
+
+      const result = await service.updateUser(mockUserId, { name: "Updated Name" });
+
+      expect(result.name).toBe("Updated Name");
+      expect(mockPrismaService.user.update).toHaveBeenCalledWith(
+        expect.objectContaining({
+          where: { id: mockUserId },
+          data: { name: "Updated Name" },
+        })
+      );
+    });
+
+    it("should set deactivatedAt when provided", async () => {
+      const deactivatedAt = "2026-02-28T00:00:00.000Z";
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.user.update.mockResolvedValue({
+        ...mockUser,
+        deactivatedAt: new Date(deactivatedAt),
+      });
+
+      const result = await service.updateUser(mockUserId, { deactivatedAt });
+
+      expect(result.deactivatedAt).toEqual(new Date(deactivatedAt));
+    });
+
+    it("should clear deactivatedAt when set to null", async () => {
+      const deactivatedUser = { ...mockUser, deactivatedAt: new Date() };
+      mockPrismaService.user.findUnique.mockResolvedValue(deactivatedUser);
+      mockPrismaService.user.update.mockResolvedValue({
+        ...deactivatedUser,
+        deactivatedAt: null,
+      });
+
+      const result = await service.updateUser(mockUserId, { deactivatedAt: null });
+
+      expect(result.deactivatedAt).toBeNull();
+    });
+
+    it("should throw NotFoundException if user does not exist", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+
+      await expect(service.updateUser("non-existent", { name: "Test" })).rejects.toThrow(
+        NotFoundException
+      );
+    });
+
+    it("should update emailVerified", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.user.update.mockResolvedValue({
+        ...mockUser,
+        emailVerified: true,
+      });
+
+      const result = await service.updateUser(mockUserId, { emailVerified: true });
+
+      expect(result.emailVerified).toBe(true);
+    });
+
+    it("should update preferences", async () => {
+      const prefs = { theme: "dark" };
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.user.update.mockResolvedValue({
+        ...mockUser,
+        preferences: prefs,
+      });
+
+      await service.updateUser(mockUserId, { preferences: prefs });
+
+      expect(mockPrismaService.user.update).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({ preferences: prefs }),
+        })
+      );
+    });
+  });
+
+  describe("deactivateUser", () => {
+    it("should set deactivatedAt on the user", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.user.update.mockResolvedValue({
+        ...mockUser,
+        deactivatedAt: new Date(),
+      });
+
+      const result = await service.deactivateUser(mockUserId);
+
+      expect(result.deactivatedAt).toBeDefined();
+      expect(mockPrismaService.user.update).toHaveBeenCalledWith(
+        expect.objectContaining({
+          where: { id: mockUserId },
+          data: { deactivatedAt: expect.any(Date) },
+        })
+      );
+    });
+
+    it("should throw NotFoundException if user does not exist", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+
+      await expect(service.deactivateUser("non-existent")).rejects.toThrow(NotFoundException);
+    });
+
+    it("should throw BadRequestException if user is already deactivated", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue({
+        ...mockUser,
+        deactivatedAt: new Date(),
+      });
+
+      await expect(service.deactivateUser(mockUserId)).rejects.toThrow(BadRequestException);
+    });
+  });
+
+  describe("createWorkspace", () => {
+    it("should create a workspace with owner membership", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.workspace.create.mockResolvedValue(mockWorkspace);
+
+      const result = await service.createWorkspace({
+        name: "New Workspace",
+        ownerId: mockAdminId,
+      });
+
+      expect(result.name).toBe("Test Workspace");
+      expect(result.memberCount).toBe(1);
+      expect(mockPrismaService.workspace.create).toHaveBeenCalled();
+      expect(mockPrismaService.workspaceMember.create).toHaveBeenCalledWith({
+        data: {
+          workspaceId: mockWorkspace.id,
+          userId: mockAdminId,
+          role: WorkspaceMemberRole.OWNER,
+        },
+      });
+    });
+
+    it("should throw NotFoundException if owner does not exist", async () => {
+      mockPrismaService.user.findUnique.mockResolvedValue(null);
+
+      await expect(
+        service.createWorkspace({ name: "New Workspace", ownerId: "non-existent" })
+      ).rejects.toThrow(NotFoundException);
+    });
+
+    it("should pass settings when provided", async () => {
+      const settings = { theme: "dark", features: ["chat"] };
+      mockPrismaService.user.findUnique.mockResolvedValue(mockUser);
+      mockPrismaService.workspace.create.mockResolvedValue({
+        ...mockWorkspace,
+        settings,
+      });
+
+      await service.createWorkspace({
+        name: "New Workspace",
+        ownerId: mockAdminId,
+        settings,
+      });
+
+      expect(mockPrismaService.workspace.create).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({ settings }),
+        })
+      );
+    });
+  });
+
+  describe("updateWorkspace", () => {
+    it("should update workspace name", async () => {
+      mockPrismaService.workspace.findUnique.mockResolvedValue(mockWorkspace);
+      mockPrismaService.workspace.update.mockResolvedValue({
+        ...mockWorkspace,
+        name: "Updated Workspace",
+        _count: { members: 3 },
+      });
+
+      const result = await service.updateWorkspace(mockWorkspaceId, {
+        name: "Updated Workspace",
+      });
+
+      expect(result.name).toBe("Updated Workspace");
+      expect(result.memberCount).toBe(3);
+    });
+
+    it("should update workspace settings", async () => {
+      const newSettings = { notifications: true };
+      mockPrismaService.workspace.findUnique.mockResolvedValue(mockWorkspace);
+      mockPrismaService.workspace.update.mockResolvedValue({
+        ...mockWorkspace,
+        settings: newSettings,
+        _count: { members: 1 },
+      });
+
+      const result = await service.updateWorkspace(mockWorkspaceId, {
+        settings: newSettings,
+      });
+
+      expect(result.settings).toEqual(newSettings);
+    });
+
+    it("should throw NotFoundException if workspace does not exist", async () => {
+      mockPrismaService.workspace.findUnique.mockResolvedValue(null);
+
+      await expect(service.updateWorkspace("non-existent", { name: "Test" })).rejects.toThrow(
+        NotFoundException
+      );
+    });
+
+    it("should only update provided fields", async () => {
+      mockPrismaService.workspace.findUnique.mockResolvedValue(mockWorkspace);
+      mockPrismaService.workspace.update.mockResolvedValue({
+        ...mockWorkspace,
+        _count: { members: 1 },
+      });
+
+      await service.updateWorkspace(mockWorkspaceId, { name: "Only Name" });
+
+      expect(mockPrismaService.workspace.update).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: { name: "Only Name" },
+        })
+      );
+    });
+  });
+});

apps/api/src/admin/admin.service.ts

@@ -0,0 +1,306 @@
+import {
+  BadRequestException,
+  ConflictException,
+  Injectable,
+  Logger,
+  NotFoundException,
+} from "@nestjs/common";
+import { Prisma, WorkspaceMemberRole } from "@prisma/client";
+import { randomUUID } from "node:crypto";
+import { PrismaService } from "../prisma/prisma.service";
+import type { InviteUserDto } from "./dto/invite-user.dto";
+import type { UpdateUserDto } from "./dto/update-user.dto";
+import type { CreateWorkspaceDto } from "./dto/create-workspace.dto";
+import type {
+  AdminUserResponse,
+  AdminWorkspaceResponse,
+  InvitationResponse,
+  PaginatedResponse,
+} from "./types/admin.types";
+
+@Injectable()
+export class AdminService {
+  private readonly logger = new Logger(AdminService.name);
+
+  constructor(private readonly prisma: PrismaService) {}
+
+  async listUsers(page = 1, limit = 50): Promise<PaginatedResponse<AdminUserResponse>> {
+    const skip = (page - 1) * limit;
+
+    const [users, total] = await Promise.all([
+      this.prisma.user.findMany({
+        include: {
+          workspaceMemberships: {
+            include: {
+              workspace: { select: { id: true, name: true } },
+            },
+          },
+        },
+        orderBy: { createdAt: "desc" },
+        skip,
+        take: limit,
+      }),
+      this.prisma.user.count(),
+    ]);
+
+    return {
+      data: users.map((user) => ({
+        id: user.id,
+        name: user.name,
+        email: user.email,
+        emailVerified: user.emailVerified,
+        image: user.image,
+        createdAt: user.createdAt,
+        deactivatedAt: user.deactivatedAt,
+        isLocalAuth: user.isLocalAuth,
+        invitedAt: user.invitedAt,
+        invitedBy: user.invitedBy,
+        workspaceMemberships: user.workspaceMemberships.map((m) => ({
+          workspaceId: m.workspaceId,
+          workspaceName: m.workspace.name,
+          role: m.role,
+          joinedAt: m.joinedAt,
+        })),
+      })),
+      meta: {
+        total,
+        page,
+        limit,
+        totalPages: Math.ceil(total / limit),
+      },
+    };
+  }
+
+  async inviteUser(dto: InviteUserDto, inviterId: string): Promise<InvitationResponse> {
+    const existing = await this.prisma.user.findUnique({
+      where: { email: dto.email },
+    });
+
+    if (existing) {
+      throw new ConflictException(`User with email ${dto.email} already exists`);
+    }
+
+    if (dto.workspaceId) {
+      const workspace = await this.prisma.workspace.findUnique({
+        where: { id: dto.workspaceId },
+      });
+      if (!workspace) {
+        throw new NotFoundException(`Workspace ${dto.workspaceId} not found`);
+      }
+    }
+
+    const invitationToken = randomUUID();
+    const now = new Date();
+
+    const user = await this.prisma.$transaction(async (tx) => {
+      const created = await tx.user.create({
+        data: {
+          email: dto.email,
+          name: dto.name ?? dto.email.split("@")[0] ?? dto.email,
+          emailVerified: false,
+          invitedBy: inviterId,
+          invitationToken,
+          invitedAt: now,
+        },
+      });
+
+      if (dto.workspaceId) {
+        await tx.workspaceMember.create({
+          data: {
+            workspaceId: dto.workspaceId,
+            userId: created.id,
+            role: dto.role ?? WorkspaceMemberRole.MEMBER,
+          },
+        });
+      }
+
+      return created;
+    });
+
+    this.logger.log(`User invited: ${user.email} by ${inviterId}`);
+
+    return {
+      userId: user.id,
+      invitationToken,
+      email: user.email,
+      invitedAt: now,
+    };
+  }
+
+  async updateUser(id: string, dto: UpdateUserDto): Promise<AdminUserResponse> {
+    const existing = await this.prisma.user.findUnique({ where: { id } });
+    if (!existing) {
+      throw new NotFoundException(`User ${id} not found`);
+    }
+
+    const data: Prisma.UserUpdateInput = {};
+
+    if (dto.name !== undefined) {
+      data.name = dto.name;
+    }
+    if (dto.emailVerified !== undefined) {
+      data.emailVerified = dto.emailVerified;
+    }
+    if (dto.preferences !== undefined) {
+      data.preferences = dto.preferences as Prisma.InputJsonValue;
+    }
+    if (dto.deactivatedAt !== undefined) {
+      data.deactivatedAt = dto.deactivatedAt ? new Date(dto.deactivatedAt) : null;
+    }
+
+    const user = await this.prisma.user.update({
+      where: { id },
+      data,
+      include: {
+        workspaceMemberships: {
+          include: {
+            workspace: { select: { id: true, name: true } },
+          },
+        },
+      },
+    });
+
+    this.logger.log(`User updated: ${id}`);
+
+    return {
+      id: user.id,
+      name: user.name,
+      email: user.email,
+      emailVerified: user.emailVerified,
+      image: user.image,
+      createdAt: user.createdAt,
+      deactivatedAt: user.deactivatedAt,
+      isLocalAuth: user.isLocalAuth,
+      invitedAt: user.invitedAt,
+      invitedBy: user.invitedBy,
+      workspaceMemberships: user.workspaceMemberships.map((m) => ({
+        workspaceId: m.workspaceId,
+        workspaceName: m.workspace.name,
+        role: m.role,
+        joinedAt: m.joinedAt,
+      })),
+    };
+  }
+
+  async deactivateUser(id: string): Promise<AdminUserResponse> {
+    const existing = await this.prisma.user.findUnique({ where: { id } });
+    if (!existing) {
+      throw new NotFoundException(`User ${id} not found`);
+    }
+
+    if (existing.deactivatedAt) {
+      throw new BadRequestException(`User ${id} is already deactivated`);
+    }
+
+    const user = await this.prisma.user.update({
+      where: { id },
+      data: { deactivatedAt: new Date() },
+      include: {
+        workspaceMemberships: {
+          include: {
+            workspace: { select: { id: true, name: true } },
+          },
+        },
+      },
+    });
+
+    this.logger.log(`User deactivated: ${id}`);
+
+    return {
+      id: user.id,
+      name: user.name,
+      email: user.email,
+      emailVerified: user.emailVerified,
+      image: user.image,
+      createdAt: user.createdAt,
+      deactivatedAt: user.deactivatedAt,
+      isLocalAuth: user.isLocalAuth,
+      invitedAt: user.invitedAt,
+      invitedBy: user.invitedBy,
+      workspaceMemberships: user.workspaceMemberships.map((m) => ({
+        workspaceId: m.workspaceId,
+        workspaceName: m.workspace.name,
+        role: m.role,
+        joinedAt: m.joinedAt,
+      })),
+    };
+  }
+
+  async createWorkspace(dto: CreateWorkspaceDto): Promise<AdminWorkspaceResponse> {
+    const owner = await this.prisma.user.findUnique({ where: { id: dto.ownerId } });
+    if (!owner) {
+      throw new NotFoundException(`User ${dto.ownerId} not found`);
+    }
+
+    const workspace = await this.prisma.$transaction(async (tx) => {
+      const created = await tx.workspace.create({
+        data: {
+          name: dto.name,
+          ownerId: dto.ownerId,
+          settings: dto.settings ? (dto.settings as Prisma.InputJsonValue) : {},
+        },
+      });
+
+      await tx.workspaceMember.create({
+        data: {
+          workspaceId: created.id,
+          userId: dto.ownerId,
+          role: WorkspaceMemberRole.OWNER,
+        },
+      });
+
+      return created;
+    });
+
+    this.logger.log(`Workspace created: ${workspace.id} with owner ${dto.ownerId}`);
+
+    return {
+      id: workspace.id,
+      name: workspace.name,
+      ownerId: workspace.ownerId,
+      settings: workspace.settings as Record<string, unknown>,
+      createdAt: workspace.createdAt,
+      updatedAt: workspace.updatedAt,
+      memberCount: 1,
+    };
+  }
+
+  async updateWorkspace(
+    id: string,
+    dto: { name?: string; settings?: Record<string, unknown> }
+  ): Promise<AdminWorkspaceResponse> {
+    const existing = await this.prisma.workspace.findUnique({ where: { id } });
+    if (!existing) {
+      throw new NotFoundException(`Workspace ${id} not found`);
+    }
+
+    const data: Prisma.WorkspaceUpdateInput = {};
+
+    if (dto.name !== undefined) {
+      data.name = dto.name;
+    }
+    if (dto.settings !== undefined) {
+      data.settings = dto.settings as Prisma.InputJsonValue;
+    }
+
+    const workspace = await this.prisma.workspace.update({
+      where: { id },
+      data,
+      include: {
+        _count: { select: { members: true } },
+      },
+    });
+
+    this.logger.log(`Workspace updated: ${id}`);
+
+    return {
+      id: workspace.id,
+      name: workspace.name,
+      ownerId: workspace.ownerId,
+      settings: workspace.settings as Record<string, unknown>,
+      createdAt: workspace.createdAt,
+      updatedAt: workspace.updatedAt,
+      memberCount: workspace._count.members,
+    };
+  }
+}

apps/api/src/admin/dto/create-workspace.dto.ts

@@ -0,0 +1,15 @@
+import { IsObject, IsOptional, IsString, IsUUID, MaxLength, MinLength } from "class-validator";
+
+export class CreateWorkspaceDto {
+  @IsString({ message: "name must be a string" })
+  @MinLength(1, { message: "name must not be empty" })
+  @MaxLength(255, { message: "name must not exceed 255 characters" })
+  name!: string;
+
+  @IsUUID("4", { message: "ownerId must be a valid UUID" })
+  ownerId!: string;
+
+  @IsOptional()
+  @IsObject({ message: "settings must be an object" })
+  settings?: Record<string, unknown>;
+}

apps/api/src/admin/dto/invite-user.dto.ts

@@ -0,0 +1,20 @@
+import { WorkspaceMemberRole } from "@prisma/client";
+import { IsEmail, IsEnum, IsOptional, IsString, IsUUID, MaxLength } from "class-validator";
+
+export class InviteUserDto {
+  @IsEmail({}, { message: "email must be a valid email address" })
+  email!: string;
+
+  @IsOptional()
+  @IsString({ message: "name must be a string" })
+  @MaxLength(255, { message: "name must not exceed 255 characters" })
+  name?: string;
+
+  @IsOptional()
+  @IsUUID("4", { message: "workspaceId must be a valid UUID" })
+  workspaceId?: string;
+
+  @IsOptional()
+  @IsEnum(WorkspaceMemberRole, { message: "role must be a valid WorkspaceMemberRole" })
+  role?: WorkspaceMemberRole;
+}

apps/api/src/admin/dto/manage-member.dto.ts

@@ -0,0 +1,15 @@
+import { WorkspaceMemberRole } from "@prisma/client";
+import { IsEnum, IsUUID } from "class-validator";
+
+export class AddMemberDto {
+  @IsUUID("4", { message: "userId must be a valid UUID" })
+  userId!: string;
+
+  @IsEnum(WorkspaceMemberRole, { message: "role must be a valid WorkspaceMemberRole" })
+  role!: WorkspaceMemberRole;
+}
+
+export class UpdateMemberRoleDto {
+  @IsEnum(WorkspaceMemberRole, { message: "role must be a valid WorkspaceMemberRole" })
+  role!: WorkspaceMemberRole;
+}

apps/api/src/admin/dto/query-users.dto.ts

@@ -0,0 +1,17 @@
+import { IsInt, IsOptional, Max, Min } from "class-validator";
+import { Type } from "class-transformer";
+
+export class QueryUsersDto {
+  @IsOptional()
+  @Type(() => Number)
+  @IsInt({ message: "page must be an integer" })
+  @Min(1, { message: "page must be at least 1" })
+  page?: number;
+
+  @IsOptional()
+  @Type(() => Number)
+  @IsInt({ message: "limit must be an integer" })
+  @Min(1, { message: "limit must be at least 1" })
+  @Max(100, { message: "limit must not exceed 100" })
+  limit?: number;
+}

apps/api/src/admin/dto/update-user.dto.ts

@@ -0,0 +1,27 @@
+import {
+  IsBoolean,
+  IsDateString,
+  IsObject,
+  IsOptional,
+  IsString,
+  MaxLength,
+} from "class-validator";
+
+export class UpdateUserDto {
+  @IsOptional()
+  @IsString({ message: "name must be a string" })
+  @MaxLength(255, { message: "name must not exceed 255 characters" })
+  name?: string;
+
+  @IsOptional()
+  @IsDateString({}, { message: "deactivatedAt must be a valid ISO 8601 date string" })
+  deactivatedAt?: string | null;
+
+  @IsOptional()
+  @IsBoolean({ message: "emailVerified must be a boolean" })
+  emailVerified?: boolean;
+
+  @IsOptional()
+  @IsObject({ message: "preferences must be an object" })
+  preferences?: Record<string, unknown>;
+}

apps/api/src/admin/dto/update-workspace.dto.ts

@@ -0,0 +1,13 @@
+import { IsObject, IsOptional, IsString, MaxLength, MinLength } from "class-validator";
+
+export class UpdateWorkspaceDto {
+  @IsOptional()
+  @IsString({ message: "name must be a string" })
+  @MinLength(1, { message: "name must not be empty" })
+  @MaxLength(255, { message: "name must not exceed 255 characters" })
+  name?: string;
+
+  @IsOptional()
+  @IsObject({ message: "settings must be an object" })
+  settings?: Record<string, unknown>;
+}

apps/api/src/admin/types/admin.types.ts

@@ -0,0 +1,49 @@
+import type { WorkspaceMemberRole } from "@prisma/client";
+
+export interface AdminUserResponse {
+  id: string;
+  name: string;
+  email: string;
+  emailVerified: boolean;
+  image: string | null;
+  createdAt: Date;
+  deactivatedAt: Date | null;
+  isLocalAuth: boolean;
+  invitedAt: Date | null;
+  invitedBy: string | null;
+  workspaceMemberships: WorkspaceMembershipResponse[];
+}
+
+export interface WorkspaceMembershipResponse {
+  workspaceId: string;
+  workspaceName: string;
+  role: WorkspaceMemberRole;
+  joinedAt: Date;
+}
+
+export interface PaginatedResponse<T> {
+  data: T[];
+  meta: {
+    total: number;
+    page: number;
+    limit: number;
+    totalPages: number;
+  };
+}
+
+export interface InvitationResponse {
+  userId: string;
+  invitationToken: string;
+  email: string;
+  invitedAt: Date;
+}
+
+export interface AdminWorkspaceResponse {
+  id: string;
+  name: string;
+  ownerId: string;
+  settings: Record<string, unknown>;
+  createdAt: Date;
+  updatedAt: Date;
+  memberCount: number;
+}

apps/api/src/app.module.ts

@@ -39,6 +39,11 @@ import { FederationModule } from "./federation/federation.module";
 import { CredentialsModule } from "./credentials/credentials.module";
 import { MosaicTelemetryModule } from "./mosaic-telemetry";
 import { SpeechModule } from "./speech/speech.module";
+import { DashboardModule } from "./dashboard/dashboard.module";
+import { TerminalModule } from "./terminal/terminal.module";
+import { PersonalitiesModule } from "./personalities/personalities.module";
+import { WorkspacesModule } from "./workspaces/workspaces.module";
+import { AdminModule } from "./admin/admin.module";
 import { RlsContextInterceptor } from "./common/interceptors/rls-context.interceptor";
 
 @Module({
@@ -101,6 +106,11 @@ import { RlsContextInterceptor } from "./common/interceptors/rls-context.interce
     CredentialsModule,
     MosaicTelemetryModule,
     SpeechModule,
+    DashboardModule,
+    TerminalModule,
+    PersonalitiesModule,
+    WorkspacesModule,
+    AdminModule,
   ],
   controllers: [AppController, CsrfController],
   providers: [

apps/api/src/auth/auth.config.ts

@@ -254,6 +254,10 @@ export function createAuth(prisma: PrismaClient) {
       enabled: true,
     },
     plugins: [...getOidcPlugins()],
+    logger: {
+      disabled: false,
+      level: "error",
+    },
     session: {
       expiresIn: 60 * 60 * 24 * 7, // 7 days absolute max
       updateAge: 60 * 60 * 2, // 2 hours — minimum session age before BetterAuth refreshes the expiry on next request

apps/api/src/auth/auth.controller.spec.ts

@@ -361,16 +361,13 @@ describe("AuthController", () => {
   });
 
   describe("getProfile", () => {
-    it("should return complete user profile with workspace fields", () => {
+    it("should return complete user profile with identity fields", () => {
       const mockUser: AuthUser = {
         id: "user-123",
         email: "test@example.com",
         name: "Test User",
         image: "https://example.com/avatar.jpg",
         emailVerified: true,
-        workspaceId: "workspace-123",
-        currentWorkspaceId: "workspace-456",
-        workspaceRole: "admin",
       };
 
       const result = controller.getProfile(mockUser);
@@ -381,13 +378,10 @@ describe("AuthController", () => {
         name: mockUser.name,
         image: mockUser.image,
         emailVerified: mockUser.emailVerified,
-        workspaceId: mockUser.workspaceId,
-        currentWorkspaceId: mockUser.currentWorkspaceId,
-        workspaceRole: mockUser.workspaceRole,
       });
     });
 
-    it("should return user profile with optional fields undefined", () => {
+    it("should return user profile with only required fields", () => {
       const mockUser: AuthUser = {
         id: "user-123",
         email: "test@example.com",
@@ -400,12 +394,11 @@ describe("AuthController", () => {
         id: mockUser.id,
         email: mockUser.email,
         name: mockUser.name,
-        image: undefined,
-        emailVerified: undefined,
-        workspaceId: undefined,
-        currentWorkspaceId: undefined,
-        workspaceRole: undefined,
       });
+      // Workspace fields are not included — served by GET /api/workspaces
+      expect(result).not.toHaveProperty("workspaceId");
+      expect(result).not.toHaveProperty("currentWorkspaceId");
+      expect(result).not.toHaveProperty("workspaceRole");
     });
   });
 

apps/api/src/auth/auth.controller.ts

@@ -72,15 +72,10 @@ export class AuthController {
     if (user.emailVerified !== undefined) {
       profile.emailVerified = user.emailVerified;
     }
-    if (user.workspaceId !== undefined) {
+
-      profile.workspaceId = user.workspaceId;
+    // Workspace context is served by GET /api/workspaces, not the auth profile.
-    }
+    // The deprecated workspaceId/currentWorkspaceId/workspaceRole fields on
-    if (user.currentWorkspaceId !== undefined) {
+    // AuthUser are never populated by BetterAuth and are omitted here.
-      profile.currentWorkspaceId = user.currentWorkspaceId;
-    }
-    if (user.workspaceRole !== undefined) {
-      profile.workspaceRole = user.workspaceRole;
-    }
 
     return profile;
   }
@@ -123,6 +118,14 @@ export class AuthController {
 
     try {
       await handler(req, res);
+
+      // BetterAuth writes responses directly — catch silent 500s that bypass NestJS error handling
+      if (res.statusCode >= 500) {
+        this.logger.error(
+          `BetterAuth returned ${String(res.statusCode)} for ${req.method} ${req.url} from ${clientIp}` +
+            ` — check container stdout for '# SERVER_ERROR' details`
+        );
+      }
     } catch (error: unknown) {
       const message = error instanceof Error ? error.message : String(error);
       const stack = error instanceof Error ? error.stack : undefined;

apps/api/src/common/controllers/csrf.controller.ts

@@ -16,7 +16,7 @@ interface AuthenticatedRequest extends Request {
   user?: AuthenticatedUser;
 }
 
-@Controller("api/v1/csrf")
+@Controller("v1/csrf")
 export class CsrfController {
   constructor(private readonly csrfService: CsrfService) {}
 

apps/api/src/common/guards/csrf.guard.spec.ts

@@ -174,17 +174,19 @@ describe("CsrfGuard", () => {
   });
 
   describe("Session binding validation", () => {
-    it("should reject when user is not authenticated", () => {
+    it("should allow when user context is not yet available (global guard ordering)", () => {
+      // CsrfGuard runs as APP_GUARD before per-controller AuthGuard,
+      // so request.user may not be populated. Double-submit cookie match
+      // is sufficient protection in this case.
       const token = generateValidToken("user-123");
       const context = createContext(
         "POST",
         { "csrf-token": token },
         { "x-csrf-token": token },
         false
-        // No userId - unauthenticated
+        // No userId - AuthGuard hasn't run yet
       );
-      expect(() => guard.canActivate(context)).toThrow(ForbiddenException);
+      expect(guard.canActivate(context)).toBe(true);
-      expect(() => guard.canActivate(context)).toThrow("CSRF validation requires authentication");
     });
 
     it("should reject token from different session", () => {

apps/api/src/common/guards/csrf.guard.ts

@@ -89,30 +89,30 @@ export class CsrfGuard implements CanActivate {
       throw new ForbiddenException("CSRF token mismatch");
     }
 
-    // Validate session binding via HMAC
+    // Validate session binding via HMAC when user context is available.
+    // CsrfGuard is a global guard (APP_GUARD) that runs before per-controller
+    // AuthGuard, so request.user may not be populated yet. In that case, the
+    // double-submit cookie match above is sufficient CSRF protection.
     const userId = request.user?.id;
-    if (!userId) {
+    if (userId) {
-      this.logger.warn({
+      if (!this.csrfService.validateToken(cookieToken, userId)) {
-        event: "CSRF_NO_USER_CONTEXT",
+        this.logger.warn({
+          event: "CSRF_SESSION_BINDING_INVALID",
+          method: request.method,
+          path: request.path,
+          securityEvent: true,
+          timestamp: new Date().toISOString(),
+        });
+
+        throw new ForbiddenException("CSRF token not bound to session");
+      }
+    } else {
+      this.logger.debug({
+        event: "CSRF_SKIP_SESSION_BINDING",
         method: request.method,
         path: request.path,
-        securityEvent: true,
+        reason: "User context not yet available (global guard runs before AuthGuard)",
-        timestamp: new Date().toISOString(),
       });
-
-      throw new ForbiddenException("CSRF validation requires authentication");
-    }
-
-    if (!this.csrfService.validateToken(cookieToken, userId)) {
-      this.logger.warn({
-        event: "CSRF_SESSION_BINDING_INVALID",
-        method: request.method,
-        path: request.path,
-        securityEvent: true,
-        timestamp: new Date().toISOString(),
-      });
-
-      throw new ForbiddenException("CSRF token not bound to session");
     }
 
     return true;

apps/api/src/common/guards/workspace.guard.ts

@@ -110,10 +110,10 @@ export class WorkspaceGuard implements CanActivate {
       return paramWorkspaceId;
     }
 
-    // 3. Check request body
+    // 3. Check request body (body may be undefined for GET requests despite Express typings)
-    const bodyWorkspaceId = request.body.workspaceId;
+    const body = request.body as Record<string, unknown> | undefined;
-    if (typeof bodyWorkspaceId === "string") {
+    if (body && typeof body.workspaceId === "string") {
-      return bodyWorkspaceId;
+      return body.workspaceId;
     }
 
     // 4. Check query string (backward compatibility for existing clients)

apps/api/src/dashboard/dashboard.controller.spec.ts

@@ -0,0 +1,143 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { Test, TestingModule } from "@nestjs/testing";
+import { DashboardController } from "./dashboard.controller";
+import { DashboardService } from "./dashboard.service";
+import { AuthGuard } from "../auth/guards/auth.guard";
+import { WorkspaceGuard } from "../common/guards/workspace.guard";
+import { PermissionGuard } from "../common/guards/permission.guard";
+import type { DashboardSummaryDto } from "./dto";
+
+describe("DashboardController", () => {
+  let controller: DashboardController;
+  let service: DashboardService;
+
+  const mockWorkspaceId = "550e8400-e29b-41d4-a716-446655440001";
+
+  const mockSummary: DashboardSummaryDto = {
+    metrics: {
+      activeAgents: 3,
+      tasksCompleted: 12,
+      totalTasks: 25,
+      tasksInProgress: 5,
+      activeProjects: 4,
+      errorRate: 2.5,
+    },
+    recentActivity: [
+      {
+        id: "550e8400-e29b-41d4-a716-446655440010",
+        action: "CREATED",
+        entityType: "TASK",
+        entityId: "550e8400-e29b-41d4-a716-446655440011",
+        details: { title: "New task" },
+        userId: "550e8400-e29b-41d4-a716-446655440002",
+        createdAt: "2026-02-22T12:00:00.000Z",
+      },
+    ],
+    activeJobs: [
+      {
+        id: "550e8400-e29b-41d4-a716-446655440020",
+        type: "code-task",
+        status: "RUNNING",
+        progressPercent: 45,
+        createdAt: "2026-02-22T11:00:00.000Z",
+        updatedAt: "2026-02-22T11:30:00.000Z",
+        steps: [
+          {
+            id: "550e8400-e29b-41d4-a716-446655440030",
+            name: "Setup",
+            status: "COMPLETED",
+            phase: "SETUP",
+          },
+        ],
+      },
+    ],
+    tokenBudget: [
+      {
+        model: "agent-1",
+        used: 5000,
+        limit: 10000,
+      },
+    ],
+  };
+
+  const mockDashboardService = {
+    getSummary: vi.fn(),
+  };
+
+  const mockAuthGuard = {
+    canActivate: vi.fn(() => true),
+  };
+
+  const mockWorkspaceGuard = {
+    canActivate: vi.fn(() => true),
+  };
+
+  const mockPermissionGuard = {
+    canActivate: vi.fn(() => true),
+  };
+
+  beforeEach(async () => {
+    const module: TestingModule = await Test.createTestingModule({
+      controllers: [DashboardController],
+      providers: [
+        {
+          provide: DashboardService,
+          useValue: mockDashboardService,
+        },
+      ],
+    })
+      .overrideGuard(AuthGuard)
+      .useValue(mockAuthGuard)
+      .overrideGuard(WorkspaceGuard)
+      .useValue(mockWorkspaceGuard)
+      .overrideGuard(PermissionGuard)
+      .useValue(mockPermissionGuard)
+      .compile();
+
+    controller = module.get<DashboardController>(DashboardController);
+    service = module.get<DashboardService>(DashboardService);
+
+    vi.clearAllMocks();
+  });
+
+  it("should be defined", () => {
+    expect(controller).toBeDefined();
+  });
+
+  describe("getSummary", () => {
+    it("should return dashboard summary for workspace", async () => {
+      mockDashboardService.getSummary.mockResolvedValue(mockSummary);
+
+      const result = await controller.getSummary(mockWorkspaceId);
+
+      expect(result).toEqual(mockSummary);
+      expect(service.getSummary).toHaveBeenCalledWith(mockWorkspaceId);
+    });
+
+    it("should return empty arrays when no data exists", async () => {
+      const emptySummary: DashboardSummaryDto = {
+        metrics: {
+          activeAgents: 0,
+          tasksCompleted: 0,
+          totalTasks: 0,
+          tasksInProgress: 0,
+          activeProjects: 0,
+          errorRate: 0,
+        },
+        recentActivity: [],
+        activeJobs: [],
+        tokenBudget: [],
+      };
+
+      mockDashboardService.getSummary.mockResolvedValue(emptySummary);
+
+      const result = await controller.getSummary(mockWorkspaceId);
+
+      expect(result).toEqual(emptySummary);
+      expect(result.metrics.errorRate).toBe(0);
+      expect(result.recentActivity).toHaveLength(0);
+      expect(result.activeJobs).toHaveLength(0);
+      expect(result.tokenBudget).toHaveLength(0);
+    });
+  });
+});

apps/api/src/dashboard/dashboard.controller.ts

@@ -0,0 +1,35 @@
+import { Controller, Get, UseGuards, BadRequestException } from "@nestjs/common";
+import { DashboardService } from "./dashboard.service";
+import { AuthGuard } from "../auth/guards/auth.guard";
+import { WorkspaceGuard, PermissionGuard } from "../common/guards";
+import { Workspace, Permission, RequirePermission } from "../common/decorators";
+import type { DashboardSummaryDto } from "./dto";
+
+/**
+ * Controller for dashboard endpoints.
+ * Returns aggregated summary data for the workspace dashboard.
+ *
+ * Guards are applied in order:
+ * 1. AuthGuard - Verifies user authentication
+ * 2. WorkspaceGuard - Validates workspace access and sets RLS context
+ * 3. PermissionGuard - Checks role-based permissions
+ */
+@Controller("dashboard")
+@UseGuards(AuthGuard, WorkspaceGuard, PermissionGuard)
+export class DashboardController {
+  constructor(private readonly dashboardService: DashboardService) {}
+
+  /**
+   * GET /api/dashboard/summary
+   * Returns aggregated metrics, recent activity, active jobs, and token budgets
+   * Requires: Any workspace member (including GUEST)
+   */
+  @Get("summary")
+  @RequirePermission(Permission.WORKSPACE_ANY)
+  async getSummary(@Workspace() workspaceId: string | undefined): Promise<DashboardSummaryDto> {
+    if (!workspaceId) {
+      throw new BadRequestException("Workspace context required");
+    }
+    return this.dashboardService.getSummary(workspaceId);
+  }
+}

apps/api/src/dashboard/dashboard.module.ts

@@ -0,0 +1,13 @@
+import { Module } from "@nestjs/common";
+import { DashboardController } from "./dashboard.controller";
+import { DashboardService } from "./dashboard.service";
+import { PrismaModule } from "../prisma/prisma.module";
+import { AuthModule } from "../auth/auth.module";
+
+@Module({
+  imports: [PrismaModule, AuthModule],
+  controllers: [DashboardController],
+  providers: [DashboardService],
+  exports: [DashboardService],
+})
+export class DashboardModule {}

apps/api/src/dashboard/dashboard.service.ts

@@ -0,0 +1,187 @@
+import { Injectable } from "@nestjs/common";
+import { AgentStatus, ProjectStatus, RunnerJobStatus, TaskStatus } from "@prisma/client";
+import { PrismaService } from "../prisma/prisma.service";
+import type {
+  DashboardSummaryDto,
+  ActiveJobDto,
+  RecentActivityDto,
+  TokenBudgetEntryDto,
+} from "./dto";
+
+/**
+ * Service for aggregating dashboard summary data.
+ * Executes all queries in parallel to minimize latency.
+ */
+@Injectable()
+export class DashboardService {
+  constructor(private readonly prisma: PrismaService) {}
+
+  /**
+   * Get aggregated dashboard summary for a workspace
+   */
+  async getSummary(workspaceId: string): Promise<DashboardSummaryDto> {
+    const now = new Date();
+    const oneDayAgo = new Date(now.getTime() - 24 * 60 * 60 * 1000);
+
+    // Execute all queries in parallel
+    const [
+      activeAgents,
+      tasksCompleted,
+      totalTasks,
+      tasksInProgress,
+      activeProjects,
+      failedJobsLast24h,
+      totalJobsLast24h,
+      recentActivityRows,
+      activeJobRows,
+      tokenBudgetRows,
+    ] = await Promise.all([
+      // Active agents: IDLE, WORKING, WAITING
+      this.prisma.agent.count({
+        where: {
+          workspaceId,
+          status: { in: [AgentStatus.IDLE, AgentStatus.WORKING, AgentStatus.WAITING] },
+        },
+      }),
+
+      // Tasks completed
+      this.prisma.task.count({
+        where: {
+          workspaceId,
+          status: TaskStatus.COMPLETED,
+        },
+      }),
+
+      // Total tasks
+      this.prisma.task.count({
+        where: { workspaceId },
+      }),
+
+      // Tasks in progress
+      this.prisma.task.count({
+        where: {
+          workspaceId,
+          status: TaskStatus.IN_PROGRESS,
+        },
+      }),
+
+      // Active projects
+      this.prisma.project.count({
+        where: {
+          workspaceId,
+          status: ProjectStatus.ACTIVE,
+        },
+      }),
+
+      // Failed jobs in last 24h (for error rate)
+      this.prisma.runnerJob.count({
+        where: {
+          workspaceId,
+          status: RunnerJobStatus.FAILED,
+          createdAt: { gte: oneDayAgo },
+        },
+      }),
+
+      // Total jobs in last 24h (for error rate)
+      this.prisma.runnerJob.count({
+        where: {
+          workspaceId,
+          createdAt: { gte: oneDayAgo },
+        },
+      }),
+
+      // Recent activity: last 10 entries
+      this.prisma.activityLog.findMany({
+        where: { workspaceId },
+        orderBy: { createdAt: "desc" },
+        take: 10,
+      }),
+
+      // Active jobs: PENDING, QUEUED, RUNNING with steps
+      this.prisma.runnerJob.findMany({
+        where: {
+          workspaceId,
+          status: {
+            in: [RunnerJobStatus.PENDING, RunnerJobStatus.QUEUED, RunnerJobStatus.RUNNING],
+          },
+        },
+        include: {
+          steps: {
+            select: {
+              id: true,
+              name: true,
+              status: true,
+              phase: true,
+            },
+            orderBy: { ordinal: "asc" },
+          },
+        },
+        orderBy: { createdAt: "desc" },
+      }),
+
+      // Token budgets for workspace (active, not yet completed)
+      this.prisma.tokenBudget.findMany({
+        where: {
+          workspaceId,
+          completedAt: null,
+        },
+        select: {
+          agentId: true,
+          totalTokensUsed: true,
+          allocatedTokens: true,
+        },
+      }),
+    ]);
+
+    // Compute error rate
+    const errorRate = totalJobsLast24h > 0 ? (failedJobsLast24h / totalJobsLast24h) * 100 : 0;
+
+    // Map recent activity
+    const recentActivity: RecentActivityDto[] = recentActivityRows.map((row) => ({
+      id: row.id,
+      action: row.action,
+      entityType: row.entityType,
+      entityId: row.entityId,
+      details: row.details as Record<string, unknown> | null,
+      userId: row.userId,
+      createdAt: row.createdAt.toISOString(),
+    }));
+
+    // Map active jobs (RunnerJob lacks updatedAt; use startedAt or createdAt as proxy)
+    const activeJobs: ActiveJobDto[] = activeJobRows.map((row) => ({
+      id: row.id,
+      type: row.type,
+      status: row.status,
+      progressPercent: row.progressPercent,
+      createdAt: row.createdAt.toISOString(),
+      updatedAt: (row.startedAt ?? row.createdAt).toISOString(),
+      steps: row.steps.map((step) => ({
+        id: step.id,
+        name: step.name,
+        status: step.status,
+        phase: step.phase,
+      })),
+    }));
+
+    // Map token budget entries
+    const tokenBudget: TokenBudgetEntryDto[] = tokenBudgetRows.map((row) => ({
+      model: row.agentId,
+      used: row.totalTokensUsed,
+      limit: row.allocatedTokens,
+    }));
+
+    return {
+      metrics: {
+        activeAgents,
+        tasksCompleted,
+        totalTasks,
+        tasksInProgress,
+        activeProjects,
+        errorRate: Math.round(errorRate * 100) / 100,
+      },
+      recentActivity,
+      activeJobs,
+      tokenBudget,
+    };
+  }
+}

apps/api/src/dashboard/dto/dashboard-summary.dto.ts

@@ -0,0 +1,53 @@
+/**
+ * Dashboard Summary DTO
+ * Defines the response shape for the dashboard summary endpoint.
+ */
+
+export class DashboardMetricsDto {
+  activeAgents!: number;
+  tasksCompleted!: number;
+  totalTasks!: number;
+  tasksInProgress!: number;
+  activeProjects!: number;
+  errorRate!: number;
+}
+
+export class RecentActivityDto {
+  id!: string;
+  action!: string;
+  entityType!: string;
+  entityId!: string;
+  details!: Record<string, unknown> | null;
+  userId!: string;
+  createdAt!: string;
+}
+
+export class ActiveJobStepDto {
+  id!: string;
+  name!: string;
+  status!: string;
+  phase!: string;
+}
+
+export class ActiveJobDto {
+  id!: string;
+  type!: string;
+  status!: string;
+  progressPercent!: number;
+  createdAt!: string;
+  updatedAt!: string;
+  steps!: ActiveJobStepDto[];
+}
+
+export class TokenBudgetEntryDto {
+  model!: string;
+  used!: number;
+  limit!: number;
+}
+
+export class DashboardSummaryDto {
+  metrics!: DashboardMetricsDto;
+  recentActivity!: RecentActivityDto[];
+  activeJobs!: ActiveJobDto[];
+  tokenBudget!: TokenBudgetEntryDto[];
+}

apps/api/src/dashboard/dto/index.ts

@@ -0,0 +1 @@
+export * from "./dashboard-summary.dto";

apps/api/src/federation/command.controller.ts

@@ -12,7 +12,7 @@ import type { AuthenticatedRequest } from "../common/types/user.types";
 import type { CommandMessageDetails, CommandResponse } from "./types/message.types";
 import type { FederationMessageStatus } from "@prisma/client";
 
-@Controller("api/v1/federation")
+@Controller("v1/federation")
 export class CommandController {
   private readonly logger = new Logger(CommandController.name);
 

apps/api/src/federation/event.controller.ts

@@ -23,7 +23,7 @@ import {
   IncomingEventAckDto,
 } from "./dto/event.dto";
 
-@Controller("api/v1/federation")
+@Controller("v1/federation")
 export class EventController {
   private readonly logger = new Logger(EventController.name);
 

apps/api/src/federation/federation-auth.controller.ts

@@ -18,7 +18,7 @@ import {
   ValidateFederatedTokenDto,
 } from "./dto/federated-auth.dto";
 
-@Controller("api/v1/federation/auth")
+@Controller("v1/federation/auth")
 export class FederationAuthController {
   private readonly logger = new Logger(FederationAuthController.name);
 

apps/api/src/federation/federation.controller.ts

@@ -27,7 +27,7 @@ import {
 } from "./dto/connection.dto";
 import { FederationConnectionStatus } from "@prisma/client";
 
-@Controller("api/v1/federation")
+@Controller("v1/federation")
 export class FederationController {
   private readonly logger = new Logger(FederationController.name);
 

apps/api/src/federation/query.controller.ts

@@ -12,7 +12,7 @@ import type { AuthenticatedRequest } from "../common/types/user.types";
 import type { QueryMessageDetails, QueryResponse } from "./types/message.types";
 import type { FederationMessageStatus } from "@prisma/client";
 
-@Controller("api/v1/federation")
+@Controller("v1/federation")
 export class QueryController {
   private readonly logger = new Logger(QueryController.name);
 

apps/api/src/knowledge/dto/entry-query.dto.ts

@@ -1,6 +1,6 @@
-import { IsOptional, IsEnum, IsString, IsInt, Min, Max } from "class-validator";
+import { IsOptional, IsEnum, IsString, IsInt, IsIn, Min, Max } from "class-validator";
 import { Type } from "class-transformer";
-import { EntryStatus } from "@prisma/client";
+import { EntryStatus, Visibility } from "@prisma/client";
 
 /**
  * DTO for querying knowledge entries (list endpoint)
@@ -10,10 +10,28 @@ export class EntryQueryDto {
   @IsEnum(EntryStatus, { message: "status must be a valid EntryStatus" })
   status?: EntryStatus;
 
+  @IsOptional()
+  @IsEnum(Visibility, { message: "visibility must be a valid Visibility" })
+  visibility?: Visibility;
+
   @IsOptional()
   @IsString({ message: "tag must be a string" })
   tag?: string;
 
+  @IsOptional()
+  @IsString({ message: "search must be a string" })
+  search?: string;
+
+  @IsOptional()
+  @IsIn(["updatedAt", "createdAt", "title"], {
+    message: "sortBy must be updatedAt, createdAt, or title",
+  })
+  sortBy?: "updatedAt" | "createdAt" | "title";
+
+  @IsOptional()
+  @IsIn(["asc", "desc"], { message: "sortOrder must be asc or desc" })
+  sortOrder?: "asc" | "desc";
+
   @IsOptional()
   @Type(() => Number)
   @IsInt({ message: "page must be an integer" })

apps/api/src/knowledge/knowledge.service.ts

@@ -48,6 +48,10 @@ export class KnowledgeService {
       where.status = query.status;
     }
 
+    if (query.visibility) {
+      where.visibility = query.visibility;
+    }
+
     if (query.tag) {
       where.tags = {
         some: {
@@ -58,6 +62,20 @@ export class KnowledgeService {
       };
     }
 
+    if (query.search) {
+      where.OR = [
+        { title: { contains: query.search, mode: "insensitive" } },
+        { content: { contains: query.search, mode: "insensitive" } },
+      ];
+    }
+
+    // Build orderBy
+    const sortField = query.sortBy ?? "updatedAt";
+    const sortDirection = query.sortOrder ?? "desc";
+    const orderBy: Prisma.KnowledgeEntryOrderByWithRelationInput = {
+      [sortField]: sortDirection,
+    };
+
     // Get total count
     const total = await this.prisma.knowledgeEntry.count({ where });
 
@@ -71,9 +89,7 @@ export class KnowledgeService {
           },
         },
       },
-      orderBy: {
+      orderBy,
-        updatedAt: "desc",
-      },
       skip,
       take: limit,
     });

apps/api/src/main.ts

@@ -1,5 +1,5 @@
 import { NestFactory } from "@nestjs/core";
-import { ValidationPipe } from "@nestjs/common";
+import { RequestMethod, ValidationPipe } from "@nestjs/common";
 import cookieParser from "cookie-parser";
 import { AppModule } from "./app.module";
 import { getTrustedOrigins } from "./auth/auth.config";
@@ -47,6 +47,16 @@ async function bootstrap() {
 
   app.useGlobalFilters(new GlobalExceptionFilter());
 
+  // Set global API prefix — all routes get /api/* except auth and health
+  // Auth routes are excluded because BetterAuth expects /auth/* paths
+  // Health is excluded because Docker healthchecks hit /health directly
+  app.setGlobalPrefix("api", {
+    exclude: [
+      { path: "health", method: RequestMethod.GET },
+      { path: "auth/(.*)", method: RequestMethod.ALL },
+    ],
+  });
+
   // Configure CORS for cookie-based authentication
   // Origin list is shared with BetterAuth trustedOrigins via getTrustedOrigins()
   const trustedOrigins = getTrustedOrigins();

apps/api/src/personalities/dto/create-personality.dto.ts

@@ -1,59 +1,38 @@
-import {
+import { FormalityLevel } from "@prisma/client";
-  IsString,
+import { IsString, IsEnum, IsOptional, IsBoolean, MinLength, MaxLength } from "class-validator";
-  IsOptional,
-  IsBoolean,
-  IsNumber,
-  IsInt,
-  IsUUID,
-  MinLength,
-  MaxLength,
-  Min,
-  Max,
-} from "class-validator";
 
 /**
- * DTO for creating a new personality/assistant configuration
+ * DTO for creating a new personality
+ * Field names match the frontend API contract from @mosaic/shared Personality type.
  */
 export class CreatePersonalityDto {
-  @IsString()
+  @IsString({ message: "name must be a string" })
-  @MinLength(1)
+  @MinLength(1, { message: "name must not be empty" })
-  @MaxLength(100)
+  @MaxLength(255, { message: "name must not exceed 255 characters" })
-  name!: string; // unique identifier slug
+  name!: string;
-
-  @IsString()
-  @MinLength(1)
-  @MaxLength(200)
-  displayName!: string; // human-readable name
 
   @IsOptional()
-  @IsString()
+  @IsString({ message: "description must be a string" })
-  @MaxLength(1000)
+  @MaxLength(2000, { message: "description must not exceed 2000 characters" })
   description?: string;
 
-  @IsString()
+  @IsString({ message: "tone must be a string" })
-  @MinLength(10)
+  @MinLength(1, { message: "tone must not be empty" })
-  systemPrompt!: string;
+  @MaxLength(100, { message: "tone must not exceed 100 characters" })
+  tone!: string;
+
+  @IsEnum(FormalityLevel, { message: "formalityLevel must be a valid FormalityLevel" })
+  formalityLevel!: FormalityLevel;
+
+  @IsString({ message: "systemPromptTemplate must be a string" })
+  @MinLength(1, { message: "systemPromptTemplate must not be empty" })
+  systemPromptTemplate!: string;
 
   @IsOptional()
-  @IsNumber()
+  @IsBoolean({ message: "isDefault must be a boolean" })
-  @Min(0)
-  @Max(2)
-  temperature?: number; // null = use provider default
-
-  @IsOptional()
-  @IsInt()
-  @Min(1)
-  maxTokens?: number; // null = use provider default
-
-  @IsOptional()
-  @IsUUID("4")
-  llmProviderInstanceId?: string; // FK to LlmProviderInstance
-
-  @IsOptional()
-  @IsBoolean()
   isDefault?: boolean;
 
   @IsOptional()
-  @IsBoolean()
+  @IsBoolean({ message: "isActive must be a boolean" })
-  isEnabled?: boolean;
+  isActive?: boolean;
 }

apps/api/src/personalities/dto/index.ts

@@ -1,2 +1,3 @@
 export * from "./create-personality.dto";
 export * from "./update-personality.dto";
+export * from "./personality-query.dto";

apps/api/src/personalities/dto/personality-query.dto.ts

@@ -0,0 +1,12 @@
+import { IsBoolean, IsOptional } from "class-validator";
+import { Transform } from "class-transformer";
+
+/**
+ * DTO for querying/filtering personalities
+ */
+export class PersonalityQueryDto {
+  @IsOptional()
+  @IsBoolean({ message: "isActive must be a boolean" })
+  @Transform(({ value }) => value === "true" || value === true)
+  isActive?: boolean;
+}

apps/api/src/personalities/dto/update-personality.dto.ts

@@ -1,62 +1,42 @@
-import {
+import { FormalityLevel } from "@prisma/client";
-  IsString,
+import { IsString, IsEnum, IsOptional, IsBoolean, MinLength, MaxLength } from "class-validator";
-  IsOptional,
-  IsBoolean,
-  IsNumber,
-  IsInt,
-  IsUUID,
-  MinLength,
-  MaxLength,
-  Min,
-  Max,
-} from "class-validator";
 
 /**
- * DTO for updating an existing personality/assistant configuration
+ * DTO for updating an existing personality
+ * All fields are optional; only provided fields are updated.
  */
 export class UpdatePersonalityDto {
   @IsOptional()
-  @IsString()
+  @IsString({ message: "name must be a string" })
-  @MinLength(1)
+  @MinLength(1, { message: "name must not be empty" })
-  @MaxLength(100)
+  @MaxLength(255, { message: "name must not exceed 255 characters" })
-  name?: string; // unique identifier slug
+  name?: string;
 
   @IsOptional()
-  @IsString()
+  @IsString({ message: "description must be a string" })
-  @MinLength(1)
+  @MaxLength(2000, { message: "description must not exceed 2000 characters" })
-  @MaxLength(200)
-  displayName?: string; // human-readable name
-
-  @IsOptional()
-  @IsString()
-  @MaxLength(1000)
   description?: string;
 
   @IsOptional()
-  @IsString()
+  @IsString({ message: "tone must be a string" })
-  @MinLength(10)
+  @MinLength(1, { message: "tone must not be empty" })
-  systemPrompt?: string;
+  @MaxLength(100, { message: "tone must not exceed 100 characters" })
+  tone?: string;
 
   @IsOptional()
-  @IsNumber()
+  @IsEnum(FormalityLevel, { message: "formalityLevel must be a valid FormalityLevel" })
-  @Min(0)
+  formalityLevel?: FormalityLevel;
-  @Max(2)
-  temperature?: number; // null = use provider default
 
   @IsOptional()
-  @IsInt()
+  @IsString({ message: "systemPromptTemplate must be a string" })
-  @Min(1)
+  @MinLength(1, { message: "systemPromptTemplate must not be empty" })
-  maxTokens?: number; // null = use provider default
+  systemPromptTemplate?: string;
 
   @IsOptional()
-  @IsUUID("4")
+  @IsBoolean({ message: "isDefault must be a boolean" })
-  llmProviderInstanceId?: string; // FK to LlmProviderInstance
-
-  @IsOptional()
-  @IsBoolean()
   isDefault?: boolean;
 
   @IsOptional()
-  @IsBoolean()
+  @IsBoolean({ message: "isActive must be a boolean" })
-  isEnabled?: boolean;
+  isActive?: boolean;
 }

apps/api/src/personalities/entities/personality.entity.ts

@@ -1,20 +1,24 @@
-import type { Personality as PrismaPersonality } from "@prisma/client";
+import type { FormalityLevel } from "@prisma/client";
 
 /**
- * Personality entity representing an assistant configuration
+ * Personality response entity
+ * Maps Prisma Personality fields to the frontend API contract.
+ *
+ * Field mapping (Prisma -> API):
+ *   systemPrompt   -> systemPromptTemplate
+ *   isEnabled      -> isActive
+ *   (tone, formalityLevel are identical in both)
  */
-export class Personality implements PrismaPersonality {
+export interface PersonalityResponse {
-  id!: string;
+  id: string;
-  workspaceId!: string;
+  workspaceId: string;
-  name!: string; // unique identifier slug
+  name: string;
-  displayName!: string; // human-readable name
+  description: string | null;
-  description!: string | null;
+  tone: string;
-  systemPrompt!: string;
+  formalityLevel: FormalityLevel;
-  temperature!: number | null; // null = use provider default
+  systemPromptTemplate: string;
-  maxTokens!: number | null; // null = use provider default
+  isDefault: boolean;
-  llmProviderInstanceId!: string | null; // FK to LlmProviderInstance
+  isActive: boolean;
-  isDefault!: boolean;
+  createdAt: Date;
-  isEnabled!: boolean;
+  updatedAt: Date;
-  createdAt!: Date;
-  updatedAt!: Date;
 }

apps/api/src/personalities/personalities.controller.spec.ts

@@ -2,36 +2,32 @@ import { describe, it, expect, beforeEach, vi } from "vitest";
 import { Test, TestingModule } from "@nestjs/testing";
 import { PersonalitiesController } from "./personalities.controller";
 import { PersonalitiesService } from "./personalities.service";
-import { CreatePersonalityDto, UpdatePersonalityDto } from "./dto";
+import type { CreatePersonalityDto } from "./dto/create-personality.dto";
+import type { UpdatePersonalityDto } from "./dto/update-personality.dto";
 import { AuthGuard } from "../auth/guards/auth.guard";
+import { WorkspaceGuard, PermissionGuard } from "../common/guards";
+import { FormalityLevel } from "@prisma/client";
 
 describe("PersonalitiesController", () => {
   let controller: PersonalitiesController;
   let service: PersonalitiesService;
 
   const mockWorkspaceId = "workspace-123";
-  const mockUserId = "user-123";
   const mockPersonalityId = "personality-123";
 
+  /** API response shape (frontend field names) */
   const mockPersonality = {
     id: mockPersonalityId,
     workspaceId: mockWorkspaceId,
     name: "professional-assistant",
-    displayName: "Professional Assistant",
     description: "A professional communication assistant",
-    systemPrompt: "You are a professional assistant who helps with tasks.",
+    tone: "professional",
-    temperature: 0.7,
+    formalityLevel: FormalityLevel.FORMAL,
-    maxTokens: 2000,
+    systemPromptTemplate: "You are a professional assistant who helps with tasks.",
-    llmProviderInstanceId: "provider-123",
     isDefault: true,
-    isEnabled: true,
+    isActive: true,
-    createdAt: new Date(),
+    createdAt: new Date("2026-01-01"),
-    updatedAt: new Date(),
+    updatedAt: new Date("2026-01-01"),
-  };
-
-  const mockRequest = {
-    user: { id: mockUserId },
-    workspaceId: mockWorkspaceId,
   };
 
   const mockPersonalitiesService = {
@@ -57,46 +53,43 @@ describe("PersonalitiesController", () => {
     })
       .overrideGuard(AuthGuard)
       .useValue({ canActivate: () => true })
+      .overrideGuard(WorkspaceGuard)
+      .useValue({
+        canActivate: (ctx: {
+          switchToHttp: () => { getRequest: () => { workspaceId: string } };
+        }) => {
+          const req = ctx.switchToHttp().getRequest();
+          req.workspaceId = mockWorkspaceId;
+          return true;
+        },
+      })
+      .overrideGuard(PermissionGuard)
+      .useValue({ canActivate: () => true })
       .compile();
 
     controller = module.get<PersonalitiesController>(PersonalitiesController);
     service = module.get<PersonalitiesService>(PersonalitiesService);
 
-    // Reset mocks
     vi.clearAllMocks();
   });
 
   describe("findAll", () => {
-    it("should return all personalities", async () => {
+    it("should return success response with personalities list", async () => {
-      const mockPersonalities = [mockPersonality];
+      const mockList = [mockPersonality];
-      mockPersonalitiesService.findAll.mockResolvedValue(mockPersonalities);
+      mockPersonalitiesService.findAll.mockResolvedValue(mockList);
 
-      const result = await controller.findAll(mockRequest);
+      const result = await controller.findAll(mockWorkspaceId, {});
 
-      expect(result).toEqual(mockPersonalities);
+      expect(result).toEqual({ success: true, data: mockList });
-      expect(service.findAll).toHaveBeenCalledWith(mockWorkspaceId);
+      expect(service.findAll).toHaveBeenCalledWith(mockWorkspaceId, {});
     });
-  });
 
-  describe("findOne", () => {
+    it("should pass isActive query filter to service", async () => {
-    it("should return a personality by id", async () => {
+      mockPersonalitiesService.findAll.mockResolvedValue([mockPersonality]);
-      mockPersonalitiesService.findOne.mockResolvedValue(mockPersonality);
 
-      const result = await controller.findOne(mockRequest, mockPersonalityId);
+      await controller.findAll(mockWorkspaceId, { isActive: true });
 
-      expect(result).toEqual(mockPersonality);
+      expect(service.findAll).toHaveBeenCalledWith(mockWorkspaceId, { isActive: true });
-      expect(service.findOne).toHaveBeenCalledWith(mockWorkspaceId, mockPersonalityId);
-    });
-  });
-
-  describe("findByName", () => {
-    it("should return a personality by name", async () => {
-      mockPersonalitiesService.findByName.mockResolvedValue(mockPersonality);
-
-      const result = await controller.findByName(mockRequest, "professional-assistant");
-
-      expect(result).toEqual(mockPersonality);
-      expect(service.findByName).toHaveBeenCalledWith(mockWorkspaceId, "professional-assistant");
     });
   });
 
@@ -104,32 +97,40 @@ describe("PersonalitiesController", () => {
     it("should return the default personality", async () => {
       mockPersonalitiesService.findDefault.mockResolvedValue(mockPersonality);
 
-      const result = await controller.findDefault(mockRequest);
+      const result = await controller.findDefault(mockWorkspaceId);
 
       expect(result).toEqual(mockPersonality);
       expect(service.findDefault).toHaveBeenCalledWith(mockWorkspaceId);
     });
   });
 
+  describe("findOne", () => {
+    it("should return a personality by id", async () => {
+      mockPersonalitiesService.findOne.mockResolvedValue(mockPersonality);
+
+      const result = await controller.findOne(mockWorkspaceId, mockPersonalityId);
+
+      expect(result).toEqual(mockPersonality);
+      expect(service.findOne).toHaveBeenCalledWith(mockWorkspaceId, mockPersonalityId);
+    });
+  });
+
   describe("create", () => {
     it("should create a new personality", async () => {
       const createDto: CreatePersonalityDto = {
         name: "casual-helper",
-        displayName: "Casual Helper",
         description: "A casual helper",
-        systemPrompt: "You are a casual assistant.",
+        tone: "casual",
-        temperature: 0.8,
+        formalityLevel: FormalityLevel.CASUAL,
-        maxTokens: 1500,
+        systemPromptTemplate: "You are a casual assistant.",
       };
 
-      mockPersonalitiesService.create.mockResolvedValue({
+      const created = { ...mockPersonality, ...createDto, isActive: true, isDefault: false };
-        ...mockPersonality,
+      mockPersonalitiesService.create.mockResolvedValue(created);
-        ...createDto,
-      });
 
-      const result = await controller.create(mockRequest, createDto);
+      const result = await controller.create(mockWorkspaceId, createDto);
 
-      expect(result).toMatchObject(createDto);
+      expect(result).toMatchObject({ name: createDto.name, tone: createDto.tone });
       expect(service.create).toHaveBeenCalledWith(mockWorkspaceId, createDto);
     });
   });
@@ -138,15 +139,13 @@ describe("PersonalitiesController", () => {
     it("should update a personality", async () => {
       const updateDto: UpdatePersonalityDto = {
         description: "Updated description",
-        temperature: 0.9,
+        tone: "enthusiastic",
       };
 
-      mockPersonalitiesService.update.mockResolvedValue({
+      const updated = { ...mockPersonality, ...updateDto };
-        ...mockPersonality,
+      mockPersonalitiesService.update.mockResolvedValue(updated);
-        ...updateDto,
-      });
 
-      const result = await controller.update(mockRequest, mockPersonalityId, updateDto);
+      const result = await controller.update(mockWorkspaceId, mockPersonalityId, updateDto);
 
       expect(result).toMatchObject(updateDto);
       expect(service.update).toHaveBeenCalledWith(mockWorkspaceId, mockPersonalityId, updateDto);
@@ -157,7 +156,7 @@ describe("PersonalitiesController", () => {
     it("should delete a personality", async () => {
       mockPersonalitiesService.delete.mockResolvedValue(undefined);
 
-      await controller.delete(mockRequest, mockPersonalityId);
+      await controller.delete(mockWorkspaceId, mockPersonalityId);
 
       expect(service.delete).toHaveBeenCalledWith(mockWorkspaceId, mockPersonalityId);
     });
@@ -165,12 +164,10 @@ describe("PersonalitiesController", () => {
 
   describe("setDefault", () => {
     it("should set a personality as default", async () => {
-      mockPersonalitiesService.setDefault.mockResolvedValue({
+      const updated = { ...mockPersonality, isDefault: true };
-        ...mockPersonality,
+      mockPersonalitiesService.setDefault.mockResolvedValue(updated);
-        isDefault: true,
-      });
 
-      const result = await controller.setDefault(mockRequest, mockPersonalityId);
+      const result = await controller.setDefault(mockWorkspaceId, mockPersonalityId);
 
       expect(result).toMatchObject({ isDefault: true });
       expect(service.setDefault).toHaveBeenCalledWith(mockWorkspaceId, mockPersonalityId);

apps/api/src/personalities/personalities.controller.ts

@@ -6,105 +6,122 @@ import {
   Delete,
   Body,
   Param,
+  Query,
   UseGuards,
-  Req,
   HttpCode,
   HttpStatus,
 } from "@nestjs/common";
 import { AuthGuard } from "../auth/guards/auth.guard";
+import { WorkspaceGuard, PermissionGuard } from "../common/guards";
+import { Workspace, Permission, RequirePermission } from "../common/decorators";
 import { PersonalitiesService } from "./personalities.service";
-import { CreatePersonalityDto, UpdatePersonalityDto } from "./dto";
+import { CreatePersonalityDto } from "./dto/create-personality.dto";
-import { Personality } from "./entities/personality.entity";
+import { UpdatePersonalityDto } from "./dto/update-personality.dto";
-
+import { PersonalityQueryDto } from "./dto/personality-query.dto";
-interface AuthenticatedRequest {
+import type { PersonalityResponse } from "./entities/personality.entity";
-  user: { id: string };
-  workspaceId: string;
-}
 
 /**
- * Controller for managing personality/assistant configurations
+ * Controller for personality CRUD endpoints.
+ * Route: /api/personalities
+ *
+ * Guards applied in order:
+ * 1. AuthGuard - verifies the user is authenticated
+ * 2. WorkspaceGuard - validates workspace access
+ * 3. PermissionGuard - checks role-based permissions
  */
-@Controller("personality")
+@Controller("personalities")
-@UseGuards(AuthGuard)
+@UseGuards(AuthGuard, WorkspaceGuard, PermissionGuard)
 export class PersonalitiesController {
   constructor(private readonly personalitiesService: PersonalitiesService) {}
 
   /**
-   * List all personalities for the workspace
+   * GET /api/personalities
+   * List all personalities for the workspace.
+   * Supports ?isActive=true|false filter.
    */
   @Get()
-  async findAll(@Req() req: AuthenticatedRequest): Promise<Personality[]> {
+  @RequirePermission(Permission.WORKSPACE_ANY)
-    return this.personalitiesService.findAll(req.workspaceId);
+  async findAll(
+    @Workspace() workspaceId: string,
+    @Query() query: PersonalityQueryDto
+  ): Promise<{ success: true; data: PersonalityResponse[] }> {
+    const data = await this.personalitiesService.findAll(workspaceId, query);
+    return { success: true, data };
   }
 
   /**
-   * Get the default personality for the workspace
+   * GET /api/personalities/default
+   * Get the default personality for the workspace.
+   * Must be declared before :id to avoid route conflicts.
    */
   @Get("default")
-  async findDefault(@Req() req: AuthenticatedRequest): Promise<Personality> {
+  @RequirePermission(Permission.WORKSPACE_ANY)
-    return this.personalitiesService.findDefault(req.workspaceId);
+  async findDefault(@Workspace() workspaceId: string): Promise<PersonalityResponse> {
+    return this.personalitiesService.findDefault(workspaceId);
   }
 
   /**
-   * Get a personality by its unique name
+   * GET /api/personalities/:id
-   */
+   * Get a single personality by ID.
-  @Get("by-name/:name")
-  async findByName(
-    @Req() req: AuthenticatedRequest,
-    @Param("name") name: string
-  ): Promise<Personality> {
-    return this.personalitiesService.findByName(req.workspaceId, name);
-  }
-
-  /**
-   * Get a personality by ID
    */
   @Get(":id")
-  async findOne(@Req() req: AuthenticatedRequest, @Param("id") id: string): Promise<Personality> {
+  @RequirePermission(Permission.WORKSPACE_ANY)
-    return this.personalitiesService.findOne(req.workspaceId, id);
+  async findOne(
+    @Workspace() workspaceId: string,
+    @Param("id") id: string
+  ): Promise<PersonalityResponse> {
+    return this.personalitiesService.findOne(workspaceId, id);
   }
 
   /**
-   * Create a new personality
+   * POST /api/personalities
+   * Create a new personality.
    */
   @Post()
   @HttpCode(HttpStatus.CREATED)
+  @RequirePermission(Permission.WORKSPACE_MEMBER)
   async create(
-    @Req() req: AuthenticatedRequest,
+    @Workspace() workspaceId: string,
     @Body() dto: CreatePersonalityDto
-  ): Promise<Personality> {
+  ): Promise<PersonalityResponse> {
-    return this.personalitiesService.create(req.workspaceId, dto);
+    return this.personalitiesService.create(workspaceId, dto);
   }
 
   /**
-   * Update a personality
+   * PATCH /api/personalities/:id
+   * Update an existing personality.
    */
   @Patch(":id")
+  @RequirePermission(Permission.WORKSPACE_MEMBER)
   async update(
-    @Req() req: AuthenticatedRequest,
+    @Workspace() workspaceId: string,
     @Param("id") id: string,
     @Body() dto: UpdatePersonalityDto
-  ): Promise<Personality> {
+  ): Promise<PersonalityResponse> {
-    return this.personalitiesService.update(req.workspaceId, id, dto);
+    return this.personalitiesService.update(workspaceId, id, dto);
   }
 
   /**
-   * Delete a personality
+   * DELETE /api/personalities/:id
+   * Delete a personality.
    */
   @Delete(":id")
   @HttpCode(HttpStatus.NO_CONTENT)
-  async delete(@Req() req: AuthenticatedRequest, @Param("id") id: string): Promise<void> {
+  @RequirePermission(Permission.WORKSPACE_MEMBER)
-    return this.personalitiesService.delete(req.workspaceId, id);
+  async delete(@Workspace() workspaceId: string, @Param("id") id: string): Promise<void> {
+    return this.personalitiesService.delete(workspaceId, id);
   }
 
   /**
-   * Set a personality as the default
+   * POST /api/personalities/:id/set-default
+   * Convenience endpoint to set a personality as the default.
    */
   @Post(":id/set-default")
+  @RequirePermission(Permission.WORKSPACE_MEMBER)
   async setDefault(
-    @Req() req: AuthenticatedRequest,
+    @Workspace() workspaceId: string,
     @Param("id") id: string
-  ): Promise<Personality> {
+  ): Promise<PersonalityResponse> {
-    return this.personalitiesService.setDefault(req.workspaceId, id);
+    return this.personalitiesService.setDefault(workspaceId, id);
   }
 }

apps/api/src/personalities/personalities.service.spec.ts

@@ -2,8 +2,10 @@ import { describe, it, expect, beforeEach, vi } from "vitest";
 import { Test, TestingModule } from "@nestjs/testing";
 import { PersonalitiesService } from "./personalities.service";
 import { PrismaService } from "../prisma/prisma.service";
-import { CreatePersonalityDto, UpdatePersonalityDto } from "./dto";
+import type { CreatePersonalityDto } from "./dto/create-personality.dto";
+import type { UpdatePersonalityDto } from "./dto/update-personality.dto";
 import { NotFoundException, ConflictException } from "@nestjs/common";
+import { FormalityLevel } from "@prisma/client";
 
 describe("PersonalitiesService", () => {
   let service: PersonalitiesService;
@@ -11,22 +13,39 @@ describe("PersonalitiesService", () => {
 
   const mockWorkspaceId = "workspace-123";
   const mockPersonalityId = "personality-123";
-  const mockProviderId = "provider-123";
 
-  const mockPersonality = {
+  /** Raw Prisma record shape (uses Prisma field names) */
+  const mockPrismaRecord = {
     id: mockPersonalityId,
     workspaceId: mockWorkspaceId,
     name: "professional-assistant",
     displayName: "Professional Assistant",
     description: "A professional communication assistant",
+    tone: "professional",
+    formalityLevel: FormalityLevel.FORMAL,
     systemPrompt: "You are a professional assistant who helps with tasks.",
     temperature: 0.7,
     maxTokens: 2000,
-    llmProviderInstanceId: mockProviderId,
+    llmProviderInstanceId: "provider-123",
     isDefault: true,
     isEnabled: true,
-    createdAt: new Date(),
+    createdAt: new Date("2026-01-01"),
-    updatedAt: new Date(),
+    updatedAt: new Date("2026-01-01"),
+  };
+
+  /** Expected API response shape (uses frontend field names) */
+  const mockResponse = {
+    id: mockPersonalityId,
+    workspaceId: mockWorkspaceId,
+    name: "professional-assistant",
+    description: "A professional communication assistant",
+    tone: "professional",
+    formalityLevel: FormalityLevel.FORMAL,
+    systemPromptTemplate: "You are a professional assistant who helps with tasks.",
+    isDefault: true,
+    isActive: true,
+    createdAt: new Date("2026-01-01"),
+    updatedAt: new Date("2026-01-01"),
   };
 
   const mockPrismaService = {
@@ -37,9 +56,7 @@ describe("PersonalitiesService", () => {
       create: vi.fn(),
       update: vi.fn(),
       delete: vi.fn(),
-      count: vi.fn(),
     },
-    $transaction: vi.fn((callback) => callback(mockPrismaService)),
   };
 
   beforeEach(async () => {
@@ -56,44 +73,54 @@ describe("PersonalitiesService", () => {
     service = module.get<PersonalitiesService>(PersonalitiesService);
     prisma = module.get<PrismaService>(PrismaService);
 
-    // Reset mocks
     vi.clearAllMocks();
   });
 
   describe("create", () => {
     const createDto: CreatePersonalityDto = {
       name: "casual-helper",
-      displayName: "Casual Helper",
       description: "A casual communication helper",
-      systemPrompt: "You are a casual assistant.",
+      tone: "casual",
-      temperature: 0.8,
+      formalityLevel: FormalityLevel.CASUAL,
-      maxTokens: 1500,
+      systemPromptTemplate: "You are a casual assistant.",
-      llmProviderInstanceId: mockProviderId,
+      isDefault: false,
+      isActive: true,
     };
 
-    it("should create a new personality", async () => {
+    const createdRecord = {
+      ...mockPrismaRecord,
+      name: createDto.name,
+      description: createDto.description,
+      tone: createDto.tone,
+      formalityLevel: createDto.formalityLevel,
+      systemPrompt: createDto.systemPromptTemplate,
+      isDefault: false,
+      isEnabled: true,
+      id: "new-personality-id",
+    };
+
+    it("should create a new personality and return API response shape", async () => {
       mockPrismaService.personality.findFirst.mockResolvedValue(null);
-      mockPrismaService.personality.create.mockResolvedValue({
+      mockPrismaService.personality.create.mockResolvedValue(createdRecord);
-        ...mockPersonality,
-        ...createDto,
-        id: "new-personality-id",
-        isDefault: false,
-        isEnabled: true,
-      });
 
       const result = await service.create(mockWorkspaceId, createDto);
 
-      expect(result).toMatchObject(createDto);
+      expect(result.name).toBe(createDto.name);
+      expect(result.tone).toBe(createDto.tone);
+      expect(result.formalityLevel).toBe(createDto.formalityLevel);
+      expect(result.systemPromptTemplate).toBe(createDto.systemPromptTemplate);
+      expect(result.isActive).toBe(true);
+      expect(result.isDefault).toBe(false);
+
       expect(prisma.personality.create).toHaveBeenCalledWith({
         data: {
           workspaceId: mockWorkspaceId,
           name: createDto.name,
-          displayName: createDto.displayName,
+          displayName: createDto.name,
           description: createDto.description ?? null,
-          systemPrompt: createDto.systemPrompt,
+          tone: createDto.tone,
-          temperature: createDto.temperature ?? null,
+          formalityLevel: createDto.formalityLevel,
-          maxTokens: createDto.maxTokens ?? null,
+          systemPrompt: createDto.systemPromptTemplate,
-          llmProviderInstanceId: createDto.llmProviderInstanceId ?? null,
           isDefault: false,
           isEnabled: true,
         },
@@ -101,68 +128,73 @@ describe("PersonalitiesService", () => {
     });
 
     it("should throw ConflictException when name already exists", async () => {
-      mockPrismaService.personality.findFirst.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst.mockResolvedValue(mockPrismaRecord);
 
       await expect(service.create(mockWorkspaceId, createDto)).rejects.toThrow(ConflictException);
     });
 
     it("should unset other defaults when creating a new default personality", async () => {
-      const createDefaultDto = { ...createDto, isDefault: true };
+      const createDefaultDto: CreatePersonalityDto = { ...createDto, isDefault: true };
-      // First call to findFirst checks for name conflict (should be null)
+      const otherDefault = { ...mockPrismaRecord, id: "other-id" };
-      // Second call to findFirst finds the existing default personality
+
       mockPrismaService.personality.findFirst
-        .mockResolvedValueOnce(null) // No name conflict
+        .mockResolvedValueOnce(null) // name conflict check
-        .mockResolvedValueOnce(mockPersonality); // Existing default
+        .mockResolvedValueOnce(otherDefault); // existing default lookup
-      mockPrismaService.personality.update.mockResolvedValue({
+      mockPrismaService.personality.update.mockResolvedValue({ ...otherDefault, isDefault: false });
-        ...mockPersonality,
-        isDefault: false,
-      });
       mockPrismaService.personality.create.mockResolvedValue({
-        ...mockPersonality,
+        ...createdRecord,
-        ...createDefaultDto,
+        isDefault: true,
       });
 
       await service.create(mockWorkspaceId, createDefaultDto);
 
       expect(prisma.personality.update).toHaveBeenCalledWith({
-        where: { id: mockPersonalityId },
+        where: { id: "other-id" },
         data: { isDefault: false },
       });
     });
   });
 
   describe("findAll", () => {
-    it("should return all personalities for a workspace", async () => {
+    it("should return mapped response list for a workspace", async () => {
-      const mockPersonalities = [mockPersonality];
+      mockPrismaService.personality.findMany.mockResolvedValue([mockPrismaRecord]);
-      mockPrismaService.personality.findMany.mockResolvedValue(mockPersonalities);
 
       const result = await service.findAll(mockWorkspaceId);
 
-      expect(result).toEqual(mockPersonalities);
+      expect(result).toHaveLength(1);
+      expect(result[0]).toEqual(mockResponse);
       expect(prisma.personality.findMany).toHaveBeenCalledWith({
         where: { workspaceId: mockWorkspaceId },
         orderBy: [{ isDefault: "desc" }, { name: "asc" }],
       });
     });
+
+    it("should filter by isActive when provided", async () => {
+      mockPrismaService.personality.findMany.mockResolvedValue([mockPrismaRecord]);
+
+      await service.findAll(mockWorkspaceId, { isActive: true });
+
+      expect(prisma.personality.findMany).toHaveBeenCalledWith({
+        where: { workspaceId: mockWorkspaceId, isEnabled: true },
+        orderBy: [{ isDefault: "desc" }, { name: "asc" }],
+      });
+    });
   });
 
   describe("findOne", () => {
-    it("should return a personality by id", async () => {
+    it("should return a mapped personality response by id", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst.mockResolvedValue(mockPrismaRecord);
 
       const result = await service.findOne(mockWorkspaceId, mockPersonalityId);
 
-      expect(result).toEqual(mockPersonality);
+      expect(result).toEqual(mockResponse);
-      expect(prisma.personality.findUnique).toHaveBeenCalledWith({
+      expect(prisma.personality.findFirst).toHaveBeenCalledWith({
-        where: {
+        where: { id: mockPersonalityId, workspaceId: mockWorkspaceId },
-          id: mockPersonalityId,
-          workspaceId: mockWorkspaceId,
-        },
       });
     });
 
     it("should throw NotFoundException when personality not found", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(null);
+      mockPrismaService.personality.findFirst.mockResolvedValue(null);
 
       await expect(service.findOne(mockWorkspaceId, mockPersonalityId)).rejects.toThrow(
         NotFoundException
@@ -171,17 +203,14 @@ describe("PersonalitiesService", () => {
   });
 
   describe("findByName", () => {
-    it("should return a personality by name", async () => {
+    it("should return a mapped personality response by name", async () => {
-      mockPrismaService.personality.findFirst.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst.mockResolvedValue(mockPrismaRecord);
 
       const result = await service.findByName(mockWorkspaceId, "professional-assistant");
 
-      expect(result).toEqual(mockPersonality);
+      expect(result).toEqual(mockResponse);
       expect(prisma.personality.findFirst).toHaveBeenCalledWith({
-        where: {
+        where: { workspaceId: mockWorkspaceId, name: "professional-assistant" },
-          workspaceId: mockWorkspaceId,
-          name: "professional-assistant",
-        },
       });
     });
 
@@ -196,11 +225,11 @@ describe("PersonalitiesService", () => {
 
   describe("findDefault", () => {
     it("should return the default personality", async () => {
-      mockPrismaService.personality.findFirst.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst.mockResolvedValue(mockPrismaRecord);
 
       const result = await service.findDefault(mockWorkspaceId);
 
-      expect(result).toEqual(mockPersonality);
+      expect(result).toEqual(mockResponse);
       expect(prisma.personality.findFirst).toHaveBeenCalledWith({
         where: { workspaceId: mockWorkspaceId, isDefault: true, isEnabled: true },
       });
@@ -216,41 +245,45 @@ describe("PersonalitiesService", () => {
   describe("update", () => {
     const updateDto: UpdatePersonalityDto = {
       description: "Updated description",
-      temperature: 0.9,
+      tone: "formal",
+      isActive: false,
     };
 
-    it("should update a personality", async () => {
+    it("should update a personality and return mapped response", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(mockPersonality);
+      const updatedRecord = {
-      mockPrismaService.personality.findFirst.mockResolvedValue(null);
+        ...mockPrismaRecord,
-      mockPrismaService.personality.update.mockResolvedValue({
+        description: updateDto.description,
-        ...mockPersonality,
+        tone: updateDto.tone,
-        ...updateDto,
+        isEnabled: false,
-      });
+      };
+
+      mockPrismaService.personality.findFirst
+        .mockResolvedValueOnce(mockPrismaRecord) // findOne check
+        .mockResolvedValueOnce(null); // name conflict check (no dto.name here)
+      mockPrismaService.personality.update.mockResolvedValue(updatedRecord);
 
       const result = await service.update(mockWorkspaceId, mockPersonalityId, updateDto);
 
-      expect(result).toMatchObject(updateDto);
+      expect(result.description).toBe(updateDto.description);
-      expect(prisma.personality.update).toHaveBeenCalledWith({
+      expect(result.tone).toBe(updateDto.tone);
-        where: { id: mockPersonalityId },
+      expect(result.isActive).toBe(false);
-        data: updateDto,
-      });
     });
 
     it("should throw NotFoundException when personality not found", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(null);
+      mockPrismaService.personality.findFirst.mockResolvedValue(null);
 
       await expect(service.update(mockWorkspaceId, mockPersonalityId, updateDto)).rejects.toThrow(
         NotFoundException
       );
     });
 
-    it("should throw ConflictException when updating to existing name", async () => {
+    it("should throw ConflictException when updating to an existing name", async () => {
-      const updateNameDto = { name: "existing-name" };
+      const updateNameDto: UpdatePersonalityDto = { name: "existing-name" };
-      mockPrismaService.personality.findUnique.mockResolvedValue(mockPersonality);
+      const conflictRecord = { ...mockPrismaRecord, id: "different-id" };
-      mockPrismaService.personality.findFirst.mockResolvedValue({
+
-        ...mockPersonality,
+      mockPrismaService.personality.findFirst
-        id: "different-id",
+        .mockResolvedValueOnce(mockPrismaRecord) // findOne check
-      });
+        .mockResolvedValueOnce(conflictRecord); // name conflict
 
       await expect(
         service.update(mockWorkspaceId, mockPersonalityId, updateNameDto)
@@ -258,14 +291,16 @@ describe("PersonalitiesService", () => {
     });
 
     it("should unset other defaults when setting as default", async () => {
-      const updateDefaultDto = { isDefault: true };
+      const updateDefaultDto: UpdatePersonalityDto = { isDefault: true };
-      const otherPersonality = { ...mockPersonality, id: "other-id", isDefault: true };
+      const otherPersonality = { ...mockPrismaRecord, id: "other-id", isDefault: true };
+      const updatedRecord = { ...mockPrismaRecord, isDefault: true };
 
-      mockPrismaService.personality.findUnique.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst
-      mockPrismaService.personality.findFirst.mockResolvedValue(otherPersonality); // Existing default from unsetOtherDefaults
+        .mockResolvedValueOnce(mockPrismaRecord) // findOne check
+        .mockResolvedValueOnce(otherPersonality); // unsetOtherDefaults lookup
       mockPrismaService.personality.update
-        .mockResolvedValueOnce({ ...otherPersonality, isDefault: false }) // Unset old default
+        .mockResolvedValueOnce({ ...otherPersonality, isDefault: false })
-        .mockResolvedValueOnce({ ...mockPersonality, isDefault: true }); // Set new default
+        .mockResolvedValueOnce(updatedRecord);
 
       await service.update(mockWorkspaceId, mockPersonalityId, updateDefaultDto);
 
@@ -273,16 +308,12 @@ describe("PersonalitiesService", () => {
         where: { id: "other-id" },
         data: { isDefault: false },
       });
-      expect(prisma.personality.update).toHaveBeenNthCalledWith(2, {
-        where: { id: mockPersonalityId },
-        data: updateDefaultDto,
-      });
     });
   });
 
   describe("delete", () => {
     it("should delete a personality", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst.mockResolvedValue(mockPrismaRecord);
       mockPrismaService.personality.delete.mockResolvedValue(undefined);
 
       await service.delete(mockWorkspaceId, mockPersonalityId);
@@ -293,7 +324,7 @@ describe("PersonalitiesService", () => {
     });
 
     it("should throw NotFoundException when personality not found", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(null);
+      mockPrismaService.personality.findFirst.mockResolvedValue(null);
 
       await expect(service.delete(mockWorkspaceId, mockPersonalityId)).rejects.toThrow(
         NotFoundException
@@ -303,30 +334,27 @@ describe("PersonalitiesService", () => {
 
   describe("setDefault", () => {
     it("should set a personality as default", async () => {
-      const otherPersonality = { ...mockPersonality, id: "other-id", isDefault: true };
+      const otherPersonality = { ...mockPrismaRecord, id: "other-id", isDefault: true };
-      const updatedPersonality = { ...mockPersonality, isDefault: true };
+      const updatedRecord = { ...mockPrismaRecord, isDefault: true };
 
-      mockPrismaService.personality.findUnique.mockResolvedValue(mockPersonality);
+      mockPrismaService.personality.findFirst
-      mockPrismaService.personality.findFirst.mockResolvedValue(otherPersonality);
+        .mockResolvedValueOnce(mockPrismaRecord) // findOne check
+        .mockResolvedValueOnce(otherPersonality); // unsetOtherDefaults lookup
       mockPrismaService.personality.update
-        .mockResolvedValueOnce({ ...otherPersonality, isDefault: false }) // Unset old default
+        .mockResolvedValueOnce({ ...otherPersonality, isDefault: false })
-        .mockResolvedValueOnce(updatedPersonality); // Set new default
+        .mockResolvedValueOnce(updatedRecord);
 
       const result = await service.setDefault(mockWorkspaceId, mockPersonalityId);
 
-      expect(result).toMatchObject({ isDefault: true });
+      expect(result.isDefault).toBe(true);
-      expect(prisma.personality.update).toHaveBeenNthCalledWith(1, {
+      expect(prisma.personality.update).toHaveBeenCalledWith({
-        where: { id: "other-id" },
-        data: { isDefault: false },
-      });
-      expect(prisma.personality.update).toHaveBeenNthCalledWith(2, {
         where: { id: mockPersonalityId },
         data: { isDefault: true },
       });
     });
 
     it("should throw NotFoundException when personality not found", async () => {
-      mockPrismaService.personality.findUnique.mockResolvedValue(null);
+      mockPrismaService.personality.findFirst.mockResolvedValue(null);
 
       await expect(service.setDefault(mockWorkspaceId, mockPersonalityId)).rejects.toThrow(
         NotFoundException

apps/api/src/personalities/personalities.service.ts

@@ -1,10 +1,17 @@
 import { Injectable, NotFoundException, ConflictException, Logger } from "@nestjs/common";
+import type { FormalityLevel, Personality } from "@prisma/client";
 import { PrismaService } from "../prisma/prisma.service";
-import { CreatePersonalityDto, UpdatePersonalityDto } from "./dto";
+import type { CreatePersonalityDto } from "./dto/create-personality.dto";
-import { Personality } from "./entities/personality.entity";
+import type { UpdatePersonalityDto } from "./dto/update-personality.dto";
+import type { PersonalityQueryDto } from "./dto/personality-query.dto";
+import type { PersonalityResponse } from "./entities/personality.entity";
 
 /**
- * Service for managing personality/assistant configurations
+ * Service for managing personality/assistant configurations.
+ *
+ * Field mapping:
+ *   Prisma `systemPrompt`  <-> API/frontend `systemPromptTemplate`
+ *   Prisma `isEnabled`     <-> API/frontend `isActive`
  */
 @Injectable()
 export class PersonalitiesService {
@@ -12,11 +19,30 @@ export class PersonalitiesService {
 
   constructor(private readonly prisma: PrismaService) {}
 
+  /**
+   * Map a Prisma Personality record to the API response shape.
+   */
+  private toResponse(personality: Personality): PersonalityResponse {
+    return {
+      id: personality.id,
+      workspaceId: personality.workspaceId,
+      name: personality.name,
+      description: personality.description,
+      tone: personality.tone,
+      formalityLevel: personality.formalityLevel,
+      systemPromptTemplate: personality.systemPrompt,
+      isDefault: personality.isDefault,
+      isActive: personality.isEnabled,
+      createdAt: personality.createdAt,
+      updatedAt: personality.updatedAt,
+    };
+  }
+
   /**
    * Create a new personality
    */
-  async create(workspaceId: string, dto: CreatePersonalityDto): Promise<Personality> {
+  async create(workspaceId: string, dto: CreatePersonalityDto): Promise<PersonalityResponse> {
-    // Check for duplicate name
+    // Check for duplicate name within workspace
     const existing = await this.prisma.personality.findFirst({
       where: { workspaceId, name: dto.name },
     });
@@ -25,7 +51,7 @@ export class PersonalitiesService {
       throw new ConflictException(`Personality with name "${dto.name}" already exists`);
     }
 
-    // If creating a default personality, unset other defaults
+    // If creating as default, unset other defaults first
     if (dto.isDefault) {
       await this.unsetOtherDefaults(workspaceId);
     }
@@ -34,36 +60,43 @@ export class PersonalitiesService {
       data: {
         workspaceId,
         name: dto.name,
-        displayName: dto.displayName,
+        displayName: dto.name, // use name as displayName since frontend doesn't send displayName separately
         description: dto.description ?? null,
-        systemPrompt: dto.systemPrompt,
+        tone: dto.tone,
-        temperature: dto.temperature ?? null,
+        formalityLevel: dto.formalityLevel,
-        maxTokens: dto.maxTokens ?? null,
+        systemPrompt: dto.systemPromptTemplate,
-        llmProviderInstanceId: dto.llmProviderInstanceId ?? null,
         isDefault: dto.isDefault ?? false,
-        isEnabled: dto.isEnabled ?? true,
+        isEnabled: dto.isActive ?? true,
       },
     });
 
     this.logger.log(`Created personality ${personality.id} for workspace ${workspaceId}`);
-    return personality;
+    return this.toResponse(personality);
   }
 
   /**
-   * Find all personalities for a workspace
+   * Find all personalities for a workspace with optional active filter
    */
-  async findAll(workspaceId: string): Promise<Personality[]> {
+  async findAll(workspaceId: string, query?: PersonalityQueryDto): Promise<PersonalityResponse[]> {
-    return this.prisma.personality.findMany({
+    const where: { workspaceId: string; isEnabled?: boolean } = { workspaceId };
-      where: { workspaceId },
+
+    if (query?.isActive !== undefined) {
+      where.isEnabled = query.isActive;
+    }
+
+    const personalities = await this.prisma.personality.findMany({
+      where,
       orderBy: [{ isDefault: "desc" }, { name: "asc" }],
     });
+
+    return personalities.map((p) => this.toResponse(p));
   }
 
   /**
    * Find a specific personality by ID
    */
-  async findOne(workspaceId: string, id: string): Promise<Personality> {
+  async findOne(workspaceId: string, id: string): Promise<PersonalityResponse> {
-    const personality = await this.prisma.personality.findUnique({
+    const personality = await this.prisma.personality.findFirst({
       where: { id, workspaceId },
     });
 
@@ -71,13 +104,13 @@ export class PersonalitiesService {
       throw new NotFoundException(`Personality with ID ${id} not found`);
     }
 
-    return personality;
+    return this.toResponse(personality);
   }
 
   /**
-   * Find a personality by name
+   * Find a personality by name slug
    */
-  async findByName(workspaceId: string, name: string): Promise<Personality> {
+  async findByName(workspaceId: string, name: string): Promise<PersonalityResponse> {
     const personality = await this.prisma.personality.findFirst({
       where: { workspaceId, name },
     });
@@ -86,13 +119,13 @@ export class PersonalitiesService {
       throw new NotFoundException(`Personality with name "${name}" not found`);
     }
 
-    return personality;
+    return this.toResponse(personality);
   }
 
   /**
-   * Find the default personality for a workspace
+   * Find the default (and enabled) personality for a workspace
    */
-  async findDefault(workspaceId: string): Promise<Personality> {
+  async findDefault(workspaceId: string): Promise<PersonalityResponse> {
     const personality = await this.prisma.personality.findFirst({
       where: { workspaceId, isDefault: true, isEnabled: true },
     });
@@ -101,14 +134,18 @@ export class PersonalitiesService {
       throw new NotFoundException(`No default personality found for workspace ${workspaceId}`);
     }
 
-    return personality;
+    return this.toResponse(personality);
   }
 
   /**
    * Update an existing personality
    */
-  async update(workspaceId: string, id: string, dto: UpdatePersonalityDto): Promise<Personality> {
+  async update(
-    // Check existence
+    workspaceId: string,
+    id: string,
+    dto: UpdatePersonalityDto
+  ): Promise<PersonalityResponse> {
+    // Verify existence
     await this.findOne(workspaceId, id);
 
     // Check for duplicate name if updating name
@@ -127,20 +164,43 @@ export class PersonalitiesService {
       await this.unsetOtherDefaults(workspaceId, id);
     }
 
+    // Build update data with field mapping
+    const updateData: {
+      name?: string;
+      displayName?: string;
+      description?: string;
+      tone?: string;
+      formalityLevel?: FormalityLevel;
+      systemPrompt?: string;
+      isDefault?: boolean;
+      isEnabled?: boolean;
+    } = {};
+
+    if (dto.name !== undefined) {
+      updateData.name = dto.name;
+      updateData.displayName = dto.name;
+    }
+    if (dto.description !== undefined) updateData.description = dto.description;
+    if (dto.tone !== undefined) updateData.tone = dto.tone;
+    if (dto.formalityLevel !== undefined) updateData.formalityLevel = dto.formalityLevel;
+    if (dto.systemPromptTemplate !== undefined) updateData.systemPrompt = dto.systemPromptTemplate;
+    if (dto.isDefault !== undefined) updateData.isDefault = dto.isDefault;
+    if (dto.isActive !== undefined) updateData.isEnabled = dto.isActive;
+
     const personality = await this.prisma.personality.update({
       where: { id },
-      data: dto,
+      data: updateData,
     });
 
     this.logger.log(`Updated personality ${id} for workspace ${workspaceId}`);
-    return personality;
+    return this.toResponse(personality);
   }
 
   /**
    * Delete a personality
    */
   async delete(workspaceId: string, id: string): Promise<void> {
-    // Check existence
+    // Verify existence
     await this.findOne(workspaceId, id);
 
     await this.prisma.personality.delete({
@@ -151,23 +211,22 @@ export class PersonalitiesService {
   }
 
   /**
-   * Set a personality as the default
+   * Set a personality as the default (convenience endpoint)
    */
-  async setDefault(workspaceId: string, id: string): Promise<Personality> {
+  async setDefault(workspaceId: string, id: string): Promise<PersonalityResponse> {
-    // Check existence
+    // Verify existence
     await this.findOne(workspaceId, id);
 
     // Unset other defaults
     await this.unsetOtherDefaults(workspaceId, id);
 
-    // Set this one as default
     const personality = await this.prisma.personality.update({
       where: { id },
       data: { isDefault: true },
     });
 
     this.logger.log(`Set personality ${id} as default for workspace ${workspaceId}`);
-    return personality;
+    return this.toResponse(personality);
   }
 
   /**
@@ -178,7 +237,7 @@ export class PersonalitiesService {
       where: {
         workspaceId,
         isDefault: true,
-        ...(excludeId && { id: { not: excludeId } }),
+        ...(excludeId !== undefined && { id: { not: excludeId } }),
       },
     });
 

apps/api/src/prisma/prisma.service.ts

@@ -140,8 +140,11 @@ export class PrismaService extends PrismaClient implements OnModuleInit, OnModul
     workspaceId: string,
     client: PrismaClient = this
   ): Promise<void> {
-    await client.$executeRaw`SET LOCAL app.current_user_id = ${userId}`;
+    // Use set_config() instead of SET LOCAL so values are safely parameterized.
-    await client.$executeRaw`SET LOCAL app.current_workspace_id = ${workspaceId}`;
+    // SET LOCAL with Prisma's tagged template produces invalid SQL (bind parameter $1
+    // is not supported in SET statements by PostgreSQL).
+    await client.$executeRaw`SELECT set_config('app.current_user_id', ${userId}, true)`;
+    await client.$executeRaw`SELECT set_config('app.current_workspace_id', ${workspaceId}, true)`;
   }
 
   /**
@@ -151,8 +154,8 @@ export class PrismaService extends PrismaClient implements OnModuleInit, OnModul
    * @param client - Optional Prisma client (uses 'this' if not provided)
    */
   async clearWorkspaceContext(client: PrismaClient = this): Promise<void> {
-    await client.$executeRaw`SET LOCAL app.current_user_id = NULL`;
+    await client.$executeRaw`SELECT set_config('app.current_user_id', '', true)`;
-    await client.$executeRaw`SET LOCAL app.current_workspace_id = NULL`;
+    await client.$executeRaw`SELECT set_config('app.current_workspace_id', '', true)`;
   }
 
   /**

apps/api/src/runner-jobs/runner-jobs.module.ts

@@ -4,6 +4,7 @@ import { RunnerJobsService } from "./runner-jobs.service";
 import { PrismaModule } from "../prisma/prisma.module";
 import { BullMqModule } from "../bullmq/bullmq.module";
 import { AuthModule } from "../auth/auth.module";
+import { WebSocketModule } from "../websocket/websocket.module";
 
 /**
  * Runner Jobs Module
@@ -12,7 +13,7 @@ import { AuthModule } from "../auth/auth.module";
  * for asynchronous job processing.
  */
 @Module({
-  imports: [PrismaModule, BullMqModule, AuthModule],
+  imports: [PrismaModule, BullMqModule, AuthModule, WebSocketModule],
   controllers: [RunnerJobsController],
   providers: [RunnerJobsService],
   exports: [RunnerJobsService],

apps/api/src/runner-jobs/runner-jobs.service.concurrency.spec.ts

@@ -3,6 +3,7 @@ import { Test, TestingModule } from "@nestjs/testing";
 import { RunnerJobsService } from "./runner-jobs.service";
 import { PrismaService } from "../prisma/prisma.service";
 import { BullMqService } from "../bullmq/bullmq.service";
+import { WebSocketGateway } from "../websocket/websocket.gateway";
 import { RunnerJobStatus } from "@prisma/client";
 import { ConflictException, BadRequestException } from "@nestjs/common";
 
@@ -19,6 +20,12 @@ describe("RunnerJobsService - Concurrency", () => {
     getQueue: vi.fn(),
   };
 
+  const mockWebSocketGateway = {
+    emitJobCreated: vi.fn(),
+    emitJobStatusChanged: vi.fn(),
+    emitJobProgress: vi.fn(),
+  };
+
   beforeEach(async () => {
     const module: TestingModule = await Test.createTestingModule({
       providers: [
@@ -37,6 +44,10 @@ describe("RunnerJobsService - Concurrency", () => {
           provide: BullMqService,
           useValue: mockBullMqService,
         },
+        {
+          provide: WebSocketGateway,
+          useValue: mockWebSocketGateway,
+        },
       ],
     }).compile();
 

apps/api/src/runner-jobs/runner-jobs.service.spec.ts

@@ -3,6 +3,7 @@ import { Test, TestingModule } from "@nestjs/testing";
 import { RunnerJobsService } from "./runner-jobs.service";
 import { PrismaService } from "../prisma/prisma.service";
 import { BullMqService } from "../bullmq/bullmq.service";
+import { WebSocketGateway } from "../websocket/websocket.gateway";
 import { RunnerJobStatus } from "@prisma/client";
 import { NotFoundException, BadRequestException } from "@nestjs/common";
 import { CreateJobDto, QueryJobsDto } from "./dto";
@@ -32,6 +33,12 @@ describe("RunnerJobsService", () => {
     getQueue: vi.fn(),
   };
 
+  const mockWebSocketGateway = {
+    emitJobCreated: vi.fn(),
+    emitJobStatusChanged: vi.fn(),
+    emitJobProgress: vi.fn(),
+  };
+
   beforeEach(async () => {
     const module: TestingModule = await Test.createTestingModule({
       providers: [
@@ -44,6 +51,10 @@ describe("RunnerJobsService", () => {
           provide: BullMqService,
           useValue: mockBullMqService,
         },
+        {
+          provide: WebSocketGateway,
+          useValue: mockWebSocketGateway,
+        },
       ],
     }).compile();
 

apps/api/src/runner-jobs/runner-jobs.service.ts

@@ -3,6 +3,7 @@ import { Prisma, RunnerJobStatus } from "@prisma/client";
 import { Response } from "express";
 import { PrismaService } from "../prisma/prisma.service";
 import { BullMqService } from "../bullmq/bullmq.service";
+import { WebSocketGateway } from "../websocket/websocket.gateway";
 import { QUEUE_NAMES } from "../bullmq/queues";
 import { ConcurrentUpdateException } from "../common/exceptions/concurrent-update.exception";
 import type { CreateJobDto, QueryJobsDto } from "./dto";
@@ -14,7 +15,8 @@ import type { CreateJobDto, QueryJobsDto } from "./dto";
 export class RunnerJobsService {
   constructor(
     private readonly prisma: PrismaService,
-    private readonly bullMq: BullMqService
+    private readonly bullMq: BullMqService,
+    private readonly wsGateway: WebSocketGateway
   ) {}
 
   /**
@@ -56,6 +58,8 @@ export class RunnerJobsService {
       { priority }
     );
 
+    this.wsGateway.emitJobCreated(workspaceId, job);
+
     return job;
   }
 
@@ -194,6 +198,13 @@ export class RunnerJobsService {
         throw new NotFoundException(`RunnerJob with ID ${id} not found after cancel`);
       }
 
+      this.wsGateway.emitJobStatusChanged(workspaceId, id, {
+        id,
+        workspaceId,
+        status: job.status,
+        previousStatus: existingJob.status,
+      });
+
       return job;
     });
   }
@@ -248,6 +259,8 @@ export class RunnerJobsService {
       { priority: existingJob.priority }
     );
 
+    this.wsGateway.emitJobCreated(workspaceId, newJob);
+
     return newJob;
   }
 
@@ -530,6 +543,13 @@ export class RunnerJobsService {
         throw new NotFoundException(`RunnerJob with ID ${id} not found after update`);
       }
 
+      this.wsGateway.emitJobStatusChanged(workspaceId, id, {
+        id,
+        workspaceId,
+        status: updatedJob.status,
+        previousStatus: existingJob.status,
+      });
+
       return updatedJob;
     });
   }
@@ -606,6 +626,12 @@ export class RunnerJobsService {
         throw new NotFoundException(`RunnerJob with ID ${id} not found after update`);
       }
 
+      this.wsGateway.emitJobProgress(workspaceId, id, {
+        id,
+        workspaceId,
+        progressPercent: updatedJob.progressPercent,
+      });
+
       return updatedJob;
     });
   }

apps/api/src/terminal/terminal-session.dto.ts

@@ -0,0 +1,53 @@
+/**
+ * Terminal Session DTOs
+ *
+ * Data Transfer Objects for terminal session persistence endpoints.
+ * Validated using class-validator decorators.
+ */
+
+import { IsString, IsOptional, MaxLength, IsEnum, IsUUID } from "class-validator";
+import { TerminalSessionStatus } from "@prisma/client";
+
+/**
+ * DTO for creating a new terminal session record.
+ */
+export class CreateTerminalSessionDto {
+  @IsString()
+  @IsUUID()
+  workspaceId!: string;
+
+  @IsOptional()
+  @IsString()
+  @MaxLength(128)
+  name?: string;
+}
+
+/**
+ * DTO for querying terminal sessions by workspace.
+ */
+export class FindTerminalSessionsByWorkspaceDto {
+  @IsString()
+  @IsUUID()
+  workspaceId!: string;
+}
+
+/**
+ * Response shape for a terminal session.
+ */
+export class TerminalSessionResponseDto {
+  id!: string;
+  workspaceId!: string;
+  name!: string;
+  status!: TerminalSessionStatus;
+  createdAt!: Date;
+  closedAt!: Date | null;
+}
+
+/**
+ * DTO for filtering terminal sessions by status.
+ */
+export class TerminalSessionStatusFilterDto {
+  @IsOptional()
+  @IsEnum(TerminalSessionStatus)
+  status?: TerminalSessionStatus;
+}

apps/api/src/terminal/terminal-session.service.spec.ts

@@ -0,0 +1,229 @@
+/**
+ * TerminalSessionService Tests
+ *
+ * Unit tests for database-backed terminal session CRUD:
+ * create, findByWorkspace, close, and findById.
+ * PrismaService is mocked to isolate the service logic.
+ */
+
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { NotFoundException } from "@nestjs/common";
+import { TerminalSessionStatus } from "@prisma/client";
+import type { TerminalSession } from "@prisma/client";
+import { TerminalSessionService } from "./terminal-session.service";
+
+// ==========================================
+// Helpers
+// ==========================================
+
+function makeSession(overrides: Partial<TerminalSession> = {}): TerminalSession {
+  return {
+    id: "session-uuid-1",
+    workspaceId: "workspace-uuid-1",
+    name: "Terminal",
+    status: TerminalSessionStatus.ACTIVE,
+    createdAt: new Date("2026-02-25T00:00:00Z"),
+    closedAt: null,
+    ...overrides,
+  };
+}
+
+// ==========================================
+// Mock PrismaService
+// ==========================================
+
+function makeMockPrisma() {
+  return {
+    terminalSession: {
+      create: vi.fn(),
+      findMany: vi.fn(),
+      findUnique: vi.fn(),
+      update: vi.fn(),
+    },
+  };
+}
+
+// ==========================================
+// Tests
+// ==========================================
+
+describe("TerminalSessionService", () => {
+  let service: TerminalSessionService;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  let mockPrisma: any;
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    mockPrisma = makeMockPrisma();
+    service = new TerminalSessionService(mockPrisma);
+  });
+
+  // ==========================================
+  // create
+  // ==========================================
+  describe("create", () => {
+    it("should call prisma.terminalSession.create with workspaceId only when no name provided", async () => {
+      const session = makeSession();
+      mockPrisma.terminalSession.create.mockResolvedValueOnce(session);
+
+      const result = await service.create("workspace-uuid-1");
+
+      expect(mockPrisma.terminalSession.create).toHaveBeenCalledWith({
+        data: { workspaceId: "workspace-uuid-1" },
+      });
+      expect(result).toEqual(session);
+    });
+
+    it("should include name in create data when name is provided", async () => {
+      const session = makeSession({ name: "My Terminal" });
+      mockPrisma.terminalSession.create.mockResolvedValueOnce(session);
+
+      const result = await service.create("workspace-uuid-1", "My Terminal");
+
+      expect(mockPrisma.terminalSession.create).toHaveBeenCalledWith({
+        data: { workspaceId: "workspace-uuid-1", name: "My Terminal" },
+      });
+      expect(result).toEqual(session);
+    });
+
+    it("should return the created session", async () => {
+      const session = makeSession();
+      mockPrisma.terminalSession.create.mockResolvedValueOnce(session);
+
+      const result = await service.create("workspace-uuid-1");
+
+      expect(result.id).toBe("session-uuid-1");
+      expect(result.status).toBe(TerminalSessionStatus.ACTIVE);
+    });
+  });
+
+  // ==========================================
+  // findByWorkspace
+  // ==========================================
+  describe("findByWorkspace", () => {
+    it("should query for ACTIVE sessions in the given workspace, ordered by createdAt desc", async () => {
+      const sessions = [makeSession(), makeSession({ id: "session-uuid-2" })];
+      mockPrisma.terminalSession.findMany.mockResolvedValueOnce(sessions);
+
+      const result = await service.findByWorkspace("workspace-uuid-1");
+
+      expect(mockPrisma.terminalSession.findMany).toHaveBeenCalledWith({
+        where: {
+          workspaceId: "workspace-uuid-1",
+          status: TerminalSessionStatus.ACTIVE,
+        },
+        orderBy: { createdAt: "desc" },
+      });
+      expect(result).toHaveLength(2);
+    });
+
+    it("should return an empty array when no active sessions exist", async () => {
+      mockPrisma.terminalSession.findMany.mockResolvedValueOnce([]);
+
+      const result = await service.findByWorkspace("workspace-uuid-empty");
+
+      expect(result).toEqual([]);
+    });
+
+    it("should not include CLOSED sessions", async () => {
+      // The where clause enforces ACTIVE status — verify it is present
+      mockPrisma.terminalSession.findMany.mockResolvedValueOnce([]);
+
+      await service.findByWorkspace("workspace-uuid-1");
+
+      const callArgs = mockPrisma.terminalSession.findMany.mock.calls[0][0] as {
+        where: { status: TerminalSessionStatus };
+      };
+      expect(callArgs.where.status).toBe(TerminalSessionStatus.ACTIVE);
+    });
+  });
+
+  // ==========================================
+  // close
+  // ==========================================
+  describe("close", () => {
+    it("should set status to CLOSED and set closedAt when session exists", async () => {
+      const existingSession = makeSession();
+      const closedSession = makeSession({
+        status: TerminalSessionStatus.CLOSED,
+        closedAt: new Date("2026-02-25T01:00:00Z"),
+      });
+
+      mockPrisma.terminalSession.findUnique.mockResolvedValueOnce(existingSession);
+      mockPrisma.terminalSession.update.mockResolvedValueOnce(closedSession);
+
+      const result = await service.close("session-uuid-1");
+
+      expect(mockPrisma.terminalSession.findUnique).toHaveBeenCalledWith({
+        where: { id: "session-uuid-1" },
+      });
+      expect(mockPrisma.terminalSession.update).toHaveBeenCalledWith({
+        where: { id: "session-uuid-1" },
+        data: {
+          status: TerminalSessionStatus.CLOSED,
+          closedAt: expect.any(Date),
+        },
+      });
+      expect(result.status).toBe(TerminalSessionStatus.CLOSED);
+    });
+
+    it("should throw NotFoundException when session does not exist", async () => {
+      mockPrisma.terminalSession.findUnique.mockResolvedValueOnce(null);
+
+      await expect(service.close("nonexistent-id")).rejects.toThrow(NotFoundException);
+      expect(mockPrisma.terminalSession.update).not.toHaveBeenCalled();
+    });
+
+    it("should include a non-null closedAt timestamp on close", async () => {
+      const existingSession = makeSession();
+      const closedSession = makeSession({
+        status: TerminalSessionStatus.CLOSED,
+        closedAt: new Date(),
+      });
+
+      mockPrisma.terminalSession.findUnique.mockResolvedValueOnce(existingSession);
+      mockPrisma.terminalSession.update.mockResolvedValueOnce(closedSession);
+
+      const result = await service.close("session-uuid-1");
+
+      expect(result.closedAt).not.toBeNull();
+    });
+  });
+
+  // ==========================================
+  // findById
+  // ==========================================
+  describe("findById", () => {
+    it("should return the session when it exists", async () => {
+      const session = makeSession();
+      mockPrisma.terminalSession.findUnique.mockResolvedValueOnce(session);
+
+      const result = await service.findById("session-uuid-1");
+
+      expect(mockPrisma.terminalSession.findUnique).toHaveBeenCalledWith({
+        where: { id: "session-uuid-1" },
+      });
+      expect(result).toEqual(session);
+    });
+
+    it("should return null when session does not exist", async () => {
+      mockPrisma.terminalSession.findUnique.mockResolvedValueOnce(null);
+
+      const result = await service.findById("no-such-id");
+
+      expect(result).toBeNull();
+    });
+
+    it("should find CLOSED sessions as well as ACTIVE ones", async () => {
+      const closedSession = makeSession({
+        status: TerminalSessionStatus.CLOSED,
+        closedAt: new Date(),
+      });
+      mockPrisma.terminalSession.findUnique.mockResolvedValueOnce(closedSession);
+
+      const result = await service.findById("session-uuid-1");
+
+      expect(result?.status).toBe(TerminalSessionStatus.CLOSED);
+    });
+  });
+});

apps/api/src/terminal/terminal-session.service.ts

@@ -0,0 +1,96 @@
+/**
+ * TerminalSessionService
+ *
+ * Manages database persistence for terminal sessions.
+ * Provides CRUD operations on the TerminalSession model,
+ * enabling session tracking, recovery, and workspace-level listing.
+ *
+ * Session lifecycle:
+ * - create: record a new terminal session with ACTIVE status
+ * - findByWorkspace: return all ACTIVE sessions for a workspace
+ * - close: mark a session as CLOSED, set closedAt timestamp
+ * - findById: retrieve a single session by ID
+ */
+
+import { Injectable, NotFoundException, Logger } from "@nestjs/common";
+import { TerminalSessionStatus } from "@prisma/client";
+import type { TerminalSession } from "@prisma/client";
+import { PrismaService } from "../prisma/prisma.service";
+
+@Injectable()
+export class TerminalSessionService {
+  private readonly logger = new Logger(TerminalSessionService.name);
+
+  constructor(private readonly prisma: PrismaService) {}
+
+  /**
+   * Create a new terminal session record in the database.
+   *
+   * @param workspaceId - The workspace this session belongs to
+   * @param name - Optional display name for the session (defaults to "Terminal")
+   * @returns The created TerminalSession record
+   */
+  async create(workspaceId: string, name?: string): Promise<TerminalSession> {
+    this.logger.log(
+      `Creating terminal session for workspace ${workspaceId}${name !== undefined ? ` (name: ${name})` : ""}`
+    );
+
+    const data: { workspaceId: string; name?: string } = { workspaceId };
+    if (name !== undefined) {
+      data.name = name;
+    }
+
+    return this.prisma.terminalSession.create({ data });
+  }
+
+  /**
+   * Find all ACTIVE terminal sessions for a workspace.
+   *
+   * @param workspaceId - The workspace to query
+   * @returns Array of active TerminalSession records, ordered by creation time (newest first)
+   */
+  async findByWorkspace(workspaceId: string): Promise<TerminalSession[]> {
+    return this.prisma.terminalSession.findMany({
+      where: {
+        workspaceId,
+        status: TerminalSessionStatus.ACTIVE,
+      },
+      orderBy: { createdAt: "desc" },
+    });
+  }
+
+  /**
+   * Close a terminal session by setting its status to CLOSED and recording closedAt.
+   *
+   * @param id - The session ID to close
+   * @returns The updated TerminalSession record
+   * @throws NotFoundException if the session does not exist
+   */
+  async close(id: string): Promise<TerminalSession> {
+    const existing = await this.prisma.terminalSession.findUnique({ where: { id } });
+
+    if (!existing) {
+      throw new NotFoundException(`Terminal session ${id} not found`);
+    }
+
+    this.logger.log(`Closing terminal session ${id} (workspace: ${existing.workspaceId})`);
+
+    return this.prisma.terminalSession.update({
+      where: { id },
+      data: {
+        status: TerminalSessionStatus.CLOSED,
+        closedAt: new Date(),
+      },
+    });
+  }
+
+  /**
+   * Find a terminal session by ID.
+   *
+   * @param id - The session ID to retrieve
+   * @returns The TerminalSession record, or null if not found
+   */
+  async findById(id: string): Promise<TerminalSession | null> {
+    return this.prisma.terminalSession.findUnique({ where: { id } });
+  }
+}

apps/api/src/terminal/terminal.dto.ts

@@ -0,0 +1,89 @@
+/**
+ * Terminal DTOs
+ *
+ * Data Transfer Objects for terminal WebSocket events.
+ * Validated using class-validator decorators.
+ */
+
+import {
+  IsString,
+  IsOptional,
+  IsNumber,
+  IsInt,
+  Min,
+  Max,
+  MinLength,
+  MaxLength,
+} from "class-validator";
+
+/**
+ * DTO for creating a new terminal PTY session.
+ */
+export class CreateTerminalDto {
+  @IsOptional()
+  @IsString()
+  @MaxLength(128)
+  name?: string;
+
+  @IsOptional()
+  @IsInt()
+  @Min(1)
+  @Max(500)
+  cols?: number;
+
+  @IsOptional()
+  @IsInt()
+  @Min(1)
+  @Max(200)
+  rows?: number;
+
+  @IsOptional()
+  @IsString()
+  @MaxLength(4096)
+  cwd?: string;
+}
+
+/**
+ * DTO for sending input data to a terminal PTY session.
+ */
+export class TerminalInputDto {
+  @IsString()
+  @MinLength(1)
+  @MaxLength(64)
+  sessionId!: string;
+
+  @IsString()
+  data!: string;
+}
+
+/**
+ * DTO for resizing a terminal PTY session.
+ */
+export class TerminalResizeDto {
+  @IsString()
+  @MinLength(1)
+  @MaxLength(64)
+  sessionId!: string;
+
+  @IsNumber()
+  @IsInt()
+  @Min(1)
+  @Max(500)
+  cols!: number;
+
+  @IsNumber()
+  @IsInt()
+  @Min(1)
+  @Max(200)
+  rows!: number;
+}
+
+/**
+ * DTO for closing a terminal PTY session.
+ */
+export class CloseTerminalDto {
+  @IsString()
+  @MinLength(1)
+  @MaxLength(64)
+  sessionId!: string;
+}

apps/api/src/terminal/terminal.gateway.spec.ts

@@ -0,0 +1,501 @@
+/**
+ * TerminalGateway Tests
+ *
+ * Unit tests for WebSocket terminal gateway:
+ * - Authentication on connection
+ * - terminal:create event handling
+ * - terminal:input event handling
+ * - terminal:resize event handling
+ * - terminal:close event handling
+ * - disconnect cleanup
+ * - Error paths
+ */
+
+import { describe, it, expect, beforeEach, vi, afterEach } from "vitest";
+import type { Socket } from "socket.io";
+import { TerminalGateway } from "./terminal.gateway";
+import { TerminalService } from "./terminal.service";
+import { AuthService } from "../auth/auth.service";
+import { PrismaService } from "../prisma/prisma.service";
+
+// ==========================================
+// Mocks
+// ==========================================
+
+// Mock node-pty globally so TerminalService doesn't fail to import
+vi.mock("node-pty", () => ({
+  spawn: vi.fn(() => ({
+    onData: vi.fn(),
+    onExit: vi.fn(),
+    write: vi.fn(),
+    resize: vi.fn(),
+    kill: vi.fn(),
+    pid: 1000,
+  })),
+}));
+
+interface AuthenticatedSocket extends Socket {
+  data: {
+    userId?: string;
+    workspaceId?: string;
+  };
+}
+
+function createMockSocket(id = "test-socket-id"): AuthenticatedSocket {
+  return {
+    id,
+    emit: vi.fn(),
+    join: vi.fn(),
+    leave: vi.fn(),
+    disconnect: vi.fn(),
+    data: {},
+    handshake: {
+      auth: { token: "valid-token" },
+      query: {},
+      headers: {},
+    },
+  } as unknown as AuthenticatedSocket;
+}
+
+function createMockAuthService() {
+  return {
+    verifySession: vi.fn().mockResolvedValue({
+      user: { id: "user-123" },
+      session: { id: "session-123" },
+    }),
+  };
+}
+
+function createMockPrismaService() {
+  return {
+    workspaceMember: {
+      findFirst: vi.fn().mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      }),
+    },
+  };
+}
+
+function createMockTerminalService() {
+  return {
+    createSession: vi.fn().mockReturnValue({
+      sessionId: "session-uuid-1",
+      name: undefined,
+      cols: 80,
+      rows: 24,
+    }),
+    writeToSession: vi.fn(),
+    resizeSession: vi.fn(),
+    closeSession: vi.fn().mockReturnValue(true),
+    closeWorkspaceSessions: vi.fn(),
+    sessionBelongsToWorkspace: vi.fn().mockReturnValue(true),
+    getWorkspaceSessionCount: vi.fn().mockReturnValue(0),
+  };
+}
+
+// ==========================================
+// Tests
+// ==========================================
+
+describe("TerminalGateway", () => {
+  let gateway: TerminalGateway;
+  let mockAuthService: ReturnType<typeof createMockAuthService>;
+  let mockPrismaService: ReturnType<typeof createMockPrismaService>;
+  let mockTerminalService: ReturnType<typeof createMockTerminalService>;
+  let mockClient: AuthenticatedSocket;
+
+  beforeEach(() => {
+    mockAuthService = createMockAuthService();
+    mockPrismaService = createMockPrismaService();
+    mockTerminalService = createMockTerminalService();
+    mockClient = createMockSocket();
+
+    gateway = new TerminalGateway(
+      mockAuthService as unknown as AuthService,
+      mockPrismaService as unknown as PrismaService,
+      mockTerminalService as unknown as TerminalService
+    );
+
+    vi.clearAllMocks();
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+  });
+
+  // ==========================================
+  // handleConnection (authentication)
+  // ==========================================
+  describe("handleConnection", () => {
+    it("should authenticate client and join workspace room on valid token", async () => {
+      mockAuthService.verifySession.mockResolvedValue({
+        user: { id: "user-123" },
+      });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+
+      await gateway.handleConnection(mockClient);
+
+      expect(mockAuthService.verifySession).toHaveBeenCalledWith("valid-token");
+      expect(mockClient.data.userId).toBe("user-123");
+      expect(mockClient.data.workspaceId).toBe("workspace-456");
+      expect(mockClient.join).toHaveBeenCalledWith("terminal:workspace-456");
+    });
+
+    it("should disconnect and emit error if no token provided", async () => {
+      const clientNoToken = createMockSocket("no-token");
+      clientNoToken.handshake = {
+        auth: {},
+        query: {},
+        headers: {},
+      } as typeof clientNoToken.handshake;
+
+      await gateway.handleConnection(clientNoToken);
+
+      expect(clientNoToken.disconnect).toHaveBeenCalled();
+      expect(clientNoToken.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("no token") })
+      );
+    });
+
+    it("should disconnect and emit error if token is invalid", async () => {
+      mockAuthService.verifySession.mockResolvedValue(null);
+
+      await gateway.handleConnection(mockClient);
+
+      expect(mockClient.disconnect).toHaveBeenCalled();
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("invalid") })
+      );
+    });
+
+    it("should disconnect and emit error if no workspace access", async () => {
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue(null);
+
+      await gateway.handleConnection(mockClient);
+
+      expect(mockClient.disconnect).toHaveBeenCalled();
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("workspace") })
+      );
+    });
+
+    it("should disconnect and emit error if auth throws", async () => {
+      mockAuthService.verifySession.mockRejectedValue(new Error("Auth service down"));
+
+      await gateway.handleConnection(mockClient);
+
+      expect(mockClient.disconnect).toHaveBeenCalled();
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.any(String) })
+      );
+    });
+
+    it("should extract token from handshake.query as fallback", async () => {
+      const clientQueryToken = createMockSocket("query-token-client");
+      clientQueryToken.handshake = {
+        auth: {},
+        query: { token: "query-token" },
+        headers: {},
+      } as typeof clientQueryToken.handshake;
+
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+
+      await gateway.handleConnection(clientQueryToken);
+
+      expect(mockAuthService.verifySession).toHaveBeenCalledWith("query-token");
+    });
+
+    it("should extract token from Authorization header as last fallback", async () => {
+      const clientHeaderToken = createMockSocket("header-token-client");
+      clientHeaderToken.handshake = {
+        auth: {},
+        query: {},
+        headers: { authorization: "Bearer header-token" },
+      } as typeof clientHeaderToken.handshake;
+
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+
+      await gateway.handleConnection(clientHeaderToken);
+
+      expect(mockAuthService.verifySession).toHaveBeenCalledWith("header-token");
+    });
+  });
+
+  // ==========================================
+  // handleDisconnect
+  // ==========================================
+  describe("handleDisconnect", () => {
+    it("should close all workspace sessions on disconnect", async () => {
+      await gateway.handleConnection(mockClient);
+      vi.clearAllMocks();
+
+      gateway.handleDisconnect(mockClient);
+
+      expect(mockTerminalService.closeWorkspaceSessions).toHaveBeenCalledWith("workspace-456");
+    });
+
+    it("should not throw for unauthenticated client disconnect", () => {
+      const unauthClient = createMockSocket("unauth-disconnect");
+
+      expect(() => gateway.handleDisconnect(unauthClient)).not.toThrow();
+      expect(mockTerminalService.closeWorkspaceSessions).not.toHaveBeenCalled();
+    });
+  });
+
+  // ==========================================
+  // handleCreate (terminal:create)
+  // ==========================================
+  describe("handleCreate", () => {
+    beforeEach(async () => {
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+      await gateway.handleConnection(mockClient);
+      vi.clearAllMocks();
+    });
+
+    it("should create a PTY session and emit terminal:created", async () => {
+      mockTerminalService.createSession.mockReturnValue({
+        sessionId: "new-session-id",
+        cols: 80,
+        rows: 24,
+      });
+
+      await gateway.handleCreate(mockClient, {});
+
+      expect(mockTerminalService.createSession).toHaveBeenCalled();
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:created",
+        expect.objectContaining({ sessionId: "new-session-id" })
+      );
+    });
+
+    it("should pass cols, rows, cwd, name to service", async () => {
+      await gateway.handleCreate(mockClient, {
+        cols: 132,
+        rows: 50,
+        cwd: "/home/user",
+        name: "my-shell",
+      });
+
+      expect(mockTerminalService.createSession).toHaveBeenCalledWith(
+        expect.anything(),
+        expect.objectContaining({ cols: 132, rows: 50, cwd: "/home/user", name: "my-shell" })
+      );
+    });
+
+    it("should emit terminal:error if not authenticated", async () => {
+      const unauthClient = createMockSocket("unauth");
+
+      await gateway.handleCreate(unauthClient, {});
+
+      expect(unauthClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("authenticated") })
+      );
+    });
+
+    it("should emit terminal:error if service throws (session limit)", async () => {
+      mockTerminalService.createSession.mockImplementation(() => {
+        throw new Error("Workspace has reached the maximum of 10 concurrent terminal sessions");
+      });
+
+      await gateway.handleCreate(mockClient, {});
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("maximum") })
+      );
+    });
+
+    it("should emit terminal:error for invalid payload (negative cols)", async () => {
+      await gateway.handleCreate(mockClient, { cols: -1 });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("Invalid payload") })
+      );
+    });
+  });
+
+  // ==========================================
+  // handleInput (terminal:input)
+  // ==========================================
+  describe("handleInput", () => {
+    beforeEach(async () => {
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+      await gateway.handleConnection(mockClient);
+      vi.clearAllMocks();
+    });
+
+    it("should write data to the PTY session", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(true);
+
+      await gateway.handleInput(mockClient, { sessionId: "sess-1", data: "ls\n" });
+
+      expect(mockTerminalService.writeToSession).toHaveBeenCalledWith("sess-1", "ls\n");
+    });
+
+    it("should emit terminal:error if session does not belong to workspace", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(false);
+
+      await gateway.handleInput(mockClient, { sessionId: "alien-sess", data: "data" });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("not found") })
+      );
+      expect(mockTerminalService.writeToSession).not.toHaveBeenCalled();
+    });
+
+    it("should emit terminal:error if not authenticated", async () => {
+      const unauthClient = createMockSocket("unauth");
+
+      await gateway.handleInput(unauthClient, { sessionId: "sess-1", data: "x" });
+
+      expect(unauthClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("authenticated") })
+      );
+    });
+
+    it("should emit terminal:error for invalid payload (missing sessionId)", async () => {
+      await gateway.handleInput(mockClient, { data: "some input" });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("Invalid payload") })
+      );
+    });
+  });
+
+  // ==========================================
+  // handleResize (terminal:resize)
+  // ==========================================
+  describe("handleResize", () => {
+    beforeEach(async () => {
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+      await gateway.handleConnection(mockClient);
+      vi.clearAllMocks();
+    });
+
+    it("should resize the PTY session", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(true);
+
+      await gateway.handleResize(mockClient, { sessionId: "sess-1", cols: 120, rows: 40 });
+
+      expect(mockTerminalService.resizeSession).toHaveBeenCalledWith("sess-1", 120, 40);
+    });
+
+    it("should emit terminal:error if session does not belong to workspace", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(false);
+
+      await gateway.handleResize(mockClient, { sessionId: "alien-sess", cols: 80, rows: 24 });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("not found") })
+      );
+    });
+
+    it("should emit terminal:error for invalid payload (cols too large)", async () => {
+      await gateway.handleResize(mockClient, { sessionId: "sess-1", cols: 9999, rows: 24 });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("Invalid payload") })
+      );
+    });
+  });
+
+  // ==========================================
+  // handleClose (terminal:close)
+  // ==========================================
+  describe("handleClose", () => {
+    beforeEach(async () => {
+      mockAuthService.verifySession.mockResolvedValue({ user: { id: "user-123" } });
+      mockPrismaService.workspaceMember.findFirst.mockResolvedValue({
+        userId: "user-123",
+        workspaceId: "workspace-456",
+        role: "MEMBER",
+      });
+      await gateway.handleConnection(mockClient);
+      vi.clearAllMocks();
+    });
+
+    it("should close an existing PTY session", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(true);
+      mockTerminalService.closeSession.mockReturnValue(true);
+
+      await gateway.handleClose(mockClient, { sessionId: "sess-1" });
+
+      expect(mockTerminalService.closeSession).toHaveBeenCalledWith("sess-1");
+    });
+
+    it("should emit terminal:error if session does not belong to workspace", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(false);
+
+      await gateway.handleClose(mockClient, { sessionId: "alien-sess" });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("not found") })
+      );
+    });
+
+    it("should emit terminal:error if closeSession returns false (session gone)", async () => {
+      mockTerminalService.sessionBelongsToWorkspace.mockReturnValue(true);
+      mockTerminalService.closeSession.mockReturnValue(false);
+
+      await gateway.handleClose(mockClient, { sessionId: "gone-sess" });
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("not found") })
+      );
+    });
+
+    it("should emit terminal:error for invalid payload (missing sessionId)", async () => {
+      await gateway.handleClose(mockClient, {});
+
+      expect(mockClient.emit).toHaveBeenCalledWith(
+        "terminal:error",
+        expect.objectContaining({ message: expect.stringContaining("Invalid payload") })
+      );
+    });
+  });
+});

apps/api/src/terminal/terminal.gateway.ts

@@ -0,0 +1,423 @@
+/**
+ * TerminalGateway
+ *
+ * WebSocket gateway for real-time PTY terminal sessions.
+ * Uses the `/terminal` namespace to keep terminal traffic separate
+ * from the main WebSocket gateway.
+ *
+ * Protocol:
+ * 1. Client connects with auth token in handshake
+ * 2. Client emits `terminal:create` to spawn a new PTY session
+ * 3. Server emits `terminal:created` with { sessionId }
+ * 4. Client emits `terminal:input` with { sessionId, data } to send keystrokes
+ * 5. Server emits `terminal:output` with { sessionId, data } for stdout/stderr
+ * 6. Client emits `terminal:resize` with { sessionId, cols, rows } on window resize
+ * 7. Client emits `terminal:close` with { sessionId } to terminate the PTY
+ * 8. Server emits `terminal:exit` with { sessionId, exitCode, signal } on PTY exit
+ *
+ * Authentication:
+ * - Same pattern as websocket.gateway.ts and speech.gateway.ts
+ * - Token extracted from handshake.auth.token / query.token / Authorization header
+ *
+ * Workspace isolation:
+ * - Clients join room `terminal:{workspaceId}` on connect
+ * - Sessions are scoped to workspace; cross-workspace access is denied
+ */
+
+import {
+  WebSocketGateway as WSGateway,
+  WebSocketServer,
+  SubscribeMessage,
+  OnGatewayConnection,
+  OnGatewayDisconnect,
+} from "@nestjs/websockets";
+import { Logger } from "@nestjs/common";
+import { Server, Socket } from "socket.io";
+import { AuthService } from "../auth/auth.service";
+import { PrismaService } from "../prisma/prisma.service";
+import { TerminalService } from "./terminal.service";
+import {
+  CreateTerminalDto,
+  TerminalInputDto,
+  TerminalResizeDto,
+  CloseTerminalDto,
+} from "./terminal.dto";
+import { validate } from "class-validator";
+import { plainToInstance } from "class-transformer";
+
+// ==========================================
+// Types
+// ==========================================
+
+interface AuthenticatedSocket extends Socket {
+  data: {
+    userId?: string;
+    workspaceId?: string;
+  };
+}
+
+// ==========================================
+// Gateway
+// ==========================================
+
+@WSGateway({
+  namespace: "/terminal",
+  cors: {
+    origin: process.env.WEB_URL ?? "http://localhost:3000",
+    credentials: true,
+  },
+})
+export class TerminalGateway implements OnGatewayConnection, OnGatewayDisconnect {
+  @WebSocketServer()
+  server!: Server;
+
+  private readonly logger = new Logger(TerminalGateway.name);
+  private readonly CONNECTION_TIMEOUT_MS = 5000;
+
+  constructor(
+    private readonly authService: AuthService,
+    private readonly prisma: PrismaService,
+    private readonly terminalService: TerminalService
+  ) {}
+
+  // ==========================================
+  // Connection lifecycle
+  // ==========================================
+
+  /**
+   * Authenticate client on connection using handshake token.
+   * Validates workspace membership and joins the workspace-scoped room.
+   */
+  async handleConnection(client: Socket): Promise<void> {
+    const authenticatedClient = client as AuthenticatedSocket;
+
+    const timeoutId = setTimeout(() => {
+      if (!authenticatedClient.data.userId) {
+        this.logger.warn(
+          `Terminal client ${authenticatedClient.id} timed out during authentication`
+        );
+        authenticatedClient.emit("terminal:error", {
+          message: "Authentication timed out.",
+        });
+        authenticatedClient.disconnect();
+      }
+    }, this.CONNECTION_TIMEOUT_MS);
+
+    try {
+      const token = this.extractTokenFromHandshake(authenticatedClient);
+
+      if (!token) {
+        this.logger.warn(`Terminal client ${authenticatedClient.id} connected without token`);
+        authenticatedClient.emit("terminal:error", {
+          message: "Authentication failed: no token provided.",
+        });
+        authenticatedClient.disconnect();
+        clearTimeout(timeoutId);
+        return;
+      }
+
+      const sessionData = await this.authService.verifySession(token);
+
+      if (!sessionData) {
+        this.logger.warn(`Terminal client ${authenticatedClient.id} has invalid token`);
+        authenticatedClient.emit("terminal:error", {
+          message: "Authentication failed: invalid or expired token.",
+        });
+        authenticatedClient.disconnect();
+        clearTimeout(timeoutId);
+        return;
+      }
+
+      const user = sessionData.user as { id: string };
+      const userId = user.id;
+
+      const workspaceMembership = await this.prisma.workspaceMember.findFirst({
+        where: { userId },
+        select: { workspaceId: true, userId: true, role: true },
+      });
+
+      if (!workspaceMembership) {
+        this.logger.warn(`Terminal user ${userId} has no workspace access`);
+        authenticatedClient.emit("terminal:error", {
+          message: "Authentication failed: no workspace access.",
+        });
+        authenticatedClient.disconnect();
+        clearTimeout(timeoutId);
+        return;
+      }
+
+      authenticatedClient.data.userId = userId;
+      authenticatedClient.data.workspaceId = workspaceMembership.workspaceId;
+
+      // Join workspace-scoped terminal room
+      const room = this.getWorkspaceRoom(workspaceMembership.workspaceId);
+      await authenticatedClient.join(room);
+
+      clearTimeout(timeoutId);
+      this.logger.log(
+        `Terminal client ${authenticatedClient.id} connected (user: ${userId}, workspace: ${workspaceMembership.workspaceId})`
+      );
+    } catch (error) {
+      clearTimeout(timeoutId);
+      this.logger.error(
+        `Authentication failed for terminal client ${authenticatedClient.id}:`,
+        error instanceof Error ? error.message : "Unknown error"
+      );
+      authenticatedClient.emit("terminal:error", {
+        message: "Authentication failed: an unexpected error occurred.",
+      });
+      authenticatedClient.disconnect();
+    }
+  }
+
+  /**
+   * Clean up all PTY sessions for this client's workspace on disconnect.
+   */
+  handleDisconnect(client: Socket): void {
+    const authenticatedClient = client as AuthenticatedSocket;
+    const { workspaceId, userId } = authenticatedClient.data;
+
+    if (workspaceId) {
+      this.terminalService.closeWorkspaceSessions(workspaceId);
+
+      const room = this.getWorkspaceRoom(workspaceId);
+      void authenticatedClient.leave(room);
+      this.logger.log(
+        `Terminal client ${authenticatedClient.id} disconnected (user: ${userId ?? "unknown"}, workspace: ${workspaceId})`
+      );
+    } else {
+      this.logger.debug(`Terminal client ${authenticatedClient.id} disconnected (unauthenticated)`);
+    }
+  }
+
+  // ==========================================
+  // Terminal events
+  // ==========================================
+
+  /**
+   * Spawn a new PTY session for the connected client.
+   *
+   * Emits `terminal:created` with { sessionId, name, cols, rows } on success.
+   * Emits `terminal:error` on failure.
+   */
+  @SubscribeMessage("terminal:create")
+  async handleCreate(client: Socket, payload: unknown): Promise<void> {
+    const authenticatedClient = client as AuthenticatedSocket;
+    const { userId, workspaceId } = authenticatedClient.data;
+
+    if (!userId || !workspaceId) {
+      authenticatedClient.emit("terminal:error", {
+        message: "Not authenticated. Connect with a valid token.",
+      });
+      return;
+    }
+
+    // Validate DTO
+    const dto = plainToInstance(CreateTerminalDto, payload ?? {});
+    const errors = await validate(dto);
+    if (errors.length > 0) {
+      const messages = errors.map((e) => Object.values(e.constraints ?? {}).join(", ")).join("; ");
+      authenticatedClient.emit("terminal:error", {
+        message: `Invalid payload: ${messages}`,
+      });
+      return;
+    }
+
+    try {
+      const result = this.terminalService.createSession(authenticatedClient, {
+        workspaceId,
+        socketId: authenticatedClient.id,
+        ...(dto.name !== undefined ? { name: dto.name } : {}),
+        ...(dto.cols !== undefined ? { cols: dto.cols } : {}),
+        ...(dto.rows !== undefined ? { rows: dto.rows } : {}),
+        ...(dto.cwd !== undefined ? { cwd: dto.cwd } : {}),
+      });
+
+      authenticatedClient.emit("terminal:created", {
+        sessionId: result.sessionId,
+        name: result.name,
+        cols: result.cols,
+        rows: result.rows,
+      });
+
+      this.logger.log(
+        `Terminal session ${result.sessionId} created for client ${authenticatedClient.id} (workspace: ${workspaceId})`
+      );
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      this.logger.error(
+        `Failed to create terminal session for client ${authenticatedClient.id}: ${message}`
+      );
+      authenticatedClient.emit("terminal:error", { message });
+    }
+  }
+
+  /**
+   * Write input data to an existing PTY session.
+   *
+   * Emits `terminal:error` if the session is not found or unauthorized.
+   */
+  @SubscribeMessage("terminal:input")
+  async handleInput(client: Socket, payload: unknown): Promise<void> {
+    const authenticatedClient = client as AuthenticatedSocket;
+    const { userId, workspaceId } = authenticatedClient.data;
+
+    if (!userId || !workspaceId) {
+      authenticatedClient.emit("terminal:error", {
+        message: "Not authenticated. Connect with a valid token.",
+      });
+      return;
+    }
+
+    const dto = plainToInstance(TerminalInputDto, payload ?? {});
+    const errors = await validate(dto);
+    if (errors.length > 0) {
+      const messages = errors.map((e) => Object.values(e.constraints ?? {}).join(", ")).join("; ");
+      authenticatedClient.emit("terminal:error", {
+        message: `Invalid payload: ${messages}`,
+      });
+      return;
+    }
+
+    if (!this.terminalService.sessionBelongsToWorkspace(dto.sessionId, workspaceId)) {
+      authenticatedClient.emit("terminal:error", {
+        message: `Terminal session ${dto.sessionId} not found or unauthorized.`,
+      });
+      return;
+    }
+
+    try {
+      this.terminalService.writeToSession(dto.sessionId, dto.data);
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      this.logger.warn(`Failed to write to terminal session ${dto.sessionId}: ${message}`);
+      authenticatedClient.emit("terminal:error", { message });
+    }
+  }
+
+  /**
+   * Resize an existing PTY session.
+   *
+   * Emits `terminal:error` if the session is not found or unauthorized.
+   */
+  @SubscribeMessage("terminal:resize")
+  async handleResize(client: Socket, payload: unknown): Promise<void> {
+    const authenticatedClient = client as AuthenticatedSocket;
+    const { userId, workspaceId } = authenticatedClient.data;
+
+    if (!userId || !workspaceId) {
+      authenticatedClient.emit("terminal:error", {
+        message: "Not authenticated. Connect with a valid token.",
+      });
+      return;
+    }
+
+    const dto = plainToInstance(TerminalResizeDto, payload ?? {});
+    const errors = await validate(dto);
+    if (errors.length > 0) {
+      const messages = errors.map((e) => Object.values(e.constraints ?? {}).join(", ")).join("; ");
+      authenticatedClient.emit("terminal:error", {
+        message: `Invalid payload: ${messages}`,
+      });
+      return;
+    }
+
+    if (!this.terminalService.sessionBelongsToWorkspace(dto.sessionId, workspaceId)) {
+      authenticatedClient.emit("terminal:error", {
+        message: `Terminal session ${dto.sessionId} not found or unauthorized.`,
+      });
+      return;
+    }
+
+    try {
+      this.terminalService.resizeSession(dto.sessionId, dto.cols, dto.rows);
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      this.logger.warn(`Failed to resize terminal session ${dto.sessionId}: ${message}`);
+      authenticatedClient.emit("terminal:error", { message });
+    }
+  }
+
+  /**
+   * Kill and close an existing PTY session.
+   *
+   * Emits `terminal:error` if the session is not found or unauthorized.
+   */
+  @SubscribeMessage("terminal:close")
+  async handleClose(client: Socket, payload: unknown): Promise<void> {
+    const authenticatedClient = client as AuthenticatedSocket;
+    const { userId, workspaceId } = authenticatedClient.data;
+
+    if (!userId || !workspaceId) {
+      authenticatedClient.emit("terminal:error", {
+        message: "Not authenticated. Connect with a valid token.",
+      });
+      return;
+    }
+
+    const dto = plainToInstance(CloseTerminalDto, payload ?? {});
+    const errors = await validate(dto);
+    if (errors.length > 0) {
+      const messages = errors.map((e) => Object.values(e.constraints ?? {}).join(", ")).join("; ");
+      authenticatedClient.emit("terminal:error", {
+        message: `Invalid payload: ${messages}`,
+      });
+      return;
+    }
+
+    if (!this.terminalService.sessionBelongsToWorkspace(dto.sessionId, workspaceId)) {
+      authenticatedClient.emit("terminal:error", {
+        message: `Terminal session ${dto.sessionId} not found or unauthorized.`,
+      });
+      return;
+    }
+
+    const closed = this.terminalService.closeSession(dto.sessionId);
+    if (!closed) {
+      authenticatedClient.emit("terminal:error", {
+        message: `Terminal session ${dto.sessionId} not found.`,
+      });
+      return;
+    }
+
+    this.logger.log(`Terminal session ${dto.sessionId} closed by client ${authenticatedClient.id}`);
+  }
+
+  // ==========================================
+  // Private helpers
+  // ==========================================
+
+  /**
+   * Extract authentication token from Socket.IO handshake.
+   * Checks auth.token, query.token, and Authorization header (in that order).
+   */
+  private extractTokenFromHandshake(client: Socket): string | undefined {
+    const authToken = client.handshake.auth.token as unknown;
+    if (typeof authToken === "string" && authToken.length > 0) {
+      return authToken;
+    }
+
+    const queryToken = client.handshake.query.token as unknown;
+    if (typeof queryToken === "string" && queryToken.length > 0) {
+      return queryToken;
+    }
+
+    const authHeader = client.handshake.headers.authorization as unknown;
+    if (typeof authHeader === "string") {
+      const parts = authHeader.split(" ");
+      const [type, token] = parts;
+      if (type === "Bearer" && token) {
+        return token;
+      }
+    }
+
+    return undefined;
+  }
+
+  /**
+   * Get the workspace-scoped room name for the terminal namespace.
+   */
+  private getWorkspaceRoom(workspaceId: string): string {
+    return `terminal:${workspaceId}`;
+  }
+}

apps/api/src/terminal/terminal.module.ts

@@ -0,0 +1,31 @@
+/**
+ * TerminalModule
+ *
+ * NestJS module for WebSocket-based terminal sessions via node-pty.
+ *
+ * Imports:
+ * - AuthModule for WebSocket authentication (verifySession)
+ * - PrismaModule for workspace membership queries and session persistence
+ *
+ * Providers:
+ * - TerminalService: manages PTY session lifecycle (in-memory)
+ * - TerminalSessionService: persists session records to the database
+ * - TerminalGateway: WebSocket gateway on /terminal namespace
+ *
+ * The module does not export providers; terminal sessions are
+ * self-contained within this module.
+ */
+
+import { Module } from "@nestjs/common";
+import { TerminalGateway } from "./terminal.gateway";
+import { TerminalService } from "./terminal.service";
+import { TerminalSessionService } from "./terminal-session.service";
+import { AuthModule } from "../auth/auth.module";
+import { PrismaModule } from "../prisma/prisma.module";
+
+@Module({
+  imports: [AuthModule, PrismaModule],
+  providers: [TerminalGateway, TerminalService, TerminalSessionService],
+  exports: [TerminalSessionService],
+})
+export class TerminalModule {}

apps/api/src/terminal/terminal.service.spec.ts

@@ -0,0 +1,339 @@
+/**
+ * TerminalService Tests
+ *
+ * Unit tests for PTY session management: create, write, resize, close,
+ * workspace cleanup, and access control.
+ */
+
+import { describe, it, expect, beforeEach, vi, afterEach } from "vitest";
+import type { Socket } from "socket.io";
+import { TerminalService, MAX_SESSIONS_PER_WORKSPACE } from "./terminal.service";
+
+// ==========================================
+// Mocks
+// ==========================================
+
+// Mock node-pty before importing service
+const mockPtyProcess = {
+  onData: vi.fn(),
+  onExit: vi.fn(),
+  write: vi.fn(),
+  resize: vi.fn(),
+  kill: vi.fn(),
+  pid: 12345,
+};
+
+vi.mock("node-pty", () => ({
+  spawn: vi.fn(() => mockPtyProcess),
+}));
+
+function createMockSocket(id = "socket-1"): Socket {
+  return {
+    id,
+    emit: vi.fn(),
+    join: vi.fn(),
+    leave: vi.fn(),
+    disconnect: vi.fn(),
+    data: {},
+  } as unknown as Socket;
+}
+
+// ==========================================
+// Tests
+// ==========================================
+
+describe("TerminalService", () => {
+  let service: TerminalService;
+  let mockSocket: Socket;
+
+  beforeEach(async () => {
+    vi.clearAllMocks();
+    // Reset mock implementations
+    mockPtyProcess.onData.mockImplementation((_cb: (data: string) => void) => {});
+    mockPtyProcess.onExit.mockImplementation(
+      (_cb: (e: { exitCode: number; signal?: number }) => void) => {}
+    );
+    service = new TerminalService();
+    // Trigger lazy import of node-pty (uses dynamic import(), intercepted by vi.mock)
+    await service.onModuleInit();
+    mockSocket = createMockSocket();
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+  });
+
+  // ==========================================
+  // createSession
+  // ==========================================
+  describe("createSession", () => {
+    it("should create a PTY session and return sessionId", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(result.sessionId).toBeDefined();
+      expect(typeof result.sessionId).toBe("string");
+      expect(result.cols).toBe(80);
+      expect(result.rows).toBe(24);
+    });
+
+    it("should use provided cols and rows", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+        cols: 120,
+        rows: 40,
+      });
+
+      expect(result.cols).toBe(120);
+      expect(result.rows).toBe(40);
+    });
+
+    it("should return the provided session name", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+        name: "my-terminal",
+      });
+
+      expect(result.name).toBe("my-terminal");
+    });
+
+    it("should wire PTY onData to emit terminal:output", () => {
+      let dataCallback: ((data: string) => void) | undefined;
+      mockPtyProcess.onData.mockImplementation((cb: (data: string) => void) => {
+        dataCallback = cb;
+      });
+
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(dataCallback).toBeDefined();
+      dataCallback!("hello world");
+
+      expect(mockSocket.emit).toHaveBeenCalledWith("terminal:output", {
+        sessionId: result.sessionId,
+        data: "hello world",
+      });
+    });
+
+    it("should wire PTY onExit to emit terminal:exit and cleanup", () => {
+      let exitCallback: ((e: { exitCode: number; signal?: number }) => void) | undefined;
+      mockPtyProcess.onExit.mockImplementation(
+        (cb: (e: { exitCode: number; signal?: number }) => void) => {
+          exitCallback = cb;
+        }
+      );
+
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(exitCallback).toBeDefined();
+      exitCallback!({ exitCode: 0 });
+
+      expect(mockSocket.emit).toHaveBeenCalledWith("terminal:exit", {
+        sessionId: result.sessionId,
+        exitCode: 0,
+        signal: undefined,
+      });
+
+      // Session should be cleaned up
+      expect(service.sessionBelongsToWorkspace(result.sessionId, "ws-1")).toBe(false);
+      expect(service.getWorkspaceSessionCount("ws-1")).toBe(0);
+    });
+
+    it("should throw when workspace session limit is reached", () => {
+      const limit = MAX_SESSIONS_PER_WORKSPACE;
+
+      for (let i = 0; i < limit; i++) {
+        service.createSession(createMockSocket(`socket-${String(i)}`), {
+          workspaceId: "ws-limit",
+          socketId: `socket-${String(i)}`,
+        });
+      }
+
+      expect(() =>
+        service.createSession(createMockSocket("socket-overflow"), {
+          workspaceId: "ws-limit",
+          socketId: "socket-overflow",
+        })
+      ).toThrow(/maximum/i);
+    });
+
+    it("should allow sessions in different workspaces independently", () => {
+      service.createSession(mockSocket, { workspaceId: "ws-a", socketId: "s1" });
+      service.createSession(createMockSocket("s2"), { workspaceId: "ws-b", socketId: "s2" });
+
+      expect(service.getWorkspaceSessionCount("ws-a")).toBe(1);
+      expect(service.getWorkspaceSessionCount("ws-b")).toBe(1);
+    });
+  });
+
+  // ==========================================
+  // writeToSession
+  // ==========================================
+  describe("writeToSession", () => {
+    it("should write data to PTY", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      service.writeToSession(result.sessionId, "ls -la\n");
+
+      expect(mockPtyProcess.write).toHaveBeenCalledWith("ls -la\n");
+    });
+
+    it("should throw for unknown sessionId", () => {
+      expect(() => service.writeToSession("nonexistent-id", "data")).toThrow(/not found/i);
+    });
+  });
+
+  // ==========================================
+  // resizeSession
+  // ==========================================
+  describe("resizeSession", () => {
+    it("should resize PTY dimensions", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      service.resizeSession(result.sessionId, 132, 50);
+
+      expect(mockPtyProcess.resize).toHaveBeenCalledWith(132, 50);
+    });
+
+    it("should throw for unknown sessionId", () => {
+      expect(() => service.resizeSession("nonexistent-id", 80, 24)).toThrow(/not found/i);
+    });
+  });
+
+  // ==========================================
+  // closeSession
+  // ==========================================
+  describe("closeSession", () => {
+    it("should kill PTY and return true for existing session", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      const closed = service.closeSession(result.sessionId);
+
+      expect(closed).toBe(true);
+      expect(mockPtyProcess.kill).toHaveBeenCalled();
+      expect(service.sessionBelongsToWorkspace(result.sessionId, "ws-1")).toBe(false);
+    });
+
+    it("should return false for nonexistent sessionId", () => {
+      const closed = service.closeSession("does-not-exist");
+      expect(closed).toBe(false);
+    });
+
+    it("should clean up workspace tracking after close", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(service.getWorkspaceSessionCount("ws-1")).toBe(1);
+      service.closeSession(result.sessionId);
+      expect(service.getWorkspaceSessionCount("ws-1")).toBe(0);
+    });
+
+    it("should not throw if PTY kill throws", () => {
+      mockPtyProcess.kill.mockImplementationOnce(() => {
+        throw new Error("PTY already dead");
+      });
+
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(() => service.closeSession(result.sessionId)).not.toThrow();
+    });
+  });
+
+  // ==========================================
+  // closeWorkspaceSessions
+  // ==========================================
+  describe("closeWorkspaceSessions", () => {
+    it("should kill all sessions for a workspace", () => {
+      service.createSession(mockSocket, { workspaceId: "ws-1", socketId: "s1" });
+      service.createSession(createMockSocket("s2"), { workspaceId: "ws-1", socketId: "s2" });
+
+      expect(service.getWorkspaceSessionCount("ws-1")).toBe(2);
+
+      service.closeWorkspaceSessions("ws-1");
+
+      expect(service.getWorkspaceSessionCount("ws-1")).toBe(0);
+      expect(mockPtyProcess.kill).toHaveBeenCalledTimes(2);
+    });
+
+    it("should not affect sessions in other workspaces", () => {
+      service.createSession(mockSocket, { workspaceId: "ws-1", socketId: "s1" });
+      service.createSession(createMockSocket("s2"), { workspaceId: "ws-2", socketId: "s2" });
+
+      service.closeWorkspaceSessions("ws-1");
+
+      expect(service.getWorkspaceSessionCount("ws-1")).toBe(0);
+      expect(service.getWorkspaceSessionCount("ws-2")).toBe(1);
+    });
+
+    it("should not throw for workspaces with no sessions", () => {
+      expect(() => service.closeWorkspaceSessions("ws-nonexistent")).not.toThrow();
+    });
+  });
+
+  // ==========================================
+  // sessionBelongsToWorkspace
+  // ==========================================
+  describe("sessionBelongsToWorkspace", () => {
+    it("should return true for a session belonging to the workspace", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(service.sessionBelongsToWorkspace(result.sessionId, "ws-1")).toBe(true);
+    });
+
+    it("should return false for a session in a different workspace", () => {
+      const result = service.createSession(mockSocket, {
+        workspaceId: "ws-1",
+        socketId: "socket-1",
+      });
+
+      expect(service.sessionBelongsToWorkspace(result.sessionId, "ws-2")).toBe(false);
+    });
+
+    it("should return false for a nonexistent sessionId", () => {
+      expect(service.sessionBelongsToWorkspace("no-such-id", "ws-1")).toBe(false);
+    });
+  });
+
+  // ==========================================
+  // getWorkspaceSessionCount
+  // ==========================================
+  describe("getWorkspaceSessionCount", () => {
+    it("should return 0 for workspace with no sessions", () => {
+      expect(service.getWorkspaceSessionCount("empty-ws")).toBe(0);
+    });
+
+    it("should track session count accurately", () => {
+      service.createSession(mockSocket, { workspaceId: "ws-count", socketId: "s1" });
+      expect(service.getWorkspaceSessionCount("ws-count")).toBe(1);
+
+      service.createSession(createMockSocket("s2"), { workspaceId: "ws-count", socketId: "s2" });
+      expect(service.getWorkspaceSessionCount("ws-count")).toBe(2);
+    });
+  });
+});

apps/api/src/terminal/terminal.service.ts

@@ -0,0 +1,276 @@
+/**
+ * TerminalService
+ *
+ * Manages PTY (pseudo-terminal) sessions for workspace users.
+ * Spawns real shell processes via node-pty, streams I/O to connected sockets,
+ * and enforces per-workspace session limits.
+ *
+ * Session lifecycle:
+ * - createSession: spawn a new PTY, wire onData/onExit, return sessionId
+ * - writeToSession: send input data to PTY stdin
+ * - resizeSession: resize PTY dimensions (cols x rows)
+ * - closeSession: kill PTY process, emit terminal:exit, cleanup
+ * - closeWorkspaceSessions: kill all sessions for a workspace (on disconnect)
+ */
+
+import { Injectable, Logger, OnModuleInit } from "@nestjs/common";
+import type { IPty } from "node-pty";
+import type { Socket } from "socket.io";
+import { randomUUID } from "node:crypto";
+
+// Lazy-loaded in onModuleInit via dynamic import() to prevent crash
+// if the native binary is missing. node-pty requires a compiled .node
+// binary which may not be available in all Docker environments.
+interface NodePtyModule {
+  spawn: (file: string, args: string[], options: Record<string, unknown>) => IPty;
+}
+let pty: NodePtyModule | null = null;
+
+/** Maximum concurrent PTY sessions per workspace */
+export const MAX_SESSIONS_PER_WORKSPACE = parseInt(
+  process.env.TERMINAL_MAX_SESSIONS_PER_WORKSPACE ?? "10",
+  10
+);
+
+/** Default PTY dimensions */
+const DEFAULT_COLS = 80;
+const DEFAULT_ROWS = 24;
+
+export interface TerminalSession {
+  sessionId: string;
+  workspaceId: string;
+  pty: IPty;
+  name?: string;
+  createdAt: Date;
+}
+
+export interface CreateSessionOptions {
+  name?: string;
+  cols?: number;
+  rows?: number;
+  cwd?: string;
+  workspaceId: string;
+  socketId: string;
+}
+
+export interface SessionCreatedResult {
+  sessionId: string;
+  name?: string;
+  cols: number;
+  rows: number;
+}
+
+@Injectable()
+export class TerminalService implements OnModuleInit {
+  private readonly logger = new Logger(TerminalService.name);
+
+  /**
+   * Map of sessionId -> TerminalSession
+   */
+  private readonly sessions = new Map<string, TerminalSession>();
+
+  /**
+   * Map of workspaceId -> Set<sessionId> for fast per-workspace lookups
+   */
+  private readonly workspaceSessions = new Map<string, Set<string>>();
+
+  async onModuleInit(): Promise<void> {
+    if (!pty) {
+      try {
+        pty = await import("node-pty");
+        this.logger.log("node-pty loaded successfully — terminal sessions available");
+      } catch {
+        this.logger.warn(
+          "node-pty native module not available — terminal sessions will be disabled. " +
+            "Install build tools (python3, make, g++) and rebuild node-pty to enable."
+        );
+      }
+    }
+  }
+
+  /**
+   * Create a new PTY session for the given workspace and socket.
+   * Wires PTY onData -> emit terminal:output and onExit -> emit terminal:exit.
+   *
+   * @throws Error if workspace session limit is exceeded or node-pty is unavailable
+   */
+  createSession(socket: Socket, options: CreateSessionOptions): SessionCreatedResult {
+    if (!pty) {
+      throw new Error("Terminal sessions are unavailable: node-pty native module failed to load");
+    }
+    const { workspaceId, name, cwd, socketId } = options;
+    const cols = options.cols ?? DEFAULT_COLS;
+    const rows = options.rows ?? DEFAULT_ROWS;
+
+    // Enforce per-workspace session limit
+    const workspaceSessionIds = this.workspaceSessions.get(workspaceId) ?? new Set<string>();
+    if (workspaceSessionIds.size >= MAX_SESSIONS_PER_WORKSPACE) {
+      throw new Error(
+        `Workspace ${workspaceId} has reached the maximum of ${String(MAX_SESSIONS_PER_WORKSPACE)} concurrent terminal sessions`
+      );
+    }
+
+    const sessionId = randomUUID();
+    const shell = process.env.SHELL ?? "/bin/bash";
+
+    this.logger.log(
+      `Spawning PTY session ${sessionId} for workspace ${workspaceId} (socket: ${socketId}, shell: ${shell}, ${String(cols)}x${String(rows)})`
+    );
+
+    const ptyProcess = pty.spawn(shell, [], {
+      name: "xterm-256color",
+      cols,
+      rows,
+      cwd: cwd ?? process.cwd(),
+      env: process.env as Record<string, string>,
+    });
+
+    const session: TerminalSession = {
+      sessionId,
+      workspaceId,
+      pty: ptyProcess,
+      ...(name !== undefined ? { name } : {}),
+      createdAt: new Date(),
+    };
+
+    this.sessions.set(sessionId, session);
+
+    // Track by workspace
+    if (!this.workspaceSessions.has(workspaceId)) {
+      this.workspaceSessions.set(workspaceId, new Set());
+    }
+    const wsSet = this.workspaceSessions.get(workspaceId);
+    if (wsSet) {
+      wsSet.add(sessionId);
+    }
+
+    // Wire PTY stdout/stderr -> terminal:output
+    ptyProcess.onData((data: string) => {
+      socket.emit("terminal:output", { sessionId, data });
+    });
+
+    // Wire PTY exit -> terminal:exit, cleanup
+    ptyProcess.onExit(({ exitCode, signal }) => {
+      this.logger.log(
+        `PTY session ${sessionId} exited (exitCode: ${String(exitCode)}, signal: ${String(signal ?? "none")})`
+      );
+      socket.emit("terminal:exit", { sessionId, exitCode, signal });
+      this.cleanupSession(sessionId, workspaceId);
+    });
+
+    return { sessionId, ...(name !== undefined ? { name } : {}), cols, rows };
+  }
+
+  /**
+   * Write input data to a PTY session's stdin.
+   *
+   * @throws Error if session not found
+   */
+  writeToSession(sessionId: string, data: string): void {
+    const session = this.sessions.get(sessionId);
+    if (!session) {
+      throw new Error(`Terminal session ${sessionId} not found`);
+    }
+    session.pty.write(data);
+  }
+
+  /**
+   * Resize a PTY session's terminal dimensions.
+   *
+   * @throws Error if session not found
+   */
+  resizeSession(sessionId: string, cols: number, rows: number): void {
+    const session = this.sessions.get(sessionId);
+    if (!session) {
+      throw new Error(`Terminal session ${sessionId} not found`);
+    }
+    session.pty.resize(cols, rows);
+    this.logger.debug(`Resized PTY session ${sessionId} to ${String(cols)}x${String(rows)}`);
+  }
+
+  /**
+   * Kill and clean up a specific PTY session.
+   * Returns true if the session existed, false if it was already gone.
+   */
+  closeSession(sessionId: string): boolean {
+    const session = this.sessions.get(sessionId);
+    if (!session) {
+      return false;
+    }
+
+    this.logger.log(`Closing PTY session ${sessionId} for workspace ${session.workspaceId}`);
+
+    try {
+      session.pty.kill();
+    } catch (error) {
+      this.logger.warn(
+        `Error killing PTY session ${sessionId}: ${error instanceof Error ? error.message : String(error)}`
+      );
+    }
+
+    this.cleanupSession(sessionId, session.workspaceId);
+    return true;
+  }
+
+  /**
+   * Close all PTY sessions for a workspace (called on client disconnect).
+   */
+  closeWorkspaceSessions(workspaceId: string): void {
+    const sessionIds = this.workspaceSessions.get(workspaceId);
+    if (!sessionIds || sessionIds.size === 0) {
+      return;
+    }
+
+    this.logger.log(
+      `Closing ${String(sessionIds.size)} PTY session(s) for workspace ${workspaceId} (disconnect)`
+    );
+
+    // Copy to array to avoid mutation during iteration
+    const ids = Array.from(sessionIds);
+    for (const sessionId of ids) {
+      const session = this.sessions.get(sessionId);
+      if (session) {
+        try {
+          session.pty.kill();
+        } catch (error) {
+          this.logger.warn(
+            `Error killing PTY session ${sessionId} on disconnect: ${error instanceof Error ? error.message : String(error)}`
+          );
+        }
+        this.cleanupSession(sessionId, workspaceId);
+      }
+    }
+  }
+
+  /**
+   * Get the number of active sessions for a workspace.
+   */
+  getWorkspaceSessionCount(workspaceId: string): number {
+    return this.workspaceSessions.get(workspaceId)?.size ?? 0;
+  }
+
+  /**
+   * Check if a session belongs to a given workspace.
+   * Used for access control in the gateway.
+   */
+  sessionBelongsToWorkspace(sessionId: string, workspaceId: string): boolean {
+    const session = this.sessions.get(sessionId);
+    return session?.workspaceId === workspaceId;
+  }
+
+  /**
+   * Internal cleanup: remove session from tracking maps.
+   * Does NOT kill the PTY (caller is responsible).
+   */
+  private cleanupSession(sessionId: string, workspaceId: string): void {
+    this.sessions.delete(sessionId);
+
+    const workspaceSessionIds = this.workspaceSessions.get(workspaceId);
+    if (workspaceSessionIds) {
+      workspaceSessionIds.delete(sessionId);
+      if (workspaceSessionIds.size === 0) {
+        this.workspaceSessions.delete(workspaceId);
+      }
+    }
+  }
+}

apps/api/src/users/preferences.controller.spec.ts

@@ -0,0 +1,112 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { UnauthorizedException } from "@nestjs/common";
+import { PreferencesController } from "./preferences.controller";
+import { PreferencesService } from "./preferences.service";
+import type { UpdatePreferencesDto, PreferencesResponseDto } from "./dto";
+import type { AuthenticatedRequest } from "../common/types/user.types";
+
+describe("PreferencesController", () => {
+  let controller: PreferencesController;
+  let service: PreferencesService;
+
+  const mockPreferencesService = {
+    getPreferences: vi.fn(),
+    updatePreferences: vi.fn(),
+  };
+
+  const mockUserId = "user-uuid-123";
+
+  const mockPreferencesResponse: PreferencesResponseDto = {
+    id: "pref-uuid-456",
+    userId: mockUserId,
+    theme: "system",
+    locale: "en",
+    timezone: null,
+    settings: {},
+    updatedAt: new Date("2026-01-01T00:00:00Z"),
+  };
+
+  function makeRequest(userId?: string): AuthenticatedRequest {
+    return {
+      user: userId ? { id: userId } : undefined,
+    } as unknown as AuthenticatedRequest;
+  }
+
+  beforeEach(() => {
+    service = mockPreferencesService as unknown as PreferencesService;
+    controller = new PreferencesController(service);
+    vi.clearAllMocks();
+  });
+
+  describe("GET /api/users/me/preferences", () => {
+    it("should return preferences for authenticated user", async () => {
+      mockPreferencesService.getPreferences.mockResolvedValue(mockPreferencesResponse);
+
+      const result = await controller.getPreferences(makeRequest(mockUserId));
+
+      expect(result).toEqual(mockPreferencesResponse);
+      expect(mockPreferencesService.getPreferences).toHaveBeenCalledWith(mockUserId);
+    });
+
+    it("should throw UnauthorizedException when user is not authenticated", async () => {
+      await expect(controller.getPreferences(makeRequest())).rejects.toThrow(UnauthorizedException);
+      expect(mockPreferencesService.getPreferences).not.toHaveBeenCalled();
+    });
+  });
+
+  describe("PUT /api/users/me/preferences", () => {
+    const updateDto: UpdatePreferencesDto = {
+      theme: "dark",
+      locale: "fr",
+      timezone: "Europe/Paris",
+    };
+
+    it("should update and return preferences for authenticated user", async () => {
+      const updatedResponse: PreferencesResponseDto = {
+        ...mockPreferencesResponse,
+        theme: "dark",
+        locale: "fr",
+        timezone: "Europe/Paris",
+      };
+      mockPreferencesService.updatePreferences.mockResolvedValue(updatedResponse);
+
+      const result = await controller.updatePreferences(updateDto, makeRequest(mockUserId));
+
+      expect(result).toEqual(updatedResponse);
+      expect(mockPreferencesService.updatePreferences).toHaveBeenCalledWith(mockUserId, updateDto);
+    });
+
+    it("should throw UnauthorizedException when user is not authenticated", async () => {
+      await expect(controller.updatePreferences(updateDto, makeRequest())).rejects.toThrow(
+        UnauthorizedException
+      );
+      expect(mockPreferencesService.updatePreferences).not.toHaveBeenCalled();
+    });
+  });
+
+  describe("PATCH /api/users/me/preferences", () => {
+    const patchDto: UpdatePreferencesDto = {
+      theme: "light",
+    };
+
+    it("should partially update and return preferences for authenticated user", async () => {
+      const patchedResponse: PreferencesResponseDto = {
+        ...mockPreferencesResponse,
+        theme: "light",
+      };
+      mockPreferencesService.updatePreferences.mockResolvedValue(patchedResponse);
+
+      const result = await controller.patchPreferences(patchDto, makeRequest(mockUserId));
+
+      expect(result).toEqual(patchedResponse);
+      expect(mockPreferencesService.updatePreferences).toHaveBeenCalledWith(mockUserId, patchDto);
+    });
+
+    it("should throw UnauthorizedException when user is not authenticated", async () => {
+      await expect(controller.patchPreferences(patchDto, makeRequest())).rejects.toThrow(
+        UnauthorizedException
+      );
+      expect(mockPreferencesService.updatePreferences).not.toHaveBeenCalled();
+    });
+  });
+});

apps/api/src/users/preferences.controller.ts

@@ -2,6 +2,7 @@ import {
   Controller,
   Get,
   Put,
+  Patch,
   Body,
   UseGuards,
   Request,
@@ -38,7 +39,7 @@ export class PreferencesController {
 
   /**
    * PUT /api/users/me/preferences
-   * Update current user's preferences
+   * Full replace of current user's preferences
    */
   @Put()
   async updatePreferences(
@@ -53,4 +54,22 @@ export class PreferencesController {
 
     return this.preferencesService.updatePreferences(userId, updatePreferencesDto);
   }
+
+  /**
+   * PATCH /api/users/me/preferences
+   * Partial update of current user's preferences
+   */
+  @Patch()
+  async patchPreferences(
+    @Body() updatePreferencesDto: UpdatePreferencesDto,
+    @Request() req: AuthenticatedRequest
+  ) {
+    const userId = req.user?.id;
+
+    if (!userId) {
+      throw new UnauthorizedException("Authentication required");
+    }
+
+    return this.preferencesService.updatePreferences(userId, updatePreferencesDto);
+  }
 }

apps/api/src/users/preferences.service.spec.ts

@@ -0,0 +1,141 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { PreferencesService } from "./preferences.service";
+import type { PrismaService } from "../prisma/prisma.service";
+import type { UpdatePreferencesDto } from "./dto";
+
+describe("PreferencesService", () => {
+  let service: PreferencesService;
+
+  const mockPrisma = {
+    userPreference: {
+      findUnique: vi.fn(),
+      create: vi.fn(),
+      update: vi.fn(),
+    },
+  };
+
+  const mockUserId = "user-uuid-123";
+
+  const mockDbPreference = {
+    id: "pref-uuid-456",
+    userId: mockUserId,
+    theme: "system",
+    locale: "en",
+    timezone: null,
+    settings: {},
+    updatedAt: new Date("2026-01-01T00:00:00Z"),
+  };
+
+  beforeEach(() => {
+    service = new PreferencesService(mockPrisma as unknown as PrismaService);
+    vi.clearAllMocks();
+  });
+
+  describe("getPreferences", () => {
+    it("should return existing preferences", async () => {
+      mockPrisma.userPreference.findUnique.mockResolvedValue(mockDbPreference);
+
+      const result = await service.getPreferences(mockUserId);
+
+      expect(result).toMatchObject({
+        id: mockDbPreference.id,
+        userId: mockUserId,
+        theme: "system",
+        locale: "en",
+        timezone: null,
+        settings: {},
+      });
+      expect(mockPrisma.userPreference.findUnique).toHaveBeenCalledWith({
+        where: { userId: mockUserId },
+      });
+      expect(mockPrisma.userPreference.create).not.toHaveBeenCalled();
+    });
+
+    it("should create default preferences when none exist", async () => {
+      mockPrisma.userPreference.findUnique.mockResolvedValue(null);
+      mockPrisma.userPreference.create.mockResolvedValue(mockDbPreference);
+
+      const result = await service.getPreferences(mockUserId);
+
+      expect(result).toMatchObject({
+        id: mockDbPreference.id,
+        userId: mockUserId,
+        theme: "system",
+        locale: "en",
+      });
+      expect(mockPrisma.userPreference.create).toHaveBeenCalledWith({
+        data: expect.objectContaining({
+          userId: mockUserId,
+          theme: "system",
+          locale: "en",
+        }),
+      });
+    });
+  });
+
+  describe("updatePreferences", () => {
+    it("should update existing preferences", async () => {
+      const updateDto: UpdatePreferencesDto = { theme: "dark", locale: "fr" };
+      const updatedPreference = { ...mockDbPreference, theme: "dark", locale: "fr" };
+
+      mockPrisma.userPreference.findUnique.mockResolvedValue(mockDbPreference);
+      mockPrisma.userPreference.update.mockResolvedValue(updatedPreference);
+
+      const result = await service.updatePreferences(mockUserId, updateDto);
+
+      expect(result).toMatchObject({ theme: "dark", locale: "fr" });
+      expect(mockPrisma.userPreference.update).toHaveBeenCalledWith({
+        where: { userId: mockUserId },
+        data: expect.objectContaining({ theme: "dark", locale: "fr" }),
+      });
+      expect(mockPrisma.userPreference.create).not.toHaveBeenCalled();
+    });
+
+    it("should create preferences when updating non-existent record", async () => {
+      const updateDto: UpdatePreferencesDto = { theme: "light" };
+      const createdPreference = { ...mockDbPreference, theme: "light" };
+
+      mockPrisma.userPreference.findUnique.mockResolvedValue(null);
+      mockPrisma.userPreference.create.mockResolvedValue(createdPreference);
+
+      const result = await service.updatePreferences(mockUserId, updateDto);
+
+      expect(result).toMatchObject({ theme: "light" });
+      expect(mockPrisma.userPreference.create).toHaveBeenCalledWith({
+        data: expect.objectContaining({
+          userId: mockUserId,
+          theme: "light",
+        }),
+      });
+      expect(mockPrisma.userPreference.update).not.toHaveBeenCalled();
+    });
+
+    it("should handle timezone update", async () => {
+      const updateDto: UpdatePreferencesDto = { timezone: "America/New_York" };
+      const updatedPreference = { ...mockDbPreference, timezone: "America/New_York" };
+
+      mockPrisma.userPreference.findUnique.mockResolvedValue(mockDbPreference);
+      mockPrisma.userPreference.update.mockResolvedValue(updatedPreference);
+
+      const result = await service.updatePreferences(mockUserId, updateDto);
+
+      expect(result.timezone).toBe("America/New_York");
+      expect(mockPrisma.userPreference.update).toHaveBeenCalledWith({
+        where: { userId: mockUserId },
+        data: expect.objectContaining({ timezone: "America/New_York" }),
+      });
+    });
+
+    it("should handle settings update", async () => {
+      const updateDto: UpdatePreferencesDto = { settings: { notifications: true } };
+      const updatedPreference = { ...mockDbPreference, settings: { notifications: true } };
+
+      mockPrisma.userPreference.findUnique.mockResolvedValue(mockDbPreference);
+      mockPrisma.userPreference.update.mockResolvedValue(updatedPreference);
+
+      const result = await service.updatePreferences(mockUserId, updateDto);
+
+      expect(result.settings).toEqual({ notifications: true });
+    });
+  });
+});

apps/api/src/websocket/websocket.gateway.ts

@@ -7,6 +7,7 @@ import {
 import { Logger } from "@nestjs/common";
 import { Server, Socket } from "socket.io";
 import { AuthService } from "../auth/auth.service";
+import { getTrustedOrigins } from "../auth/auth.config";
 import { PrismaService } from "../prisma/prisma.service";
 
 interface AuthenticatedSocket extends Socket {
@@ -77,7 +78,7 @@ interface StepOutputData {
  */
 @WSGateway({
   cors: {
-    origin: process.env.WEB_URL ?? "http://localhost:3000",
+    origin: getTrustedOrigins(),
     credentials: true,
   },
 })
@@ -167,17 +168,36 @@ export class WebSocketGateway implements OnGatewayConnection, OnGatewayDisconnec
   }
 
   /**
-   * @description Extract authentication token from Socket.IO handshake
+   * @description Extract authentication token from Socket.IO handshake.
+   *
+   * Checks sources in order:
+   * 1. handshake.auth.token  — explicit token (e.g. from API clients)
+   * 2. handshake.headers.cookie — session cookie sent by browser via withCredentials
+   * 3. query.token           — URL query parameter fallback
+   * 4. Authorization header  — Bearer token fallback
+   *
    * @param client - The socket client
    * @returns The token string or undefined if not found
    */
   private extractTokenFromHandshake(client: Socket): string | undefined {
-    // Check handshake.auth.token (preferred method)
+    // Check handshake.auth.token (preferred method for non-browser clients)
     const authToken = client.handshake.auth.token as unknown;
     if (typeof authToken === "string" && authToken.length > 0) {
       return authToken;
     }
 
+    // Fallback: parse session cookie from request headers.
+    // Browsers send httpOnly cookies automatically when withCredentials: true is set
+    // on the socket.io client.  BetterAuth uses one of these cookie names depending
+    // on whether the connection is HTTPS (Secure prefix) or HTTP (dev).
+    const cookieHeader = client.handshake.headers.cookie;
+    if (typeof cookieHeader === "string" && cookieHeader.length > 0) {
+      const cookieToken = this.extractTokenFromCookieHeader(cookieHeader);
+      if (cookieToken) {
+        return cookieToken;
+      }
+    }
+
     // Fallback: check query parameters
     const queryToken = client.handshake.query.token as unknown;
     if (typeof queryToken === "string" && queryToken.length > 0) {
@@ -197,6 +217,45 @@ export class WebSocketGateway implements OnGatewayConnection, OnGatewayDisconnec
     return undefined;
   }
 
+  /**
+   * @description Parse the BetterAuth session token from a raw Cookie header string.
+   *
+   * BetterAuth names the session cookie differently based on the security context:
+   * - `__Secure-better-auth.session_token` — HTTPS with Secure flag
+   * - `better-auth.session_token`           — HTTP (development)
+   * - `__Host-better-auth.session_token`    — HTTPS with Host prefix
+   *
+   * @param cookieHeader - The raw Cookie header value
+   * @returns The session token value or undefined if no matching cookie found
+   */
+  private extractTokenFromCookieHeader(cookieHeader: string): string | undefined {
+    const SESSION_COOKIE_NAMES = [
+      "__Secure-better-auth.session_token",
+      "better-auth.session_token",
+      "__Host-better-auth.session_token",
+    ] as const;
+
+    // Parse the Cookie header into a key-value map
+    const cookies = Object.fromEntries(
+      cookieHeader.split(";").map((pair) => {
+        const eqIndex = pair.indexOf("=");
+        if (eqIndex === -1) {
+          return [pair.trim(), ""];
+        }
+        return [pair.slice(0, eqIndex).trim(), pair.slice(eqIndex + 1).trim()];
+      })
+    );
+
+    for (const name of SESSION_COOKIE_NAMES) {
+      const value = cookies[name];
+      if (typeof value === "string" && value.length > 0) {
+        return value;
+      }
+    }
+
+    return undefined;
+  }
+
   /**
    * @description Handle client disconnect by leaving the workspace room.
    * @param client - The socket client containing workspaceId in data.

apps/api/src/widgets/widgets.controller.ts

@@ -1,22 +1,14 @@
-import {
+import { Controller, Get, Post, Body, Param, UseGuards, Request } from "@nestjs/common";
-  Controller,
-  Get,
-  Post,
-  Body,
-  Param,
-  UseGuards,
-  Request,
-  UnauthorizedException,
-} from "@nestjs/common";
 import { WidgetsService } from "./widgets.service";
 import { WidgetDataService } from "./widget-data.service";
 import { AuthGuard } from "../auth/guards/auth.guard";
+import { WorkspaceGuard } from "../common/guards/workspace.guard";
 import type { StatCardQueryDto, ChartQueryDto, ListQueryDto, CalendarPreviewQueryDto } from "./dto";
-import type { AuthenticatedRequest } from "../common/types/user.types";
+import type { RequestWithWorkspace } from "../common/types/user.types";
 
 /**
  * Controller for widget definition and data endpoints
- * All endpoints require authentication
+ * All endpoints require authentication; data endpoints also require workspace context
  */
 @Controller("widgets")
 @UseGuards(AuthGuard)
@@ -51,12 +43,9 @@ export class WidgetsController {
    * Get stat card widget data
    */
   @Post("data/stat-card")
-  async getStatCardData(@Request() req: AuthenticatedRequest, @Body() query: StatCardQueryDto) {
+  @UseGuards(WorkspaceGuard)
-    const workspaceId = req.user?.currentWorkspaceId ?? req.user?.workspaceId;
+  async getStatCardData(@Request() req: RequestWithWorkspace, @Body() query: StatCardQueryDto) {
-    if (!workspaceId) {
+    return this.widgetDataService.getStatCardData(req.workspace.id, query);
-      throw new UnauthorizedException("Workspace ID required");
-    }
-    return this.widgetDataService.getStatCardData(workspaceId, query);
   }
 
   /**
@@ -64,12 +53,9 @@ export class WidgetsController {
    * Get chart widget data
    */
   @Post("data/chart")
-  async getChartData(@Request() req: AuthenticatedRequest, @Body() query: ChartQueryDto) {
+  @UseGuards(WorkspaceGuard)
-    const workspaceId = req.user?.currentWorkspaceId ?? req.user?.workspaceId;
+  async getChartData(@Request() req: RequestWithWorkspace, @Body() query: ChartQueryDto) {
-    if (!workspaceId) {
+    return this.widgetDataService.getChartData(req.workspace.id, query);
-      throw new UnauthorizedException("Workspace ID required");
-    }
-    return this.widgetDataService.getChartData(workspaceId, query);
   }
 
   /**
@@ -77,12 +63,9 @@ export class WidgetsController {
    * Get list widget data
    */
   @Post("data/list")
-  async getListData(@Request() req: AuthenticatedRequest, @Body() query: ListQueryDto) {
+  @UseGuards(WorkspaceGuard)
-    const workspaceId = req.user?.currentWorkspaceId ?? req.user?.workspaceId;
+  async getListData(@Request() req: RequestWithWorkspace, @Body() query: ListQueryDto) {
-    if (!workspaceId) {
+    return this.widgetDataService.getListData(req.workspace.id, query);
-      throw new UnauthorizedException("Workspace ID required");
-    }
-    return this.widgetDataService.getListData(workspaceId, query);
   }
 
   /**
@@ -90,15 +73,12 @@ export class WidgetsController {
    * Get calendar preview widget data
    */
   @Post("data/calendar-preview")
+  @UseGuards(WorkspaceGuard)
   async getCalendarPreviewData(
-    @Request() req: AuthenticatedRequest,
+    @Request() req: RequestWithWorkspace,
     @Body() query: CalendarPreviewQueryDto
   ) {
-    const workspaceId = req.user?.currentWorkspaceId ?? req.user?.workspaceId;
+    return this.widgetDataService.getCalendarPreviewData(req.workspace.id, query);
-    if (!workspaceId) {
-      throw new UnauthorizedException("Workspace ID required");
-    }
-    return this.widgetDataService.getCalendarPreviewData(workspaceId, query);
   }
 
   /**
@@ -106,12 +86,9 @@ export class WidgetsController {
    * Get active projects widget data
    */
   @Post("data/active-projects")
-  async getActiveProjectsData(@Request() req: AuthenticatedRequest) {
+  @UseGuards(WorkspaceGuard)
-    const workspaceId = req.user?.currentWorkspaceId ?? req.user?.workspaceId;
+  async getActiveProjectsData(@Request() req: RequestWithWorkspace) {
-    if (!workspaceId) {
+    return this.widgetDataService.getActiveProjectsData(req.workspace.id);
-      throw new UnauthorizedException("Workspace ID required");
-    }
-    return this.widgetDataService.getActiveProjectsData(workspaceId);
   }
 
   /**
@@ -119,11 +96,8 @@ export class WidgetsController {
    * Get agent chains widget data (active agent sessions)
    */
   @Post("data/agent-chains")
-  async getAgentChainsData(@Request() req: AuthenticatedRequest) {
+  @UseGuards(WorkspaceGuard)
-    const workspaceId = req.user?.currentWorkspaceId ?? req.user?.workspaceId;
+  async getAgentChainsData(@Request() req: RequestWithWorkspace) {
-    if (!workspaceId) {
+    return this.widgetDataService.getAgentChainsData(req.workspace.id);
-      throw new UnauthorizedException("Workspace ID required");
-    }
-    return this.widgetDataService.getAgentChainsData(workspaceId);
   }
 }

apps/api/src/workspaces/dto/add-member.dto.ts

@@ -0,0 +1,13 @@
+import { WorkspaceMemberRole } from "@prisma/client";
+import { IsEnum, IsUUID } from "class-validator";
+
+/**
+ * DTO for adding a user to a workspace.
+ */
+export class AddMemberDto {
+  @IsUUID("4", { message: "userId must be a valid UUID" })
+  userId!: string;
+
+  @IsEnum(WorkspaceMemberRole, { message: "role must be a valid WorkspaceMemberRole" })
+  role!: WorkspaceMemberRole;
+}

apps/api/src/workspaces/dto/index.ts

@@ -0,0 +1,3 @@
+export { AddMemberDto } from "./add-member.dto";
+export { UpdateMemberRoleDto } from "./update-member-role.dto";
+export { WorkspaceResponseDto } from "./workspace-response.dto";

apps/api/src/workspaces/dto/update-member-role.dto.ts

@@ -0,0 +1,10 @@
+import { WorkspaceMemberRole } from "@prisma/client";
+import { IsEnum } from "class-validator";
+
+/**
+ * DTO for updating a workspace member's role.
+ */
+export class UpdateMemberRoleDto {
+  @IsEnum(WorkspaceMemberRole, { message: "role must be a valid WorkspaceMemberRole" })
+  role!: WorkspaceMemberRole;
+}

apps/api/src/workspaces/dto/workspace-response.dto.ts

@@ -0,0 +1,12 @@
+import type { WorkspaceMemberRole } from "@prisma/client";
+
+/**
+ * Response DTO for a workspace the authenticated user belongs to.
+ */
+export class WorkspaceResponseDto {
+  id!: string;
+  name!: string;
+  ownerId!: string;
+  role!: WorkspaceMemberRole;
+  createdAt!: Date;
+}

apps/api/src/workspaces/index.ts

@@ -0,0 +1,3 @@
+export { WorkspacesModule } from "./workspaces.module";
+export { WorkspacesService } from "./workspaces.service";
+export { WorkspacesController } from "./workspaces.controller";

apps/api/src/workspaces/workspaces.controller.spec.ts

@@ -0,0 +1,149 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { Test, TestingModule } from "@nestjs/testing";
+import { WorkspacesController } from "./workspaces.controller";
+import { WorkspacesService } from "./workspaces.service";
+import { AuthGuard } from "../auth/guards/auth.guard";
+import { WorkspaceGuard, PermissionGuard } from "../common/guards";
+import { WorkspaceMemberRole } from "@prisma/client";
+import type { AuthUser } from "@mosaic/shared";
+
+describe("WorkspacesController", () => {
+  let controller: WorkspacesController;
+  let service: WorkspacesService;
+
+  const mockWorkspacesService = {
+    getUserWorkspaces: vi.fn(),
+    addMember: vi.fn(),
+    updateMemberRole: vi.fn(),
+    removeMember: vi.fn(),
+  };
+
+  const mockUser: AuthUser = {
+    id: "user-1",
+    email: "test@example.com",
+    name: "Test User",
+  };
+
+  beforeEach(async () => {
+    const module: TestingModule = await Test.createTestingModule({
+      controllers: [WorkspacesController],
+      providers: [
+        {
+          provide: WorkspacesService,
+          useValue: mockWorkspacesService,
+        },
+      ],
+    })
+      .overrideGuard(AuthGuard)
+      .useValue({ canActivate: () => true })
+      .overrideGuard(WorkspaceGuard)
+      .useValue({ canActivate: () => true })
+      .overrideGuard(PermissionGuard)
+      .useValue({ canActivate: () => true })
+      .compile();
+
+    controller = module.get<WorkspacesController>(WorkspacesController);
+    service = module.get<WorkspacesService>(WorkspacesService);
+
+    vi.clearAllMocks();
+  });
+
+  describe("GET /api/workspaces", () => {
+    it("should call service with authenticated user id", async () => {
+      mockWorkspacesService.getUserWorkspaces.mockResolvedValueOnce([]);
+
+      await controller.getUserWorkspaces(mockUser);
+
+      expect(service.getUserWorkspaces).toHaveBeenCalledWith("user-1");
+    });
+
+    it("should return workspace list from service", async () => {
+      const mockWorkspaces = [
+        {
+          id: "ws-1",
+          name: "My Workspace",
+          ownerId: "user-1",
+          role: WorkspaceMemberRole.OWNER,
+          createdAt: new Date("2026-01-01"),
+        },
+      ];
+      mockWorkspacesService.getUserWorkspaces.mockResolvedValueOnce(mockWorkspaces);
+
+      const result = await controller.getUserWorkspaces(mockUser);
+
+      expect(result).toEqual(mockWorkspaces);
+    });
+
+    it("should propagate service errors", async () => {
+      mockWorkspacesService.getUserWorkspaces.mockRejectedValueOnce(new Error("Database error"));
+
+      await expect(controller.getUserWorkspaces(mockUser)).rejects.toThrow("Database error");
+    });
+  });
+
+  describe("POST /api/workspaces/:id/members", () => {
+    it("should call service with workspace id, actor id, and add member dto", async () => {
+      const workspaceId = "ws-1";
+      const addMemberDto = {
+        userId: "user-2",
+        role: WorkspaceMemberRole.MEMBER,
+      };
+      const mockMember = {
+        workspaceId,
+        userId: "user-2",
+        role: WorkspaceMemberRole.MEMBER,
+        joinedAt: new Date("2026-02-01"),
+      };
+      mockWorkspacesService.addMember.mockResolvedValueOnce(mockMember);
+
+      const result = await controller.addMember(workspaceId, addMemberDto, mockUser);
+
+      expect(result).toEqual(mockMember);
+      expect(service.addMember).toHaveBeenCalledWith(workspaceId, mockUser.id, addMemberDto);
+    });
+  });
+
+  describe("PATCH /api/workspaces/:id/members/:userId", () => {
+    it("should call service with workspace id, actor id, target user id, and role dto", async () => {
+      const workspaceId = "ws-1";
+      const targetUserId = "user-2";
+      const updateRoleDto = {
+        role: WorkspaceMemberRole.ADMIN,
+      };
+      const mockMember = {
+        workspaceId,
+        userId: targetUserId,
+        role: WorkspaceMemberRole.ADMIN,
+        joinedAt: new Date("2026-02-01"),
+      };
+      mockWorkspacesService.updateMemberRole.mockResolvedValueOnce(mockMember);
+
+      const result = await controller.updateMemberRole(
+        workspaceId,
+        targetUserId,
+        updateRoleDto,
+        mockUser
+      );
+
+      expect(result).toEqual(mockMember);
+      expect(service.updateMemberRole).toHaveBeenCalledWith(
+        workspaceId,
+        mockUser.id,
+        targetUserId,
+        updateRoleDto
+      );
+    });
+  });
+
+  describe("DELETE /api/workspaces/:id/members/:userId", () => {
+    it("should call service with workspace id, actor id, and target user id", async () => {
+      const workspaceId = "ws-1";
+      const targetUserId = "user-2";
+      mockWorkspacesService.removeMember.mockResolvedValueOnce(undefined);
+
+      await controller.removeMember(workspaceId, targetUserId, mockUser);
+
+      expect(service.removeMember).toHaveBeenCalledWith(workspaceId, mockUser.id, targetUserId);
+    });
+  });
+});

apps/api/src/workspaces/workspaces.controller.ts

@@ -0,0 +1,85 @@
+import { Body, Controller, Delete, Get, Param, Patch, Post, UseGuards } from "@nestjs/common";
+import { WorkspacesService } from "./workspaces.service";
+import { AuthGuard } from "../auth/guards/auth.guard";
+import { CurrentUser } from "../auth/decorators/current-user.decorator";
+import { WorkspaceGuard, PermissionGuard } from "../common/guards";
+import { Permission, RequirePermission } from "../common/decorators";
+import type { WorkspaceMember } from "@prisma/client";
+import type { AuthenticatedUser } from "../common/types/user.types";
+import type { AddMemberDto, UpdateMemberRoleDto, WorkspaceResponseDto } from "./dto";
+
+/**
+ * User-scoped workspace operations.
+ *
+ * Intentionally does NOT use WorkspaceGuard — these routes operate across all
+ * workspaces the user belongs to, not within a single workspace context.
+ */
+@Controller("workspaces")
+@UseGuards(AuthGuard)
+export class WorkspacesController {
+  constructor(private readonly workspacesService: WorkspacesService) {}
+
+  /**
+   * GET /api/workspaces
+   * Returns workspaces the authenticated user is a member of.
+   * Auto-provisions a default workspace if the user has none.
+   */
+  @Get()
+  async getUserWorkspaces(@CurrentUser() user: AuthenticatedUser): Promise<WorkspaceResponseDto[]> {
+    return this.workspacesService.getUserWorkspaces(user.id);
+  }
+
+  /**
+   * POST /api/workspaces/:workspaceId/members
+   * Add a member to a workspace with the specified role.
+   * Requires: ADMIN role or higher.
+   */
+  @Post(":workspaceId/members")
+  @UseGuards(WorkspaceGuard, PermissionGuard)
+  @RequirePermission(Permission.WORKSPACE_ADMIN)
+  async addMember(
+    @Param("workspaceId") workspaceId: string,
+    @Body() addMemberDto: AddMemberDto,
+    @CurrentUser() user: AuthenticatedUser
+  ): Promise<WorkspaceMember> {
+    return this.workspacesService.addMember(workspaceId, user.id, addMemberDto);
+  }
+
+  /**
+   * PATCH /api/workspaces/:workspaceId/members/:userId
+   * Change a member role in a workspace.
+   * Requires: ADMIN role or higher.
+   */
+  @Patch(":workspaceId/members/:userId")
+  @UseGuards(WorkspaceGuard, PermissionGuard)
+  @RequirePermission(Permission.WORKSPACE_ADMIN)
+  async updateMemberRole(
+    @Param("workspaceId") workspaceId: string,
+    @Param("userId") targetUserId: string,
+    @Body() updateMemberRoleDto: UpdateMemberRoleDto,
+    @CurrentUser() user: AuthenticatedUser
+  ): Promise<WorkspaceMember> {
+    return this.workspacesService.updateMemberRole(
+      workspaceId,
+      user.id,
+      targetUserId,
+      updateMemberRoleDto
+    );
+  }
+
+  /**
+   * DELETE /api/workspaces/:workspaceId/members/:userId
+   * Remove a member from a workspace.
+   * Requires: ADMIN role or higher.
+   */
+  @Delete(":workspaceId/members/:userId")
+  @UseGuards(WorkspaceGuard, PermissionGuard)
+  @RequirePermission(Permission.WORKSPACE_ADMIN)
+  async removeMember(
+    @Param("workspaceId") workspaceId: string,
+    @Param("userId") targetUserId: string,
+    @CurrentUser() user: AuthenticatedUser
+  ): Promise<void> {
+    await this.workspacesService.removeMember(workspaceId, user.id, targetUserId);
+  }
+}

apps/api/src/workspaces/workspaces.module.ts

@@ -0,0 +1,13 @@
+import { Module } from "@nestjs/common";
+import { WorkspacesController } from "./workspaces.controller";
+import { WorkspacesService } from "./workspaces.service";
+import { PrismaModule } from "../prisma/prisma.module";
+import { AuthModule } from "../auth/auth.module";
+
+@Module({
+  imports: [PrismaModule, AuthModule],
+  controllers: [WorkspacesController],
+  providers: [WorkspacesService],
+  exports: [WorkspacesService],
+})
+export class WorkspacesModule {}

apps/api/src/workspaces/workspaces.service.spec.ts

@@ -0,0 +1,516 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { Test, TestingModule } from "@nestjs/testing";
+import { WorkspacesService } from "./workspaces.service";
+import { PrismaService } from "../prisma/prisma.service";
+import { WorkspaceMemberRole } from "@prisma/client";
+import {
+  BadRequestException,
+  ConflictException,
+  ForbiddenException,
+  NotFoundException,
+} from "@nestjs/common";
+
+describe("WorkspacesService", () => {
+  let service: WorkspacesService;
+
+  const mockUserId = "550e8400-e29b-41d4-a716-446655440001";
+  const mockAdminUserId = "550e8400-e29b-41d4-a716-446655440010";
+  const mockMemberUserId = "550e8400-e29b-41d4-a716-446655440011";
+  const mockWorkspaceId = "550e8400-e29b-41d4-a716-446655440002";
+
+  const mockWorkspace = {
+    id: mockWorkspaceId,
+    name: "Test Workspace",
+    ownerId: mockUserId,
+    settings: {},
+    matrixRoomId: null,
+    createdAt: new Date("2026-01-01"),
+    updatedAt: new Date("2026-01-01"),
+  };
+
+  const mockMembership = {
+    workspaceId: mockWorkspaceId,
+    userId: mockUserId,
+    role: WorkspaceMemberRole.OWNER,
+    joinedAt: new Date("2026-01-01"),
+    workspace: {
+      id: mockWorkspaceId,
+      name: "Test Workspace",
+      ownerId: mockUserId,
+      createdAt: new Date("2026-01-01"),
+    },
+  };
+
+  const mockPrismaService = {
+    workspaceMember: {
+      findMany: vi.fn(),
+      findUnique: vi.fn(),
+      count: vi.fn(),
+      create: vi.fn(),
+      update: vi.fn(),
+      delete: vi.fn(),
+    },
+    workspace: {
+      create: vi.fn(),
+    },
+    user: {
+      findUnique: vi.fn(),
+    },
+    $transaction: vi.fn(),
+  };
+
+  beforeEach(async () => {
+    const module: TestingModule = await Test.createTestingModule({
+      providers: [
+        WorkspacesService,
+        {
+          provide: PrismaService,
+          useValue: mockPrismaService,
+        },
+      ],
+    }).compile();
+
+    service = module.get<WorkspacesService>(WorkspacesService);
+
+    vi.clearAllMocks();
+
+    mockPrismaService.$transaction.mockImplementation(
+      async (fn: (tx: typeof mockPrismaService) => Promise<unknown>) =>
+        fn(mockPrismaService as unknown as typeof mockPrismaService)
+    );
+  });
+
+  describe("getUserWorkspaces", () => {
+    it("should return all workspaces user is a member of", async () => {
+      mockPrismaService.workspaceMember.findMany.mockResolvedValueOnce([mockMembership]);
+
+      const result = await service.getUserWorkspaces(mockUserId);
+
+      expect(result).toEqual([
+        {
+          id: mockWorkspaceId,
+          name: "Test Workspace",
+          ownerId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          createdAt: mockMembership.workspace.createdAt,
+        },
+      ]);
+      expect(mockPrismaService.workspaceMember.findMany).toHaveBeenCalledWith({
+        where: { userId: mockUserId },
+        include: {
+          workspace: {
+            select: { id: true, name: true, ownerId: true, createdAt: true },
+          },
+        },
+        orderBy: { joinedAt: "asc" },
+      });
+    });
+
+    it("should return multiple workspaces ordered by joinedAt", async () => {
+      const secondWorkspace = {
+        ...mockMembership,
+        workspaceId: "ws-2",
+        role: WorkspaceMemberRole.MEMBER,
+        joinedAt: new Date("2026-02-01"),
+        workspace: {
+          id: "ws-2",
+          name: "Second Workspace",
+          ownerId: "other-user",
+          createdAt: new Date("2026-02-01"),
+        },
+      };
+
+      mockPrismaService.workspaceMember.findMany.mockResolvedValueOnce([
+        mockMembership,
+        secondWorkspace,
+      ]);
+
+      const result = await service.getUserWorkspaces(mockUserId);
+
+      expect(result).toHaveLength(2);
+      expect(result[0].id).toBe(mockWorkspaceId);
+      expect(result[1].id).toBe("ws-2");
+      expect(result[1].role).toBe(WorkspaceMemberRole.MEMBER);
+    });
+
+    it("should auto-provision a default workspace when user has no memberships", async () => {
+      mockPrismaService.workspaceMember.findMany.mockResolvedValueOnce([]);
+      mockPrismaService.$transaction.mockImplementationOnce(
+        async (fn: (tx: typeof mockPrismaService) => Promise<unknown>) => {
+          const txMock = {
+            workspaceMember: {
+              findFirst: vi.fn().mockResolvedValueOnce(null),
+              create: vi.fn().mockResolvedValueOnce({}),
+            },
+            workspace: {
+              create: vi.fn().mockResolvedValueOnce(mockWorkspace),
+            },
+          };
+          return fn(txMock as unknown as typeof mockPrismaService);
+        }
+      );
+
+      const result = await service.getUserWorkspaces(mockUserId);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].name).toBe("Test Workspace");
+      expect(result[0].role).toBe(WorkspaceMemberRole.OWNER);
+      expect(mockPrismaService.$transaction).toHaveBeenCalledTimes(1);
+    });
+
+    it("should return existing workspace if one was created between initial check and transaction", async () => {
+      // Simulates a race condition: initial findMany returns [], but inside the
+      // transaction another request already created a workspace.
+      mockPrismaService.workspaceMember.findMany.mockResolvedValueOnce([]);
+      mockPrismaService.$transaction.mockImplementationOnce(
+        async (fn: (tx: typeof mockPrismaService) => Promise<unknown>) => {
+          const txMock = {
+            workspaceMember: {
+              findFirst: vi.fn().mockResolvedValueOnce(mockMembership),
+            },
+            workspace: {
+              create: vi.fn(),
+            },
+          };
+          return fn(txMock as unknown as typeof mockPrismaService);
+        }
+      );
+
+      const result = await service.getUserWorkspaces(mockUserId);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].id).toBe(mockWorkspaceId);
+      expect(result[0].name).toBe("Test Workspace");
+    });
+
+    it("should create workspace with correct data during auto-provisioning", async () => {
+      mockPrismaService.workspaceMember.findMany.mockResolvedValueOnce([]);
+
+      let capturedWorkspaceData: unknown;
+      let capturedMemberData: unknown;
+
+      mockPrismaService.$transaction.mockImplementationOnce(
+        async (fn: (tx: typeof mockPrismaService) => Promise<unknown>) => {
+          const txMock = {
+            workspaceMember: {
+              findFirst: vi.fn().mockResolvedValueOnce(null),
+              create: vi.fn().mockImplementation((args: unknown) => {
+                capturedMemberData = args;
+                return {};
+              }),
+            },
+            workspace: {
+              create: vi.fn().mockImplementation((args: unknown) => {
+                capturedWorkspaceData = args;
+                return mockWorkspace;
+              }),
+            },
+          };
+          return fn(txMock as unknown as typeof mockPrismaService);
+        }
+      );
+
+      await service.getUserWorkspaces(mockUserId);
+
+      expect(capturedWorkspaceData).toEqual({
+        data: {
+          name: "My Workspace",
+          ownerId: mockUserId,
+          settings: {},
+        },
+      });
+      expect(capturedMemberData).toEqual({
+        data: {
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+        },
+      });
+    });
+
+    it("should not auto-provision when user already has workspaces", async () => {
+      mockPrismaService.workspaceMember.findMany.mockResolvedValueOnce([mockMembership]);
+
+      await service.getUserWorkspaces(mockUserId);
+
+      expect(mockPrismaService.$transaction).not.toHaveBeenCalled();
+    });
+
+    it("should propagate database errors", async () => {
+      mockPrismaService.workspaceMember.findMany.mockRejectedValueOnce(
+        new Error("Database connection failed")
+      );
+
+      await expect(service.getUserWorkspaces(mockUserId)).rejects.toThrow(
+        "Database connection failed"
+      );
+    });
+  });
+
+  describe("addMember", () => {
+    const addMemberDto = {
+      userId: mockMemberUserId,
+      role: WorkspaceMemberRole.MEMBER,
+    };
+
+    it("should add a new member to the workspace", async () => {
+      const createdMembership = {
+        workspaceId: mockWorkspaceId,
+        userId: mockMemberUserId,
+        role: WorkspaceMemberRole.MEMBER,
+        joinedAt: new Date("2026-02-02"),
+      };
+      mockPrismaService.user.findUnique.mockResolvedValueOnce({ id: mockMemberUserId });
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockAdminUserId,
+          role: WorkspaceMemberRole.ADMIN,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce(null);
+      mockPrismaService.workspaceMember.create.mockResolvedValueOnce(createdMembership);
+
+      const result = await service.addMember(mockWorkspaceId, mockAdminUserId, addMemberDto);
+
+      expect(result).toEqual(createdMembership);
+      expect(mockPrismaService.workspaceMember.create).toHaveBeenCalledWith({
+        data: {
+          workspaceId: mockWorkspaceId,
+          userId: mockMemberUserId,
+          role: WorkspaceMemberRole.MEMBER,
+        },
+      });
+    });
+
+    it("should throw NotFoundException when user does not exist", async () => {
+      mockPrismaService.workspaceMember.findUnique.mockResolvedValueOnce({
+        workspaceId: mockWorkspaceId,
+        userId: mockAdminUserId,
+        role: WorkspaceMemberRole.ADMIN,
+        joinedAt: new Date("2026-01-01"),
+      });
+      mockPrismaService.user.findUnique.mockResolvedValueOnce(null);
+
+      await expect(
+        service.addMember(mockWorkspaceId, mockAdminUserId, addMemberDto)
+      ).rejects.toThrow(NotFoundException);
+    });
+
+    it("should throw ConflictException when user is already a member", async () => {
+      mockPrismaService.workspaceMember.findUnique.mockResolvedValueOnce({
+        workspaceId: mockWorkspaceId,
+        userId: mockAdminUserId,
+        role: WorkspaceMemberRole.ADMIN,
+        joinedAt: new Date("2026-01-01"),
+      });
+      mockPrismaService.user.findUnique.mockResolvedValueOnce({ id: mockMemberUserId });
+      mockPrismaService.workspaceMember.findUnique.mockResolvedValueOnce({
+        workspaceId: mockWorkspaceId,
+        userId: mockMemberUserId,
+        role: WorkspaceMemberRole.MEMBER,
+        joinedAt: new Date("2026-01-02"),
+      });
+
+      await expect(
+        service.addMember(mockWorkspaceId, mockAdminUserId, addMemberDto)
+      ).rejects.toThrow(ConflictException);
+    });
+
+    it("should throw ForbiddenException when admin tries to assign OWNER role", async () => {
+      mockPrismaService.workspaceMember.findUnique.mockResolvedValueOnce({
+        workspaceId: mockWorkspaceId,
+        userId: mockAdminUserId,
+        role: WorkspaceMemberRole.ADMIN,
+        joinedAt: new Date("2026-01-01"),
+      });
+
+      await expect(
+        service.addMember(mockWorkspaceId, mockAdminUserId, {
+          userId: mockMemberUserId,
+          role: WorkspaceMemberRole.OWNER,
+        })
+      ).rejects.toThrow(ForbiddenException);
+    });
+  });
+
+  describe("updateMemberRole", () => {
+    it("should update a member role", async () => {
+      const updatedMembership = {
+        workspaceId: mockWorkspaceId,
+        userId: mockMemberUserId,
+        role: WorkspaceMemberRole.ADMIN,
+        joinedAt: new Date("2026-01-02"),
+      };
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockMemberUserId,
+          role: WorkspaceMemberRole.MEMBER,
+          joinedAt: new Date("2026-01-02"),
+        });
+      mockPrismaService.workspaceMember.update.mockResolvedValueOnce(updatedMembership);
+
+      const result = await service.updateMemberRole(mockWorkspaceId, mockUserId, mockMemberUserId, {
+        role: WorkspaceMemberRole.ADMIN,
+      });
+
+      expect(result).toEqual(updatedMembership);
+      expect(mockPrismaService.workspaceMember.update).toHaveBeenCalledWith({
+        where: {
+          workspaceId_userId: {
+            workspaceId: mockWorkspaceId,
+            userId: mockMemberUserId,
+          },
+        },
+        data: {
+          role: WorkspaceMemberRole.ADMIN,
+        },
+      });
+    });
+
+    it("should throw NotFoundException when target member does not exist", async () => {
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce(null);
+
+      await expect(
+        service.updateMemberRole(mockWorkspaceId, mockUserId, mockMemberUserId, {
+          role: WorkspaceMemberRole.ADMIN,
+        })
+      ).rejects.toThrow(NotFoundException);
+    });
+
+    it("should throw BadRequestException when sole owner attempts self-demotion", async () => {
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        });
+      mockPrismaService.workspaceMember.count.mockResolvedValueOnce(1);
+
+      await expect(
+        service.updateMemberRole(mockWorkspaceId, mockUserId, mockUserId, {
+          role: WorkspaceMemberRole.ADMIN,
+        })
+      ).rejects.toThrow(BadRequestException);
+    });
+
+    it("should throw ForbiddenException when actor tries to change role of higher-ranked member", async () => {
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockAdminUserId,
+          role: WorkspaceMemberRole.ADMIN,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        });
+
+      await expect(
+        service.updateMemberRole(mockWorkspaceId, mockAdminUserId, mockUserId, {
+          role: WorkspaceMemberRole.MEMBER,
+        })
+      ).rejects.toThrow(ForbiddenException);
+    });
+  });
+
+  describe("removeMember", () => {
+    it("should remove a workspace member", async () => {
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockMemberUserId,
+          role: WorkspaceMemberRole.MEMBER,
+          joinedAt: new Date("2026-01-02"),
+        });
+      mockPrismaService.workspaceMember.delete.mockResolvedValueOnce({
+        workspaceId: mockWorkspaceId,
+        userId: mockMemberUserId,
+        role: WorkspaceMemberRole.MEMBER,
+        joinedAt: new Date("2026-01-02"),
+      });
+
+      await service.removeMember(mockWorkspaceId, mockUserId, mockMemberUserId);
+
+      expect(mockPrismaService.workspaceMember.delete).toHaveBeenCalledWith({
+        where: {
+          workspaceId_userId: {
+            workspaceId: mockWorkspaceId,
+            userId: mockMemberUserId,
+          },
+        },
+      });
+    });
+
+    it("should throw BadRequestException when trying to remove the last owner", async () => {
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        });
+      mockPrismaService.workspaceMember.count.mockResolvedValueOnce(1);
+
+      await expect(service.removeMember(mockWorkspaceId, mockUserId, mockUserId)).rejects.toThrow(
+        BadRequestException
+      );
+    });
+
+    it("should throw ForbiddenException when admin attempts to remove an owner", async () => {
+      mockPrismaService.workspaceMember.findUnique
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockAdminUserId,
+          role: WorkspaceMemberRole.ADMIN,
+          joinedAt: new Date("2026-01-01"),
+        })
+        .mockResolvedValueOnce({
+          workspaceId: mockWorkspaceId,
+          userId: mockUserId,
+          role: WorkspaceMemberRole.OWNER,
+          joinedAt: new Date("2026-01-01"),
+        });
+
+      await expect(
+        service.removeMember(mockWorkspaceId, mockAdminUserId, mockUserId)
+      ).rejects.toThrow(ForbiddenException);
+    });
+  });
+});

apps/api/src/workspaces/workspaces.service.ts

@@ -0,0 +1,345 @@
+import {
+  BadRequestException,
+  ConflictException,
+  ForbiddenException,
+  Injectable,
+  Logger,
+  NotFoundException,
+} from "@nestjs/common";
+import { Prisma, WorkspaceMemberRole } from "@prisma/client";
+import type { WorkspaceMember } from "@prisma/client";
+import { PrismaService } from "../prisma/prisma.service";
+import type { AddMemberDto, UpdateMemberRoleDto, WorkspaceResponseDto } from "./dto";
+
+const WORKSPACE_ROLE_RANK: Record<WorkspaceMemberRole, number> = {
+  [WorkspaceMemberRole.GUEST]: 1,
+  [WorkspaceMemberRole.MEMBER]: 2,
+  [WorkspaceMemberRole.ADMIN]: 3,
+  [WorkspaceMemberRole.OWNER]: 4,
+};
+
+@Injectable()
+export class WorkspacesService {
+  private readonly logger = new Logger(WorkspacesService.name);
+
+  constructor(private readonly prisma: PrismaService) {}
+
+  /**
+   * Get all workspaces the user is a member of.
+   *
+   * Auto-provisioning: if the user has no workspace memberships (e.g. fresh
+   * signup via BetterAuth), a default workspace is created atomically and
+   * returned.  This is the only call site for workspace bootstrapping.
+   */
+  async getUserWorkspaces(userId: string): Promise<WorkspaceResponseDto[]> {
+    const memberships = await this.prisma.workspaceMember.findMany({
+      where: { userId },
+      include: {
+        workspace: {
+          select: { id: true, name: true, ownerId: true, createdAt: true },
+        },
+      },
+      orderBy: { joinedAt: "asc" },
+    });
+
+    if (memberships.length > 0) {
+      return memberships.map((m) => ({
+        id: m.workspace.id,
+        name: m.workspace.name,
+        ownerId: m.workspace.ownerId,
+        role: m.role,
+        createdAt: m.workspace.createdAt,
+      }));
+    }
+
+    // Auto-provision a default workspace for new users.
+    // Re-query inside the transaction to guard against concurrent requests
+    // both seeing zero memberships and creating duplicate workspaces.
+    this.logger.log(`Auto-provisioning default workspace for user ${userId}`);
+
+    const workspace = await this.prisma.$transaction(async (tx) => {
+      const existing = await tx.workspaceMember.findFirst({
+        where: { userId },
+        include: {
+          workspace: {
+            select: { id: true, name: true, ownerId: true, createdAt: true },
+          },
+        },
+      });
+      if (existing) {
+        return { ...existing.workspace, alreadyExisted: true as const };
+      }
+
+      const created = await tx.workspace.create({
+        data: {
+          name: "My Workspace",
+          ownerId: userId,
+          settings: {},
+        },
+      });
+      await tx.workspaceMember.create({
+        data: {
+          workspaceId: created.id,
+          userId,
+          role: WorkspaceMemberRole.OWNER,
+        },
+      });
+      return { ...created, alreadyExisted: false as const };
+    });
+
+    if (workspace.alreadyExisted) {
+      return [
+        {
+          id: workspace.id,
+          name: workspace.name,
+          ownerId: workspace.ownerId,
+          role: WorkspaceMemberRole.OWNER,
+          createdAt: workspace.createdAt,
+        },
+      ];
+    }
+
+    return [
+      {
+        id: workspace.id,
+        name: workspace.name,
+        ownerId: workspace.ownerId,
+        role: WorkspaceMemberRole.OWNER,
+        createdAt: workspace.createdAt,
+      },
+    ];
+  }
+
+  /**
+   * Add a member to a workspace.
+   */
+  async addMember(
+    workspaceId: string,
+    actorUserId: string,
+    addMemberDto: AddMemberDto
+  ): Promise<WorkspaceMember> {
+    const actorMembership = await this.prisma.workspaceMember.findUnique({
+      where: {
+        workspaceId_userId: {
+          workspaceId,
+          userId: actorUserId,
+        },
+      },
+      select: {
+        role: true,
+      },
+    });
+
+    if (!actorMembership) {
+      throw new ForbiddenException("You are not a member of this workspace");
+    }
+
+    this.assertCanAssignRole(actorMembership.role, addMemberDto.role);
+
+    const user = await this.prisma.user.findUnique({
+      where: { id: addMemberDto.userId },
+      select: { id: true },
+    });
+
+    if (!user) {
+      throw new NotFoundException(`User with ID ${addMemberDto.userId} not found`);
+    }
+
+    const existingMembership = await this.prisma.workspaceMember.findUnique({
+      where: {
+        workspaceId_userId: {
+          workspaceId,
+          userId: addMemberDto.userId,
+        },
+      },
+      select: {
+        workspaceId: true,
+        userId: true,
+      },
+    });
+
+    if (existingMembership) {
+      throw new ConflictException("User is already a member of this workspace");
+    }
+
+    try {
+      return await this.prisma.workspaceMember.create({
+        data: {
+          workspaceId,
+          userId: addMemberDto.userId,
+          role: addMemberDto.role,
+        },
+      });
+    } catch (error) {
+      if (this.isUniqueConstraintError(error)) {
+        throw new ConflictException("User is already a member of this workspace");
+      }
+      throw error;
+    }
+  }
+
+  /**
+   * Update the role of an existing workspace member.
+   */
+  async updateMemberRole(
+    workspaceId: string,
+    actorUserId: string,
+    targetUserId: string,
+    updateMemberRoleDto: UpdateMemberRoleDto
+  ): Promise<WorkspaceMember> {
+    return this.prisma.$transaction(async (tx) => {
+      const actorMembership = await tx.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId: actorUserId,
+          },
+        },
+        select: {
+          role: true,
+        },
+      });
+
+      if (!actorMembership) {
+        throw new ForbiddenException("You are not a member of this workspace");
+      }
+
+      const targetMembership = await tx.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId: targetUserId,
+          },
+        },
+        select: {
+          role: true,
+        },
+      });
+
+      if (!targetMembership) {
+        throw new NotFoundException(`User ${targetUserId} is not a member of this workspace`);
+      }
+
+      this.assertCanManageTargetMember(actorMembership.role, targetMembership.role);
+      this.assertCanAssignRole(actorMembership.role, updateMemberRoleDto.role);
+
+      if (targetMembership.role === WorkspaceMemberRole.OWNER) {
+        const isDemotion = updateMemberRoleDto.role !== WorkspaceMemberRole.OWNER;
+        if (isDemotion) {
+          const ownerCount = await tx.workspaceMember.count({
+            where: {
+              workspaceId,
+              role: WorkspaceMemberRole.OWNER,
+            },
+          });
+          if (ownerCount <= 1) {
+            if (actorUserId === targetUserId) {
+              throw new BadRequestException("Cannot self-demote if you are the sole owner");
+            }
+            throw new BadRequestException("Cannot remove the last owner from a workspace");
+          }
+        }
+      }
+
+      return tx.workspaceMember.update({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId: targetUserId,
+          },
+        },
+        data: {
+          role: updateMemberRoleDto.role,
+        },
+      });
+    });
+  }
+
+  /**
+   * Remove a member from a workspace.
+   */
+  async removeMember(
+    workspaceId: string,
+    actorUserId: string,
+    targetUserId: string
+  ): Promise<void> {
+    await this.prisma.$transaction(async (tx) => {
+      const actorMembership = await tx.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId: actorUserId,
+          },
+        },
+        select: {
+          role: true,
+        },
+      });
+
+      if (!actorMembership) {
+        throw new ForbiddenException("You are not a member of this workspace");
+      }
+
+      const targetMembership = await tx.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId: targetUserId,
+          },
+        },
+        select: {
+          role: true,
+        },
+      });
+
+      if (!targetMembership) {
+        throw new NotFoundException(`User ${targetUserId} is not a member of this workspace`);
+      }
+
+      this.assertCanManageTargetMember(actorMembership.role, targetMembership.role);
+
+      if (targetMembership.role === WorkspaceMemberRole.OWNER) {
+        const ownerCount = await tx.workspaceMember.count({
+          where: {
+            workspaceId,
+            role: WorkspaceMemberRole.OWNER,
+          },
+        });
+        if (ownerCount <= 1) {
+          throw new BadRequestException("Cannot remove the last owner from a workspace");
+        }
+      }
+
+      await tx.workspaceMember.delete({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId: targetUserId,
+          },
+        },
+      });
+    });
+  }
+
+  private assertCanAssignRole(
+    actorRole: WorkspaceMemberRole,
+    requestedRole: WorkspaceMemberRole
+  ): void {
+    if (WORKSPACE_ROLE_RANK[actorRole] < WORKSPACE_ROLE_RANK[requestedRole]) {
+      throw new ForbiddenException("You cannot assign a role higher than your own");
+    }
+  }
+
+  private assertCanManageTargetMember(
+    actorRole: WorkspaceMemberRole,
+    targetRole: WorkspaceMemberRole
+  ): void {
+    if (WORKSPACE_ROLE_RANK[actorRole] < WORKSPACE_ROLE_RANK[targetRole]) {
+      throw new ForbiddenException("You cannot manage a member with a higher role");
+    }
+  }
+
+  private isUniqueConstraintError(error: unknown): error is Prisma.PrismaClientKnownRequestError {
+    return error instanceof Prisma.PrismaClientKnownRequestError && error.code === "P2002";
+  }
+}

apps/orchestrator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mosaic/orchestrator",
-  "version": "0.0.6",
+  "version": "0.0.20",
   "private": true,
   "scripts": {
     "dev": "nest start --watch",

apps/web/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/dev/types/routes.d.ts";
+import "./.next/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mosaic/web",
-  "version": "0.0.1",
+  "version": "0.0.20",
   "private": true,
   "scripts": {
     "build": "next build",
@@ -18,15 +18,30 @@
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^9.0.0",
     "@dnd-kit/utilities": "^3.2.2",
+    "@hello-pangea/dnd": "^18.0.1",
     "@mosaic/shared": "workspace:*",
     "@mosaic/ui": "workspace:*",
     "@tanstack/react-query": "^5.90.20",
+    "@tiptap/extension-code-block-lowlight": "^3.20.0",
+    "@tiptap/extension-link": "^3.20.0",
+    "@tiptap/extension-placeholder": "^3.20.0",
+    "@tiptap/extension-table": "^3.20.0",
+    "@tiptap/extension-table-cell": "^3.20.0",
+    "@tiptap/extension-table-header": "^3.20.0",
+    "@tiptap/extension-table-row": "^3.20.0",
+    "@tiptap/pm": "^3.20.0",
+    "@tiptap/react": "^3.20.0",
+    "@tiptap/starter-kit": "^3.20.0",
     "@types/dompurify": "^3.2.0",
+    "@xterm/addon-fit": "^0.11.0",
+    "@xterm/addon-web-links": "^0.12.0",
+    "@xterm/xterm": "^6.0.0",
     "@xyflow/react": "^12.5.3",
     "better-auth": "^1.4.17",
     "date-fns": "^4.1.0",
     "dompurify": "^3.3.1",
     "elkjs": "^0.9.3",
+    "lowlight": "^3.3.0",
     "lucide-react": "^0.563.0",
     "mermaid": "^11.4.1",
     "next": "^16.1.6",
@@ -34,7 +49,8 @@
     "react-dom": "^19.0.0",
     "react-grid-layout": "^2.2.2",
     "recharts": "^3.7.0",
-    "socket.io-client": "^4.8.3"
+    "socket.io-client": "^4.8.3",
+    "tiptap-markdown": "^0.9.0"
   },
   "devDependencies": {
     "@mosaic/config": "workspace:*",

apps/web/src/app/(auth)/login/page.tsx

@@ -128,12 +128,31 @@ function LoginPageContent(): ReactElement {
     setError(null);
     const callbackURL =
       typeof window !== "undefined" ? new URL("/", window.location.origin).toString() : "/";
-    signIn.oauth2({ providerId, callbackURL }).catch((err: unknown) => {
+    signIn
-      const message = err instanceof Error ? err.message : String(err);
+      .oauth2({ providerId, callbackURL })
-      console.error(`[Auth] OAuth sign-in initiation failed for ${providerId}:`, message);
+      .then((result) => {
-      setError("Unable to connect to the sign-in provider. Please try again in a moment.");
+        // BetterAuth returns Data | Error union — check for error or missing redirect URL
-      setOauthLoading(null);
+        const hasError = "error" in result && result.error;
-    });
+        const hasUrl = "data" in result && result.data?.url;
+        if (hasError || !hasUrl) {
+          const errObj = hasError ? result.error : null;
+          const message =
+            errObj && typeof errObj === "object" && "message" in errObj
+              ? String(errObj.message)
+              : "no redirect URL";
+          console.error(`[Auth] OAuth sign-in failed for ${providerId}:`, message);
+          setError("Unable to connect to the sign-in provider. Please try again in a moment.");
+          setOauthLoading(null);
+        }
+        // If data.url exists, BetterAuth's client will redirect the browser automatically.
+        // No need to reset loading — the page is navigating away.
+      })
+      .catch((err: unknown) => {
+        const message = err instanceof Error ? err.message : String(err);
+        console.error(`[Auth] OAuth sign-in initiation failed for ${providerId}:`, message);
+        setError("Unable to connect to the sign-in provider. Please try again in a moment.");
+        setOauthLoading(null);
+      });
   }, []);
 
   const handleCredentialsLogin = useCallback(
@@ -307,7 +326,7 @@ function LoginPageContent(): ReactElement {
         </div>
 
         <div className="mt-6 flex justify-center">
-          <AuthStatusPill label="Mosaic v0.1" tone="neutral" />
+          <AuthStatusPill label="Mosaic v0.0.20" tone="neutral" />
         </div>
       </AuthCard>
     </AuthShell>

apps/web/src/app/(authenticated)/calendar/page.test.tsx

@@ -1,5 +1,6 @@
-import { describe, it, expect, vi } from "vitest";
+import { describe, it, expect, vi, beforeEach } from "vitest";
 import { render, screen, waitFor } from "@testing-library/react";
+import type { Event } from "@mosaic/shared";
 import CalendarPage from "./page";
 
 // Mock the Calendar component
@@ -15,15 +16,94 @@ vi.mock("@/components/calendar/Calendar", () => ({
   ),
 }));
 
+// Mock MosaicSpinner
+vi.mock("@/components/ui/MosaicSpinner", () => ({
+  MosaicSpinner: ({ label }: { label?: string }): React.JSX.Element => (
+    <div data-testid="mosaic-spinner">{label ?? "Loading..."}</div>
+  ),
+}));
+
+// Mock useWorkspaceId
+const mockUseWorkspaceId = vi.fn<() => string | null>();
+vi.mock("@/lib/hooks", () => ({
+  useWorkspaceId: (): string | null => mockUseWorkspaceId(),
+}));
+
+// Mock fetchEvents
+const mockFetchEvents = vi.fn<() => Promise<Event[]>>();
+vi.mock("@/lib/api/events", () => ({
+  fetchEvents: (...args: unknown[]): Promise<Event[]> => mockFetchEvents(...(args as [])),
+}));
+
+const fakeEvents: Event[] = [
+  {
+    id: "event-1",
+    title: "Team standup",
+    description: "Daily standup meeting",
+    startTime: new Date("2026-02-20T09:00:00Z"),
+    endTime: new Date("2026-02-20T09:30:00Z"),
+    allDay: false,
+    location: null,
+    recurrence: null,
+    creatorId: "user-1",
+    projectId: null,
+    workspaceId: "ws-1",
+    metadata: {},
+    createdAt: new Date("2026-01-28"),
+    updatedAt: new Date("2026-01-28"),
+  },
+  {
+    id: "event-2",
+    title: "Sprint planning",
+    description: "Bi-weekly sprint planning",
+    startTime: new Date("2026-02-21T14:00:00Z"),
+    endTime: new Date("2026-02-21T15:00:00Z"),
+    allDay: false,
+    location: null,
+    recurrence: null,
+    creatorId: "user-1",
+    projectId: null,
+    workspaceId: "ws-1",
+    metadata: {},
+    createdAt: new Date("2026-01-28"),
+    updatedAt: new Date("2026-01-28"),
+  },
+  {
+    id: "event-3",
+    title: "All-day workshop",
+    description: null,
+    startTime: new Date("2026-02-22T00:00:00Z"),
+    endTime: null,
+    allDay: true,
+    location: "Conference Room A",
+    recurrence: null,
+    creatorId: "user-1",
+    projectId: null,
+    workspaceId: "ws-1",
+    metadata: {},
+    createdAt: new Date("2026-01-28"),
+    updatedAt: new Date("2026-01-28"),
+  },
+];
+
 describe("CalendarPage", (): void => {
+  beforeEach((): void => {
+    vi.clearAllMocks();
+    mockUseWorkspaceId.mockReturnValue("ws-1");
+    mockFetchEvents.mockResolvedValue(fakeEvents);
+  });
+
   it("should render the page title", (): void => {
     render(<CalendarPage />);
     expect(screen.getByRole("heading", { level: 1 })).toHaveTextContent("Calendar");
   });
 
   it("should show loading state initially", (): void => {
+    // Never resolve so we stay in loading state
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    mockFetchEvents.mockReturnValue(new Promise<Event[]>(() => {}));
     render(<CalendarPage />);
-    expect(screen.getByTestId("calendar")).toHaveTextContent("Loading");
+    expect(screen.getByTestId("mosaic-spinner")).toBeInTheDocument();
   });
 
   it("should render the Calendar with events after loading", async (): Promise<void> => {
@@ -43,4 +123,31 @@ describe("CalendarPage", (): void => {
     render(<CalendarPage />);
     expect(screen.getByText("View your schedule at a glance")).toBeInTheDocument();
   });
+
+  it("should show empty state when no events exist", async (): Promise<void> => {
+    mockFetchEvents.mockResolvedValue([]);
+    render(<CalendarPage />);
+    await waitFor((): void => {
+      expect(screen.getByText("No events scheduled")).toBeInTheDocument();
+    });
+  });
+
+  it("should show error state on API failure", async (): Promise<void> => {
+    mockFetchEvents.mockRejectedValue(new Error("Network error"));
+    render(<CalendarPage />);
+    await waitFor((): void => {
+      expect(screen.getByText("Network error")).toBeInTheDocument();
+    });
+    expect(screen.getByRole("button", { name: /try again/i })).toBeInTheDocument();
+  });
+
+  it("should not fetch when workspace ID is not available", async (): Promise<void> => {
+    mockUseWorkspaceId.mockReturnValue(null);
+    render(<CalendarPage />);
+
+    // Wait a tick to ensure useEffect ran
+    await waitFor((): void => {
+      expect(mockFetchEvents).not.toHaveBeenCalled();
+    });
+  });
 });

apps/web/src/app/(authenticated)/calendar/page.tsx

@@ -3,57 +3,161 @@
 import { useState, useEffect } from "react";
 import type { ReactElement } from "react";
 import { Calendar } from "@/components/calendar/Calendar";
-import { mockEvents } from "@/lib/api/events";
+import { fetchEvents } from "@/lib/api/events";
+import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
+import { useWorkspaceId } from "@/lib/hooks";
 import type { Event } from "@mosaic/shared";
 
 export default function CalendarPage(): ReactElement {
+  const workspaceId = useWorkspaceId();
   const [events, setEvents] = useState<Event[]>([]);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
-    void loadEvents();
+    if (!workspaceId) {
-  }, []);
-
-  async function loadEvents(): Promise<void> {
-    setIsLoading(true);
-    setError(null);
-
-    try {
-      // TODO: Replace with real API call when backend is ready
-      // const data = await fetchEvents();
-      await new Promise((resolve) => setTimeout(resolve, 300));
-      setEvents(mockEvents);
-    } catch (err) {
-      setError(
-        err instanceof Error
-          ? err.message
-          : "We had trouble loading your calendar. Please try again when you're ready."
-      );
-    } finally {
       setIsLoading(false);
+      return;
     }
+
+    const wsId = workspaceId;
+    let cancelled = false;
+    setError(null);
+    setIsLoading(true);
+
+    async function loadEvents(): Promise<void> {
+      try {
+        const data = await fetchEvents(wsId);
+        if (!cancelled) {
+          setEvents(data);
+        }
+      } catch (err: unknown) {
+        console.error("[Calendar] Failed to fetch events:", err);
+        if (!cancelled) {
+          setError(
+            err instanceof Error
+              ? err.message
+              : "We had trouble loading your calendar. Please try again when you're ready."
+          );
+        }
+      } finally {
+        if (!cancelled) {
+          setIsLoading(false);
+        }
+      }
+    }
+
+    void loadEvents();
+
+    return (): void => {
+      cancelled = true;
+    };
+  }, [workspaceId]);
+
+  function handleRetry(): void {
+    if (!workspaceId) return;
+
+    const wsId = workspaceId;
+    setError(null);
+    setIsLoading(true);
+
+    fetchEvents(wsId)
+      .then((data) => {
+        setEvents(data);
+      })
+      .catch((err: unknown) => {
+        console.error("[Calendar] Retry failed:", err);
+        setError(
+          err instanceof Error
+            ? err.message
+            : "We had trouble loading your calendar. Please try again when you're ready."
+        );
+      })
+      .finally(() => {
+        setIsLoading(false);
+      });
+  }
+
+  if (isLoading) {
+    return (
+      <main className="container mx-auto px-4 py-8">
+        <div className="mb-8">
+          <h1 className="text-3xl font-bold" style={{ color: "var(--text)" }}>
+            Calendar
+          </h1>
+          <p style={{ color: "var(--text-muted)" }} className="mt-2">
+            View your schedule at a glance
+          </p>
+        </div>
+        <div className="flex justify-center py-16">
+          <MosaicSpinner label="Loading calendar..." />
+        </div>
+      </main>
+    );
+  }
+
+  if (error !== null) {
+    return (
+      <main className="container mx-auto px-4 py-8">
+        <div className="mb-8">
+          <h1 className="text-3xl font-bold" style={{ color: "var(--text)" }}>
+            Calendar
+          </h1>
+          <p style={{ color: "var(--text-muted)" }} className="mt-2">
+            View your schedule at a glance
+          </p>
+        </div>
+        <div
+          className="rounded-lg p-6 text-center"
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+          }}
+        >
+          <p style={{ color: "var(--danger)" }}>{error}</p>
+          <button
+            onClick={handleRetry}
+            className="mt-4 rounded-md px-4 py-2 text-sm font-medium transition-colors"
+            style={{
+              background: "var(--accent)",
+              color: "var(--surface)",
+            }}
+          >
+            Try again
+          </button>
+        </div>
+      </main>
+    );
   }
 
   return (
     <main className="container mx-auto px-4 py-8">
       <div className="mb-8">
-        <h1 className="text-3xl font-bold text-gray-900">Calendar</h1>
+        <h1 className="text-3xl font-bold" style={{ color: "var(--text)" }}>
-        <p className="text-gray-600 mt-2">View your schedule at a glance</p>
+          Calendar
+        </h1>
+        <p style={{ color: "var(--text-muted)" }} className="mt-2">
+          View your schedule at a glance
+        </p>
       </div>
 
-      {error !== null ? (
+      {events.length === 0 ? (
-        <div className="rounded-lg border border-amber-200 bg-amber-50 p-6 text-center">
+        <div
-          <p className="text-amber-800">{error}</p>
+          className="rounded-lg p-8 text-center"
-          <button
+          style={{
-            onClick={() => void loadEvents()}
+            background: "var(--surface)",
-            className="mt-4 rounded-md bg-amber-600 px-4 py-2 text-sm font-medium text-white hover:bg-amber-700 transition-colors"
+            border: "1px solid var(--border)",
-          >
+          }}
-            Try again
+        >
-          </button>
+          <p className="text-lg" style={{ color: "var(--text-muted)" }}>
+            No events scheduled
+          </p>
+          <p className="text-sm mt-2" style={{ color: "var(--text-muted)" }}>
+            Your calendar is clear
+          </p>
         </div>
       ) : (
-        <Calendar events={events} isLoading={isLoading} />
+        <Calendar events={events} isLoading={false} />
       )}
     </main>
   );

apps/web/src/app/(authenticated)/kanban/page.tsx

@@ -0,0 +1,765 @@
+"use client";
+
+import { useState, useEffect, useCallback, useMemo } from "react";
+import type { ReactElement } from "react";
+import { useSearchParams, useRouter } from "next/navigation";
+import { DragDropContext, Droppable, Draggable } from "@hello-pangea/dnd";
+import type {
+  DropResult,
+  DroppableProvided,
+  DraggableProvided,
+  DraggableStateSnapshot,
+} from "@hello-pangea/dnd";
+
+import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
+import { fetchTasks, updateTask, type TaskFilters } from "@/lib/api/tasks";
+import { fetchProjects, type Project } from "@/lib/api/projects";
+import { useWorkspaceId } from "@/lib/hooks";
+import type { Task } from "@mosaic/shared";
+import { TaskStatus, TaskPriority } from "@mosaic/shared";
+
+/* ---------------------------------------------------------------------------
+   Column configuration
+   --------------------------------------------------------------------------- */
+
+interface ColumnConfig {
+  status: TaskStatus;
+  label: string;
+  accent: string;
+}
+
+const COLUMNS: ColumnConfig[] = [
+  { status: TaskStatus.NOT_STARTED, label: "To Do", accent: "var(--ms-blue-400)" },
+  { status: TaskStatus.IN_PROGRESS, label: "In Progress", accent: "var(--ms-amber-400)" },
+  { status: TaskStatus.PAUSED, label: "Paused", accent: "var(--ms-purple-400)" },
+  { status: TaskStatus.COMPLETED, label: "Done", accent: "var(--ms-teal-400)" },
+  { status: TaskStatus.ARCHIVED, label: "Archived", accent: "var(--muted)" },
+];
+
+const PRIORITY_OPTIONS: { value: string; label: string }[] = [
+  { value: "", label: "All Priorities" },
+  { value: TaskPriority.HIGH, label: "High" },
+  { value: TaskPriority.MEDIUM, label: "Medium" },
+  { value: TaskPriority.LOW, label: "Low" },
+];
+
+/* ---------------------------------------------------------------------------
+   Filter select shared styles
+   --------------------------------------------------------------------------- */
+
+const selectStyle: React.CSSProperties = {
+  padding: "6px 10px",
+  borderRadius: "var(--r)",
+  border: "1px solid var(--border)",
+  background: "var(--surface)",
+  color: "var(--text)",
+  fontSize: "0.83rem",
+  outline: "none",
+  minWidth: 130,
+};
+
+const inputStyle: React.CSSProperties = {
+  ...selectStyle,
+  minWidth: 180,
+};
+
+/* ---------------------------------------------------------------------------
+   Priority badge helper
+   --------------------------------------------------------------------------- */
+
+interface PriorityStyle {
+  label: string;
+  bg: string;
+  color: string;
+}
+
+function getPriorityStyle(priority: TaskPriority): PriorityStyle {
+  switch (priority) {
+    case TaskPriority.HIGH:
+      return { label: "High", bg: "rgba(229,72,77,0.15)", color: "var(--danger)" };
+    case TaskPriority.MEDIUM:
+      return { label: "Medium", bg: "rgba(245,158,11,0.15)", color: "var(--warn)" };
+    case TaskPriority.LOW:
+      return { label: "Low", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
+    default:
+      return { label: String(priority), bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
+  }
+}
+
+/* ---------------------------------------------------------------------------
+   Task Card
+   --------------------------------------------------------------------------- */
+
+interface TaskCardProps {
+  task: Task;
+  provided: DraggableProvided;
+  snapshot: DraggableStateSnapshot;
+  columnAccent: string;
+}
+
+function TaskCard({ task, provided, snapshot, columnAccent }: TaskCardProps): ReactElement {
+  const [hovered, setHovered] = useState(false);
+  const priorityStyle = getPriorityStyle(task.priority);
+
+  return (
+    <div
+      ref={provided.innerRef}
+      {...provided.draggableProps}
+      {...provided.dragHandleProps}
+      onMouseEnter={() => {
+        setHovered(true);
+      }}
+      onMouseLeave={() => {
+        setHovered(false);
+      }}
+      style={{
+        background: "var(--surface)",
+        border: `1px solid ${hovered || snapshot.isDragging ? columnAccent : "var(--border)"}`,
+        borderRadius: "var(--r)",
+        padding: 12,
+        marginBottom: 8,
+        cursor: "grab",
+        transition: "border-color 0.15s, box-shadow 0.15s",
+        boxShadow: snapshot.isDragging ? "var(--shadow-lg)" : "none",
+        ...provided.draggableProps.style,
+      }}
+    >
+      {/* Title */}
+      <div
+        style={{
+          fontWeight: 600,
+          color: "var(--text)",
+          fontSize: "0.875rem",
+          marginBottom: 6,
+          overflow: "hidden",
+          textOverflow: "ellipsis",
+          whiteSpace: "nowrap",
+        }}
+      >
+        {task.title}
+      </div>
+
+      {/* Priority badge */}
+      <span
+        style={{
+          display: "inline-block",
+          padding: "1px 8px",
+          borderRadius: "var(--r-sm)",
+          background: priorityStyle.bg,
+          color: priorityStyle.color,
+          fontSize: "0.7rem",
+          fontWeight: 500,
+          marginBottom: 6,
+        }}
+      >
+        {priorityStyle.label}
+      </span>
+
+      {/* Description */}
+      {task.description && (
+        <p
+          style={{
+            color: "var(--muted)",
+            fontSize: "0.8rem",
+            margin: 0,
+            overflow: "hidden",
+            textOverflow: "ellipsis",
+            display: "-webkit-box",
+            WebkitLineClamp: 2,
+            WebkitBoxOrient: "vertical",
+            lineHeight: 1.4,
+          }}
+        >
+          {task.description}
+        </p>
+      )}
+    </div>
+  );
+}
+
+/* ---------------------------------------------------------------------------
+   Kanban Column
+   --------------------------------------------------------------------------- */
+
+interface KanbanColumnProps {
+  config: ColumnConfig;
+  tasks: Task[];
+}
+
+function KanbanColumn({ config, tasks }: KanbanColumnProps): ReactElement {
+  return (
+    <div
+      style={{
+        minWidth: 280,
+        maxWidth: 340,
+        flex: "1 0 280px",
+        display: "flex",
+        flexDirection: "column",
+        background: "var(--bg-mid)",
+        borderRadius: "var(--r-lg)",
+        overflow: "hidden",
+      }}
+    >
+      {/* Column header */}
+      <div
+        style={{
+          borderTop: `3px solid ${config.accent}`,
+          padding: "12px 16px",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+        }}
+      >
+        <span
+          style={{
+            fontWeight: 600,
+            fontSize: "0.85rem",
+            color: "var(--text)",
+          }}
+        >
+          {config.label}
+        </span>
+        <span
+          style={{
+            display: "inline-flex",
+            alignItems: "center",
+            justifyContent: "center",
+            minWidth: 22,
+            height: 22,
+            padding: "0 6px",
+            borderRadius: "var(--r)",
+            background: `color-mix(in srgb, ${config.accent} 15%, transparent)`,
+            color: config.accent,
+            fontSize: "0.75rem",
+            fontWeight: 600,
+            fontFamily: "var(--mono)",
+          }}
+        >
+          {tasks.length}
+        </span>
+      </div>
+
+      {/* Droppable area */}
+      <Droppable droppableId={config.status}>
+        {(provided: DroppableProvided) => (
+          <div
+            ref={provided.innerRef}
+            {...provided.droppableProps}
+            style={{
+              padding: "8px 12px 12px",
+              flex: 1,
+              minHeight: 80,
+              overflowY: "auto",
+            }}
+          >
+            {tasks.map((task, index) => (
+              <Draggable key={task.id} draggableId={task.id} index={index}>
+                {(dragProvided: DraggableProvided, dragSnapshot: DraggableStateSnapshot) => (
+                  <TaskCard
+                    task={task}
+                    provided={dragProvided}
+                    snapshot={dragSnapshot}
+                    columnAccent={config.accent}
+                  />
+                )}
+              </Draggable>
+            ))}
+            {provided.placeholder}
+          </div>
+        )}
+      </Droppable>
+    </div>
+  );
+}
+
+/* ---------------------------------------------------------------------------
+   Filter Bar
+   --------------------------------------------------------------------------- */
+
+interface FilterBarProps {
+  projects: Project[];
+  projectId: string;
+  priority: string;
+  search: string;
+  myTasks: boolean;
+  onProjectChange: (value: string) => void;
+  onPriorityChange: (value: string) => void;
+  onSearchChange: (value: string) => void;
+  onMyTasksToggle: () => void;
+  onClear: () => void;
+  hasActiveFilters: boolean;
+}
+
+function FilterBar({
+  projects,
+  projectId,
+  priority,
+  search,
+  myTasks,
+  onProjectChange,
+  onPriorityChange,
+  onSearchChange,
+  onMyTasksToggle,
+  onClear,
+  hasActiveFilters,
+}: FilterBarProps): ReactElement {
+  return (
+    <div
+      style={{
+        display: "flex",
+        alignItems: "center",
+        flexWrap: "wrap",
+        gap: 8,
+        padding: "10px 14px",
+        background: "var(--surface)",
+        border: "1px solid var(--border)",
+        borderRadius: "var(--r-lg)",
+        marginBottom: 16,
+      }}
+    >
+      {/* Search */}
+      <input
+        type="text"
+        placeholder="Search tasks..."
+        value={search}
+        onChange={(e): void => {
+          onSearchChange(e.target.value);
+        }}
+        style={inputStyle}
+      />
+
+      {/* Project filter */}
+      <select
+        value={projectId}
+        onChange={(e): void => {
+          onProjectChange(e.target.value);
+        }}
+        style={selectStyle}
+      >
+        <option value="">All Projects</option>
+        {projects.map((p) => (
+          <option key={p.id} value={p.id}>
+            {p.name}
+          </option>
+        ))}
+      </select>
+
+      {/* Priority filter */}
+      <select
+        value={priority}
+        onChange={(e): void => {
+          onPriorityChange(e.target.value);
+        }}
+        style={selectStyle}
+      >
+        {PRIORITY_OPTIONS.map((opt) => (
+          <option key={opt.value} value={opt.value}>
+            {opt.label}
+          </option>
+        ))}
+      </select>
+
+      {/* My Tasks toggle */}
+      <button
+        type="button"
+        onClick={onMyTasksToggle}
+        style={{
+          padding: "6px 12px",
+          borderRadius: "var(--r)",
+          border: myTasks ? "1px solid var(--primary)" : "1px solid var(--border)",
+          background: myTasks ? "var(--primary)" : "transparent",
+          color: myTasks ? "#fff" : "var(--text-2)",
+          fontSize: "0.83rem",
+          fontWeight: 500,
+          cursor: "pointer",
+          transition: "all 0.12s ease",
+          whiteSpace: "nowrap",
+        }}
+      >
+        My Tasks
+      </button>
+
+      {/* Clear filters */}
+      {hasActiveFilters && (
+        <button
+          type="button"
+          onClick={onClear}
+          style={{
+            padding: "6px 12px",
+            borderRadius: "var(--r)",
+            border: "1px solid var(--border)",
+            background: "transparent",
+            color: "var(--muted)",
+            fontSize: "0.83rem",
+            fontWeight: 500,
+            cursor: "pointer",
+            whiteSpace: "nowrap",
+          }}
+        >
+          Clear
+        </button>
+      )}
+    </div>
+  );
+}
+
+/* ---------------------------------------------------------------------------
+   Kanban Board Page
+   --------------------------------------------------------------------------- */
+
+export default function KanbanPage(): ReactElement {
+  const workspaceId = useWorkspaceId();
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  const [tasks, setTasks] = useState<Task[]>([]);
+  const [projects, setProjects] = useState<Project[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Read filters from URL params
+  const filterProject = searchParams.get("project") ?? "";
+  const filterPriority = searchParams.get("priority") ?? "";
+  const filterSearch = searchParams.get("q") ?? "";
+  const filterMyTasks = searchParams.get("my") === "1";
+
+  const hasActiveFilters =
+    filterProject !== "" || filterPriority !== "" || filterSearch !== "" || filterMyTasks;
+
+  /** Update a single URL param (preserving others) */
+  const setParam = useCallback(
+    (key: string, value: string) => {
+      const params = new URLSearchParams(searchParams.toString());
+      if (value) {
+        params.set(key, value);
+      } else {
+        params.delete(key);
+      }
+      router.replace(`/kanban?${params.toString()}`, { scroll: false });
+    },
+    [searchParams, router]
+  );
+
+  const handleProjectChange = useCallback(
+    (value: string) => {
+      setParam("project", value);
+    },
+    [setParam]
+  );
+
+  const handlePriorityChange = useCallback(
+    (value: string) => {
+      setParam("priority", value);
+    },
+    [setParam]
+  );
+
+  const handleSearchChange = useCallback(
+    (value: string) => {
+      setParam("q", value);
+    },
+    [setParam]
+  );
+
+  const handleMyTasksToggle = useCallback(() => {
+    setParam("my", filterMyTasks ? "" : "1");
+  }, [setParam, filterMyTasks]);
+
+  const handleClearFilters = useCallback(() => {
+    router.replace("/kanban", { scroll: false });
+  }, [router]);
+
+  /* --- data fetching --- */
+
+  const loadTasks = useCallback(async (wsId: string | null): Promise<void> => {
+    try {
+      setIsLoading(true);
+      setError(null);
+      const filters = wsId !== null ? { workspaceId: wsId } : {};
+      const data = await fetchTasks(filters);
+      setTasks(data);
+    } catch (err: unknown) {
+      console.error("[Kanban] Failed to fetch tasks:", err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : "Something went wrong loading tasks. You could try again when ready."
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    if (!workspaceId) {
+      setIsLoading(false);
+      return;
+    }
+
+    const ac = new AbortController();
+
+    async function load(): Promise<void> {
+      try {
+        setIsLoading(true);
+        setError(null);
+        const filters: TaskFilters = {};
+        if (workspaceId) filters.workspaceId = workspaceId;
+        const [taskData, projectData] = await Promise.all([
+          fetchTasks(filters),
+          fetchProjects(workspaceId ?? undefined),
+        ]);
+        if (ac.signal.aborted) return;
+        setTasks(taskData);
+        setProjects(projectData);
+      } catch (err: unknown) {
+        console.error("[Kanban] Failed to fetch tasks:", err);
+        if (ac.signal.aborted) return;
+        setError(
+          err instanceof Error
+            ? err.message
+            : "Something went wrong loading tasks. You could try again when ready."
+        );
+      } finally {
+        if (!ac.signal.aborted) {
+          setIsLoading(false);
+        }
+      }
+    }
+
+    void load();
+
+    return (): void => {
+      ac.abort();
+    };
+  }, [workspaceId]);
+
+  /* --- apply client-side filters --- */
+
+  const filteredTasks = useMemo(() => {
+    let result = tasks;
+
+    if (filterProject) {
+      result = result.filter((t) => t.projectId === filterProject);
+    }
+
+    if (filterPriority) {
+      result = result.filter((t) => t.priority === (filterPriority as TaskPriority));
+    }
+
+    if (filterSearch) {
+      const q = filterSearch.toLowerCase();
+      result = result.filter(
+        (t) => t.title.toLowerCase().includes(q) || t.description?.toLowerCase().includes(q)
+      );
+    }
+
+    if (filterMyTasks) {
+      // "My Tasks" filters to tasks assigned to the current user.
+      // Since we don't have the current userId readily available,
+      // filter by assigneeId being non-null (assigned tasks).
+      // A proper implementation would compare against the logged-in user's ID.
+      result = result.filter((t) => t.assigneeId !== null);
+    }
+
+    return result;
+  }, [tasks, filterProject, filterPriority, filterSearch, filterMyTasks]);
+
+  /* --- group tasks by status --- */
+
+  function groupByStatus(allTasks: Task[]): Record<TaskStatus, Task[]> {
+    const grouped: Record<TaskStatus, Task[]> = {
+      [TaskStatus.NOT_STARTED]: [],
+      [TaskStatus.IN_PROGRESS]: [],
+      [TaskStatus.PAUSED]: [],
+      [TaskStatus.COMPLETED]: [],
+      [TaskStatus.ARCHIVED]: [],
+    };
+
+    for (const task of allTasks) {
+      grouped[task.status].push(task);
+    }
+
+    return grouped;
+  }
+
+  const grouped = groupByStatus(filteredTasks);
+
+  /* --- drag-and-drop handler --- */
+
+  const handleDragEnd = useCallback(
+    (result: DropResult) => {
+      const { source, destination, draggableId } = result;
+
+      // Dropped outside a droppable area
+      if (!destination) return;
+
+      // Dropped in same position
+      if (source.droppableId === destination.droppableId && source.index === destination.index) {
+        return;
+      }
+
+      const newStatus = destination.droppableId as TaskStatus;
+      const taskId = draggableId;
+
+      // Optimistic update: move card in local state
+      setTasks((prev) => prev.map((t) => (t.id === taskId ? { ...t, status: newStatus } : t)));
+
+      // Persist to API
+      const wsId = workspaceId ?? undefined;
+      updateTask(taskId, { status: newStatus }, wsId).catch((err: unknown) => {
+        console.error("[Kanban] Failed to update task status:", err);
+        // Revert on failure by re-fetching
+        void loadTasks(workspaceId);
+      });
+    },
+    [workspaceId, loadTasks]
+  );
+
+  /* --- retry handler --- */
+
+  function handleRetry(): void {
+    void loadTasks(workspaceId);
+  }
+
+  /* --- render --- */
+
+  return (
+    <main style={{ padding: "32px 24px", minHeight: "100%" }}>
+      {/* Page header */}
+      <div style={{ marginBottom: 16 }}>
+        <h1
+          style={{
+            fontSize: "1.875rem",
+            fontWeight: 700,
+            color: "var(--text)",
+            margin: 0,
+          }}
+        >
+          Kanban Board
+        </h1>
+        <p
+          style={{
+            fontSize: "0.9rem",
+            color: "var(--muted)",
+            marginTop: 4,
+          }}
+        >
+          Visualize and manage task progress across stages
+        </p>
+      </div>
+
+      {/* Filter bar */}
+      <FilterBar
+        projects={projects}
+        projectId={filterProject}
+        priority={filterPriority}
+        search={filterSearch}
+        myTasks={filterMyTasks}
+        onProjectChange={handleProjectChange}
+        onPriorityChange={handlePriorityChange}
+        onSearchChange={handleSearchChange}
+        onMyTasksToggle={handleMyTasksToggle}
+        onClear={handleClearFilters}
+        hasActiveFilters={hasActiveFilters}
+      />
+
+      {/* Loading state */}
+      {isLoading ? (
+        <div className="flex justify-center py-16">
+          <MosaicSpinner label="Loading tasks..." />
+        </div>
+      ) : error !== null ? (
+        /* Error state */
+        <div
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+            borderRadius: "var(--r-lg)",
+            padding: 32,
+            textAlign: "center",
+          }}
+        >
+          <p style={{ color: "var(--danger)", margin: "0 0 16px" }}>{error}</p>
+          <button
+            onClick={handleRetry}
+            style={{
+              padding: "8px 16px",
+              background: "var(--danger)",
+              border: "none",
+              borderRadius: "var(--r)",
+              color: "#fff",
+              fontSize: "0.85rem",
+              fontWeight: 500,
+              cursor: "pointer",
+            }}
+          >
+            Try again
+          </button>
+        </div>
+      ) : filteredTasks.length === 0 && tasks.length > 0 ? (
+        /* No results (filtered) */
+        <div
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+            borderRadius: "var(--r-lg)",
+            padding: 48,
+            textAlign: "center",
+          }}
+        >
+          <p style={{ color: "var(--muted)", margin: 0, fontSize: "0.9rem" }}>
+            No tasks match your filters.
+          </p>
+          <button
+            type="button"
+            onClick={handleClearFilters}
+            style={{
+              marginTop: 12,
+              padding: "6px 14px",
+              borderRadius: "var(--r)",
+              border: "1px solid var(--border)",
+              background: "transparent",
+              color: "var(--text-2)",
+              fontSize: "0.83rem",
+              cursor: "pointer",
+            }}
+          >
+            Clear filters
+          </button>
+        </div>
+      ) : tasks.length === 0 ? (
+        /* Empty state */
+        <div
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+            borderRadius: "var(--r-lg)",
+            padding: 48,
+            textAlign: "center",
+          }}
+        >
+          <p style={{ color: "var(--muted)", margin: 0, fontSize: "0.9rem" }}>
+            No tasks yet. Create some tasks to see them here.
+          </p>
+        </div>
+      ) : (
+        /* Board */
+        <DragDropContext onDragEnd={handleDragEnd}>
+          <div
+            style={{
+              display: "flex",
+              gap: 16,
+              overflowX: "auto",
+              paddingBottom: 16,
+              minHeight: 400,
+            }}
+          >
+            {COLUMNS.map((col) => (
+              <KanbanColumn key={col.status} config={col} tasks={grouped[col.status]} />
+            ))}
+          </div>
+        </DragDropContext>
+      )}
+    </main>
+  );
+}

apps/web/src/app/(authenticated)/knowledge/page.tsx

@@ -2,23 +2,25 @@
 
 import type { ReactElement } from "react";
 
-import { useState, useMemo } from "react";
+import { useState, useEffect, useCallback } from "react";
+import type { KnowledgeEntryWithTags, KnowledgeTag } from "@mosaic/shared";
 import type { EntryStatus } from "@mosaic/shared";
 import { EntryList } from "@/components/knowledge/EntryList";
 import { EntryFilters } from "@/components/knowledge/EntryFilters";
 import { ImportExportActions } from "@/components/knowledge";
-import { mockEntries, mockTags } from "@/lib/api/knowledge";
+import { fetchEntries, fetchTags } from "@/lib/api/knowledge";
+import type { EntriesResponse } from "@/lib/api/knowledge";
+import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
 import Link from "next/link";
 import { Plus } from "lucide-react";
 
 export default function KnowledgePage(): ReactElement {
-  // TODO: Replace with real API call when backend is ready
+  // Data state
-  // const { data: entries, isLoading } = useQuery({
+  const [entries, setEntries] = useState<KnowledgeEntryWithTags[]>([]);
-  //   queryKey: ["knowledge-entries"],
+  const [tags, setTags] = useState<KnowledgeTag[]>([]);
-  //   queryFn: fetchEntries,
+  const [totalEntries, setTotalEntries] = useState(0);
-  // });
+  const [isLoading, setIsLoading] = useState(true);
-
+  const [error, setError] = useState<string | null>(null);
-  const [isLoading] = useState(false);
 
   // Filter and sort state
   const [selectedStatus, setSelectedStatus] = useState<EntryStatus | "all">("all");
@@ -31,60 +33,65 @@ export default function KnowledgePage(): ReactElement {
   const [currentPage, setCurrentPage] = useState(1);
   const itemsPerPage = 10;
 
-  // Client-side filtering and sorting
+  // Load tags on mount
-  const filteredAndSortedEntries = useMemo(() => {
+  useEffect(() => {
-    let filtered = [...mockEntries];
+    let cancelled = false;
 
-    // Filter by status
+    fetchTags()
-    if (selectedStatus !== "all") {
+      .then((result) => {
-      filtered = filtered.filter((entry) => entry.status === selectedStatus);
+        if (!cancelled) {
-    }
+          setTags(result);
+        }
+      })
+      .catch((err: unknown) => {
+        console.error("Failed to load tags:", err);
+      });
 
-    // Filter by tag
+    return (): void => {
-    if (selectedTag !== "all") {
+      cancelled = true;
-      filtered = filtered.filter((entry) =>
+    };
-        entry.tags.some((tag: { slug: string }) => tag.slug === selectedTag)
+  }, []);
-      );
-    }
 
-    // Filter by search query
+  // Load entries when filters/sort/page change
-    if (searchQuery.trim()) {
+  const loadEntries = useCallback(async (): Promise<void> => {
-      const query = searchQuery.toLowerCase();
+    setIsLoading(true);
-      filtered = filtered.filter(
+    setError(null);
-        (entry) =>
-          entry.title.toLowerCase().includes(query) ||
-          (entry.summary?.toLowerCase().includes(query) ?? false) ||
-          entry.tags.some((tag: { name: string }): boolean =>
-            tag.name.toLowerCase().includes(query)
-          )
-      );
-    }
 
-    // Sort entries
+    try {
-    filtered.sort((a, b) => {
+      const filters: Record<string, unknown> = {
-      let comparison = 0;
+        page: currentPage,
+        limit: itemsPerPage,
+        sortBy,
+        sortOrder,
+      };
 
-      if (sortBy === "title") {
+      if (selectedStatus !== "all") {
-        comparison = a.title.localeCompare(b.title);
+        filters.status = selectedStatus;
-      } else if (sortBy === "createdAt") {
+      }
-        comparison = new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime();
+      if (selectedTag !== "all") {
-      } else {
+        filters.tag = selectedTag;
-        // updatedAt
+      }
-        comparison = new Date(a.updatedAt).getTime() - new Date(b.updatedAt).getTime();
+      if (searchQuery.trim()) {
+        filters.search = searchQuery.trim();
       }
 
-      return sortOrder === "asc" ? comparison : -comparison;
+      const response: EntriesResponse = await fetchEntries(
-    });
+        filters as Parameters<typeof fetchEntries>[0]
+      );
+      setEntries(response.data);
+      setTotalEntries(response.meta?.total ?? response.data.length);
+    } catch (err: unknown) {
+      setError(err instanceof Error ? err.message : "Failed to load entries");
+    } finally {
+      setIsLoading(false);
+    }
+  }, [currentPage, itemsPerPage, sortBy, sortOrder, selectedStatus, selectedTag, searchQuery]);
 
-    return filtered;
+  useEffect(() => {
-  }, [selectedStatus, selectedTag, searchQuery, sortBy, sortOrder]);
+    void loadEntries();
+  }, [loadEntries]);
 
-  // Pagination
+  const totalPages = Math.max(1, Math.ceil(totalEntries / itemsPerPage));
-  const totalPages = Math.ceil(filteredAndSortedEntries.length / itemsPerPage);
-  const paginatedEntries = filteredAndSortedEntries.slice(
-    (currentPage - 1) * itemsPerPage,
-    currentPage * itemsPerPage
-  );
 
   // Reset to page 1 when filters change
   const handleFilterChange = (callback: () => void): void => {
@@ -101,6 +108,16 @@ export default function KnowledgePage(): ReactElement {
     setCurrentPage(1);
   };
 
+  if (isLoading && entries.length === 0) {
+    return (
+      <main className="container mx-auto px-4 py-8 max-w-5xl">
+        <div className="flex justify-center items-center py-20">
+          <MosaicSpinner size={48} label="Loading knowledge base..." />
+        </div>
+      </main>
+    );
+  }
+
   return (
     <main className="container mx-auto px-4 py-8 max-w-5xl">
       {/* Header */}
@@ -125,14 +142,37 @@ export default function KnowledgePage(): ReactElement {
         <div className="flex justify-end">
           <ImportExportActions
             onImportComplete={() => {
-              // TODO: Refresh the entry list when real API is connected
+              void loadEntries();
-              // For now, this would trigger a refetch of the entries
-              window.location.reload();
             }}
           />
         </div>
       </div>
 
+      {/* Error state */}
+      {error && (
+        <div
+          className="mb-6 p-4 rounded-lg border"
+          style={{
+            borderColor: "var(--danger)",
+            background: "rgba(229,72,77,0.08)",
+          }}
+        >
+          <p className="text-sm" style={{ color: "var(--danger)" }}>
+            {error}
+          </p>
+          <button
+            type="button"
+            onClick={() => {
+              void loadEntries();
+            }}
+            className="mt-2 text-sm font-medium underline"
+            style={{ color: "var(--danger)" }}
+          >
+            Retry
+          </button>
+        </div>
+      )}
+
       {/* Filters */}
       <EntryFilters
         selectedStatus={selectedStatus}
@@ -140,7 +180,7 @@ export default function KnowledgePage(): ReactElement {
         searchQuery={searchQuery}
         sortBy={sortBy}
         sortOrder={sortOrder}
-        tags={mockTags}
+        tags={tags}
         onStatusChange={(status) => {
           handleFilterChange(() => {
             setSelectedStatus(status);
@@ -161,7 +201,7 @@ export default function KnowledgePage(): ReactElement {
 
       {/* Entry list */}
       <EntryList
-        entries={paginatedEntries}
+        entries={entries}
         isLoading={isLoading}
         currentPage={currentPage}
         totalPages={totalPages}

apps/web/src/app/(authenticated)/logs/page.tsx

@@ -0,0 +1,851 @@
+"use client";
+
+import { useState, useEffect, useCallback, useRef } from "react";
+import type { ReactElement } from "react";
+
+import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
+import { fetchRunnerJobs, fetchJobSteps, RunnerJobStatus } from "@/lib/api/runner-jobs";
+import type { RunnerJob, JobStep } from "@/lib/api/runner-jobs";
+import { useWorkspaceId } from "@/lib/hooks";
+
+// ─── Constants ────────────────────────────────────────────────────────
+
+type StatusFilter = "all" | "running" | "completed" | "failed" | "queued";
+type DateRange = "24h" | "7d" | "30d" | "all";
+
+const STATUS_OPTIONS: { value: StatusFilter; label: string }[] = [
+  { value: "all", label: "All statuses" },
+  { value: "running", label: "Running" },
+  { value: "completed", label: "Completed" },
+  { value: "failed", label: "Failed" },
+  { value: "queued", label: "Queued" },
+];
+
+const DATE_RANGES: { value: DateRange; label: string }[] = [
+  { value: "24h", label: "Last 24h" },
+  { value: "7d", label: "7d" },
+  { value: "30d", label: "30d" },
+  { value: "all", label: "All" },
+];
+
+const STATUS_FILTER_TO_ENUM: Record<StatusFilter, RunnerJobStatus[] | undefined> = {
+  all: undefined,
+  running: [RunnerJobStatus.RUNNING],
+  completed: [RunnerJobStatus.COMPLETED],
+  failed: [RunnerJobStatus.FAILED],
+  queued: [RunnerJobStatus.QUEUED, RunnerJobStatus.PENDING],
+};
+
+const POLL_INTERVAL_MS = 5_000;
+
+// ─── Helpers ──────────────────────────────────────────────────────────
+
+function getStatusColor(status: string): string {
+  switch (status) {
+    case "RUNNING":
+      return "var(--ms-amber-400)";
+    case "COMPLETED":
+      return "var(--ms-teal-400)";
+    case "FAILED":
+    case "CANCELLED":
+      return "var(--danger)";
+    case "QUEUED":
+    case "PENDING":
+      return "var(--ms-blue-400)";
+    default:
+      return "var(--muted)";
+  }
+}
+
+function formatRelativeTime(dateStr: string | null): string {
+  if (!dateStr) return "\u2014";
+  const date = new Date(dateStr);
+  const now = Date.now();
+  const diffMs = now - date.getTime();
+  const diffSec = Math.floor(diffMs / 1_000);
+  const diffMin = Math.floor(diffSec / 60);
+  const diffHr = Math.floor(diffMin / 60);
+  const diffDay = Math.floor(diffHr / 24);
+
+  if (diffSec < 60) return "just now";
+  if (diffMin < 60) return `${String(diffMin)}m ago`;
+  if (diffHr < 24) return `${String(diffHr)}h ago`;
+  if (diffDay < 30) return `${String(diffDay)}d ago`;
+  return date.toLocaleDateString();
+}
+
+function formatDuration(startedAt: string | null, completedAt: string | null): string {
+  if (!startedAt) return "\u2014";
+  const start = new Date(startedAt).getTime();
+  const end = completedAt ? new Date(completedAt).getTime() : Date.now();
+  const ms = end - start;
+  if (ms < 1_000) return `${String(ms)}ms`;
+  const sec = Math.floor(ms / 1_000);
+  if (sec < 60) return `${String(sec)}s`;
+  const min = Math.floor(sec / 60);
+  const remainSec = sec % 60;
+  return `${String(min)}m ${String(remainSec)}s`;
+}
+
+function formatStepDuration(durationMs: number | null): string {
+  if (durationMs === null) return "\u2014";
+  if (durationMs < 1_000) return `${String(durationMs)}ms`;
+  const sec = Math.floor(durationMs / 1_000);
+  if (sec < 60) return `${String(sec)}s`;
+  const min = Math.floor(sec / 60);
+  const remainSec = sec % 60;
+  return `${String(min)}m ${String(remainSec)}s`;
+}
+
+function isWithinDateRange(dateStr: string, range: DateRange): boolean {
+  if (range === "all") return true;
+  const date = new Date(dateStr);
+  const now = Date.now();
+  const hours = range === "24h" ? 24 : range === "7d" ? 168 : 720;
+  return now - date.getTime() < hours * 60 * 60 * 1_000;
+}
+
+// ─── Status Badge ─────────────────────────────────────────────────────
+
+function StatusBadge({ status }: { status: string }): ReactElement {
+  const color = getStatusColor(status);
+  const isRunning = status === "RUNNING";
+
+  return (
+    <span
+      style={{
+        display: "inline-flex",
+        alignItems: "center",
+        gap: 6,
+        padding: "2px 10px",
+        borderRadius: 9999,
+        fontSize: "0.75rem",
+        fontWeight: 600,
+        color,
+        background: `color-mix(in srgb, ${color} 15%, transparent)`,
+        border: `1px solid color-mix(in srgb, ${color} 30%, transparent)`,
+        textTransform: "capitalize",
+      }}
+    >
+      {isRunning && (
+        <span
+          style={{
+            width: 6,
+            height: 6,
+            borderRadius: "50%",
+            background: color,
+            animation: "pulse 1.5s ease-in-out infinite",
+          }}
+        />
+      )}
+      {status.toLowerCase()}
+    </span>
+  );
+}
+
+// ─── Main Page Component ──────────────────────────────────────────────
+
+export default function LogsPage(): ReactElement {
+  const workspaceId = useWorkspaceId();
+
+  // Data state
+  const [jobs, setJobs] = useState<RunnerJob[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Expanded job and steps
+  const [expandedJobId, setExpandedJobId] = useState<string | null>(null);
+  const [jobStepsMap, setJobStepsMap] = useState<Record<string, JobStep[]>>({});
+  const [stepsLoading, setStepsLoading] = useState<Set<string>>(new Set());
+
+  // Filters
+  const [statusFilter, setStatusFilter] = useState<StatusFilter>("all");
+  const [dateRange, setDateRange] = useState<DateRange>("7d");
+  const [searchQuery, setSearchQuery] = useState("");
+
+  // Auto-refresh
+  const [autoRefresh, setAutoRefresh] = useState(false);
+  const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
+
+  // Hover state
+  const [hoveredRowId, setHoveredRowId] = useState<string | null>(null);
+
+  // ─── Data Loading ─────────────────────────────────────────────────
+
+  const loadJobs = useCallback(async (): Promise<void> => {
+    try {
+      const statusEnums = STATUS_FILTER_TO_ENUM[statusFilter];
+      const filters: Parameters<typeof fetchRunnerJobs>[0] = {};
+      if (workspaceId) {
+        filters.workspaceId = workspaceId;
+      }
+      if (statusEnums) {
+        filters.status = statusEnums;
+      }
+
+      const data = await fetchRunnerJobs(filters);
+      setJobs(data);
+      setError(null);
+    } catch (err: unknown) {
+      console.error("[Logs] Failed to fetch runner jobs:", err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : "We had trouble loading jobs. Please try again when you're ready."
+      );
+    }
+  }, [workspaceId, statusFilter]);
+
+  // Initial load
+  useEffect(() => {
+    let cancelled = false;
+    setIsLoading(true);
+
+    loadJobs()
+      .then(() => {
+        if (!cancelled) {
+          setIsLoading(false);
+        }
+      })
+      .catch(() => {
+        if (!cancelled) {
+          setIsLoading(false);
+        }
+      });
+
+    return (): void => {
+      cancelled = true;
+    };
+  }, [loadJobs]);
+
+  // Auto-refresh polling
+  useEffect(() => {
+    if (autoRefresh) {
+      intervalRef.current = setInterval(() => {
+        void loadJobs();
+      }, POLL_INTERVAL_MS);
+    } else if (intervalRef.current) {
+      clearInterval(intervalRef.current);
+      intervalRef.current = null;
+    }
+
+    return (): void => {
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+        intervalRef.current = null;
+      }
+    };
+  }, [autoRefresh, loadJobs]);
+
+  // ─── Steps Loading ────────────────────────────────────────────────
+
+  const toggleExpand = useCallback(
+    (jobId: string) => {
+      if (expandedJobId === jobId) {
+        setExpandedJobId(null);
+        return;
+      }
+
+      setExpandedJobId(jobId);
+
+      // Load steps if not already loaded
+      if (!jobStepsMap[jobId] && !stepsLoading.has(jobId)) {
+        setStepsLoading((prev) => new Set(prev).add(jobId));
+
+        fetchJobSteps(jobId, workspaceId ?? undefined)
+          .then((steps) => {
+            setJobStepsMap((prev) => ({ ...prev, [jobId]: steps }));
+          })
+          .catch((err: unknown) => {
+            console.error("[Logs] Failed to fetch steps for job:", jobId, err);
+            setJobStepsMap((prev) => ({ ...prev, [jobId]: [] }));
+          })
+          .finally(() => {
+            setStepsLoading((prev) => {
+              const next = new Set(prev);
+              next.delete(jobId);
+              return next;
+            });
+          });
+      }
+    },
+    [expandedJobId, jobStepsMap, stepsLoading, workspaceId]
+  );
+
+  // ─── Filtering ────────────────────────────────────────────────────
+
+  const filteredJobs = jobs.filter((job) => {
+    // Date range filter
+    if (!isWithinDateRange(job.createdAt, dateRange)) return false;
+
+    // Search filter
+    if (searchQuery.trim()) {
+      const q = searchQuery.toLowerCase();
+      const matchesType = job.type.toLowerCase().includes(q);
+      const matchesId = job.id.toLowerCase().includes(q);
+      if (!matchesType && !matchesId) return false;
+    }
+
+    return true;
+  });
+
+  // ─── Manual Refresh ───────────────────────────────────────────────
+
+  const handleManualRefresh = (): void => {
+    setIsLoading(true);
+    void loadJobs().finally(() => {
+      setIsLoading(false);
+    });
+  };
+
+  const handleRetry = (): void => {
+    setError(null);
+    handleManualRefresh();
+  };
+
+  // ─── Render ───────────────────────────────────────────────────────
+
+  return (
+    <main className="container mx-auto px-4 py-8">
+      {/* Pulse animation for running status */}
+      <style>{`
+        @keyframes pulse {
+          0%, 100% { opacity: 1; }
+          50% { opacity: 0.4; }
+        }
+        @keyframes auto-refresh-spin {
+          from { transform: rotate(0deg); }
+          to { transform: rotate(360deg); }
+        }
+      `}</style>
+
+      {/* ─── Header ─────────────────────────────────────────────── */}
+      <div
+        style={{
+          display: "flex",
+          flexWrap: "wrap",
+          alignItems: "center",
+          justifyContent: "space-between",
+          gap: 16,
+          marginBottom: 32,
+        }}
+      >
+        <div>
+          <h1 className="text-3xl font-bold" style={{ color: "var(--text)" }}>
+            Logs &amp; Telemetry
+          </h1>
+          <p className="mt-1" style={{ color: "var(--text-muted)" }}>
+            Runner job history and step-level detail
+          </p>
+        </div>
+
+        <div style={{ display: "flex", alignItems: "center", gap: 12 }}>
+          {/* Auto-refresh toggle */}
+          <button
+            onClick={() => {
+              setAutoRefresh((prev) => !prev);
+            }}
+            style={{
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 8,
+              padding: "8px 14px",
+              borderRadius: 8,
+              fontSize: "0.82rem",
+              fontWeight: 500,
+              cursor: "pointer",
+              border: `1px solid ${autoRefresh ? "var(--ms-teal-400)" : "var(--border)"}`,
+              background: autoRefresh
+                ? "color-mix(in srgb, var(--ms-teal-400) 12%, transparent)"
+                : "var(--surface)",
+              color: autoRefresh ? "var(--ms-teal-400)" : "var(--text-muted)",
+              transition: "all 150ms ease",
+            }}
+          >
+            {autoRefresh && (
+              <span
+                style={{
+                  width: 8,
+                  height: 8,
+                  borderRadius: "50%",
+                  background: "var(--ms-teal-400)",
+                  animation: "pulse 1.5s ease-in-out infinite",
+                }}
+              />
+            )}
+            Auto-refresh {autoRefresh ? "on" : "off"}
+          </button>
+
+          {/* Manual refresh */}
+          <button
+            onClick={handleManualRefresh}
+            disabled={isLoading}
+            style={{
+              padding: "8px 14px",
+              borderRadius: 8,
+              fontSize: "0.82rem",
+              fontWeight: 500,
+              cursor: isLoading ? "not-allowed" : "pointer",
+              border: "1px solid var(--border)",
+              background: "var(--surface)",
+              color: "var(--text-muted)",
+              opacity: isLoading ? 0.5 : 1,
+              transition: "all 150ms ease",
+            }}
+          >
+            Refresh
+          </button>
+        </div>
+      </div>
+
+      {/* ─── Filter Bar ─────────────────────────────────────────── */}
+      <div
+        style={{
+          display: "flex",
+          flexWrap: "wrap",
+          alignItems: "center",
+          gap: 12,
+          marginBottom: 24,
+        }}
+      >
+        {/* Status filter */}
+        <select
+          value={statusFilter}
+          onChange={(e) => {
+            setStatusFilter(e.target.value as StatusFilter);
+          }}
+          style={{
+            padding: "8px 12px",
+            borderRadius: 8,
+            fontSize: "0.82rem",
+            border: "1px solid var(--border)",
+            background: "var(--surface)",
+            color: "var(--text)",
+            cursor: "pointer",
+            minWidth: 140,
+          }}
+        >
+          {STATUS_OPTIONS.map((opt) => (
+            <option key={opt.value} value={opt.value}>
+              {opt.label}
+            </option>
+          ))}
+        </select>
+
+        {/* Date range tabs */}
+        <div
+          style={{
+            display: "flex",
+            borderRadius: 8,
+            overflow: "hidden",
+            border: "1px solid var(--border)",
+          }}
+        >
+          {DATE_RANGES.map((range) => (
+            <button
+              key={range.value}
+              onClick={() => {
+                setDateRange(range.value);
+              }}
+              style={{
+                padding: "8px 14px",
+                fontSize: "0.82rem",
+                fontWeight: 500,
+                cursor: "pointer",
+                border: "none",
+                borderRight: "1px solid var(--border)",
+                background: dateRange === range.value ? "var(--primary)" : "var(--surface)",
+                color: dateRange === range.value ? "#fff" : "var(--text-muted)",
+                transition: "all 150ms ease",
+              }}
+            >
+              {range.label}
+            </button>
+          ))}
+        </div>
+
+        {/* Search input */}
+        <input
+          type="text"
+          placeholder="Search by job type..."
+          value={searchQuery}
+          onChange={(e) => {
+            setSearchQuery(e.target.value);
+          }}
+          style={{
+            padding: "8px 12px",
+            borderRadius: 8,
+            fontSize: "0.82rem",
+            border: "1px solid var(--border)",
+            background: "var(--surface)",
+            color: "var(--text)",
+            minWidth: 200,
+            flex: "1 1 200px",
+            maxWidth: 320,
+          }}
+        />
+      </div>
+
+      {/* ─── Content ────────────────────────────────────────────── */}
+      {isLoading && jobs.length === 0 ? (
+        <div className="flex justify-center py-16">
+          <MosaicSpinner label="Loading jobs..." />
+        </div>
+      ) : error !== null ? (
+        <div
+          className="rounded-lg p-6 text-center"
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+          }}
+        >
+          <p style={{ color: "var(--danger)" }}>{error}</p>
+          <button
+            onClick={handleRetry}
+            className="mt-4 rounded-md px-4 py-2 text-sm font-medium text-white transition-colors"
+            style={{ background: "var(--danger)", cursor: "pointer", border: "none" }}
+          >
+            Try again
+          </button>
+        </div>
+      ) : filteredJobs.length === 0 ? (
+        <div
+          className="rounded-lg p-8 text-center"
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+          }}
+        >
+          <p style={{ color: "var(--text-muted)" }}>No jobs found</p>
+        </div>
+      ) : (
+        /* ─── Job Table ──────────────────────────────────────────── */
+        <div
+          style={{
+            borderRadius: 12,
+            border: "1px solid var(--border)",
+            overflow: "hidden",
+          }}
+        >
+          <div style={{ overflowX: "auto" }}>
+            <table style={{ width: "100%", borderCollapse: "collapse" }}>
+              <thead>
+                <tr
+                  style={{
+                    background: "var(--bg-mid)",
+                  }}
+                >
+                  {["Job Type", "Status", "Started", "Duration", "Steps"].map((header) => (
+                    <th
+                      key={header}
+                      style={{
+                        padding: "10px 16px",
+                        textAlign: "left",
+                        fontSize: "0.75rem",
+                        fontWeight: 600,
+                        textTransform: "uppercase",
+                        letterSpacing: "0.05em",
+                        color: "var(--muted)",
+                        fontFamily: "var(--mono)",
+                        whiteSpace: "nowrap",
+                      }}
+                    >
+                      {header}
+                    </th>
+                  ))}
+                </tr>
+              </thead>
+              <tbody>
+                {filteredJobs.map((job) => {
+                  const isExpanded = expandedJobId === job.id;
+                  const isHovered = hoveredRowId === job.id;
+                  const steps = jobStepsMap[job.id];
+                  const isStepsLoading = stepsLoading.has(job.id);
+
+                  return (
+                    <JobRow
+                      key={job.id}
+                      job={job}
+                      isExpanded={isExpanded}
+                      isHovered={isHovered}
+                      steps={steps}
+                      isStepsLoading={isStepsLoading}
+                      onToggle={() => {
+                        toggleExpand(job.id);
+                      }}
+                      onMouseEnter={() => {
+                        setHoveredRowId(job.id);
+                      }}
+                      onMouseLeave={() => {
+                        setHoveredRowId(null);
+                      }}
+                    />
+                  );
+                })}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      )}
+    </main>
+  );
+}
+
+// ─── Job Row Component ────────────────────────────────────────────────
+
+function JobRow({
+  job,
+  isExpanded,
+  isHovered,
+  steps,
+  isStepsLoading,
+  onToggle,
+  onMouseEnter,
+  onMouseLeave,
+}: {
+  job: RunnerJob;
+  isExpanded: boolean;
+  isHovered: boolean;
+  steps: JobStep[] | undefined;
+  isStepsLoading: boolean;
+  onToggle: () => void;
+  onMouseEnter: () => void;
+  onMouseLeave: () => void;
+}): ReactElement {
+  return (
+    <>
+      <tr
+        onClick={onToggle}
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+        style={{
+          background: isExpanded
+            ? "var(--surface-2)"
+            : isHovered
+              ? "var(--surface-2)"
+              : "var(--surface)",
+          cursor: "pointer",
+          borderBottom: isExpanded ? "none" : "1px solid var(--border)",
+          transition: "background 100ms ease",
+        }}
+      >
+        <td
+          style={{
+            padding: "12px 16px",
+            fontSize: "0.85rem",
+            fontWeight: 500,
+            color: "var(--text)",
+            whiteSpace: "nowrap",
+          }}
+        >
+          <span style={{ display: "inline-flex", alignItems: "center", gap: 8 }}>
+            <span
+              style={{
+                display: "inline-block",
+                width: 16,
+                textAlign: "center",
+                fontSize: "0.7rem",
+                color: "var(--muted)",
+                transition: "transform 150ms ease",
+                transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)",
+              }}
+            >
+              &#9654;
+            </span>
+            {job.type}
+          </span>
+        </td>
+        <td style={{ padding: "12px 16px" }}>
+          <StatusBadge status={job.status} />
+        </td>
+        <td
+          style={{
+            padding: "12px 16px",
+            fontSize: "0.82rem",
+            fontFamily: "var(--mono)",
+            color: "var(--text-muted)",
+            whiteSpace: "nowrap",
+          }}
+        >
+          {formatRelativeTime(job.startedAt ?? job.createdAt)}
+        </td>
+        <td
+          style={{
+            padding: "12px 16px",
+            fontSize: "0.82rem",
+            fontFamily: "var(--mono)",
+            color: "var(--text-muted)",
+            whiteSpace: "nowrap",
+          }}
+        >
+          {formatDuration(job.startedAt, job.completedAt)}
+        </td>
+        <td
+          style={{
+            padding: "12px 16px",
+            fontSize: "0.82rem",
+            fontFamily: "var(--mono)",
+            color: "var(--text-muted)",
+          }}
+        >
+          {steps ? String(steps.length) : "\u2014"}
+        </td>
+      </tr>
+
+      {/* Expanded Steps Section */}
+      {isExpanded && (
+        <tr>
+          <td
+            colSpan={5}
+            style={{
+              padding: 0,
+              borderBottom: "1px solid var(--border)",
+            }}
+          >
+            <div
+              style={{
+                background: "var(--bg-mid)",
+                padding: "12px 16px 12px 48px",
+              }}
+            >
+              {isStepsLoading ? (
+                <div style={{ display: "flex", justifyContent: "center", padding: 16 }}>
+                  <MosaicSpinner size={24} label="Loading steps..." />
+                </div>
+              ) : !steps || steps.length === 0 ? (
+                <p
+                  style={{
+                    fontSize: "0.82rem",
+                    color: "var(--text-muted)",
+                    padding: "8px 0",
+                  }}
+                >
+                  No steps recorded for this job
+                </p>
+              ) : (
+                <table style={{ width: "100%", borderCollapse: "collapse" }}>
+                  <thead>
+                    <tr>
+                      {["#", "Name", "Phase", "Status", "Duration"].map((header) => (
+                        <th
+                          key={header}
+                          style={{
+                            padding: "6px 12px",
+                            textAlign: "left",
+                            fontSize: "0.7rem",
+                            fontWeight: 600,
+                            textTransform: "uppercase",
+                            letterSpacing: "0.05em",
+                            color: "var(--muted)",
+                            fontFamily: "var(--mono)",
+                            borderBottom: "1px solid var(--border)",
+                            whiteSpace: "nowrap",
+                          }}
+                        >
+                          {header}
+                        </th>
+                      ))}
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {steps
+                      .sort((a, b) => a.ordinal - b.ordinal)
+                      .map((step) => (
+                        <StepRow key={step.id} step={step} />
+                      ))}
+                  </tbody>
+                </table>
+              )}
+
+              {/* Job error message if failed */}
+              {job.error && (
+                <div
+                  style={{
+                    marginTop: 12,
+                    padding: "8px 12px",
+                    borderRadius: 6,
+                    fontSize: "0.78rem",
+                    fontFamily: "var(--mono)",
+                    color: "var(--danger)",
+                    background: "color-mix(in srgb, var(--danger) 8%, transparent)",
+                    border: "1px solid color-mix(in srgb, var(--danger) 20%, transparent)",
+                    wordBreak: "break-all",
+                  }}
+                >
+                  {job.error}
+                </div>
+              )}
+            </div>
+          </td>
+        </tr>
+      )}
+    </>
+  );
+}
+
+// ─── Step Row Component ───────────────────────────────────────────────
+
+function StepRow({ step }: { step: JobStep }): ReactElement {
+  const [hovered, setHovered] = useState(false);
+
+  return (
+    <tr
+      onMouseEnter={() => {
+        setHovered(true);
+      }}
+      onMouseLeave={() => {
+        setHovered(false);
+      }}
+      style={{
+        background: hovered ? "color-mix(in srgb, var(--surface) 50%, transparent)" : "transparent",
+        borderBottom: "1px solid color-mix(in srgb, var(--border) 50%, transparent)",
+        transition: "background 100ms ease",
+      }}
+    >
+      <td
+        style={{
+          padding: "6px 12px",
+          fontSize: "0.78rem",
+          fontFamily: "var(--mono)",
+          color: "var(--muted)",
+        }}
+      >
+        {String(step.ordinal)}
+      </td>
+      <td
+        style={{
+          padding: "6px 12px",
+          fontSize: "0.8rem",
+          color: "var(--text)",
+        }}
+      >
+        {step.name}
+      </td>
+      <td
+        style={{
+          padding: "6px 12px",
+          fontSize: "0.75rem",
+          fontFamily: "var(--mono)",
+          color: "var(--text-muted)",
+          textTransform: "lowercase",
+        }}
+      >
+        {step.phase}
+      </td>
+      <td style={{ padding: "6px 12px" }}>
+        <StatusBadge status={step.status} />
+      </td>
+      <td
+        style={{
+          padding: "6px 12px",
+          fontSize: "0.78rem",
+          fontFamily: "var(--mono)",
+          color: "var(--text-muted)",
+          whiteSpace: "nowrap",
+        }}
+      >
+        {formatStepDuration(step.durationMs)}
+      </td>
+    </tr>
+  );
+}

apps/web/src/app/(authenticated)/not-found.tsx

@@ -0,0 +1,160 @@
+import type { ReactElement } from "react";
+import Link from "next/link";
+
+export default function AuthenticatedNotFound(): ReactElement {
+  return (
+    <div
+      style={{
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        minHeight: "60vh",
+      }}
+    >
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          gap: "24px",
+          padding: "48px 40px",
+          background: "var(--surface)",
+          border: "1px solid var(--border)",
+          borderRadius: "var(--r-xl)",
+          boxShadow: "var(--shadow-md)",
+          textAlign: "center",
+          maxWidth: "420px",
+          width: "100%",
+        }}
+      >
+        {/* Compass icon in blue-tinted icon well */}
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: 56,
+            height: 56,
+            borderRadius: "var(--r-lg)",
+            background: "rgba(47, 128, 255, 0.1)",
+            color: "var(--ms-blue-400)",
+          }}
+        >
+          <svg
+            width="28"
+            height="28"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="1.5"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            aria-hidden="true"
+          >
+            <circle cx="12" cy="12" r="10" />
+            <polygon
+              points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"
+              fill="currentColor"
+              stroke="none"
+              opacity="0.3"
+            />
+            <polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76" />
+          </svg>
+        </div>
+
+        {/* 404 badge pill */}
+        <span
+          style={{
+            display: "inline-flex",
+            alignItems: "center",
+            padding: "4px 12px",
+            borderRadius: "9999px",
+            fontSize: "0.75rem",
+            fontWeight: 600,
+            fontFamily: "var(--mono)",
+            background: "rgba(47, 128, 255, 0.15)",
+            color: "var(--ms-blue-400)",
+          }}
+        >
+          404
+        </span>
+
+        {/* Heading + description */}
+        <div style={{ display: "flex", flexDirection: "column", gap: "8px" }}>
+          <h2
+            style={{
+              fontSize: "1.25rem",
+              fontWeight: 600,
+              color: "var(--text)",
+              margin: 0,
+              letterSpacing: "-0.01em",
+            }}
+          >
+            Page not found
+          </h2>
+          <p
+            style={{
+              fontSize: "0.875rem",
+              color: "var(--muted)",
+              margin: 0,
+              lineHeight: 1.6,
+            }}
+          >
+            This page doesn&apos;t exist or you may not have permission to view it.
+          </p>
+        </div>
+
+        {/* Action buttons */}
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            gap: "12px",
+            marginTop: "8px",
+          }}
+        >
+          {/* Primary: Dashboard */}
+          <Link
+            href="/"
+            style={{
+              display: "inline-flex",
+              alignItems: "center",
+              justifyContent: "center",
+              padding: "9px 20px",
+              background: "var(--ms-blue-500)",
+              color: "#ffffff",
+              borderRadius: "var(--r)",
+              fontSize: "0.875rem",
+              fontWeight: 500,
+              textDecoration: "none",
+              transition: "opacity 0.15s ease",
+            }}
+          >
+            Dashboard
+          </Link>
+
+          {/* Ghost: Settings */}
+          <Link
+            href="/settings"
+            style={{
+              display: "inline-flex",
+              alignItems: "center",
+              justifyContent: "center",
+              padding: "9px 20px",
+              background: "transparent",
+              color: "var(--text-2)",
+              border: "1px solid var(--border)",
+              borderRadius: "var(--r)",
+              fontSize: "0.875rem",
+              fontWeight: 500,
+              textDecoration: "none",
+              transition: "all 0.15s ease",
+            }}
+          >
+            Settings
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

apps/web/src/app/(authenticated)/page.test.tsx

@@ -1,85 +1,154 @@
-import { describe, it, expect, vi } from "vitest";
+import { describe, it, expect, vi, beforeEach, beforeAll } from "vitest";
-import { render, screen, waitFor } from "@testing-library/react";
+import { render, screen, waitFor, act } from "@testing-library/react";
 import DashboardPage from "./page";
+import * as layoutsApi from "@/lib/api/layouts";
+import type { UserLayout, WidgetPlacement } from "@mosaic/shared";
 
-// Mock dashboard widgets
+// ResizeObserver is not available in jsdom
-vi.mock("@/components/dashboard/RecentTasksWidget", () => ({
+beforeAll((): void => {
-  RecentTasksWidget: ({
+  global.ResizeObserver = vi.fn().mockImplementation(() => ({
-    tasks,
+    observe: vi.fn(),
-    isLoading,
+    unobserve: vi.fn(),
+    disconnect: vi.fn(),
+  }));
+});
+
+// Mock WidgetGrid to avoid react-grid-layout dependency in tests
+vi.mock("@/components/widgets/WidgetGrid", () => ({
+  WidgetGrid: ({
+    layout,
+    isEditing,
   }: {
-    tasks: unknown[];
+    layout: WidgetPlacement[];
-    isLoading: boolean;
+    isEditing?: boolean;
   }): React.JSX.Element => (
-    <div data-testid="recent-tasks">
+    <div data-testid="widget-grid" data-editing={isEditing}>
-      {isLoading ? "Loading tasks" : `${String(tasks.length)} tasks`}
+      {layout.map((item) => (
+        <div key={item.i} data-testid={`widget-${item.i}`}>
+          {item.i}
+        </div>
+      ))}
     </div>
   ),
 }));
 
-vi.mock("@/components/dashboard/UpcomingEventsWidget", () => ({
+// Mock hooks
-  UpcomingEventsWidget: ({
+vi.mock("@/lib/hooks", () => ({
-    events,
+  useWorkspaceId: (): string | null => "ws-test-123",
-    isLoading,
-  }: {
-    events: unknown[];
-    isLoading: boolean;
-  }): React.JSX.Element => (
-    <div data-testid="upcoming-events">
-      {isLoading ? "Loading events" : `${String(events.length)} events`}
-    </div>
-  ),
 }));
 
-vi.mock("@/components/dashboard/QuickCaptureWidget", () => ({
+// Mock layout API
-  QuickCaptureWidget: (): React.JSX.Element => <div data-testid="quick-capture">Quick Capture</div>,
+vi.mock("@/lib/api/layouts");
-}));
 
-vi.mock("@/components/dashboard/DomainOverviewWidget", () => ({
+const mockExistingLayout: UserLayout = {
-  DomainOverviewWidget: ({
+  id: "layout-1",
-    tasks,
+  workspaceId: "ws-test-123",
-    isLoading,
+  userId: "user-1",
-  }: {
+  name: "Default",
-    tasks: unknown[];
+  isDefault: true,
-    isLoading: boolean;
+  layout: [
-  }): React.JSX.Element => (
+    { i: "TasksWidget-default", x: 0, y: 0, w: 4, h: 2 },
-    <div data-testid="domain-overview">
+    { i: "CalendarWidget-default", x: 4, y: 0, w: 4, h: 2 },
-      {isLoading ? "Loading overview" : `${String(tasks.length)} tasks overview`}
+  ],
-    </div>
+  metadata: {},
-  ),
+  createdAt: new Date("2026-01-01T00:00:00Z"),
-}));
+  updatedAt: new Date("2026-01-01T00:00:00Z"),
+};
 
 describe("DashboardPage", (): void => {
-  it("should render the page title", (): void => {
+  beforeEach((): void => {
-    render(<DashboardPage />);
+    vi.clearAllMocks();
-    expect(screen.getByRole("heading", { level: 1 })).toHaveTextContent("Dashboard");
   });
 
-  it("should show loading state initially", (): void => {
+  it("should render WidgetGrid with saved layout", async (): Promise<void> => {
-    render(<DashboardPage />);
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockResolvedValue(mockExistingLayout);
-    expect(screen.getByTestId("recent-tasks")).toHaveTextContent("Loading tasks");
-    expect(screen.getByTestId("upcoming-events")).toHaveTextContent("Loading events");
-    expect(screen.getByTestId("domain-overview")).toHaveTextContent("Loading overview");
-  });
 
-  it("should render all widgets with data after loading", async (): Promise<void> => {
     render(<DashboardPage />);
+
     await waitFor((): void => {
-      expect(screen.getByTestId("recent-tasks")).toHaveTextContent("4 tasks");
+      expect(screen.getByTestId("widget-grid")).toBeInTheDocument();
-      expect(screen.getByTestId("upcoming-events")).toHaveTextContent("3 events");
+    });
-      expect(screen.getByTestId("domain-overview")).toHaveTextContent("4 tasks overview");
+
-      expect(screen.getByTestId("quick-capture")).toBeInTheDocument();
+    expect(screen.getByTestId("widget-TasksWidget-default")).toBeInTheDocument();
+    expect(screen.getByTestId("widget-CalendarWidget-default")).toBeInTheDocument();
+  });
+
+  it("should create default layout when none exists", async (): Promise<void> => {
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockResolvedValue(null);
+    vi.mocked(layoutsApi.createLayout).mockResolvedValue({
+      ...mockExistingLayout,
+      layout: [{ i: "TasksWidget-default", x: 0, y: 0, w: 4, h: 2 }],
+    });
+
+    render(<DashboardPage />);
+
+    await waitFor((): void => {
+      expect(layoutsApi.createLayout).toHaveBeenCalledWith("ws-test-123", {
+        name: "Default",
+        isDefault: true,
+        layout: expect.arrayContaining([
+          expect.objectContaining({ i: "TasksWidget-default" }),
+        ]) as WidgetPlacement[],
+      });
     });
   });
 
-  it("should have proper layout structure", (): void => {
+  it("should show loading spinner initially", (): void => {
-    const { container } = render(<DashboardPage />);
+    // Never-resolving promise to test loading state
-    const main = container.querySelector("main");
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockReturnValue(
-    expect(main).toBeInTheDocument();
+      // eslint-disable-next-line @typescript-eslint/no-empty-function -- intentionally never-resolving
+      new Promise(() => {})
+    );
+
+    render(<DashboardPage />);
+
+    expect(screen.getByText("Loading dashboard...")).toBeInTheDocument();
   });
 
-  it("should render the welcome subtitle", (): void => {
+  it("should fall back to default layout on API error", async (): Promise<void> => {
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockRejectedValue(new Error("Network error"));
+
     render(<DashboardPage />);
-    expect(screen.getByText(/Welcome back/)).toBeInTheDocument();
+
+    await waitFor((): void => {
+      expect(screen.getByTestId("widget-grid")).toBeInTheDocument();
+    });
+  });
+
+  it("should render Dashboard heading", async (): Promise<void> => {
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockResolvedValue(mockExistingLayout);
+
+    render(<DashboardPage />);
+
+    await waitFor((): void => {
+      expect(screen.getByText("Dashboard")).toBeInTheDocument();
+    });
+  });
+
+  it("should render Edit Layout button", async (): Promise<void> => {
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockResolvedValue(mockExistingLayout);
+
+    render(<DashboardPage />);
+
+    await waitFor((): void => {
+      expect(screen.getByText("Edit Layout")).toBeInTheDocument();
+    });
+  });
+
+  it("should toggle edit mode on button click", async (): Promise<void> => {
+    vi.mocked(layoutsApi.fetchDefaultLayout).mockResolvedValue(mockExistingLayout);
+
+    render(<DashboardPage />);
+
+    await waitFor((): void => {
+      expect(screen.getByText("Edit Layout")).toBeInTheDocument();
+    });
+
+    act((): void => {
+      screen.getByText("Edit Layout").click();
+    });
+
+    expect(screen.getByText("Done")).toBeInTheDocument();
+    expect(screen.getByTestId("widget-grid").getAttribute("data-editing")).toBe("true");
   });
 });

apps/web/src/app/(authenticated)/page.tsx

@@ -1,32 +1,242 @@
 "use client";
 
+import { useState, useEffect, useCallback, useRef } from "react";
 import type { ReactElement } from "react";
-import { DashboardMetrics } from "@/components/dashboard/DashboardMetrics";
+import type { WidgetPlacement } from "@mosaic/shared";
-import { OrchestratorSessions } from "@/components/dashboard/OrchestratorSessions";
+import { WidgetGrid } from "@/components/widgets/WidgetGrid";
-import { QuickActions } from "@/components/dashboard/QuickActions";
+import { WidgetPicker } from "@/components/widgets/WidgetPicker";
-import { ActivityFeed } from "@/components/dashboard/ActivityFeed";
+import { WidgetConfigDialog } from "@/components/widgets/WidgetConfigDialog";
-import { TokenBudget } from "@/components/dashboard/TokenBudget";
+import { DEFAULT_LAYOUT } from "@/components/widgets/defaultLayout";
+import { fetchDefaultLayout, createLayout, updateLayout } from "@/lib/api/layouts";
+import { useWorkspaceId } from "@/lib/hooks";
 
 export default function DashboardPage(): ReactElement {
-  return (
+  const workspaceId = useWorkspaceId();
-    <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+  const [layout, setLayout] = useState<WidgetPlacement[]>(DEFAULT_LAYOUT);
-      <DashboardMetrics />
+  const [layoutId, setLayoutId] = useState<string | null>(null);
-      <div
+  const [isEditing, setIsEditing] = useState(false);
-        style={{
+  const [isPickerOpen, setIsPickerOpen] = useState(false);
-          display: "grid",
+  const [configWidgetId, setConfigWidgetId] = useState<string | null>(null);
-          gridTemplateColumns: "1fr 320px",
+  const [isLoading, setIsLoading] = useState(true);
-          gap: 16,
+
-        }}
+  // Debounce timer for auto-saving layout changes
-      >
+  const saveTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-        <div style={{ display: "flex", flexDirection: "column", gap: 16, minWidth: 0 }}>
+
-          <OrchestratorSessions />
+  // Load the user's default layout (or create one)
-          <QuickActions />
+  useEffect(() => {
-        </div>
+    if (!workspaceId) {
-        <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+      setIsLoading(false);
-          <ActivityFeed />
+      return;
-          <TokenBudget />
+    }
+
+    const wsId = workspaceId;
+    const ac = new AbortController();
+
+    async function loadLayout(): Promise<void> {
+      try {
+        const existing = await fetchDefaultLayout(wsId);
+        if (ac.signal.aborted) return;
+
+        if (existing) {
+          setLayout(existing.layout);
+          setLayoutId(existing.id);
+        } else {
+          const created = await createLayout(wsId, {
+            name: "Default",
+            isDefault: true,
+            layout: DEFAULT_LAYOUT,
+          });
+          // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- aborted can change during await
+          if (ac.signal.aborted) return;
+          setLayout(created.layout);
+          setLayoutId(created.id);
+        }
+      } catch (err: unknown) {
+        console.error("[Dashboard] Failed to load layout:", err);
+      }
+      setIsLoading(false);
+    }
+
+    void loadLayout();
+
+    return (): void => {
+      ac.abort();
+    };
+  }, [workspaceId]);
+
+  // Save layout changes with debounce
+  const saveLayout = useCallback(
+    (newLayout: WidgetPlacement[]) => {
+      if (!workspaceId || !layoutId) return;
+
+      if (saveTimerRef.current) {
+        clearTimeout(saveTimerRef.current);
+      }
+
+      saveTimerRef.current = setTimeout(() => {
+        void updateLayout(workspaceId, layoutId, { layout: newLayout }).catch((err: unknown) => {
+          console.error("[Dashboard] Failed to save layout:", err);
+        });
+      }, 800);
+    },
+    [workspaceId, layoutId]
+  );
+
+  const handleLayoutChange = useCallback(
+    (newLayout: WidgetPlacement[]) => {
+      setLayout(newLayout);
+      saveLayout(newLayout);
+    },
+    [saveLayout]
+  );
+
+  const handleRemoveWidget = useCallback(
+    (widgetId: string) => {
+      const updated = layout.filter((item) => item.i !== widgetId);
+      setLayout(updated);
+      saveLayout(updated);
+    },
+    [layout, saveLayout]
+  );
+
+  const handleAddWidget = useCallback(
+    (placement: WidgetPlacement) => {
+      const updated = [...layout, placement];
+      setLayout(updated);
+      saveLayout(updated);
+    },
+    [layout, saveLayout]
+  );
+
+  const handleResetLayout = useCallback((): void => {
+    setLayout(DEFAULT_LAYOUT);
+    saveLayout(DEFAULT_LAYOUT);
+  }, [saveLayout]);
+
+  const handleEditWidget = useCallback((widgetId: string): void => {
+    setConfigWidgetId(widgetId);
+  }, []);
+
+  if (isLoading) {
+    return (
+      <div className="flex items-center justify-center" style={{ minHeight: 400 }}>
+        <div className="flex flex-col items-center gap-2">
+          <div
+            className="w-8 h-8 border-2 border-t-transparent rounded-full animate-spin"
+            style={{ borderColor: "var(--primary)", borderTopColor: "transparent" }}
+          />
+          <span className="text-sm" style={{ color: "var(--muted)" }}>
+            Loading dashboard...
+          </span>
         </div>
       </div>
+    );
+  }
+
+  return (
+    <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+      {/* Dashboard header with edit toggle */}
+      <div className="flex items-center justify-between">
+        <h1
+          style={{
+            fontSize: "1.5rem",
+            fontWeight: 700,
+            color: "var(--text)",
+            margin: 0,
+          }}
+        >
+          Dashboard
+        </h1>
+        <div className="flex items-center gap-2">
+          {isEditing && (
+            <>
+              <button
+                onClick={handleResetLayout}
+                style={{
+                  padding: "6px 14px",
+                  borderRadius: "var(--r)",
+                  border: "1px solid var(--border)",
+                  background: "transparent",
+                  color: "var(--muted)",
+                  fontSize: "0.83rem",
+                  fontWeight: 500,
+                  cursor: "pointer",
+                  transition: "all 0.15s ease",
+                }}
+              >
+                Reset
+              </button>
+              <button
+                onClick={(): void => {
+                  setIsPickerOpen(true);
+                }}
+                style={{
+                  padding: "6px 14px",
+                  borderRadius: "var(--r)",
+                  border: "1px solid var(--border)",
+                  background: "transparent",
+                  color: "var(--text-2)",
+                  fontSize: "0.83rem",
+                  fontWeight: 500,
+                  cursor: "pointer",
+                  transition: "all 0.15s ease",
+                }}
+              >
+                + Add Widget
+              </button>
+            </>
+          )}
+          <button
+            onClick={(): void => {
+              setIsEditing((prev) => !prev);
+              if (isEditing) setIsPickerOpen(false);
+            }}
+            style={{
+              padding: "6px 14px",
+              borderRadius: "var(--r)",
+              border: isEditing ? "1px solid var(--primary)" : "1px solid var(--border)",
+              background: isEditing ? "var(--primary)" : "transparent",
+              color: isEditing ? "#fff" : "var(--text-2)",
+              fontSize: "0.83rem",
+              fontWeight: 500,
+              cursor: "pointer",
+              transition: "all 0.15s ease",
+            }}
+          >
+            {isEditing ? "Done" : "Edit Layout"}
+          </button>
+        </div>
+      </div>
+
+      {/* Widget grid */}
+      <WidgetGrid
+        layout={layout}
+        onLayoutChange={handleLayoutChange}
+        {...(isEditing && { onRemoveWidget: handleRemoveWidget })}
+        {...(isEditing && { onEditWidget: handleEditWidget })}
+        isEditing={isEditing}
+      />
+
+      {/* Widget config dialog */}
+      {configWidgetId && (
+        <WidgetConfigDialog
+          widgetId={configWidgetId}
+          open
+          onClose={(): void => {
+            setConfigWidgetId(null);
+          }}
+        />
+      )}
+
+      {/* Widget picker drawer */}
+      <WidgetPicker
+        open={isPickerOpen}
+        onClose={(): void => {
+          setIsPickerOpen(false);
+        }}
+        onAddWidget={handleAddWidget}
+        currentLayout={layout}
+      />
     </div>
   );
 }

apps/web/src/app/(authenticated)/profile/page.tsx

@@ -0,0 +1,452 @@
+"use client";
+
+import { useState, useEffect, useCallback } from "react";
+import type { ReactElement } from "react";
+import Link from "next/link";
+import { useAuth } from "@/lib/auth/auth-context";
+import { apiGet } from "@/lib/api/client";
+
+// ─── Types ────────────────────────────────────────────────────────────
+
+interface UserPreferences {
+  id: string;
+  userId: string;
+  theme: string;
+  locale: string;
+  timezone: string | null;
+  settings: Record<string, unknown>;
+  updatedAt: string;
+}
+
+// ─── Sub-components ───────────────────────────────────────────────────
+
+interface PreferenceRowProps {
+  label: string;
+  value: string;
+}
+
+function PreferenceRow({ label, value }: PreferenceRowProps): ReactElement {
+  return (
+    <div
+      style={{
+        display: "flex",
+        justifyContent: "space-between",
+        alignItems: "center",
+        padding: "12px 0",
+        borderBottom: "1px solid var(--border)",
+      }}
+    >
+      <span style={{ fontSize: "0.9rem", color: "var(--text-2)" }}>{label}</span>
+      <span
+        style={{
+          fontSize: "0.9rem",
+          fontWeight: 500,
+          color: "var(--text)",
+          fontFamily: "var(--mono)",
+        }}
+      >
+        {value}
+      </span>
+    </div>
+  );
+}
+
+function PreferencesSkeleton(): ReactElement {
+  return (
+    <div style={{ display: "flex", flexDirection: "column", gap: 12 }}>
+      {Array.from({ length: 3 }).map((_, i) => (
+        <div
+          key={i}
+          style={{
+            display: "flex",
+            justifyContent: "space-between",
+            padding: "12px 0",
+            borderBottom: "1px solid var(--border)",
+          }}
+        >
+          <div
+            style={{
+              width: 80,
+              height: 16,
+              borderRadius: 4,
+              background: "var(--surface-2)",
+              animation: "pulse 1.5s ease-in-out infinite",
+            }}
+          />
+          <div
+            style={{
+              width: 120,
+              height: 16,
+              borderRadius: 4,
+              background: "var(--surface-2)",
+              animation: "pulse 1.5s ease-in-out infinite",
+            }}
+          />
+        </div>
+      ))}
+    </div>
+  );
+}
+
+// ─── Main Page Component ──────────────────────────────────────────────
+
+export default function ProfilePage(): ReactElement {
+  const { user, signOut } = useAuth();
+  const [preferences, setPreferences] = useState<UserPreferences | null>(null);
+  const [prefsLoading, setPrefsLoading] = useState(true);
+  const [prefsError, setPrefsError] = useState<string | null>(null);
+  const [signOutHovered, setSignOutHovered] = useState(false);
+  const [settingsHovered, setSettingsHovered] = useState(false);
+
+  const loadPreferences = useCallback(async (): Promise<void> => {
+    setPrefsLoading(true);
+    setPrefsError(null);
+
+    try {
+      const data = await apiGet<UserPreferences>("/api/users/me/preferences");
+      setPreferences(data);
+    } catch (err: unknown) {
+      const message = err instanceof Error ? err.message : "Could not load preferences";
+      setPrefsError(message);
+    } finally {
+      setPrefsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    void loadPreferences();
+  }, [loadPreferences]);
+
+  // User initials for avatar fallback
+  const initials = user?.name
+    ? user.name
+        .split(" ")
+        .slice(0, 2)
+        .map((part) => part[0])
+        .join("")
+        .toUpperCase()
+    : user?.email
+      ? (user.email[0] ?? "?").toUpperCase()
+      : "?";
+
+  return (
+    <div className="max-w-3xl mx-auto p-6">
+      {/* ── Page Header ── */}
+      <div style={{ marginBottom: 32 }}>
+        <h1
+          style={{
+            fontSize: "1.875rem",
+            fontWeight: 700,
+            color: "var(--text)",
+            margin: 0,
+          }}
+        >
+          Profile
+        </h1>
+        <p
+          style={{
+            fontSize: "0.9rem",
+            color: "var(--muted)",
+            margin: "8px 0 0 0",
+          }}
+        >
+          Your account information and preferences
+        </p>
+      </div>
+
+      {/* ── User Info Card ── */}
+      <div
+        style={{
+          background: "var(--surface)",
+          border: "1px solid var(--border)",
+          borderRadius: "var(--r-xl)",
+          padding: 28,
+          marginBottom: 24,
+        }}
+      >
+        <div style={{ display: "flex", alignItems: "center", gap: 20 }}>
+          {/* Avatar (64px) */}
+          <div
+            style={{
+              width: 64,
+              height: 64,
+              borderRadius: "50%",
+              background: user?.image
+                ? "none"
+                : "linear-gradient(135deg, var(--ms-blue-500), var(--ms-purple-500))",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              flexShrink: 0,
+              overflow: "hidden",
+            }}
+          >
+            {user?.image ? (
+              <img
+                src={user.image}
+                alt={user.name || user.email || "User avatar"}
+                style={{ width: "100%", height: "100%", objectFit: "cover" }}
+              />
+            ) : (
+              <span
+                style={{
+                  fontSize: "1.25rem",
+                  fontWeight: 700,
+                  color: "#fff",
+                  letterSpacing: "0.02em",
+                  lineHeight: 1,
+                }}
+              >
+                {initials}
+              </span>
+            )}
+          </div>
+
+          {/* Name, email, role, status */}
+          <div style={{ flex: 1, minWidth: 0 }}>
+            <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
+              <h2
+                style={{
+                  fontSize: "1.25rem",
+                  fontWeight: 700,
+                  color: "var(--text)",
+                  margin: 0,
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  whiteSpace: "nowrap",
+                }}
+              >
+                {user?.name ?? "User"}
+              </h2>
+
+              {/* Online indicator */}
+              <div
+                style={{
+                  display: "flex",
+                  alignItems: "center",
+                  gap: 6,
+                }}
+              >
+                <div
+                  style={{
+                    width: 8,
+                    height: 8,
+                    borderRadius: "50%",
+                    background: "var(--success)",
+                    boxShadow: "0 0 6px var(--success)",
+                    flexShrink: 0,
+                  }}
+                  aria-hidden="true"
+                />
+                <span
+                  style={{
+                    fontSize: "0.75rem",
+                    color: "var(--success)",
+                    fontWeight: 500,
+                  }}
+                >
+                  Online
+                </span>
+              </div>
+            </div>
+
+            {user?.email && (
+              <p
+                style={{
+                  fontSize: "0.9rem",
+                  color: "var(--muted)",
+                  margin: "4px 0 0 0",
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  whiteSpace: "nowrap",
+                }}
+              >
+                {user.email}
+              </p>
+            )}
+
+            {/* Workspace role badge — placeholder until workspace context API
+                provides role data via GET /api/workspaces */}
+          </div>
+        </div>
+      </div>
+
+      {/* ── Preferences Section ── */}
+      <div
+        style={{
+          background: "var(--surface)",
+          border: "1px solid var(--border)",
+          borderRadius: "var(--r-xl)",
+          padding: 28,
+          marginBottom: 24,
+        }}
+      >
+        <h3
+          style={{
+            fontSize: "1.125rem",
+            fontWeight: 600,
+            color: "var(--text)",
+            margin: "0 0 16px 0",
+          }}
+        >
+          Preferences
+        </h3>
+
+        {prefsLoading ? (
+          <PreferencesSkeleton />
+        ) : prefsError ? (
+          <div
+            style={{
+              padding: "16px 20px",
+              borderRadius: "var(--r)",
+              background: "rgba(245, 158, 11, 0.08)",
+              border: "1px solid rgba(245, 158, 11, 0.2)",
+              color: "var(--text-2)",
+              fontSize: "0.85rem",
+              lineHeight: 1.5,
+            }}
+          >
+            <span style={{ fontWeight: 500 }}>Preferences unavailable</span>
+            <span style={{ color: "var(--muted)", marginLeft: 8 }}>&mdash; {prefsError}</span>
+          </div>
+        ) : preferences ? (
+          <div>
+            <PreferenceRow label="Theme" value={preferences.theme} />
+            <PreferenceRow label="Locale" value={preferences.locale} />
+            <PreferenceRow label="Timezone" value={preferences.timezone ?? "Not set"} />
+            {Object.keys(preferences.settings).length > 0 && (
+              <>
+                <div
+                  style={{
+                    fontSize: "0.83rem",
+                    fontWeight: 600,
+                    color: "var(--text-2)",
+                    margin: "16px 0 8px 0",
+                  }}
+                >
+                  Custom Settings
+                </div>
+                {Object.entries(preferences.settings).map(([key, value]) => (
+                  <PreferenceRow key={key} label={key} value={String(value)} />
+                ))}
+              </>
+            )}
+          </div>
+        ) : (
+          <p
+            style={{
+              fontSize: "0.9rem",
+              color: "var(--muted)",
+              margin: 0,
+            }}
+          >
+            No preferences configured yet.
+          </p>
+        )}
+      </div>
+
+      {/* ── Account Actions ── */}
+      <div
+        style={{
+          background: "var(--surface)",
+          border: "1px solid var(--border)",
+          borderRadius: "var(--r-xl)",
+          padding: 28,
+        }}
+      >
+        <h3
+          style={{
+            fontSize: "1.125rem",
+            fontWeight: 600,
+            color: "var(--text)",
+            margin: "0 0 16px 0",
+          }}
+        >
+          Account
+        </h3>
+
+        <div style={{ display: "flex", alignItems: "center", gap: 12 }}>
+          {/* Settings link */}
+          <Link
+            href="/settings"
+            style={{
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 8,
+              padding: "10px 20px",
+              borderRadius: "var(--r)",
+              background: settingsHovered ? "var(--surface-2)" : "var(--surface)",
+              border: "1px solid var(--border)",
+              color: "var(--text)",
+              fontSize: "0.9rem",
+              fontWeight: 500,
+              textDecoration: "none",
+              cursor: "pointer",
+              transition: "background 0.15s ease, border-color 0.15s ease",
+            }}
+            onMouseEnter={() => {
+              setSettingsHovered(true);
+            }}
+            onMouseLeave={() => {
+              setSettingsHovered(false);
+            }}
+          >
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="1.5"
+              aria-hidden="true"
+            >
+              <circle cx="8" cy="8" r="2.5" />
+              <path d="M8 1v1.5M8 13.5V15M1 8h1.5M13.5 8H15M3.05 3.05l1.06 1.06M11.89 11.89l1.06 1.06M3.05 12.95l1.06-1.06M11.89 4.11l1.06-1.06" />
+            </svg>
+            Settings
+          </Link>
+
+          {/* Sign Out button */}
+          <button
+            onClick={() => {
+              void signOut();
+            }}
+            style={{
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 8,
+              padding: "10px 20px",
+              borderRadius: "var(--r)",
+              background: signOutHovered ? "rgba(239, 68, 68, 0.1)" : "transparent",
+              border: "1px solid var(--danger)",
+              color: "var(--danger)",
+              fontSize: "0.9rem",
+              fontWeight: 500,
+              cursor: "pointer",
+              transition: "background 0.15s ease",
+            }}
+            onMouseEnter={() => {
+              setSignOutHovered(true);
+            }}
+            onMouseLeave={() => {
+              setSignOutHovered(false);
+            }}
+          >
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="1.5"
+              aria-hidden="true"
+            >
+              <path d="M6 2H3a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h3M10 11l4-4-4-4M14 8H6" />
+            </svg>
+            Sign Out
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}

apps/web/src/app/(authenticated)/projects/page.tsx

@@ -0,0 +1,809 @@
+"use client";
+
+import { useState, useEffect, useCallback } from "react";
+import type { ReactElement, SyntheticEvent } from "react";
+import { useRouter } from "next/navigation";
+import { Plus, Trash2 } from "lucide-react";
+
+import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogDescription,
+  DialogFooter,
+} from "@/components/ui/dialog";
+import { fetchProjects, createProject, deleteProject, ProjectStatus } from "@/lib/api/projects";
+import type { Project, CreateProjectDto } from "@/lib/api/projects";
+import { useWorkspaceId } from "@/lib/hooks";
+
+/* ---------------------------------------------------------------------------
+   Status badge helpers
+   --------------------------------------------------------------------------- */
+
+interface StatusStyle {
+  label: string;
+  bg: string;
+  color: string;
+}
+
+function getStatusStyle(status: ProjectStatus): StatusStyle {
+  switch (status) {
+    case ProjectStatus.PLANNING:
+      return { label: "Planning", bg: "rgba(47,128,255,0.15)", color: "var(--primary)" };
+    case ProjectStatus.ACTIVE:
+      return { label: "Active", bg: "rgba(20,184,166,0.15)", color: "var(--success)" };
+    case ProjectStatus.PAUSED:
+      return { label: "Paused", bg: "rgba(245,158,11,0.15)", color: "var(--warn)" };
+    case ProjectStatus.COMPLETED:
+      return { label: "Completed", bg: "rgba(139,92,246,0.15)", color: "var(--purple)" };
+    case ProjectStatus.ARCHIVED:
+      return { label: "Archived", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
+    default:
+      return { label: String(status), bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
+  }
+}
+
+function formatTimestamp(iso: string): string {
+  try {
+    return new Date(iso).toLocaleDateString("en-US", {
+      month: "short",
+      day: "numeric",
+      year: "numeric",
+    });
+  } catch {
+    return iso;
+  }
+}
+
+/* ---------------------------------------------------------------------------
+   ProjectCard
+   --------------------------------------------------------------------------- */
+
+interface ProjectCardProps {
+  project: Project;
+  onDelete: (id: string) => void;
+  onClick: (id: string) => void;
+}
+
+function ProjectCard({ project, onDelete, onClick }: ProjectCardProps): ReactElement {
+  const [hovered, setHovered] = useState(false);
+  const status = getStatusStyle(project.status);
+
+  return (
+    <div
+      role="button"
+      tabIndex={0}
+      onClick={() => {
+        onClick(project.id);
+      }}
+      onKeyDown={(e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onClick(project.id);
+        }
+      }}
+      onMouseEnter={() => {
+        setHovered(true);
+      }}
+      onMouseLeave={() => {
+        setHovered(false);
+      }}
+      style={{
+        background: "var(--surface)",
+        border: `1px solid ${hovered ? "var(--primary)" : "var(--border)"}`,
+        borderRadius: "var(--r-lg)",
+        padding: 20,
+        cursor: "pointer",
+        transition: "border-color 0.2s var(--ease)",
+        display: "flex",
+        flexDirection: "column",
+        gap: 12,
+        position: "relative",
+      }}
+    >
+      {/* Header row: name + delete button */}
+      <div style={{ display: "flex", alignItems: "flex-start", justifyContent: "space-between" }}>
+        <div style={{ flex: 1, minWidth: 0 }}>
+          <h3
+            style={{
+              fontWeight: 600,
+              color: "var(--text)",
+              fontSize: "1rem",
+              margin: 0,
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+            }}
+          >
+            {project.name}
+          </h3>
+        </div>
+
+        {/* Delete button */}
+        <button
+          aria-label={`Delete project ${project.name}`}
+          onClick={(e) => {
+            e.stopPropagation();
+            onDelete(project.id);
+          }}
+          onKeyDown={(e) => {
+            e.stopPropagation();
+          }}
+          style={{
+            background: "transparent",
+            border: "none",
+            cursor: "pointer",
+            padding: 4,
+            borderRadius: "var(--r-sm)",
+            color: "var(--muted)",
+            transition: "color 0.15s, background 0.15s",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            flexShrink: 0,
+            marginLeft: 8,
+          }}
+          onMouseEnter={(e) => {
+            e.currentTarget.style.color = "var(--danger)";
+            e.currentTarget.style.background = "rgba(229,72,77,0.1)";
+          }}
+          onMouseLeave={(e) => {
+            e.currentTarget.style.color = "var(--muted)";
+            e.currentTarget.style.background = "transparent";
+          }}
+        >
+          <Trash2 size={16} />
+        </button>
+      </div>
+
+      {/* Description */}
+      {project.description ? (
+        <p
+          style={{
+            color: "var(--muted)",
+            fontSize: "0.85rem",
+            margin: 0,
+            overflow: "hidden",
+            textOverflow: "ellipsis",
+            display: "-webkit-box",
+            WebkitLineClamp: 2,
+            WebkitBoxOrient: "vertical",
+            lineHeight: 1.5,
+          }}
+        >
+          {project.description}
+        </p>
+      ) : (
+        <p style={{ color: "var(--muted)", fontSize: "0.85rem", margin: 0, fontStyle: "italic" }}>
+          No description
+        </p>
+      )}
+
+      {/* Footer: status + timestamps */}
+      <div
+        style={{
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          marginTop: "auto",
+        }}
+      >
+        {/* Status badge */}
+        <span
+          style={{
+            display: "inline-block",
+            padding: "2px 10px",
+            borderRadius: "var(--r)",
+            background: status.bg,
+            color: status.color,
+            fontSize: "0.75rem",
+            fontWeight: 500,
+          }}
+        >
+          {status.label}
+        </span>
+
+        {/* Timestamps */}
+        <span
+          style={{
+            fontSize: "0.75rem",
+            color: "var(--muted)",
+            fontFamily: "var(--mono)",
+          }}
+        >
+          {formatTimestamp(project.createdAt)}
+        </span>
+      </div>
+    </div>
+  );
+}
+
+/* ---------------------------------------------------------------------------
+   Create Project Dialog
+   --------------------------------------------------------------------------- */
+
+interface CreateDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  onSubmit: (data: CreateProjectDto) => Promise<void>;
+  isSubmitting: boolean;
+}
+
+function CreateProjectDialog({
+  open,
+  onOpenChange,
+  onSubmit,
+  isSubmitting,
+}: CreateDialogProps): ReactElement {
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+  const [formError, setFormError] = useState<string | null>(null);
+
+  function resetForm(): void {
+    setName("");
+    setDescription("");
+    setFormError(null);
+  }
+
+  async function handleSubmit(e: SyntheticEvent): Promise<void> {
+    e.preventDefault();
+    setFormError(null);
+
+    const trimmedName = name.trim();
+    if (!trimmedName) {
+      setFormError("Project name is required.");
+      return;
+    }
+
+    try {
+      const payload: CreateProjectDto = { name: trimmedName };
+      const trimmedDesc = description.trim();
+      if (trimmedDesc) {
+        payload.description = trimmedDesc;
+      }
+      await onSubmit(payload);
+      resetForm();
+    } catch (err: unknown) {
+      setFormError(err instanceof Error ? err.message : "Failed to create project.");
+    }
+  }
+
+  return (
+    <Dialog
+      open={open}
+      onOpenChange={(isOpen) => {
+        if (!isOpen) resetForm();
+        onOpenChange(isOpen);
+      }}
+    >
+      <DialogContent>
+        <div
+          style={{
+            background: "var(--surface)",
+            borderRadius: "var(--r-lg)",
+            border: "1px solid var(--border)",
+            padding: 24,
+            position: "relative",
+          }}
+        >
+          <DialogHeader>
+            <DialogTitle>
+              <span style={{ color: "var(--text)" }}>New Project</span>
+            </DialogTitle>
+            <DialogDescription>
+              <span style={{ color: "var(--muted)" }}>
+                Give your project a name and optional description.
+              </span>
+            </DialogDescription>
+          </DialogHeader>
+
+          <form
+            onSubmit={(e) => {
+              void handleSubmit(e);
+            }}
+            style={{ marginTop: 16 }}
+          >
+            {/* Name */}
+            <div style={{ marginBottom: 16 }}>
+              <label
+                htmlFor="project-name"
+                style={{
+                  display: "block",
+                  marginBottom: 6,
+                  fontSize: "0.85rem",
+                  fontWeight: 500,
+                  color: "var(--text-2)",
+                }}
+              >
+                Name <span style={{ color: "var(--danger)" }}>*</span>
+              </label>
+              <input
+                id="project-name"
+                type="text"
+                value={name}
+                onChange={(e) => {
+                  setName(e.target.value);
+                }}
+                placeholder="e.g. Website Redesign"
+                maxLength={255}
+                autoFocus
+                style={{
+                  width: "100%",
+                  padding: "8px 12px",
+                  background: "var(--bg)",
+                  border: "1px solid var(--border)",
+                  borderRadius: "var(--r)",
+                  color: "var(--text)",
+                  fontSize: "0.9rem",
+                  outline: "none",
+                  boxSizing: "border-box",
+                }}
+              />
+            </div>
+
+            {/* Description */}
+            <div style={{ marginBottom: 16 }}>
+              <label
+                htmlFor="project-description"
+                style={{
+                  display: "block",
+                  marginBottom: 6,
+                  fontSize: "0.85rem",
+                  fontWeight: 500,
+                  color: "var(--text-2)",
+                }}
+              >
+                Description
+              </label>
+              <textarea
+                id="project-description"
+                value={description}
+                onChange={(e) => {
+                  setDescription(e.target.value);
+                }}
+                placeholder="A brief summary of this project..."
+                rows={3}
+                maxLength={10000}
+                style={{
+                  width: "100%",
+                  padding: "8px 12px",
+                  background: "var(--bg)",
+                  border: "1px solid var(--border)",
+                  borderRadius: "var(--r)",
+                  color: "var(--text)",
+                  fontSize: "0.9rem",
+                  outline: "none",
+                  resize: "vertical",
+                  fontFamily: "inherit",
+                  boxSizing: "border-box",
+                }}
+              />
+            </div>
+
+            {/* Form error */}
+            {formError !== null && (
+              <p style={{ color: "var(--danger)", fontSize: "0.85rem", margin: "0 0 12px" }}>
+                {formError}
+              </p>
+            )}
+
+            <DialogFooter>
+              <button
+                type="button"
+                onClick={() => {
+                  onOpenChange(false);
+                }}
+                disabled={isSubmitting}
+                style={{
+                  padding: "8px 16px",
+                  background: "transparent",
+                  border: "1px solid var(--border)",
+                  borderRadius: "var(--r)",
+                  color: "var(--text-2)",
+                  fontSize: "0.85rem",
+                  cursor: "pointer",
+                }}
+              >
+                Cancel
+              </button>
+              <button
+                type="submit"
+                disabled={isSubmitting || !name.trim()}
+                style={{
+                  padding: "8px 16px",
+                  background: "var(--primary)",
+                  border: "none",
+                  borderRadius: "var(--r)",
+                  color: "#fff",
+                  fontSize: "0.85rem",
+                  fontWeight: 500,
+                  cursor: isSubmitting || !name.trim() ? "not-allowed" : "pointer",
+                  opacity: isSubmitting || !name.trim() ? 0.6 : 1,
+                }}
+              >
+                {isSubmitting ? "Creating..." : "Create Project"}
+              </button>
+            </DialogFooter>
+          </form>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+/* ---------------------------------------------------------------------------
+   Delete Confirmation Dialog
+   --------------------------------------------------------------------------- */
+
+interface DeleteDialogProps {
+  open: boolean;
+  projectName: string;
+  onConfirm: () => void;
+  onCancel: () => void;
+  isDeleting: boolean;
+}
+
+function DeleteConfirmDialog({
+  open,
+  projectName,
+  onConfirm,
+  onCancel,
+  isDeleting,
+}: DeleteDialogProps): ReactElement {
+  return (
+    <Dialog
+      open={open}
+      onOpenChange={(isOpen) => {
+        if (!isOpen) onCancel();
+      }}
+    >
+      <DialogContent>
+        <div
+          style={{
+            background: "var(--surface)",
+            borderRadius: "var(--r-lg)",
+            border: "1px solid var(--border)",
+            padding: 24,
+          }}
+        >
+          <DialogHeader>
+            <DialogTitle>
+              <span style={{ color: "var(--text)" }}>Delete Project</span>
+            </DialogTitle>
+            <DialogDescription>
+              <span style={{ color: "var(--muted)" }}>
+                {"This will permanently delete "}
+                <strong style={{ color: "var(--text)" }}>{projectName}</strong>
+                {". This action cannot be undone."}
+              </span>
+            </DialogDescription>
+          </DialogHeader>
+
+          <DialogFooter>
+            <button
+              type="button"
+              onClick={onCancel}
+              disabled={isDeleting}
+              style={{
+                padding: "8px 16px",
+                background: "transparent",
+                border: "1px solid var(--border)",
+                borderRadius: "var(--r)",
+                color: "var(--text-2)",
+                fontSize: "0.85rem",
+                cursor: "pointer",
+              }}
+            >
+              Cancel
+            </button>
+            <button
+              type="button"
+              onClick={onConfirm}
+              disabled={isDeleting}
+              style={{
+                padding: "8px 16px",
+                background: "var(--danger)",
+                border: "none",
+                borderRadius: "var(--r)",
+                color: "#fff",
+                fontSize: "0.85rem",
+                fontWeight: 500,
+                cursor: isDeleting ? "not-allowed" : "pointer",
+                opacity: isDeleting ? 0.6 : 1,
+              }}
+            >
+              {isDeleting ? "Deleting..." : "Delete"}
+            </button>
+          </DialogFooter>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+/* ---------------------------------------------------------------------------
+   Projects Page
+   --------------------------------------------------------------------------- */
+
+export default function ProjectsPage(): ReactElement {
+  const router = useRouter();
+  const workspaceId = useWorkspaceId();
+
+  const [projects, setProjects] = useState<Project[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Create dialog state
+  const [createOpen, setCreateOpen] = useState(false);
+  const [isCreating, setIsCreating] = useState(false);
+
+  // Delete dialog state
+  const [deleteTarget, setDeleteTarget] = useState<Project | null>(null);
+  const [isDeleting, setIsDeleting] = useState(false);
+
+  const loadProjects = useCallback(async (wsId: string | null): Promise<void> => {
+    try {
+      setIsLoading(true);
+      setError(null);
+      const data = await fetchProjects(wsId ?? undefined);
+      setProjects(data);
+    } catch (err: unknown) {
+      console.error("[Projects] Failed to fetch projects:", err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : "Something went wrong loading projects. You could try again when ready."
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    if (!workspaceId) {
+      setIsLoading(false);
+      return;
+    }
+
+    let cancelled = false;
+    const wsId = workspaceId;
+
+    async function load(): Promise<void> {
+      try {
+        setIsLoading(true);
+        setError(null);
+        const data = await fetchProjects(wsId);
+        if (!cancelled) {
+          setProjects(data);
+        }
+      } catch (err: unknown) {
+        console.error("[Projects] Failed to fetch projects:", err);
+        if (!cancelled) {
+          setError(
+            err instanceof Error
+              ? err.message
+              : "Something went wrong loading projects. You could try again when ready."
+          );
+        }
+      } finally {
+        if (!cancelled) {
+          setIsLoading(false);
+        }
+      }
+    }
+
+    void load();
+
+    return (): void => {
+      cancelled = true;
+    };
+  }, [workspaceId]);
+
+  function handleRetry(): void {
+    void loadProjects(workspaceId);
+  }
+
+  async function handleCreate(data: CreateProjectDto): Promise<void> {
+    setIsCreating(true);
+    try {
+      await createProject(data, workspaceId ?? undefined);
+      setCreateOpen(false);
+      void loadProjects(workspaceId);
+    } finally {
+      setIsCreating(false);
+    }
+  }
+
+  function handleDeleteRequest(projectId: string): void {
+    const target = projects.find((p) => p.id === projectId);
+    if (target) {
+      setDeleteTarget(target);
+    }
+  }
+
+  async function handleDeleteConfirm(): Promise<void> {
+    if (!deleteTarget) return;
+    setIsDeleting(true);
+    try {
+      await deleteProject(deleteTarget.id, workspaceId ?? undefined);
+      setDeleteTarget(null);
+      void loadProjects(workspaceId);
+    } catch (err: unknown) {
+      console.error("[Projects] Failed to delete project:", err);
+      setError(err instanceof Error ? err.message : "Failed to delete project.");
+      setDeleteTarget(null);
+    } finally {
+      setIsDeleting(false);
+    }
+  }
+
+  function handleCardClick(projectId: string): void {
+    router.push(`/projects/${projectId}`);
+  }
+
+  return (
+    <main className="container mx-auto px-4 py-8" style={{ maxWidth: 960 }}>
+      {/* Header */}
+      <div
+        style={{
+          display: "flex",
+          alignItems: "flex-start",
+          justifyContent: "space-between",
+          marginBottom: 32,
+          flexWrap: "wrap",
+          gap: 16,
+        }}
+      >
+        <div>
+          <h1
+            style={{
+              fontSize: "1.875rem",
+              fontWeight: 700,
+              color: "var(--text)",
+              margin: 0,
+            }}
+          >
+            Projects
+          </h1>
+          <p
+            style={{
+              fontSize: "0.9rem",
+              color: "var(--muted)",
+              marginTop: 4,
+            }}
+          >
+            Organize and track your work across different initiatives
+          </p>
+        </div>
+
+        <button
+          onClick={() => {
+            setCreateOpen(true);
+          }}
+          style={{
+            display: "inline-flex",
+            alignItems: "center",
+            gap: 8,
+            padding: "8px 16px",
+            background: "var(--primary)",
+            border: "none",
+            borderRadius: "var(--r)",
+            color: "#fff",
+            fontSize: "0.85rem",
+            fontWeight: 500,
+            cursor: "pointer",
+          }}
+        >
+          <Plus size={16} />
+          New Project
+        </button>
+      </div>
+
+      {/* Loading */}
+      {isLoading ? (
+        <div className="flex justify-center py-16">
+          <MosaicSpinner label="Loading projects..." />
+        </div>
+      ) : error !== null ? (
+        /* Error */
+        <div
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+            borderRadius: "var(--r-lg)",
+            padding: 32,
+            textAlign: "center",
+          }}
+        >
+          <p style={{ color: "var(--danger)", margin: "0 0 16px" }}>{error}</p>
+          <button
+            onClick={handleRetry}
+            style={{
+              padding: "8px 16px",
+              background: "var(--danger)",
+              border: "none",
+              borderRadius: "var(--r)",
+              color: "#fff",
+              fontSize: "0.85rem",
+              fontWeight: 500,
+              cursor: "pointer",
+            }}
+          >
+            Try again
+          </button>
+        </div>
+      ) : projects.length === 0 ? (
+        /* Empty */
+        <div
+          style={{
+            background: "var(--surface)",
+            border: "1px solid var(--border)",
+            borderRadius: "var(--r-lg)",
+            padding: 48,
+            textAlign: "center",
+          }}
+        >
+          <p style={{ color: "var(--muted)", margin: "0 0 16px", fontSize: "0.9rem" }}>
+            No projects yet. Create your first project to get started.
+          </p>
+          <button
+            onClick={() => {
+              setCreateOpen(true);
+            }}
+            style={{
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 8,
+              padding: "8px 16px",
+              background: "var(--primary)",
+              border: "none",
+              borderRadius: "var(--r)",
+              color: "#fff",
+              fontSize: "0.85rem",
+              fontWeight: 500,
+              cursor: "pointer",
+            }}
+          >
+            <Plus size={16} />
+            Create Project
+          </button>
+        </div>
+      ) : (
+        /* Projects grid */
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+          {projects.map((project) => (
+            <ProjectCard
+              key={project.id}
+              project={project}
+              onDelete={handleDeleteRequest}
+              onClick={handleCardClick}
+            />
+          ))}
+        </div>
+      )}
+
+      {/* Create Dialog */}
+      <CreateProjectDialog
+        open={createOpen}
+        onOpenChange={setCreateOpen}
+        onSubmit={handleCreate}
+        isSubmitting={isCreating}
+      />
+
+      {/* Delete Confirmation Dialog */}
+      <DeleteConfirmDialog
+        open={deleteTarget !== null}
+        projectName={deleteTarget?.name ?? ""}
+        onConfirm={() => {
+          void handleDeleteConfirm();
+        }}
+        onCancel={() => {
+          setDeleteTarget(null);
+        }}
+        isDeleting={isDeleting}
+      />
+    </main>
+  );
+}