feat(queue): implement queue scheduler service and API routes

- Added QueueSchedulerService to manage task queue lifecycle, including state machine, dependency resolution, and session management.
- Implemented HTTP API endpoints for queue scheduling:
  - POST /api/queue/execute: Submit items to the scheduler.
  - GET /api/queue/scheduler/state: Retrieve full scheduler state.
  - POST /api/queue/scheduler/start: Start scheduling loop with items.
  - POST /api/queue/scheduler/pause: Pause scheduling.
  - POST /api/queue/scheduler/stop: Graceful stop of the scheduler.
  - POST /api/queue/scheduler/config: Update scheduler configuration.
- Introduced types for queue items, scheduler state, and WebSocket messages to ensure type safety and compatibility with the backend.
- Added static model lists for LiteLLM as a fallback for available models.

ccw/frontend/src/lib/api.ts

@@ -2100,7 +2100,8 @@ export interface CliExecution {
   tool: 'gemini' | 'qwen' | 'codex' | string;
   mode?: string;
   status: 'success' | 'error' | 'timeout';
-  prompt_preview: string;
+  // Backend may return string or object {text: string} for legacy data
+  prompt_preview: string | { text: string } | Record<string, unknown>;
   timestamp: string;
   duration_ms: number;
   sourceDir?: string;
@@ -2233,7 +2234,8 @@ export interface ConversationRecord {
  */
 export interface ConversationTurn {
   turn: number;
-  prompt: string;
+  // Backend may return string or object {text: string} for legacy data
+  prompt: string | { text: string } | Record<string, unknown>;
   output: {
     stdout: string;
     stderr?: string;
@@ -2270,7 +2272,8 @@ export interface NativeSessionTurn {
   turnNumber: number;
   timestamp: string;
   role: 'user' | 'assistant';
-  content: string;
+  // Backend may return string or object {text: string} for legacy data
+  content: string | { text: string } | Record<string, unknown>;
   thoughts?: string[];
   toolCalls?: NativeToolCall[];
   tokens?: NativeTokenInfo;

ccw/frontend/src/lib/cli-tool-theme.ts

@@ -0,0 +1,171 @@
+// ========================================
+// CLI Tool Theme Configuration
+// ========================================
+// Centralized theme configuration for CLI tools (gemini, codex, qwen, opencode)
+// Used for Badge variants, icons, and color theming across components
+
+import type { LucideIcon } from 'lucide-react';
+import { Sparkles, Code, Brain, Terminal, Cpu } from 'lucide-react';
+
+// ========== Types ==========
+
+export type BadgeVariant = 'default' | 'secondary' | 'outline' | 'success' | 'warning' | 'info' | 'destructive';
+
+export interface CliToolTheme {
+  /** Badge variant for UI components */
+  variant: BadgeVariant;
+  /** Lucide icon name */
+  icon: LucideIcon;
+  /** Color theme (used for CSS classes) */
+  color: 'blue' | 'green' | 'amber' | 'gray' | 'purple';
+  /** Human-readable display name */
+  displayName: string;
+  /** Short label for compact display */
+  shortLabel: string;
+}
+
+// ========== Tool Theme Configuration ==========
+
+/**
+ * Theme configuration for each supported CLI tool
+ * Maps tool ID to visual theme properties
+ */
+export const CLI_TOOL_THEMES: Record<string, CliToolTheme> = {
+  gemini: {
+    variant: 'info',
+    icon: Sparkles,
+    color: 'blue',
+    displayName: 'Gemini',
+    shortLabel: 'GEM',
+  },
+  codex: {
+    variant: 'success',
+    icon: Code,
+    color: 'green',
+    displayName: 'Codex',
+    shortLabel: 'CDX',
+  },
+  qwen: {
+    variant: 'warning',
+    icon: Brain,
+    color: 'amber',
+    displayName: 'Qwen',
+    shortLabel: 'QWN',
+  },
+  opencode: {
+    variant: 'secondary',
+    icon: Terminal,
+    color: 'gray',
+    displayName: 'OpenCode',
+    shortLabel: 'OPC',
+  },
+  claude: {
+    variant: 'default',
+    icon: Cpu,
+    color: 'purple',
+    displayName: 'Claude',
+    shortLabel: 'CLD',
+  },
+};
+
+/**
+ * Default theme for unknown tools
+ */
+export const DEFAULT_TOOL_THEME: CliToolTheme = {
+  variant: 'secondary',
+  icon: Terminal,
+  color: 'gray',
+  displayName: 'CLI',
+  shortLabel: 'CLI',
+};
+
+// ========== Helper Functions ==========
+
+/**
+ * Get theme configuration for a CLI tool
+ * Falls back to default theme for unknown tools
+ *
+ * @param tool - Tool identifier (e.g., 'gemini', 'codex', 'qwen')
+ * @returns Theme configuration for the tool
+ */
+export function getToolTheme(tool: string): CliToolTheme {
+  const normalizedTool = tool.toLowerCase().trim();
+  return CLI_TOOL_THEMES[normalizedTool] || DEFAULT_TOOL_THEME;
+}
+
+/**
+ * Get Badge variant for a CLI tool
+ * Used for tool badges in UI components
+ *
+ * @param tool - Tool identifier
+ * @returns Badge variant
+ */
+export function getToolVariant(tool: string): BadgeVariant {
+  return getToolTheme(tool).variant;
+}
+
+/**
+ * Get icon component for a CLI tool
+ *
+ * @param tool - Tool identifier
+ * @returns Lucide icon component
+ */
+export function getToolIcon(tool: string): LucideIcon {
+  return getToolTheme(tool).icon;
+}
+
+/**
+ * Get color class for a CLI tool
+ * Returns a Tailwind CSS color class prefix
+ *
+ * @param tool - Tool identifier
+ * @returns Color class prefix (e.g., 'text-blue-500')
+ */
+export function getToolColorClass(tool: string, shade: number = 500): string {
+  const color = getToolTheme(tool).color;
+  const colorMap: Record<string, string> = {
+    blue: 'blue',
+    green: 'green',
+    amber: 'amber',
+    gray: 'gray',
+    purple: 'purple',
+  };
+  return `text-${colorMap[color] || 'gray'}-${shade}`;
+}
+
+/**
+ * Get background color class for a CLI tool
+ *
+ * @param tool - Tool identifier
+ * @returns Background color class (e.g., 'bg-blue-100')
+ */
+export function getToolBgClass(tool: string, shade: number = 100): string {
+  const color = getToolTheme(tool).color;
+  const colorMap: Record<string, string> = {
+    blue: 'blue',
+    green: 'green',
+    amber: 'amber',
+    gray: 'gray',
+    purple: 'purple',
+  };
+  return `bg-${colorMap[color] || 'gray'}-${shade}`;
+}
+
+/**
+ * Check if a tool is a known CLI tool
+ *
+ * @param tool - Tool identifier
+ * @returns Whether the tool is known
+ */
+export function isKnownTool(tool: string): boolean {
+  return tool.toLowerCase().trim() in CLI_TOOL_THEMES;
+}
+
+/**
+ * Get all known tool identifiers
+ *
+ * @returns Array of known tool IDs
+ */
+export function getKnownTools(): string[] {
+  return Object.keys(CLI_TOOL_THEMES);
+}

ccw/frontend/src/lib/queryKeys.ts

@@ -118,6 +118,11 @@ export const workspaceQueryKeys = {
   cliExecutionDetail: (projectPath: string, executionId: string) =>
     [...workspaceQueryKeys.cliHistory(projectPath), 'detail', executionId] as const,
 
+  // ========== Native Sessions ==========
+  nativeSessions: (projectPath: string) => [...workspaceQueryKeys.all(projectPath), 'nativeSessions'] as const,
+  nativeSessionsList: (projectPath: string, tool?: string) =>
+    [...workspaceQueryKeys.nativeSessions(projectPath), 'list', tool] as const,
+
   // ========== Audit ==========
   audit: (projectPath: string) => [...workspaceQueryKeys.all(projectPath), 'audit'] as const,
   cliSessionAudit: (