@swarmclawai/swarmclaw 1.9.35 → 1.9.37

package/README.md

@@ -151,6 +151,23 @@ openclaw skills install swarmclaw
 
 [Browse on ClawHub](https://clawhub.ai/waydelyle/swarmclaw)
 
+## v1.9.37 Highlights
+
+Theme and memory-pressure release for lighter UI preferences and leaner chat history storage.
+
+- **Light, dark, and system theme modes.** Settings → Appearance now persists a Light/Dark/System selector while keeping the existing hue presets and custom color picker.
+- **Lean session history storage.** Legacy transcript blobs migrate into the `session_messages` table and are compacted from session records after persistence is verified, reducing page-load memory pressure on lower-RAM devices.
+- **Repo-backed message readers.** Global search, live usage summaries, and OpenClaw history merge now read table-backed messages after transcript compaction.
+- **Regression coverage.** Added tests for theme-mode normalization, legacy transcript compaction, and repo-backed message search.
+
+## v1.9.36 Highlights
+
+Protocol builder visibility release for built-in Structured Sessions.
+
+- **Built-in flow inspector.** Built-in protocol templates now open in a full-size visual builder canvas with a read-only template step panel.
+- **Canvas viewport repair.** Builder routes now claim the full dashboard workspace and refit React Flow after async template loads.
+- **Regression coverage.** Browser smoke now verifies that the built-in facilitated discussion graph renders with visible flow nodes.
+
 ## v1.9.35 Highlights
 
 Installed package build fix for fresh npm-global installs and upgrades.
@@ -462,6 +479,23 @@ Operational docs: https://swarmclaw.ai/docs/observability
 
 ## Releases
 
+### v1.9.37 Highlights
+
+Theme and memory-pressure release for lighter UI preferences and leaner chat history storage.
+
+- **Light, dark, and system theme modes.** Settings → Appearance now persists a Light/Dark/System selector while keeping the existing hue presets and custom color picker.
+- **Lean session history storage.** Legacy transcript blobs migrate into the `session_messages` table and are compacted from session records after persistence is verified, reducing page-load memory pressure on lower-RAM devices.
+- **Repo-backed message readers.** Global search, live usage summaries, and OpenClaw history merge now read table-backed messages after transcript compaction.
+- **Regression coverage.** Added tests for theme-mode normalization, legacy transcript compaction, and repo-backed message search.
+
+### v1.9.36 Highlights
+
+Protocol builder visibility release for built-in Structured Sessions.
+
+- **Built-in flow inspector.** Built-in protocol templates now open in a full-size visual builder canvas with a read-only template step panel.
+- **Canvas viewport repair.** Builder routes now claim the full dashboard workspace and refit React Flow after async template loads.
+- **Regression coverage.** Browser smoke now verifies that the built-in facilitated discussion graph renders with visible flow nodes.
+
 ### v1.9.35 Highlights
 
 Installed package build fix for fresh npm-global installs and upgrades.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swarmclawai/swarmclaw",
-  "version": "1.9.35",
+  "version": "1.9.37",
   "description": "Build and run autonomous AI agents with OpenClaw, Hermes, multiple model providers, orchestration, delegation, memory, skills, schedules, and chat connectors.",
   "main": "electron-dist/main.js",
   "license": "MIT",
@@ -88,8 +88,8 @@
     "test:cli": "node --test src/cli/*.test.js bin/*.test.js scripts/electron-after-pack.test.mjs scripts/electron-signing-config.test.mjs scripts/ensure-sandbox-browser-image.test.mjs scripts/postinstall.test.mjs scripts/run-next-build.test.mjs scripts/run-next-typegen.test.mjs",
     "test:setup": "tsx --test src/app/api/setup/check-provider/route.test.ts src/lib/server/provider-model-discovery.test.ts src/components/auth/setup-wizard/utils.test.ts src/components/auth/setup-wizard/types.test.ts src/hooks/setup-done-detection.test.ts src/lib/setup-defaults.test.ts src/lib/server/storage-auth.test.ts src/lib/server/storage-auth-docker.test.ts",
     "test:openclaw": "tsx --test src/lib/openclaw/openclaw-agent-id.test.ts src/lib/openclaw/openclaw-endpoint.test.ts src/lib/server/agents/agent-runtime-config.test.ts src/lib/server/build-llm.test.ts src/lib/server/connectors/connector-routing.test.ts src/lib/server/connectors/openclaw.test.ts src/lib/server/connectors/swarmdock.test.ts src/lib/server/gateway/protocol.test.ts src/lib/server/gateways/gateway-topology.test.ts src/lib/server/llm-response-cache.test.ts src/lib/server/mcp-conformance.test.ts src/lib/server/openclaw/agent-resolver.test.ts src/lib/server/openclaw/deploy.test.ts src/lib/server/openclaw/skills-normalize.test.ts src/lib/server/session-tools/openclaw-nodes.test.ts src/lib/server/session-tools/swarmdock.test.ts src/lib/server/tasks/task-quality-gate.test.ts src/lib/server/tasks/task-validation.test.ts src/lib/server/tool-capability-policy.test.ts src/lib/providers/openai.test.ts src/lib/providers/openclaw-exports.test.ts src/app/api/gateways/topology-route.test.ts src/app/api/openclaw/dashboard-url/route.test.ts",
-    "test:runtime": "tsx --test src/lib/a2a/agent-card.test.ts src/lib/agent-planning-mode.test.ts src/lib/agent-config-history.test.ts src/lib/autonomy/supervisor-settings.test.ts src/lib/strip-internal-metadata.test.ts src/lib/provider-sets.test.ts src/lib/providers/opencode-cli.test.ts src/lib/providers/cli-provider-metadata.test.ts src/lib/providers/cli-utils.test.ts src/lib/providers/generic-cli.test.ts src/lib/server/agents/delegation-advisory.test.ts src/lib/server/agents/agent-runtime-config.test.ts src/lib/server/autonomy/supervisor-reflection.test.ts src/lib/server/cli-provider-readiness.test.ts src/lib/server/provider-health.test.ts src/lib/server/provider-diagnostics.test.ts src/lib/server/mcp-gateway-runtime.test.ts src/lib/server/mcp-connection-pool.test.ts src/lib/server/knowledge-sources.test.ts src/lib/server/memory/dream-service.test.ts src/lib/server/memory/memory-consolidation.test.ts src/lib/server/extension-managed-resources.test.ts src/lib/server/eval/baseline.test.ts src/lib/server/eval/environment-plan.test.ts src/lib/server/chat-execution/chat-execution-grounding.test.ts src/lib/server/chat-execution/chat-turn-preparation.test.ts src/lib/server/chat-execution/compaction-generation-preference.test.ts src/lib/server/chat-execution/iteration-timers.test.ts src/lib/server/chat-execution/post-stream-finalization.test.ts src/lib/server/chat-execution/prompt-sections.planning-mode.test.ts src/lib/server/chat-execution/reasoning-tag-scrubber.test.ts src/lib/server/chats/clear-undo-snapshots.test.ts src/lib/server/chats/session-context-pack.test.ts src/lib/server/connectors/email.test.ts src/lib/server/connectors/slack.test.ts src/lib/server/protocols/protocol-service.test.ts src/lib/server/runtime/run-ledger.test.ts src/lib/server/runtime/queue-retry-policy.test.ts src/lib/server/runs/run-brief.test.ts src/lib/server/runs/run-handoff.test.ts src/lib/server/operations/operation-pulse.test.ts src/lib/server/schedules/schedule-history.test.ts src/lib/server/schedules/schedule-timing.test.ts src/lib/server/schedules/schedule-preview.test.ts src/lib/quality/release-readiness.test.ts src/lib/quality/architecture-health.test.ts src/lib/server/artifacts/artifact-resolver.test.ts src/lib/server/observability/otel-config.test.ts src/lib/server/safe-parse-body.test.ts src/lib/server/missions/mission-templates.test.ts src/lib/server/sharing/share-link-repository.test.ts src/lib/server/sharing/share-resolver.test.ts src/lib/server/tasks/task-execution-workspace.test.ts src/lib/server/tasks/task-execution-policy.test.ts src/lib/server/tasks/task-handoff.test.ts src/lib/server/tasks/task-service.test.ts src/lib/server/session-tools/execute.test.ts src/lib/server/session-tools/manage-tasks.test.ts src/lib/server/session-tools/web-crawl.test.ts src/lib/app/view-constants.test.ts src/lib/quality/quality-summary.test.ts src/app/api/approvals/route.test.ts src/app/api/agents/agents-route.test.ts src/app/api/tasks/tasks-route.test.ts src/app/api/tasks/task-workspace-route.test.ts src/app/api/chats/chat-route.test.ts src/app/api/chats/clear-route.test.ts src/app/api/chats/compact-route.test.ts src/app/api/chats/context-pack-route.test.ts src/app/api/chats/context-status-route.test.ts src/app/api/config-versions/config-versions-route.test.ts src/app/api/runs/run-handoff-route.test.ts src/app/api/connectors/connector-doctor-route.test.ts src/app/api/extensions/managed-resources/route.test.ts src/app/api/gateways/control-route.test.ts src/app/api/healthz/route.test.ts src/app/api/logs/route.test.ts src/app/api/portability/export/route.test.ts src/app/api/portability/import/route.test.ts src/app/api/providers/[id]/route.test.ts src/app/api/schedules/preview/route.test.ts src/app/api/schedules/schedule-history-route.test.ts src/app/api/tts/route.test.ts",
-    "test:builder": "tsx --test src/features/protocols/builder/utils/nodes-to-template.test.ts src/features/protocols/builder/utils/template-to-nodes.test.ts src/features/protocols/builder/validators/dag-validator.test.ts",
+    "test:runtime": "tsx --test src/lib/a2a/agent-card.test.ts src/lib/agent-planning-mode.test.ts src/lib/agent-config-history.test.ts src/lib/autonomy/supervisor-settings.test.ts src/lib/strip-internal-metadata.test.ts src/lib/provider-sets.test.ts src/lib/providers/opencode-cli.test.ts src/lib/providers/cli-provider-metadata.test.ts src/lib/providers/cli-utils.test.ts src/lib/providers/generic-cli.test.ts src/lib/server/agents/delegation-advisory.test.ts src/lib/server/agents/agent-runtime-config.test.ts src/lib/server/autonomy/supervisor-reflection.test.ts src/lib/server/cli-provider-readiness.test.ts src/lib/server/provider-health.test.ts src/lib/server/provider-diagnostics.test.ts src/lib/server/mcp-gateway-runtime.test.ts src/lib/server/mcp-connection-pool.test.ts src/lib/server/knowledge-sources.test.ts src/lib/server/memory/dream-service.test.ts src/lib/server/memory/memory-consolidation.test.ts src/lib/server/messages/message-repository.test.ts src/lib/server/extension-managed-resources.test.ts src/lib/server/eval/baseline.test.ts src/lib/server/eval/environment-plan.test.ts src/lib/server/chat-execution/chat-execution-grounding.test.ts src/lib/server/chat-execution/chat-turn-preparation.test.ts src/lib/server/chat-execution/compaction-generation-preference.test.ts src/lib/server/chat-execution/iteration-timers.test.ts src/lib/server/chat-execution/post-stream-finalization.test.ts src/lib/server/chat-execution/prompt-sections.planning-mode.test.ts src/lib/server/chat-execution/reasoning-tag-scrubber.test.ts src/lib/server/chats/clear-undo-snapshots.test.ts src/lib/server/chats/session-context-pack.test.ts src/lib/server/connectors/email.test.ts src/lib/server/connectors/slack.test.ts src/lib/server/protocols/protocol-service.test.ts src/lib/server/runtime/run-ledger.test.ts src/lib/server/runtime/queue-retry-policy.test.ts src/lib/server/runs/run-brief.test.ts src/lib/server/runs/run-handoff.test.ts src/lib/server/operations/operation-pulse.test.ts src/lib/server/schedules/schedule-history.test.ts src/lib/server/schedules/schedule-timing.test.ts src/lib/server/schedules/schedule-preview.test.ts src/lib/quality/release-readiness.test.ts src/lib/quality/architecture-health.test.ts src/lib/server/artifacts/artifact-resolver.test.ts src/lib/server/observability/otel-config.test.ts src/lib/server/safe-parse-body.test.ts src/lib/server/missions/mission-templates.test.ts src/lib/server/sharing/share-link-repository.test.ts src/lib/server/sharing/share-resolver.test.ts src/lib/server/tasks/task-execution-workspace.test.ts src/lib/server/tasks/task-execution-policy.test.ts src/lib/server/tasks/task-handoff.test.ts src/lib/server/tasks/task-service.test.ts src/lib/server/session-tools/execute.test.ts src/lib/server/session-tools/manage-tasks.test.ts src/lib/server/session-tools/web-crawl.test.ts src/lib/app/view-constants.test.ts src/lib/quality/quality-summary.test.ts src/app/api/approvals/route.test.ts src/app/api/agents/agents-route.test.ts src/app/api/tasks/tasks-route.test.ts src/app/api/tasks/task-workspace-route.test.ts src/app/api/chats/chat-route.test.ts src/app/api/chats/clear-route.test.ts src/app/api/chats/compact-route.test.ts src/app/api/chats/context-pack-route.test.ts src/app/api/chats/context-status-route.test.ts src/app/api/config-versions/config-versions-route.test.ts src/app/api/runs/run-handoff-route.test.ts src/app/api/search/route.test.ts src/app/api/settings/settings-route.test.ts src/app/api/connectors/connector-doctor-route.test.ts src/app/api/extensions/managed-resources/route.test.ts src/app/api/gateways/control-route.test.ts src/app/api/healthz/route.test.ts src/app/api/logs/route.test.ts src/app/api/portability/export/route.test.ts src/app/api/portability/import/route.test.ts src/app/api/providers/[id]/route.test.ts src/app/api/schedules/preview/route.test.ts src/app/api/schedules/schedule-history-route.test.ts src/app/api/tts/route.test.ts",
+    "test:builder": "tsx --test src/features/protocols/builder/utils/builder-template-access.test.ts src/features/protocols/builder/utils/nodes-to-template.test.ts src/features/protocols/builder/utils/template-to-nodes.test.ts src/features/protocols/builder/validators/dag-validator.test.ts",
     "test:e2e": "node --import tsx scripts/browser-e2e-smoke.ts",
     "test:mcp:conformance": "node --import tsx ./scripts/mcp-conformance-check.ts",
     "electron:compile": "tsc -p electron/tsconfig.json",

package/src/app/api/openclaw/history/route.ts

@@ -1,7 +1,8 @@
 import { NextResponse } from 'next/server'
 import { ensureGatewayConnected } from '@/lib/server/openclaw/gateway'
 import { mergeHistoryMessages, isValidSessionKey } from '@/lib/server/openclaw/history-merge'
-import { getSession, saveSession } from '@/lib/server/sessions/session-repository'
+import { getSession, patchSession } from '@/lib/server/sessions/session-repository'
+import { getMessages, replaceAllMessages } from '@/lib/server/messages/message-repository'
 import { notify } from '@/lib/server/ws-hub'
 import type { GatewaySessionPreview } from '@/types'
 import { errorMessage } from '@/lib/shared-utils'
@@ -95,11 +96,15 @@ export async function POST(req: Request) {
       return NextResponse.json({ error: 'Local session not found' }, { status: 404 })
     }
 
-    const merged = mergeHistoryMessages(session.messages, preview)
-    const newCount = merged.length - session.messages.length
-    session.messages = merged
-    session.lastActiveAt = Date.now()
-    saveSession(localSessionId, session)
+    const currentMessages = getMessages(localSessionId)
+    const merged = mergeHistoryMessages(currentMessages, preview)
+    const newCount = merged.length - currentMessages.length
+    replaceAllMessages(localSessionId, merged)
+    patchSession(localSessionId, (current) => {
+      if (!current) return null
+      current.lastActiveAt = Date.now()
+      return current
+    })
     notify('sessions')
 
     return NextResponse.json({ ok: true, merged: newCount })

package/src/app/api/preview-server/route.ts

@@ -49,11 +49,13 @@ const servers: Map<string, PreviewServer> =
 // ---------------------------------------------------------------------------
 
 function resolveServeDir(filePath: string): string {
-  const resolved = path.resolve(filePath)
+  const resolved = path.resolve(/*turbopackIgnore: true*/ filePath)
   try {
-    return fs.statSync(resolved).isDirectory() ? resolved : path.dirname(resolved)
+    return fs.statSync(/*turbopackIgnore: true*/ resolved).isDirectory()
+      ? resolved
+      : path.dirname(/*turbopackIgnore: true*/ resolved)
   } catch {
-    return path.dirname(resolved)
+    return path.dirname(/*turbopackIgnore: true*/ resolved)
   }
 }
 
@@ -91,13 +93,13 @@ function buildFrameworkArgs(framework: string | undefined, port: number): string
 }
 
 function detectProject(dir: string): ProjectInfo {
-  const pkgPath = path.join(dir, 'package.json')
-  if (!fs.existsSync(pkgPath)) {
+  const pkgPath = path.join(/*turbopackIgnore: true*/ dir, 'package.json')
+  if (!fs.existsSync(/*turbopackIgnore: true*/ pkgPath)) {
     return { type: 'static' }
   }
 
   try {
-    const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'))
+    const pkg = JSON.parse(fs.readFileSync(/*turbopackIgnore: true*/ pkgPath, 'utf-8'))
     const scripts = pkg.scripts || {}
     const deps = { ...(pkg.dependencies || {}), ...(pkg.devDependencies || {}) }
 
@@ -156,16 +158,22 @@ function createStaticServer(dir: string): http.Server {
     ]
 
     for (const candidate of candidates) {
-      if (fs.existsSync(candidate) && fs.statSync(candidate).isFile()) {
+      if (
+        fs.existsSync(/*turbopackIgnore: true*/ candidate)
+        && fs.statSync(/*turbopackIgnore: true*/ candidate).isFile()
+      ) {
         const ext = path.extname(candidate).toLowerCase()
         res.writeHead(200, { 'Content-Type': MIME_MAP[ext] || 'application/octet-stream' })
-        fs.createReadStream(candidate).pipe(res)
+        fs.createReadStream(/*turbopackIgnore: true*/ candidate).pipe(res)
         return
       }
     }
 
-    if (fs.existsSync(normalizedFile) && fs.statSync(normalizedFile).isDirectory()) {
-      const files = fs.readdirSync(normalizedFile)
+    if (
+      fs.existsSync(/*turbopackIgnore: true*/ normalizedFile)
+      && fs.statSync(/*turbopackIgnore: true*/ normalizedFile).isDirectory()
+    ) {
+      const files = fs.readdirSync(/*turbopackIgnore: true*/ normalizedFile)
       const links = files.map((f) => `<li><a href="${reqPath.replace(/\/$/, '')}/${f}">${f}</a></li>`).join('\n')
       res.writeHead(200, { 'Content-Type': 'text/html' })
       res.end(`<!DOCTYPE html><html><head><title>Index of ${reqPath}</title><style>body{font-family:monospace;padding:20px;background:#1a1a2e;color:#e0e0e0}a{color:#60a5fa}</style></head><body><h2>Index of ${reqPath}</h2><ul>${links}</ul></body></html>`)
@@ -183,7 +191,7 @@ function createStaticServer(dir: string): http.Server {
 
 async function startNpmServer(dir: string, command: string[], port: number, framework?: string): Promise<PreviewServer> {
   // Install deps if node_modules missing
-  if (!fs.existsSync(path.join(dir, 'node_modules'))) {
+  if (!fs.existsSync(/*turbopackIgnore: true*/ path.join(/*turbopackIgnore: true*/ dir, 'node_modules'))) {
     log.info(TAG, `Installing dependencies in ${dir}`)
     await new Promise<void>((resolve, reject) => {
       const install = spawn('npm', ['install'], { cwd: dir, stdio: 'pipe' })
@@ -290,7 +298,7 @@ export async function POST(req: Request) {
       return NextResponse.json(buildResponse(servers.get(key)!))
     }
 
-    if (!fs.existsSync(dir)) {
+    if (!fs.existsSync(/*turbopackIgnore: true*/ dir)) {
       return NextResponse.json({ error: 'Directory not found' }, { status: 404 })
     }
 

package/src/app/api/search/route.test.ts

@@ -0,0 +1,63 @@
+import assert from 'node:assert/strict'
+import test from 'node:test'
+
+import { runWithTempDataDir } from '@/lib/server/test-utils/run-with-temp-data-dir'
+
+test('global search finds repo-backed session messages after blob compaction', () => {
+  const output = runWithTempDataDir<{
+    messageTitles: string[]
+    messageIndexes: number[]
+  }>(`
+    const storageMod = await import('@/lib/server/storage')
+    const repoMod = await import('@/lib/server/messages/message-repository')
+    const routeMod = await import('./src/app/api/search/route')
+    const storage = storageMod.default || storageMod
+    const repo = repoMod.default || repoMod
+    const route = routeMod.default || routeMod
+
+    storage.saveAgents({
+      'agent-search': {
+        id: 'agent-search',
+        name: 'Search Agent',
+        description: 'Search fixture',
+        provider: 'openai',
+        model: 'gpt-5',
+        createdAt: Date.now(),
+        updatedAt: Date.now(),
+      },
+    })
+    storage.saveSessions({
+      'sess-search': {
+        id: 'sess-search',
+        name: 'Search Session',
+        cwd: process.env.WORKSPACE_DIR,
+        user: 'tester',
+        provider: 'openai',
+        model: 'gpt-5',
+        agentId: 'agent-search',
+        claudeSessionId: null,
+        codexThreadId: null,
+        opencodeSessionId: null,
+        delegateResumeIds: { claudeCode: null, codex: null, opencode: null, gemini: null },
+        messages: [],
+        createdAt: Date.now(),
+        lastActiveAt: Date.now(),
+      },
+    })
+
+    repo.appendMessage('sess-search', { role: 'user', text: 'ordinary setup note', time: 10 })
+    repo.appendMessage('sess-search', { role: 'assistant', text: 'needle-backed answer from the message table', time: 20 })
+
+    const response = await route.GET(new Request('http://local/api/search?q=needle-backed'))
+    const payload = await response.json()
+    const messageResults = payload.results.filter((result) => result.type === 'message')
+
+    console.log(JSON.stringify({
+      messageTitles: messageResults.map((result) => result.title),
+      messageIndexes: messageResults.map((result) => result.messageIndex),
+    }))
+  `, { prefix: 'swarmclaw-search-repo-messages-' })
+
+  assert.deepEqual(output.messageTitles, ['needle-backed answer from the message table'])
+  assert.deepEqual(output.messageIndexes, [1])
+})

package/src/app/api/search/route.ts

@@ -7,6 +7,7 @@ import {
   loadWebhooks,
   loadSkills,
 } from '@/lib/server/storage'
+import { getMessages } from '@/lib/server/messages/message-repository'
 
 interface SearchResult {
   type: 'task' | 'agent' | 'session' | 'schedule' | 'webhook' | 'skill' | 'message'
@@ -59,8 +60,8 @@ function searchMessages(
   const MAX_MSG_RESULTS = 10
   for (const [sessionId, session] of Object.entries(sessions)) {
     if (results.length >= MAX_MSG_RESULTS) break
-    if (!Array.isArray(session.messages) || !session.messages.length) continue
-    const messages = session.messages as Array<Record<string, unknown>>
+    const messages = getMessages(sessionId)
+    if (!messages.length) continue
     const agentId = session.agentId as string | undefined
     const agentName = agentId && agents[agentId] ? (agents[agentId].name as string) : undefined
     const sessionName = (session.name as string) || 'Untitled'

package/src/app/api/settings/route.ts

@@ -7,6 +7,7 @@ import { normalizeRuntimeSettingFields } from '@/lib/runtime/runtime-loop'
 import { normalizeSupervisorSettings } from '@/lib/autonomy/supervisor-settings'
 import { ensureDaemonProcessRunning } from '@/lib/server/daemon/controller'
 import { logActivity } from '@/lib/server/activity/activity-log'
+import { normalizeThemeMode } from '@/lib/theme-mode'
 export const dynamic = 'force-dynamic'
 
 
@@ -55,7 +56,9 @@ function parseGuardMode(value: unknown): 'off' | 'warn' | 'block' {
 }
 
 export async function GET() {
-  return NextResponse.json(loadPublicSettings())
+  const settings = loadPublicSettings()
+  settings.themeMode = normalizeThemeMode(settings.themeMode)
+  return NextResponse.json(settings)
 }
 
 export async function PUT(req: Request) {
@@ -146,6 +149,7 @@ export async function PUT(req: Request) {
   settings.daemonAutostartEnabled = parseBoolSetting(settings.daemonAutostartEnabled, true)
   settings.autonomyResumeApprovalsEnabled = parseBoolSetting(settings.autonomyResumeApprovalsEnabled, false)
   settings.untrustedContentGuardMode = parseGuardMode(settings.untrustedContentGuardMode)
+  settings.themeMode = normalizeThemeMode(settings.themeMode)
   settings.sessionResetMode = settings.sessionResetMode === 'daily' ? 'daily' : settings.sessionResetMode === 'idle' ? 'idle' : null
   settings.whatsappApprovedContacts = normalizeWhatsAppApprovedContacts(settings.whatsappApprovedContacts)
   settings.sessionIdleTimeoutSec = parseIntSetting(

package/src/app/api/settings/settings-route.test.ts

@@ -0,0 +1,38 @@
+import assert from 'node:assert/strict'
+import test from 'node:test'
+
+import { runWithTempDataDir } from '@/lib/server/test-utils/run-with-temp-data-dir'
+
+test('settings route persists valid theme mode and normalizes invalid values to dark', () => {
+  const output = runWithTempDataDir<{
+    lightMode: string | null
+    invalidMode: string | null
+  }>(`
+    const routeMod = await import('./src/app/api/settings/route')
+    const route = routeMod.default || routeMod
+
+    await route.PUT(new Request('http://local/api/settings', {
+      method: 'PUT',
+      headers: { 'content-type': 'application/json' },
+      body: JSON.stringify({ themeMode: 'light' }),
+    }))
+    const lightResponse = await route.GET()
+    const lightSettings = await lightResponse.json()
+
+    await route.PUT(new Request('http://local/api/settings', {
+      method: 'PUT',
+      headers: { 'content-type': 'application/json' },
+      body: JSON.stringify({ themeMode: 'sepia' }),
+    }))
+    const invalidResponse = await route.GET()
+    const invalidSettings = await invalidResponse.json()
+
+    console.log(JSON.stringify({
+      lightMode: lightSettings.themeMode || null,
+      invalidMode: invalidSettings.themeMode || null,
+    }))
+  `, { prefix: 'swarmclaw-settings-theme-mode-' })
+
+  assert.equal(output.lightMode, 'light')
+  assert.equal(output.invalidMode, 'dark')
+})

package/src/app/api/usage/live/route.ts

@@ -9,7 +9,7 @@ type SessionSnapshot = {
   agentId?: string
   createdAt?: number
   lastActiveAt?: number
-  messages?: unknown[]
+  messageCount?: number
 }
 
 interface LiveUsage {
@@ -45,7 +45,7 @@ function summarize(sessionId: string, records: UsageRecord[], session: SessionSn
     }
   }
 
-  const turns = Array.isArray(session?.messages) ? session!.messages!.length : records.length
+  const turns = typeof session?.messageCount === 'number' ? session.messageCount : records.length
   const wallStart = session?.createdAt ?? firstAt ?? 0
   const wallEnd = session?.lastActiveAt ?? lastAt ?? Date.now()
   const wallclockMs = wallStart > 0 ? Math.max(0, wallEnd - wallStart) : 0

package/src/app/globals.css

@@ -144,6 +144,164 @@
   --command-header: rgba(0,0,0,0.3);
 }
 
+.light {
+  --background: color-mix(in srgb, var(--neutral-tint) 10%, #fff);
+  --foreground: #1f2937;
+  --card: color-mix(in srgb, var(--neutral-tint) 8%, #fff);
+  --card-foreground: #1f2937;
+  --popover: color-mix(in srgb, var(--neutral-tint) 8%, #fff);
+  --popover-foreground: #1f2937;
+  --primary: #4f46e5;
+  --primary-foreground: #ffffff;
+  --secondary: color-mix(in srgb, var(--neutral-tint) 12%, #fff);
+  --secondary-foreground: #253047;
+  --muted: color-mix(in srgb, var(--neutral-tint) 10%, #fff);
+  --muted-foreground: #5f6b85;
+  --accent: #4f46e5;
+  --accent-foreground: #ffffff;
+  --destructive: #dc2626;
+  --border: rgba(31,41,55,0.12);
+  --input: rgba(31,41,55,0.10);
+  --ring: rgba(79,70,229,0.38);
+  --sidebar: color-mix(in srgb, var(--neutral-tint) 9%, #fff);
+  --sidebar-foreground: #1f2937;
+  --sidebar-primary: #4f46e5;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: rgba(79,70,229,0.09);
+  --sidebar-accent-foreground: #253047;
+  --sidebar-border: rgba(31,41,55,0.11);
+  --sidebar-ring: rgba(79,70,229,0.35);
+
+  --color-bg: color-mix(in srgb, var(--neutral-tint) 10%, #fff);
+  --color-raised: color-mix(in srgb, var(--neutral-tint) 8%, #fff);
+  --color-surface: color-mix(in srgb, var(--neutral-tint) 14%, #fff);
+  --color-surface-2: color-mix(in srgb, var(--neutral-tint) 20%, #fff);
+  --color-surface-3: color-mix(in srgb, var(--neutral-tint) 24%, #fff);
+  --color-border-hi: rgba(31,41,55,0.12);
+  --color-border-focus: rgba(79,70,229,0.45);
+  --color-text: #1f2937;
+  --color-text-2: #4b5568;
+  --color-text-3: #6b7280;
+  --color-accent-soft: rgba(79,70,229,0.09);
+  --color-accent-glow: rgba(79,70,229,0.16);
+  --color-accent-bright: #4f46e5;
+  --color-user-text: #fff;
+  --color-success: #059669;
+  --color-success-soft: rgba(5,150,105,0.10);
+  --color-danger: #dc2626;
+  --color-danger-soft: rgba(220,38,38,0.10);
+  --color-shereen: #db2777;
+  --color-user-bubble: #4f46e5;
+  --color-user-bubble-2: #6366f1;
+  --color-ai-bubble: #f4f6fb;
+  --color-glass: rgba(255,255,255,0.82);
+  --color-glass-border: rgba(31,41,55,0.10);
+
+  --status-idle-bg: rgba(31,41,55,0.05);
+  --status-idle-border: rgba(31,41,55,0.10);
+  --status-idle-fg: #5f6b85;
+  --status-running-bg: rgba(5,150,105,0.10);
+  --status-running-border: rgba(5,150,105,0.18);
+  --status-running-fg: #047857;
+  --status-error-bg: rgba(220,38,38,0.10);
+  --status-error-border: rgba(220,38,38,0.18);
+  --status-error-fg: #dc2626;
+  --status-connecting-bg: rgba(217,119,6,0.10);
+  --status-connecting-border: rgba(217,119,6,0.18);
+  --status-connecting-fg: #b45309;
+  --status-connected-bg: rgba(2,132,199,0.10);
+  --status-connected-border: rgba(2,132,199,0.18);
+  --status-connected-fg: #0369a1;
+  --status-approval-bg: rgba(234,88,12,0.10);
+  --status-approval-border: rgba(234,88,12,0.18);
+  --status-approval-fg: #c2410c;
+
+  --command-bg: #ffffff;
+  --command-border: rgba(31,41,55,0.12);
+  --command-header: rgba(31,41,55,0.04);
+}
+
+.light .bg-white\/\[0\.01\] { background-color: rgba(31,41,55,0.01) !important; }
+.light .bg-white\/\[0\.02\] { background-color: rgba(31,41,55,0.025) !important; }
+.light .bg-white\/\[0\.025\] { background-color: rgba(31,41,55,0.03) !important; }
+.light .bg-white\/\[0\.03\] { background-color: rgba(31,41,55,0.035) !important; }
+.light .bg-white\/\[0\.035\] { background-color: rgba(31,41,55,0.04) !important; }
+.light .bg-white\/\[0\.04\] { background-color: rgba(31,41,55,0.045) !important; }
+.light .bg-white\/\[0\.05\] { background-color: rgba(31,41,55,0.055) !important; }
+.light .bg-white\/\[0\.06\] { background-color: rgba(31,41,55,0.065) !important; }
+.light .bg-white\/\[0\.07\] { background-color: rgba(31,41,55,0.075) !important; }
+.light .bg-white\/\[0\.08\] { background-color: rgba(31,41,55,0.085) !important; }
+.light .bg-white\/\[0\.10\],
+.light .bg-white\/\[0\.1\] { background-color: rgba(31,41,55,0.10) !important; }
+.light .bg-white\/\[0\.12\] { background-color: rgba(31,41,55,0.12) !important; }
+.light .bg-white\/\[0\.15\] { background-color: rgba(31,41,55,0.15) !important; }
+.light .bg-white\/\[0\.16\] { background-color: rgba(31,41,55,0.16) !important; }
+.light .bg-white\/\[0\.18\] { background-color: rgba(31,41,55,0.18) !important; }
+.light .bg-white\/\[0\.2\],
+.light .bg-white\/\[0\.20\] { background-color: rgba(31,41,55,0.20) !important; }
+.light .bg-white\/\[0\.22\] { background-color: rgba(31,41,55,0.22) !important; }
+.light .bg-white\/\[0\.45\] { background-color: rgba(31,41,55,0.45) !important; }
+
+.light .border-white\/\[0\.03\] { border-color: rgba(31,41,55,0.07) !important; }
+.light .border-white\/\[0\.04\] { border-color: rgba(31,41,55,0.08) !important; }
+.light .border-white\/\[0\.05\] { border-color: rgba(31,41,55,0.09) !important; }
+.light .border-white\/\[0\.06\] { border-color: rgba(31,41,55,0.10) !important; }
+.light .border-white\/\[0\.07\] { border-color: rgba(31,41,55,0.11) !important; }
+.light .border-white\/\[0\.08\] { border-color: rgba(31,41,55,0.12) !important; }
+.light .border-white\/\[0\.10\],
+.light .border-white\/\[0\.1\] { border-color: rgba(31,41,55,0.14) !important; }
+.light .border-white\/\[0\.12\] { border-color: rgba(31,41,55,0.16) !important; }
+.light .border-white\/\[0\.14\] { border-color: rgba(31,41,55,0.18) !important; }
+.light .border-white\/\[0\.15\] { border-color: rgba(31,41,55,0.19) !important; }
+.light .border-white\/\[0\.16\] { border-color: rgba(31,41,55,0.20) !important; }
+.light .border-white\/\[0\.2\],
+.light .border-white\/\[0\.20\] { border-color: rgba(31,41,55,0.24) !important; }
+.light .border-white\/\[0\.25\] { border-color: rgba(31,41,55,0.28) !important; }
+.light .border-white\/\[0\.4\],
+.light .border-white\/\[0\.40\] { border-color: rgba(31,41,55,0.42) !important; }
+.light .divide-white\/\[0\.04\] > :not(:last-child) { border-color: rgba(31,41,55,0.08) !important; }
+.light .divide-white\/\[0\.05\] > :not(:last-child) { border-color: rgba(31,41,55,0.09) !important; }
+.light .ring-white\/\[0\.08\] { --tw-ring-color: rgba(31,41,55,0.14) !important; }
+
+html.light,
+html.light body {
+  color-scheme: light;
+}
+
+html.light body {
+  background: color-mix(in srgb, var(--neutral-tint) 8%, #fff);
+  color: #1f2937;
+}
+
+html.light .bg-bg { background-color: color-mix(in srgb, var(--neutral-tint) 8%, #fff) !important; }
+html.light .bg-raised { background-color: color-mix(in srgb, var(--neutral-tint) 10%, #fff) !important; }
+html.light .bg-surface { background-color: color-mix(in srgb, var(--neutral-tint) 14%, #fff) !important; }
+html.light .bg-surface-2 { background-color: color-mix(in srgb, var(--neutral-tint) 18%, #fff) !important; }
+html.light .bg-glass { background-color: rgba(255,255,255,0.88) !important; }
+html.light .text-text { color: #1f2937 !important; }
+html.light .text-text-2 { color: #4b5568 !important; }
+html.light .text-text-3 { color: #6b7280 !important; }
+html.light .text-text-3\/40 { color: rgba(107,114,128,0.40) !important; }
+html.light .text-text-3\/45 { color: rgba(107,114,128,0.45) !important; }
+html.light .text-text-3\/50 { color: rgba(107,114,128,0.50) !important; }
+html.light .text-text-3\/60 { color: rgba(107,114,128,0.60) !important; }
+html.light .text-text-3\/70 { color: rgba(107,114,128,0.70) !important; }
+html.light .text-text-3\/75 { color: rgba(107,114,128,0.75) !important; }
+html.light .text-accent-bright { color: #4f46e5 !important; }
+html.light .bg-accent-soft { background-color: rgba(79,70,229,0.09) !important; }
+html.light .placeholder\:text-text-3\/40::placeholder { color: rgba(107,114,128,0.40) !important; }
+
+html.light .bg-\[\#0a0a14\],
+html.light .bg-\[\#0c0c13\],
+html.light .bg-\[\#12121e\],
+html.light .bg-\[\#13131e\],
+html.light .bg-\[\#16162a\],
+html.light .bg-\[\#171a2b\],
+html.light .bg-\[\#1a1a2e\],
+html.light .bg-\[\#1e1e38\] {
+  background-color: color-mix(in srgb, var(--neutral-tint) 14%, #fff) !important;
+}
+
 @layer base {
   *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
 }

package/src/app/layout.tsx

@@ -3,6 +3,7 @@ import { TooltipProvider } from "@/components/ui/tooltip"
 import { Toaster } from "@/components/ui/sonner"
 import { DashboardShell } from "@/components/layout/dashboard-shell"
 import { AppQueryProvider } from "@/components/providers/app-query-provider"
+import { ThemeProvider } from "@/components/providers/theme-provider"
 import "./globals.css"
 
 export const metadata: Metadata = {
@@ -27,16 +28,18 @@ export default function RootLayout({
   children: React.ReactNode
 }>) {
   return (
-    <html lang="en" className="dark">
+    <html lang="en" suppressHydrationWarning>
       <body className="antialiased" cz-shortcut-listen="true">
-        <AppQueryProvider>
-          <TooltipProvider>
-            <DashboardShell>
-              {children}
-            </DashboardShell>
-            <Toaster />
-          </TooltipProvider>
-        </AppQueryProvider>
+        <ThemeProvider>
+          <AppQueryProvider>
+            <TooltipProvider>
+              <DashboardShell>
+                {children}
+              </DashboardShell>
+              <Toaster />
+            </TooltipProvider>
+          </AppQueryProvider>
+        </ThemeProvider>
       </body>
     </html>
   )

package/src/app/protocols/builder/[templateId]/page.tsx

@@ -43,7 +43,7 @@ export default function ProtocolBuilderPage() {
 
   if (isLoading) {
     return (
-      <div className="flex h-screen items-center justify-center">
+      <div className="flex h-full min-h-0 min-w-0 flex-1 items-center justify-center">
         <div className="text-sm text-muted-foreground">Loading builder...</div>
       </div>
     )
@@ -52,7 +52,7 @@ export default function ProtocolBuilderPage() {
   const template = templates?.find((t) => t.id === templateId)
   if (!template) {
     return (
-      <div className="flex h-screen flex-col items-center justify-center gap-3">
+      <div className="flex h-full min-h-0 min-w-0 flex-1 flex-col items-center justify-center gap-3">
         <div className="text-sm text-muted-foreground">Template not found</div>
         <button
           onClick={() => router.push('/protocols')}
@@ -65,9 +65,9 @@ export default function ProtocolBuilderPage() {
   }
 
   return (
-    <div className="flex h-full flex-col">
+    <div className="flex h-full min-h-0 min-w-0 flex-1 flex-col overflow-hidden">
       {/* Header */}
-      <div className="flex items-center justify-between border-b px-4 py-2">
+      <div className="flex shrink-0 items-center justify-between border-b px-4 py-2">
         <div className="flex items-center gap-3">
           <button
             onClick={() => router.push('/protocols')}
@@ -85,7 +85,7 @@ export default function ProtocolBuilderPage() {
       </div>
 
       {/* Canvas */}
-      <div className="flex-1 p-3">
+      <div className="min-h-0 flex-1 p-3">
         <ProtocolBuilderCanvas />
       </div>
     </div>

package/src/components/layout/dashboard-shell.tsx

@@ -2,6 +2,7 @@
 
 import { useEffect, useRef, useState, useCallback } from 'react'
 import { useRouter, usePathname } from 'next/navigation'
+import { useTheme } from 'next-themes'
 import { initAudioContext } from '@/lib/tts'
 import { clearStoredAccessKey } from '@/lib/app/api-client'
 import { safeStorageGet, safeStorageRemove, safeStorageSet } from '@/lib/app/safe-storage'
@@ -14,6 +15,7 @@ import { useWs } from '@/hooks/use-ws'
 import { api } from '@/lib/app/api-client'
 import { pathToView, useNavigate } from '@/lib/app/navigation'
 import { shouldAutoOpenPanelSidebar } from '@/lib/app/view-constants'
+import { normalizeThemeMode } from '@/lib/theme-mode'
 
 import { FullScreenLoader } from '@/components/ui/full-screen-loader'
 import { SidebarRail } from '@/components/layout/sidebar-rail'
@@ -32,6 +34,7 @@ export function DashboardShell({ children }: { children: React.ReactNode }) {
   const router = useRouter()
   const pathname = usePathname()
   const navigateTo = useNavigate()
+  const { setTheme } = useTheme()
 
   const {
     hydrated,
@@ -152,6 +155,12 @@ export function DashboardShell({ children }: { children: React.ReactNode }) {
     }
   }, [appSettings.themeHue])
 
+  // Theme mode
+  useEffect(() => {
+    if (!appSettings.themeMode) return
+    setTheme(normalizeThemeMode(appSettings.themeMode))
+  }, [appSettings.themeMode, setTheme])
+
   // View validity check
   const isViewEnabled = useCallback((view: AppView) => {
     if (view === 'webhooks') return extensions['http']?.enabled !== false