xitto-kernel 0.6.4 → 0.8.4

package/CHANGELOG.md

@@ -1,5 +1,61 @@
 # Changelog
 
+## 0.8.4
+
+- **桌面雙欄佈局（善用寬螢幕）**：原本單條 760px 窄欄、左右大量留白。改用 CSS grid 雙欄：
+  - **許願頁** = 主區（許願輸入 + 當前任務/成品）+ **歷史側欄**（sticky，捲動主區時歷史保持可見）
+  - **工作台** = 檔案瀏覽器在左、**檔案預覽在右**（並排，不必上下捲）
+  - 容器加寬到 1180px；` (max-width:860px)` 自動收成單欄（窄螢幕/手機不變）
+  - 純 CSS/HTML 結構調整；測試 188/188，內嵌 JS 語法檢查 + 服務頁面結構驗證通過
+
+## 0.8.3
+
+- **工作台改逐層瀏覽（不一次攤平整個專案）**：原本 `listWorkspaceFiles` 會遞迴把所有檔案攤成一長串,對真實專案太雜。改成像檔案總管:只列當前目錄的子資料夾+檔案,點資料夾才進去,有「上一層」。
+  - 新增 `listDir(wsDir, sub)`（列單層,排除內部目錄,防穿越）；`/v1/workspaces/files` 改吃 `sub=` 逐層
+  - 網頁工作台改可導航（麵包屑 + 進子資料夾 + 上一層）；切換空間/分頁時重置到根
+  - 1 個新測試（listDir 不遞迴/子目錄分開/防穿越）+ 真實 server 端到端（根→src→src/utils）。測試 188/188
+
+## 0.8.2
+
+- **`npm run serve:local`**：一行啟動本地就地模式（= `XITTO_SERVER_LOCAL=1 XITTO_SERVER_SANDBOX=off`，token 預設 `secret`、可用 `XITTO_SERVER_TOKEN` 覆寫）。不用每次手打那串環境變數。
+
+## 0.8.1
+
+- **資料夾用「選」的（本地模式）**：不用打路徑。
+  - 瀏覽器原生選資料夾拿不到絕對路徑(安全限制),改由 **local server 端列資料夾** → 網頁「📁 選資料夾」鈕,從家目錄點進去挑一個
+  - 新增 `GET /v1/fs?path=`（**僅本地模式**;列子資料夾,排除 . 開頭/node_modules;託管模式回 403,不洩漏主機結構）
+  - 網頁資料夾瀏覽器 modal（上一層/家目錄/選定）；空間下拉以 📁 標真實資料夾
+  - 1 個新測試（/v1/fs 本地列檔 / 託管 403）+ 真實 server 端到端（家目錄→xiza→選 xitto*）。測試 187/187
+
+## 0.8.0
+
+- **本地就地模式（許願台像 Claude Code 改你選的真實資料夾）**：打通「隔離(許願台)」與「就地(Claude Code)」兩個檔案模型。
+  - `XITTO_SERVER_LOCAL=1` 時,workspace 可為**真實資料夾的絕對路徑** → 任務**就地改該資料夾的檔**(無隔離副本);網頁「新專案」可貼路徑
+  - 新增 `workspaceDir(baseDir, ws, local)`：local + 絕對路徑 → 就地；**否則(含託管收到絕對路徑)→ 消毒成管理空間,不逃逸**
+  - 工作台端點改 query `?ws=`（容納絕對路徑）；in-place 資料夾不存在 → 400
+  - 網頁注入 `__LOCAL__`；空間下拉以 `📁` 標真實資料夾
+  - 4 個新測試（workspaceDir 就地/不逃逸/管理）+ 真實 server 端到端
+    （local：就地改 /tmp/myproj/calc.js 的 a-b→a+b、無副本；hosted：絕對路徑被消毒不逃逸）。測試 186/186
+
+## 0.7.1
+
+- **成品迭代「繼續／調整」（迭代有脈絡）**：在許願台補上迭代閉環。
+  - 完成的成品上加「↳ 繼續／調整這個成果」→ 送出**後續任務**,接續這次的對話（`sessionId`）+ 同工作區
+    → agent 同時有「**檔案 + 當時的討論與理由**」,不只是檔案
+  - 預設每個許願是乾淨新對話（不暴脹）；按「繼續」才接續那條線（像 ChatGPT 新對話 vs 接著聊）
+  - 任務 view 加 `continued`（帶 sessionId = 接續）；歷史以 `↳` 標出接續鏈
+  - 底層 sessionId 接續 kernel 本已支援,本版只是接到 UI + 標記
+  - 1 個測試（view.continued）+ 真實 server 端到端：任務1 私下說「最不喜歡 Go」(只在對話、不在檔案)→ 後續任務「刪掉我最不喜歡的」→ 正確刪掉 Go（langs.txt 剩 Rust/Zig）。測試 185/185
+
+## 0.7.0
+
+- **工作台分頁（看見並管理持久工作區）**：許願台加「許願 | 📂 工作台」**同頁分頁**（不是另開頁面,共用空間/檢視器/認證）。
+  - **許願**=交辦任務的主流程（不變）；**工作台**=列出當前專案累積的**所有檔案**（看/下載/刪）
+  - server 新增 `GET /v1/workspaces/:ws/files`（列檔,排除 .xitto-kernel/tmp/node_modules）、`GET/DELETE /v1/workspaces/:ws/file`（取/刪,防穿越）
+  - 檔案檢視器抽為通用 `renderFile(base,…)`，任務成品與工作台共用；`serveFile` 抽出（content-type/下載）
+  - 讓持久工作空間從「半成品（檔案累積但看不見）」變成可見可管理；刻意保持輕量（檔案清單,非 IDE）
+  - 4 個新測試（safeWs 防穿越 / listWorkspaceFiles 排除內部目錄）+ 真實 server 端到端（兩任務累積→列/取/刪/防穿越）。測試 184/184
+
 ## 0.6.4
 
 - **許願台「展開過程」+ 彩色 diff（借 Claude Code 的工具卡/⌥展開,翻譯成非技術版）**：

package/README.md

@@ -96,6 +96,8 @@ const o = await kernel.runOutcome('建立 greet.js 並寫個範例驗證');
 **🪄 許願台網頁（給非技術使用者：瀏覽器打開就用）**
 ```bash
 XITTO_SERVER_TOKEN=secret npm run serve   # 然後瀏覽器開 http://localhost:8787/
+# 本地就地模式（可選真實資料夾、就地改檔，沙箱關）：
+npm run serve:local                        # = LOCAL=1 SANDBOX=off,token 預設 secret(可用 XITTO_SERVER_TOKEN 覆寫)
 ```
 不用終端機、不用碰金鑰(伺服器端管)。介面以**結果**為中心,不是聊天:
 - **許願**:打一句「你想完成什麼」→ 交辦(背景跑 goal loop)
@@ -105,10 +107,17 @@ XITTO_SERVER_TOKEN=secret npm run serve   # 然後瀏覽器開 http://localhost:
 - **展開過程**:預設安靜(只給進度與成品);想看細節按「展開過程」→ 完整步驟卡(讀/改/跑,人話)+ **編輯的彩色 diff**(綠 +/紅 -)。同一畫面服務「只要結果」與「想看細節」兩種人(對標 Claude Code 的 ⏺/⎿ + ctrl+r 展開)
 - **需要你回答**:agent 暫停提問時,跳出問題 + 回答框(澄清通道)
 - **收成品**:完成後顯示摘要 + **產出的檔案**,點檔名可直接看內容(`GET /v1/tasks/:id/file`,防路徑穿越)
+- **繼續／調整(迭代有脈絡)**:成品上有「↳ 繼續／調整這個成果」——打一句想改什麼/想深入什麼,送出一個**後續任務**,**接續這次的對話(sessionId)+ 同工作區**。agent 同時有「檔案 + 當時的討論與理由」,不只是檔案。預設每個許願是乾淨新對話(不暴脹),按「繼續」才接續那條線(像 ChatGPT 開新對話 vs 接著聊)。歷史以 `↳` 標出接續鏈
 - **歷史成品**:過往交辦的清單(願望 + 狀態),不是聊天串
 
+**桌面雙欄佈局**:許願頁=主區(許願+當前任務/成品)+ 歷史 sticky 側欄;工作台=檔案瀏覽器左、預覽右並排。容器 1180px,窄螢幕自動收單欄。
+
+**工作台分頁(看見並管理你的工作區)**:許願台頂部有「許願 | 📂 工作台」分頁(同頁切換,不是另開頁面)。**許願**=交辦任務的主流程;**工作台**=**逐層瀏覽**當前專案的檔案(像檔案總管:只列當前目錄的子資料夾+檔案,點資料夾才進去,不一次遞迴攤平),看/下載/刪。單一任務用許願就夠;做專案的人切到工作台看「我累積了什麼、拿任意檔、清理」——讓持久工作空間從隱形變成可見可管理。刻意保持輕量(檔案清單,不是 IDE)。
+
 **持久工作空間(成品間的關係)**:每個成品是**獨立的對話**(不續接前一個,避免 context 暴脹),但**共用一個持久工作空間**(`.xitto-server/ws/<workspace>`,預設 `default`)——所以 ① **檔案留存**,後面的任務能接續前面的成果(「把我上次做的 plan.md 翻成英文」);② **五層沉澱跨成品累積**(偏好/技能/經驗/信任)——它**越用越懂你**,不再是每次都從零開始的陌生人。`workspace` 可在 POST 時指定(多使用者各自一個);網頁有「專案」下拉切換,每份成品卡標出 `📁 所屬空間`。
 
+**本地就地模式(像 Claude Code 改你選的真實資料夾)**:`XITTO_SERVER_LOCAL=1` 時,網頁多一個「**📁 選資料夾**」鈕——**用點的**從家目錄瀏覽進你的真實資料夾並選定(不用打路徑;瀏覽器拿不到絕對路徑,所以由 local server 端列資料夾),或「新專案」直接貼絕對路徑也行。任務就**就地改那個資料夾的檔**(不另開隔離副本),工作台列的也是它。這把「許願台(隔離,服務非技術使用者)」和「Claude Code(就地,改你現有的 codebase)」兩個模型打通:**本機自用想就地 → 給路徑;隔離/託管 → 給名稱**。**安全**:只在 `local` 模式才認絕對路徑;**託管模式收到絕對路徑會被消毒成管理空間,不會逃逸到主機任意路徑**。
+
 **溯源/檔案位置**:成品記錄它的**邏輯位置(workspace)**;**實體絕對路徑**預設不外露(託管不洩漏伺服器路徑),只在**本地模式**(`XITTO_SERVER_LOCAL=1`)才在成品附「📂 檔案位置」供你到 Finder/Explorer 找檔。
 
 零依賴單一 HTML(`src/app/web/index.html`),polling 不靠 SSE。token 注入頁面供同源呼叫——本地自用零設定;**正式部署請前置真實認證**。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xitto-kernel",
-  "version": "0.6.4",
+  "version": "0.8.4",
   "type": "module",
   "description": "領域無關的 agent 底座（kernel + 可插拔 DomainPack），從 xitto-code 抽象而來",
   "keywords": [
@@ -42,6 +42,7 @@
     "demo": "node examples/demo.js",
     "eval": "node eval/run.js",
     "serve": "node src/app/server.js",
+    "serve:local": "XITTO_SERVER_LOCAL=1 XITTO_SERVER_SANDBOX=off XITTO_SERVER_TOKEN=${XITTO_SERVER_TOKEN:-secret} node src/app/server.js",
     "start": "node bin/xitto-kernel.js"
   },
   "exports": {

package/src/app/server.js

@@ -3,9 +3,10 @@
 // JSON 或 SSE 串流，以及「背景任務 + 完成通知（webhook）」—— 派任務出去、做完回呼，不用一直盯著。
 // 這是「另一個 app 消費同一組 kernel 事件」—— 不動 kernel 核心。
 import { createServer } from 'node:http';
-import { mkdirSync, readFileSync, existsSync, rmSync } from 'node:fs';
+import { mkdirSync, readFileSync, existsSync, rmSync, readdirSync, statSync } from 'node:fs';
 import { join, dirname, isAbsolute, relative, basename, resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
+import { homedir } from 'node:os';
 import { createKernel } from '../kernel/index.js';
 import { loadModel } from './providers.js';
 import { createCodingPack } from '../packs/coding/index.js';
@@ -30,6 +31,44 @@ export function contentTypeFor(name) { const ext = (String(name).split('.').pop(
 // 工具參數摘要（給「展開過程」步驟卡）：取最有意義的參數。
 const argSummary = (args) => { if (!args || typeof args !== 'object') return ''; const v = args.command ?? args.path ?? args.pattern ?? args.query ?? args.url ?? args.name ?? args.topic; return (v != null && v !== '') ? String(v).replace(/\s+/g, ' ').slice(0, 80) : ''; };
 
+// workspace 名稱消毒（防穿越）。
+export const safeWs = (w) => (String(w || 'default').replace(/[^a-zA-Z0-9_-]/g, '') || 'default');
+
+// 解析 workspace → 真實目錄。本地模式 + 絕對路徑 → 就地用該真實資料夾（像 Claude Code）；
+// 否則（含託管模式收到絕對路徑）→ 消毒成管理空間 ws/<name>，不會逃逸到主機任意路徑。
+export function workspaceDir(baseDir, ws, local) {
+  return (local && isAbsolute(String(ws || ''))) ? String(ws) : join(baseDir, 'ws', safeWs(ws));
+}
+
+// 列工作區檔案（給「工作台」分頁）：遞迴,排除內部目錄,回 [{path,size,mtime}]。
+const SKIP_WS = new Set(['.xitto-kernel', 'node_modules', '.git', 'tmp', '.swebench-repos']);
+export function listWorkspaceFiles(dir, base = dir, out = [], depth = 0) {
+  if (depth > 8 || out.length > 2000) return out;
+  let entries; try { entries = readdirSync(dir, { withFileTypes: true }); } catch { return out; }
+  for (const e of entries) {
+    if (SKIP_WS.has(e.name)) continue;
+    const full = join(dir, e.name);
+    if (e.isDirectory()) listWorkspaceFiles(full, base, out, depth + 1);
+    else if (e.isFile()) { try { const s = statSync(full); out.push({ path: relative(base, full), size: s.size, mtime: s.mtimeMs }); } catch { /* 略 */ } }
+  }
+  return out;
+}
+
+// 列單一層級（給工作台逐層瀏覽,不一次遞迴攤平整個專案）：回 { sub, dirs:[], files:[{name,size,mtime}] }。
+export function listDir(wsDir, sub) {
+  const rel = String(sub || '').replace(/^\/+|\/+$/g, '');
+  const dir = rel === '' ? wsDir : resolveArtifact(wsDir, rel);
+  if (!dir || !existsSync(dir)) return null;
+  const dirs = [], files = [];
+  let entries; try { entries = readdirSync(dir, { withFileTypes: true }); } catch { return null; }
+  for (const e of entries) {
+    if (SKIP_WS.has(e.name)) continue;
+    if (e.isDirectory()) dirs.push(e.name);
+    else if (e.isFile()) { try { const s = statSync(join(dir, e.name)); files.push({ name: e.name, size: s.size, mtime: s.mtimeMs }); } catch { /* 略 */ } }
+  }
+  return { sub: rel, dirs: dirs.sort(), files: files.sort((a, b) => b.mtime - a.mtime) };
+}
+
 // 交付檔案路徑解析（防穿越）：rel 必須是 workdir 內的相對路徑,否則回 null。
 export function resolveArtifact(workdir, rel) {
   if (typeof rel !== 'string' || !rel || isAbsolute(rel)) return null;
@@ -67,7 +106,7 @@ export function createTaskStore({ runJob, concurrency = 2, onFinish, maxEvents =
   const subs = new Map();    // id -> Set<(ev)=>void>
   let active = 0;
 
-  const view = (t) => ({ taskId: t.id, status: t.status, pack: t.spec.pack || 'general', mode: t.spec.mode || 'turn', workspace: t.spec.workspace || 'default', goal: t.spec.goal || t.spec.input || '', sessionId: t.result?.sessionId || t.spec.sessionId || null, createdAt: t.createdAt, startedAt: t.startedAt, finishedAt: t.finishedAt, error: t.error, pending: t.pending || null, progress: t.progress || null });
+  const view = (t) => ({ taskId: t.id, status: t.status, pack: t.spec.pack || 'general', mode: t.spec.mode || 'turn', workspace: t.spec.workspace || 'default', goal: t.spec.goal || t.spec.input || '', sessionId: t.result?.sessionId || t.spec.sessionId || null, continued: !!t.spec.sessionId, createdAt: t.createdAt, startedAt: t.startedAt, finishedAt: t.finishedAt, error: t.error, pending: t.pending || null, progress: t.progress || null });
 
   const emit = (t, ev) => {
     t.events.push(ev);
@@ -182,6 +221,17 @@ export function createServerApp({ model, getApiKey, token, baseDir = '.xitto-ser
   const log = (o) => console.log(JSON.stringify({ ts: new Date().toISOString(), ...o }));
   const readBody = (req) => new Promise((resolve) => { let b = ''; req.on('data', (c) => { b += c; if (b.length > 1e6) req.destroy(); }); req.on('end', () => { try { resolve(JSON.parse(b || '{}')); } catch { resolve({}); } }); });
   const sseHead = (res) => res.writeHead(200, { 'content-type': 'text/event-stream; charset=utf-8', 'cache-control': 'no-cache', connection: 'keep-alive' });
+  // 依副檔名給 content-type 回傳檔案（圖片顯示/md 渲染/下載皆走這）。
+  const serveFile = (res, full, rel, download) => {
+    if (!existsSync(full)) return json(res, 404, { error: '檔案不存在' });
+    try {
+      const ct = contentTypeFor(rel);
+      const isText = /^text\/|json|xml|javascript|svg/.test(ct);
+      const headers = { 'content-type': ct + (isText ? '; charset=utf-8' : '') };
+      if (download) headers['content-disposition'] = `attachment; filename="${encodeURIComponent(basename(rel))}"`;
+      res.writeHead(200, headers); return res.end(readFileSync(full));
+    } catch (e) { return json(res, 500, { error: e.message }); }
+  };
 
   // 共用：跑一輪/一目標，回傳 { sessionId, text, usage, rounds, done }；onEvent 收原始 kernel 事件；
   // ask（可選）= 澄清通道,讓 agent 在背景任務中暫停問使用者。
@@ -189,8 +239,9 @@ export function createServerApp({ model, getApiKey, token, baseDir = '.xitto-ser
     const make = PACKS[spec.pack || 'general'];
     if (!make) throw new Error(`未知 pack「${spec.pack}」，可用：${Object.keys(PACKS).join(', ')}`);
     // 持久工作空間（B 模型）：workdir 綁 workspace（非 sessionId）→ 檔案留存 + 五層沉澱跨成品累積。
-    const workspace = (spec.workspace || 'default').replace(/[^a-zA-Z0-9_-]/g, '') || 'default';
-    const workdir = join(baseDir, 'ws', workspace); mkdirSync(workdir, { recursive: true });
+    // 本地模式 + workspace 是絕對路徑 → 就地用該真實資料夾（像 Claude Code 改你現有的檔）。
+    const workspace = spec.workspace || 'default';
+    const workdir = workspaceDir(baseDir, workspace, local); mkdirSync(workdir, { recursive: true });
     // history 仍綁 sessionId（每個成品獨立對話：無 sessionId → 全新,不續接,避免 context 暴脹/混淆）
     const sessionId = spec.sessionId || newId();
     const sess = sessions.get(sessionId) || { history: [] };
@@ -234,7 +285,7 @@ export function createServerApp({ model, getApiKey, token, baseDir = '.xitto-ser
     if (req.method === 'GET' && (path === '/' || path === '/index.html')) {
       let html; try { html = webHtml(); } catch { return json(res, 500, { error: 'web UI 未找到' }); }
       res.writeHead(200, { 'content-type': 'text/html; charset=utf-8' });
-      return res.end(html.replace(/__SERVER_TOKEN__/g, token || '').replace(/__PACKS__/g, JSON.stringify(Object.keys(PACKS))));
+      return res.end(html.replace(/__SERVER_TOKEN__/g, token || '').replace(/__PACKS__/g, JSON.stringify(Object.keys(PACKS))).replace(/__LOCAL__/g, local ? 'true' : 'false'));
     }
 
     if (!authed(req)) return json(res, 401, { error: 'unauthorized（帶 Authorization: Bearer <token>）' });
@@ -262,6 +313,7 @@ export function createServerApp({ model, getApiKey, token, baseDir = '.xitto-ser
       const body = await readBody(req);
       if (!PACKS[body.pack || 'general']) return json(res, 400, { error: `未知 pack「${body.pack}」，可用：${Object.keys(PACKS).join(', ')}` });
       if (body.webhook && !/^https?:\/\//.test(body.webhook)) return json(res, 400, { error: 'webhook 需為 http(s) URL' });
+      if (local && body.workspace && isAbsolute(body.workspace) && !existsSync(body.workspace)) return json(res, 400, { error: `資料夾不存在：${body.workspace}` });
       const t = tasks.enqueue({ pack: body.pack, mode: body.mode, input: body.input, goal: body.goal, sessionId: body.sessionId, webhook: body.webhook, workspace: body.workspace });
       log({ task: t.id, action: 'enqueue', pack: body.pack || 'general', mode: body.mode || 'turn' });
       return json(res, 202, { taskId: t.id, status: t.status, ...tasks.stats() });
@@ -298,16 +350,37 @@ export function createServerApp({ model, getApiKey, token, baseDir = '.xitto-ser
       const t = tasks.get(mFile[1]); const ws = t?.result?.workspace;
       if (!ws) return json(res, 404, { error: '無交付物（任務尚未完成?）' });
       const rel = url.searchParams.get('path');
-      const full = resolveArtifact(join(baseDir, 'ws', ws), rel);
+      const full = resolveArtifact(workspaceDir(baseDir, ws, local), rel);
       if (!full) return json(res, 400, { error: 'path 不合法' });
-      if (!existsSync(full)) return json(res, 404, { error: '檔案不存在' });
+      return serveFile(res, full, rel, url.searchParams.get('download'));
+    }
+
+    // 資料夾瀏覽器（僅本地模式）：列某路徑下的子資料夾,給網頁「用選的」挑真實資料夾
+    if (req.method === 'GET' && path === '/v1/fs') {
+      if (!local) return json(res, 403, { error: '僅本地模式可瀏覽資料夾' });
+      const dir = resolve(url.searchParams.get('path') || homedir());
       try {
-        const ct = contentTypeFor(rel);
-        const isText = /^text\/|json|xml|javascript|svg/.test(ct);
-        const headers = { 'content-type': ct + (isText ? '; charset=utf-8' : '') };
-        if (url.searchParams.get('download')) headers['content-disposition'] = `attachment; filename="${encodeURIComponent(basename(rel))}"`;
-        res.writeHead(200, headers); return res.end(readFileSync(full));
-      } catch (e) { return json(res, 500, { error: e.message }); }
+        const dirs = readdirSync(dir, { withFileTypes: true }).filter((e) => e.isDirectory() && e.name !== 'node_modules' && !e.name.startsWith('.')).map((e) => e.name).sort();
+        return json(res, 200, { path: dir, parent: dirname(dir), home: homedir(), dirs });
+      } catch (e) { return json(res, 400, { error: '無法讀取：' + e.message }); }
+    }
+
+    // 工作台：逐層列檔（sub=子目錄,不一次遞迴攤平整個專案；ws 走 query 以容納本地絕對路徑）
+    if (req.method === 'GET' && path === '/v1/workspaces/files') {
+      const dir = workspaceDir(baseDir, url.searchParams.get('ws') || 'default', local);
+      return json(res, 200, listDir(dir, url.searchParams.get('sub') || '') || { sub: '', dirs: [], files: [] });
+    }
+    // 工作台：取檔（看/下載）/ 刪檔
+    if (path === '/v1/workspaces/file' && (req.method === 'GET' || req.method === 'DELETE')) {
+      const dir = workspaceDir(baseDir, url.searchParams.get('ws') || 'default', local);
+      const rel = url.searchParams.get('path');
+      const full = resolveArtifact(dir, rel);
+      if (!full) return json(res, 400, { error: 'path 不合法' });
+      if (req.method === 'DELETE') {
+        try { if (existsSync(full)) rmSync(full); log({ action: 'delete', path: rel }); return json(res, 200, { ok: true }); }
+        catch (e) { return json(res, 500, { error: e.message }); }
+      }
+      return serveFile(res, full, rel, url.searchParams.get('download'));
     }
 
     // 附掛背景任務的事件流（replay 緩衝 + 即時；已結束則回放後關閉）

package/src/app/web/index.html

@@ -8,7 +8,14 @@
   :root { --bg:#0f1115; --card:#181b22; --line:#272b34; --fg:#e7e9ee; --dim:#8b919e; --accent:#6ea8fe; --ok:#5fd38a; --warn:#f0c674; --me:#222630; }
   * { box-sizing:border-box; }
   body { margin:0; font:15px/1.6 -apple-system,"PingFang TC","Microsoft JhengHei",system-ui,sans-serif; background:var(--bg); color:var(--fg); }
-  .wrap { max-width:760px; margin:0 auto; padding:28px 18px 80px; }
+  .wrap { max-width:1180px; margin:0 auto; padding:24px 22px 80px; }
+  /* 雙欄佈局：許願頁=主區+歷史側欄；工作台=檔案左+預覽右。窄螢幕自動收成單欄 */
+  .cols { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:26px; align-items:start; }
+  .cols2 { display:grid; grid-template-columns:340px minmax(0,1fr); gap:26px; align-items:start; }
+  .side, .wbleft { position:sticky; top:14px; }
+  .side h3, .wbleft h3 { margin-top:0; }
+  .wbright { position:sticky; top:14px; min-height:120px; }
+  @media (max-width:860px){ .cols,.cols2{ grid-template-columns:1fr; } .side,.wbleft,.wbright{ position:static; } }
   header { display:flex; align-items:baseline; gap:10px; margin-bottom:6px; }
   header h1 { font-size:22px; margin:0; }
   header .sub { color:var(--dim); font-size:13px; }
@@ -65,6 +72,23 @@
   .hist:hover { border-color:var(--accent); }
   .hist .g { font-size:14px; } .hist .m { color:var(--dim); font-size:12px; }
   .empty { color:var(--dim); font-size:13px; }
+  .tabs { display:flex; gap:4px; border-bottom:1px solid var(--line); margin:14px 0 4px; }
+  .tab { padding:8px 16px; font-size:14px; color:var(--dim); cursor:pointer; border-bottom:2px solid transparent; }
+  .tab.active { color:var(--fg); border-bottom-color:var(--accent); }
+  .wbrow { display:flex; align-items:center; gap:10px; padding:9px 12px; background:var(--card); border:1px solid var(--line); border-radius:8px; margin:6px 0; }
+  .wbname { flex:1; color:var(--accent); cursor:pointer; font-size:14px; }
+  .wbmeta { color:var(--dim); font-size:12px; }
+  .wbdel { cursor:pointer; opacity:.6; } .wbdel:hover { opacity:1; }
+  .followup { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
+  .followup textarea { width:100%; background:#0c0e12; color:var(--fg); border:1px solid var(--line); border-radius:8px; padding:10px; font:inherit; resize:vertical; min-height:52px; margin-bottom:8px; }
+  .cont { color:var(--accent); }
+  .modal { position:fixed; inset:0; background:rgba(0,0,0,.6); display:flex; align-items:center; justify-content:center; z-index:10; }
+  .modalbox { background:var(--card); border:1px solid var(--line); border-radius:14px; width:min(560px,92vw); max-height:80vh; display:flex; flex-direction:column; padding:14px; }
+  .fspath { font:12px ui-monospace,Menlo,monospace; color:var(--dim); margin-bottom:8px; word-break:break-all; }
+  .fslist { flex:1; overflow:auto; border:1px solid var(--line); border-radius:8px; }
+  .fsrow { padding:8px 12px; cursor:pointer; border-bottom:1px solid var(--line); font-size:14px; }
+  .fsrow:hover { background:#0c0e12; } .fsrow.up { color:var(--dim); }
+  .fsbar { display:flex; align-items:center; gap:8px; margin-top:10px; }
   .viewer { margin-top:10px; border:1px solid var(--line); border-radius:10px; padding:12px; background:#0c0e12; }
   .vbar { font-size:12px; color:var(--dim); margin-bottom:8px; }
   .vbar a { color:var(--accent); text-decoration:none; }
@@ -84,27 +108,63 @@
     <span class="sub">說出你想完成的事，交給它去做、做完給你成品</span>
     <span class="spacer"></span>
     <select id="space" title="專案／空間：不同專案的檔案與記憶各自獨立"></select>
+    <button class="ghost" id="browsebtn" title="瀏覽並選一個真實資料夾（本地模式）" style="display:none">📁 選資料夾</button>
     <button class="ghost" id="newspace" title="新專案">＋</button>
   </header>
 
-  <div class="ask">
-    <textarea id="goal" placeholder="例如：把這個資料夾的 .md 檔整理成一份目錄 index.md；或：抓 example.com 的標題寫進 title.txt"></textarea>
-    <div class="row">
-      <select id="pack" title="領域"></select>
-      <span class="spacer"></span>
-      <button id="go">交辦 →</button>
+  <div id="fsmodal" class="modal" style="display:none">
+    <div class="modalbox">
+      <div style="margin-bottom:8px;font-weight:600">選一個資料夾（就地工作）</div>
+      <div class="fspath" id="fspath"></div>
+      <div class="fslist" id="fslist"></div>
+      <div class="fsbar">
+        <button class="ghost" onclick="fsHome()">🏠 家目錄</button>
+        <button class="ghost" onclick="closeFs()">取消</button>
+        <span class="spacer"></span>
+        <button onclick="chooseFs()">✓ 選這個資料夾</button>
+      </div>
     </div>
   </div>
 
-  <div id="current"></div>
+  <div class="tabs">
+    <span class="tab active" id="tab-wish" onclick="switchTab('wish')">許願</span>
+    <span class="tab" id="tab-wb" onclick="switchTab('wb')">📂 工作台</span>
+  </div>
+
+  <div id="wishview" class="cols">
+    <div class="main">
+      <div class="ask">
+        <textarea id="goal" placeholder="例如：把這個資料夾的 .md 檔整理成一份目錄 index.md；或：抓 example.com 的標題寫進 title.txt"></textarea>
+        <div class="row">
+          <select id="pack" title="領域"></select>
+          <span class="spacer"></span>
+          <button id="go">交辦 →</button>
+        </div>
+      </div>
+      <div id="current"></div>
+    </div>
+    <aside class="side">
+      <h3>歷史成品</h3>
+      <div id="history"><div class="empty">還沒有任何任務。<br>左邊交辦一件事試試。</div></div>
+    </aside>
+  </div>
 
-  <h3>歷史成品</h3>
-  <div id="history"><div class="empty">還沒有任何任務。上面交辦一件事試試。</div></div>
+  <div id="workbench" class="cols2" style="display:none">
+    <div class="wbleft">
+      <h3>📂 工作台</h3>
+      <div id="wbfiles"></div>
+    </div>
+    <div class="wbright">
+      <div id="wbhint" class="empty">← 點左邊的檔案，在這裡預覽</div>
+      <div class="viewer" id="wbview" style="display:none"></div>
+    </div>
+  </div>
 </div>
 
 <script>
 const TOKEN = "__SERVER_TOKEN__";
 const PACKS = __PACKS__;
+const LOCAL = __LOCAL__;  // 本地模式：可把專案指向真實資料夾（就地工作,像 Claude Code）
 const $ = (s) => document.querySelector(s);
 const api = (p, opts={}) => fetch(p, { ...opts, headers: { authorization:"Bearer "+TOKEN, "content-type":"application/json", ...(opts.headers||{}) } });
 const esc = (s) => String(s==null?"":s).replace(/[&<>]/g, c=>({"&":"&amp;","<":"&lt;",">":"&gt;"}[c]));
@@ -132,11 +192,36 @@ $("#pack").innerHTML = PACKS.map(p=>`<option value="${p}" ${p==="general"?"selec
 // 專案／空間（對應 Claude Code 的「目錄」,但可選＋命名＋有預設；不同空間的檔案與沉澱各自獨立）
 let spaces = JSON.parse(localStorage.getItem("xk_spaces")||'["default"]');
 let curSpace = localStorage.getItem("xk_space")||"default";
-function renderSpaces(){ $("#space").innerHTML = spaces.map(s=>`<option ${s===curSpace?"selected":""}>${esc(s)}</option>`).join(""); }
-$("#space").onchange = () => { curSpace=$("#space").value; localStorage.setItem("xk_space",curSpace); $("#current").innerHTML=""; loadHistory(); };
-$("#newspace").onclick = () => { const n=(prompt("新專案名稱（英數/底線/連字號）：")||"").trim().replace(/[^a-zA-Z0-9_-]/g,""); if(!n)return; if(!spaces.includes(n))spaces.push(n); curSpace=n; localStorage.setItem("xk_spaces",JSON.stringify(spaces)); localStorage.setItem("xk_space",curSpace); renderSpaces(); $("#current").innerHTML=""; loadHistory(); };
+const spaceLabel=s=>s.startsWith("/")?("📁 "+(s.split("/").filter(Boolean).pop()||s)):s;
+function renderSpaces(){ $("#space").innerHTML = spaces.map(s=>`<option value="${esc(s)}" ${s===curSpace?"selected":""}>${esc(spaceLabel(s))}</option>`).join(""); }
+$("#space").onchange = () => { curSpace=$("#space").value; localStorage.setItem("xk_space",curSpace); $("#current").innerHTML=""; loadHistory(); if($("#workbench").style.display!=="none"){ wbSub=""; loadWorkbench(); } };
+$("#newspace").onclick = () => {
+  const raw=(prompt(LOCAL?"新專案：輸入名稱，或貼上一個真實資料夾的絕對路徑（本地模式會就地改該資料夾的檔，像 Claude Code）":"新專案名稱（英數/底線/連字號）：")||"").trim();
+  if(!raw) return;
+  const n = (LOCAL && raw.startsWith("/")) ? raw : raw.replace(/[^a-zA-Z0-9_-]/g,"");
+  if(!n) return;
+  if(!spaces.includes(n)) spaces.push(n);
+  curSpace=n; localStorage.setItem("xk_spaces",JSON.stringify(spaces)); localStorage.setItem("xk_space",curSpace);
+  renderSpaces(); $("#current").innerHTML=""; loadHistory();
+};
 renderSpaces();
 
+// 資料夾瀏覽器（本地模式「用選的」）：伺服器端列資料夾,網頁點進去挑一個
+if(LOCAL) $("#browsebtn").style.display="";
+$("#browsebtn").onclick = ()=>{ $("#fsmodal").style.display="flex"; fsGo(null); };
+let fsPath=null;
+async function fsGo(p){
+  const r=await api("/v1/fs"+(p?("?path="+encodeURIComponent(p)):"")).then(r=>r.json()).catch(()=>({error:"讀取失敗"}));
+  if(r.error){ alert(r.error); return; }
+  fsPath=r.path; window._fsHome=r.home;
+  $("#fspath").textContent="📂 "+r.path;
+  const base=r.path.endsWith("/")?r.path:r.path+"/";
+  $("#fslist").innerHTML=`<div class="fsrow up" onclick="fsGo('${esc(r.parent)}')">⬆ 上一層</div>`+(r.dirs.length?r.dirs.map(d=>`<div class="fsrow" onclick="fsGo('${esc(base+d)}')">📁 ${esc(d)}</div>`).join(""):`<div class="empty" style="padding:10px">（沒有子資料夾，可直接選這個）</div>`);
+}
+function fsHome(){ fsGo(window._fsHome||null); }
+function closeFs(){ $("#fsmodal").style.display="none"; }
+function chooseFs(){ if(!fsPath) return; const p=fsPath; if(!spaces.includes(p)) spaces.push(p); curSpace=p; localStorage.setItem("xk_spaces",JSON.stringify(spaces)); localStorage.setItem("xk_space",curSpace); renderSpaces(); closeFs(); $("#current").innerHTML=""; loadHistory(); }
+
 // 極簡 markdown 渲染（零依賴、可離線；夠用於 agent 產的報告）
 function mdRender(src){
   const lines=String(src).replace(/\r/g,"").split("\n"); const out=[]; let inCode=false,buf=[],inList=false;
@@ -154,7 +239,10 @@ function mdRender(src){
   return out.join("");
 }
 const IMG=/\.(png|jpe?g|gif|webp|svg)$/i, MD=/\.(md|markdown)$/i, HTMLF=/\.html?$/i, JSONF=/\.json$/i;
-const fileUrl=(id,path,extra="")=>"/v1/tasks/"+id+"/file?path="+encodeURIComponent(path)+"&token="+encodeURIComponent(TOKEN)+extra;
+// 取檔 URL 產生器（任務成品走 /tasks/<id>，工作台走 /workspaces?ws=，後者 ws 可為本地絕對路徑）
+const TOK="&token="+encodeURIComponent(TOKEN);
+const taskFileUrl=id=>(path,extra="")=>"/v1/tasks/"+id+"/file?path="+encodeURIComponent(path)+TOK+extra;
+const wsFileUrl=ws=>(path,extra="")=>"/v1/workspaces/file?ws="+encodeURIComponent(ws)+"&path="+encodeURIComponent(path)+TOK+extra;
 // 彩色 diff（綠 +／紅 -）：渲染 kernel 算好的 _diff
 function diffHtml(d){
   if(!d) return "";
@@ -171,13 +259,13 @@ function logHtml(p){
 let expandedLog=false;
 function toggleLog(){ expandedLog=!expandedLog; if(liveTask) renderCurrent(liveTask); }
 
-async function viewFile(id, encPath, name){
-  const path=decodeURIComponent(encPath); const v=$("#fview"); v.style.display="block";
-  const bar=`<div class="vbar">📄 ${esc(name)} · <a href="${fileUrl(id,path)}" target="_blank">開新分頁</a> · <a href="${fileUrl(id,path,'&download=1')}">下載</a></div>`;
-  if(IMG.test(name)){ v.innerHTML=bar+`<img class="vimg" src="${fileUrl(id,path)}">`; return; }
-  if(HTMLF.test(name)){ v.innerHTML=bar+`<iframe class="vframe" sandbox src="${fileUrl(id,path)}"></iframe>`; return; }
+async function renderFile(urlFn, encPath, name, sel){
+  const path=decodeURIComponent(encPath); const v=document.querySelector(sel); v.style.display="block";
+  const bar=`<div class="vbar">📄 ${esc(name)} · <a href="${urlFn(path)}" target="_blank">開新分頁</a> · <a href="${urlFn(path,'&download=1')}">下載</a></div>`;
+  if(IMG.test(name)){ v.innerHTML=bar+`<img class="vimg" src="${urlFn(path)}">`; return; }
+  if(HTMLF.test(name)){ v.innerHTML=bar+`<iframe class="vframe" sandbox src="${urlFn(path)}"></iframe>`; return; }
   v.innerHTML=bar+`<div class="empty">載入中…</div>`;
-  const txt=await fetch(fileUrl(id,path)).then(r=>r.ok?r.text():null).catch(()=>null);
+  const txt=await fetch(urlFn(path)).then(r=>r.ok?r.text():null).catch(()=>null);
   if(txt==null){ v.innerHTML=bar+`<div class="empty">（無法以文字呈現，請下載）</div>`; return; }
   let body;
   if(MD.test(name)) body=`<div class="md">${mdRender(txt)}</div>`;
@@ -185,6 +273,34 @@ async function viewFile(id, encPath, name){
   else body=`<pre class="viewer-pre">${esc(txt)}</pre>`;
   v.innerHTML=bar+body;
 }
+function viewFile(id, encPath, name){ return renderFile(taskFileUrl(id), encPath, name, "#fview"); }
+function wbView(encPath, name){ const h=$("#wbhint"); if(h) h.style.display="none"; return renderFile(wsFileUrl(curSpace), encPath, name, "#wbview"); }
+
+// 工作台分頁：逐層瀏覽 / 看 / 刪
+function fmtSize(n){ return n<1024?n+" B":n<1048576?(n/1024).toFixed(1)+" KB":(n/1048576).toFixed(1)+" MB"; }
+let wbSub="";
+function wbNav(s){ wbSub=decodeURIComponent(s); loadWorkbench(); }
+function wbUp(){ wbSub=wbSub.includes("/")?wbSub.slice(0,wbSub.lastIndexOf("/")):""; loadWorkbench(); }
+async function loadWorkbench(){
+  $("#wbview").style.display="none"; { const h=$("#wbhint"); if(h) h.style.display=""; }
+  const r=await api("/v1/workspaces/files?ws="+encodeURIComponent(curSpace)+"&sub="+encodeURIComponent(wbSub)).then(r=>r.json()).catch(()=>({dirs:[],files:[]}));
+  const root=curSpace.startsWith("/")?curSpace:curSpace;
+  let html=`<div class="loc">📂 ${esc(root)}${wbSub?" / "+esc(wbSub):""}</div>`;
+  if(wbSub) html+=`<div class="wbrow up" onclick="wbUp()"><span class="wbname">⬆ 上一層</span></div>`;
+  html+=(r.dirs||[]).map(d=>`<div class="wbrow" onclick="wbNav('${encodeURIComponent((wbSub?wbSub+'/':'')+d)}')"><span class="wbname">📁 ${esc(d)}/</span></div>`).join("");
+  html+=(r.files||[]).map(f=>{const full=(wbSub?wbSub+'/':'')+f.name;return `<div class="wbrow"><span class="wbname" onclick="wbView('${encodeURIComponent(full)}','${esc(f.name)}')">📄 ${esc(f.name)}</span><span class="wbmeta">${fmtSize(f.size)}</span><span class="wbdel" title="刪除" onclick="wbDelete('${encodeURIComponent(full)}','${esc(f.name)}')">🗑</span></div>`;}).join("");
+  if(!(r.dirs||[]).length && !(r.files||[]).length) html+=`<div class="empty">（${wbSub?"這個資料夾是空的":"這個專案還沒有檔案，去「許願」交辦一件事吧"}）</div>`;
+  $("#wbfiles").innerHTML=html;
+}
+async function wbDelete(encPath, name){ if(!confirm("刪除 "+name+"？此動作無法復原。")) return; await api("/v1/workspaces/file?ws="+encodeURIComponent(curSpace)+"&path="+encodeURIComponent(decodeURIComponent(encPath)),{method:"DELETE"}); loadWorkbench(); }
+function switchTab(name){
+  const wish=name==="wish";
+  $("#wishview").style.display=wish?"":"none";
+  $("#workbench").style.display=wish?"none":"";
+  $("#tab-wish").classList.toggle("active",wish);
+  $("#tab-wb").classList.toggle("active",!wish);
+  if(!wish){ wbSub=""; loadWorkbench(); }
+}
 
 let activeId = null, polling = null;
 
@@ -233,6 +349,13 @@ function renderCurrent(t) {
     ${files.length?`<div class="files">📦 成品：${files.map(([f,k])=>`<span class="file ${k==="mod"?"mod":""}" onclick="viewFile('${t.taskId}','${encodeURIComponent(f)}','${esc(f)}')">${k==="mod"?"~":"+"} ${esc(f)}</span>`).join("")}</div>`:""}
     ${t.result&&t.result.workspaceDir?`<div class="loc">📂 檔案位置：<code title="點擊複製" onclick="navigator.clipboard&&navigator.clipboard.writeText('${esc(t.result.workspaceDir)}')">${esc(t.result.workspaceDir)}</code></div>`:""}
     <div class="viewer" id="fview" style="display:none"></div>
+    ${t.status==="done"?`<div class="followup">
+      <button class="ghost" onclick="toggleFollowup()">↳ 繼續／調整這個成果</button>
+      <div id="fubox" style="display:none;margin-top:8px">
+        <textarea id="fugoal" placeholder="想怎麼調整或繼續深入？（會接續這次的對話與檔案，agent 記得來龍去脈）"></textarea>
+        <button onclick="submitFollowup('${esc(t.sessionId||"")}','${esc(t.pack||"general")}','${esc(t.workspace||"default")}')">送出 →</button>
+      </div>
+    </div>`:""}
   </div>`;
   if (t.status==="needs-input") {
     const inp = $("#ans"); inp.focus();
@@ -244,11 +367,20 @@ function renderCurrent(t) {
   }
 }
 
+// 繼續／調整：送出接續上一個任務對話(sessionId)+ 同工作區的後續任務
+function toggleFollowup(){ const b=$("#fubox"); if(b){ b.style.display=b.style.display==="none"?"":"none"; if(b.style.display!=="none") $("#fugoal").focus(); } }
+async function submitFollowup(sessionId, pack, workspace){
+  const goal=$("#fugoal").value.trim(); if(!goal) return;
+  const r=await api("/v1/tasks",{method:"POST",body:JSON.stringify({pack, mode:"goal", goal, workspace, sessionId})}).then(r=>r.json());
+  if(r.error){ alert(r.error); return; }
+  activeId=r.taskId; expandedLog=false; liveTask=null; poll(); window.scrollTo({top:0,behavior:"smooth"});
+}
+
 async function loadHistory() {
   const r = await api("/v1/tasks").then(r=>r.json());
   const list = (r.tasks||[]).filter(t=>t.mode==="goal" && (t.workspace||"default")===curSpace).reverse();
   $("#history").innerHTML = list.length ? list.map(t=>`<div class="hist" onclick="openTask('${t.taskId}')">
-    <div class="g">${esc(t.goal||t.taskId)} <span class="status ${statusClass(t.status)}">${statusText(t.status)}</span></div>
+    <div class="g">${t.continued?'<span class="cont" title="接續前一個任務">↳</span> ':''}${esc(t.goal||t.taskId)} <span class="status ${statusClass(t.status)}">${statusText(t.status)}</span></div>
     <div class="m">${esc(t.createdAt)}</div></div>`).join("") : `<div class="empty">還沒有任何任務。</div>`;
 }
 async function openTask(id){ activeId=id; const t=await api("/v1/tasks/"+id).then(r=>r.json()); liveTask=t; renderCurrent(t); if(t.status==="running"||t.status==="queued"){poll();} window.scrollTo({top:0,behavior:"smooth"}); }