@guowenzhang/dsh-whiteboard 0.2.0 → 0.2.2

package/README.md

@@ -1,29 +1,38 @@
 # dsh-whiteboard
 
-A DeepSeek Harness Web plugin: the main panel keeps the whiteboard card gallery while drawioedit edits the selected board in the right Sidebar, so the list and the editor stay side by side. Diagrams live in this plugin's `files/` directory; no workspace selection is needed. A dedicated session grants write access to this directory.
+English | [中文](README.zh.md)
+
+## Why I built this plugin
+
+I often need somewhere to jot down drafts while thinking. I used to do that in documents, but now that AI tools are part of my everyday workflow, I wanted that space right inside DeepSeek Harness. A whiteboard is more flexible for sketching ideas and mapping out processes. It uses the open `.drawio` file format, so boards can also be edited in draw.io and other compatible tools.
+
+## Screenshots
+
+![Whiteboard gallery with name search](docs/images/gallery.png)
+
+![New whiteboard](docs/images/new-board.png)
+
+![Whiteboard editor](docs/images/editor.png)
+
+The editor screenshot shows an earlier version. The current version keeps the gallery visible beside the editor.
 
 ## Install
 
-Install and enable [`@guowenzhang/dsh-drawioedit`](../dsh-drawioedit) first, then this plugin:
+Install the editor dependency first, then the whiteboard plugin:
 
 ```sh
 npx @deepseek-ai/dsh plugin --profile web add @guowenzhang/dsh-drawioedit
 npx @deepseek-ai/dsh plugin --profile web add @guowenzhang/dsh-whiteboard
 ```
 
-From the npm registry: <https://www.npmjs.com/package/@guowenzhang/dsh-whiteboard> — restart the host afterwards; local checkouts, git sources and troubleshooting are in [AGENTS.md](AGENTS.md).
-
-Restart DSH Web and open **Whiteboards** in the left navigation. **New whiteboard** first opens a dialog with an editable timestamp-based name. Only **Create** writes the `.drawio` file under the plugin's `files/` directory and opens it in drawioedit. Drawioedit autosaves changes. Each card shows its name, a first-page preview, and last modification time. Click the card to edit, or click the top-right X and confirm to delete the file. The persistent search box in the toolbar filters the loaded cards by name and shows an empty-result hint when nothing matches. Returning to the **Whiteboards** page goes straight back to the board whose editor tab is still open — collapsing the Sidebar or switching pages keeps it — and only an explicit tab close, a deleted board or a replaced file leaves you on the gallery. Oversized or unreadable diagrams show a preview placeholder. On desktop, opening a board expands the editor column to fullscreen so draw.io can show its own left shapes palette and right format panel; collapse the Sidebar or leave fullscreen to get back to the gallery and click a card to continue editing.
+Restart DSH Web, open **Whiteboards** in the left navigation, and click **New whiteboard** to confirm a name and get started. Click an existing card to continue editing.
 
-New whiteboards have a single `.drawio` file. Legacy UUID files and their sidecars remain visible. Back up `files/` before replacing or uninstalling the plugin.
+## Notes
 
-## Development
+- The editor saves your drawings automatically; no manual saving is needed.
+- Boards are stored in the plugin's `files/` directory, not the current workspace. Back up that directory before updating, replacing, or uninstalling the plugin.
+- Deleting a board removes its file, so check before confirming.
 
-```sh
-npm ci --legacy-peer-deps
-npm run typecheck
-npm run build
-npm test
-```
+## License
 
-Commit the generated `lib/` with source changes. `dsh-drawioedit` supplies the editor assets at runtime.
+[Apache-2.0](LICENSE). See [NOTICE](NOTICE) for third-party notices.

package/README.zh.md

@@ -1,29 +1,38 @@
 # dsh-whiteboard
 
-DeepSeek Harness Web 白板插件：主面板常驻白板卡片列表，打开白板后列表仍留在左侧，drawioedit 在右侧侧边栏编辑。图文件保存在本插件的 `files/` 目录；无需选择工作区。白板为该目录创建专用会话并授予写入权限。
+[English](README.md) | 中文
+
+## 为什么做这个插件
+
+我在思考时，经常需要一个地方记录草稿，以前一般会写在文档里。现在全面使用 AI 工具，就把这个空间直接集成到了 DeepSeek Harness 中。白板比文档更灵活，适合随手记录想法、梳理流程；采用开放的 `.drawio` 文件格式，也方便在 draw.io 等兼容工具中继续编辑。
+
+## 截图
+
+![白板列表与名称搜索](docs/images/gallery.png)
+
+![新建白板](docs/images/new-board.png)
+
+![白板编辑器](docs/images/editor.png)
+
+编辑器截图来自旧版；当前版本在编辑器旁保留白板列表。
 
 ## 安装
 
-先安装并启用 [`@guowenzhang/dsh-drawioedit`](../dsh-drawioedit)，再安装本插件：
+先安装编辑器依赖，再安装白板插件：
 
 ```sh
 npx @deepseek-ai/dsh plugin --profile web add @guowenzhang/dsh-drawioedit
 npx @deepseek-ai/dsh plugin --profile web add @guowenzhang/dsh-whiteboard
 ```
 
-来自 npm 官方源：<https://www.npmjs.com/package/@guowenzhang/dsh-whiteboard>。装完重启宿主；本地目录开发安装、git 源与排查见 [AGENTS.md](AGENTS.md)。
-
-重启 DSH Web 后，打开左侧导航中的“白板”。点击“新建白板”会先显示命名对话框，默认填入时间名称，可直接修改；只有点击“确认创建”才会在插件 `files/` 目录创建 `.drawio` 文件并交给 drawioedit 打开。绘图内容由 drawioedit 自动保存。卡片显示名称、第一页缩略图和最近修改时间；点击卡片可继续编辑，点击右上角叉号并确认可删除文件。工具条上的搜索框按名称筛选当前卡片列表，不匹配时显示空结果提示。再次进入“白板”页时，如果上一块白板的编辑标签仍开着（只是收起过侧边栏或切到过别的页面），会直接回到那块白板；只有主动关闭标签、或该文件已被删除或替换，才会停在白板列表。过大或无法解析的图表显示预览占位内容。桌面端打开白板时右侧编辑列展开为全屏，编辑器可以完整显示自己的左侧形状面板和右侧格式面板；收起侧边栏或退出全屏即可回到白板列表，再点卡片可继续编辑。
+重启 DSH Web，打开左侧“白板”，点击“新建白板”并确认名称即可开始；点击已有卡片可继续编辑。
 
-新白板只有一个 `.drawio` 文件；旧版 UUID 文件和元数据仍可显示。替换或卸载插件前请备份 `files/` 目录。
+## 注意事项
 
-## 开发
+- 绘图内容由编辑器自动保存，无需手动保存。
+- 白板保存在插件的 `files/` 目录，不在当前工作区；更新、替换或卸载插件前请备份该目录。
+- 删除白板会删除对应文件，请确认后再操作。
 
-```sh
-npm ci --legacy-peer-deps
-npm run typecheck
-npm run build
-npm test
-```
+## 许可
 
-修改源码后须重新构建并提交 `lib/`。`dsh-drawioedit` 在运行时提供编辑器资源。
+[Apache-2.0](LICENSE)，第三方组件声明见 [NOTICE](NOTICE)。

package/lib/client.js

@@ -187,7 +187,7 @@ window.__ModuleLoader__.load({
 		};
 		//#endregion
 		//#region src/client/last-board.ts
-		const STORAGE_KEY = "dsh.whiteboard.v1.last-board";
+		const STORAGE_KEY$1 = "dsh.whiteboard.v1.last-board";
 		function storage() {
 			try {
 				return typeof window === "undefined" ? void 0 : window.localStorage;
@@ -200,7 +200,7 @@ window.__ModuleLoader__.load({
 			const store = storage();
 			if (!store) return void 0;
 			try {
-				const raw = store.getItem(STORAGE_KEY);
+				const raw = store.getItem(STORAGE_KEY$1);
 				if (raw === null) return void 0;
 				const value = JSON.parse(raw);
 				if (typeof value !== "object" || value === null) return void 0;
@@ -220,7 +220,7 @@ window.__ModuleLoader__.load({
 			const store = storage();
 			if (!store) return;
 			try {
-				store.setItem(STORAGE_KEY, JSON.stringify({
+				store.setItem(STORAGE_KEY$1, JSON.stringify({
 					id: board.id,
 					title: board.title,
 					updatedAt: board.updatedAt
@@ -232,7 +232,7 @@ window.__ModuleLoader__.load({
 			const store = storage();
 			if (!store) return;
 			try {
-				store.removeItem(STORAGE_KEY);
+				store.removeItem(STORAGE_KEY$1);
 			} catch {}
 		}
 		/**
@@ -30894,6 +30894,60 @@ segment: 30 };
 			});
 		}
 		//#endregion
+		//#region src/client/board-session.ts
+		const STORAGE_KEY = "dsh.whiteboard.v1.session";
+		/** The dedicated editor Session survives reloads; it is not a chat destination. */
+		function readBoardSession() {
+			try {
+				return window.localStorage?.getItem(STORAGE_KEY) || void 0;
+			} catch {
+				return;
+			}
+		}
+		function writeBoardSession(sessionId) {
+			try {
+				window.localStorage?.setItem(STORAGE_KEY, sessionId);
+			} catch {}
+		}
+		/**
+		* Replace only a known whiteboard Session's central occupant, not its navigation
+		* or rightbar binding. Selecting the global whiteboard panel here would hide the
+		* rightbar: the Host only exposes it while the Conversation main key is selected.
+		* The normal Conversation registration stays installed underneath this shadow.
+		*/
+		function installBoardSessionPanel(ctx, owned, face) {
+			let reconcile = () => {};
+			ctx.slots.inject("main", () => {
+				let release;
+				reconcile = () => {
+					const sessionId = ctx.sidebarRight.mounted.getSnapshot();
+					const showList = sessionId !== void 0 && owned(sessionId);
+					if (showList && !release) release = ctx.slots.register({
+						name: "main",
+						key: "conversation",
+						priority: -1,
+						locale: NS,
+						inject: () => ({
+							...face,
+							restore: async () => "none"
+						})
+					}, WhiteboardPanel);
+					else if (!showList && release) {
+						release();
+						release = void 0;
+					}
+				};
+				const unsubscribe = ctx.sidebarRight.mounted.subscribe(() => reconcile());
+				reconcile();
+				return () => {
+					unsubscribe();
+					release?.();
+					reconcile = () => {};
+				};
+			});
+			return () => reconcile();
+		}
+		//#endregion
 		//#region src/client/index.tsx
 		async function unwrap(call) {
 			const result = await call;
@@ -30941,7 +30995,8 @@ segment: 30 };
 				return service;
 			};
 			const sessions = ctx.sessions;
-			let lastSessionId;
+			let lastSessionId = readBoardSession();
+			let syncBoardPanel = () => {};
 			/** The drawio editor tab open for the mounted session: the active tab or a background one. */
 			const openEditorTab = (sessionId) => {
 				const known = ctx.sidebarRight.openTabs.getSnapshot().find((tab) => tab.sessionId === sessionId && tab.kind === "drawio-edit");
@@ -30968,6 +31023,8 @@ segment: 30 };
 					if (!sessionId) sessionId = await sessions.create({ cwd: board.directory });
 					await unwrap(remote().grantBoardSession({ sessionId }));
 					lastSessionId = sessionId;
+					writeBoardSession(sessionId);
+					syncBoardPanel();
 					writeLastBoard(board);
 					if (ctx.sidebarRight.mounted.getSnapshot() !== sessionId) {
 						ctx.uiWorkspace.openSession(sessionId);
@@ -30995,6 +31052,7 @@ segment: 30 };
 					return "reopened";
 				}
 			};
+			syncBoardPanel = installBoardSessionPanel(ctx, (id) => id === lastSessionId, face);
 			ctx.slots.inject("main", () => ctx.slots.register({
 				name: "main",
 				key: "whiteboard",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@guowenzhang/dsh-whiteboard",
-  "version": "0.2.0",
-  "description": "Plugin-owned whiteboards with a card gallery and fullscreen draw.io editing for DeepSeek Harness",
+  "version": "0.2.2",
+  "description": "Whiteboards for DeepSeek Harness: a board gallery in the main panel and draw.io editing in the Sidebar, with boards stored inside the plugin",
   "type": "module",
   "license": "Apache-2.0",
   "main": "lib/index.mjs",
@@ -11,9 +11,14 @@
     "./package.json": "./package.json",
     "./cordis.patch.yml": "./cordis.patch.yml"
   },
-  "engines": { "node": "^22.19.0 || >=24.0.0", "dsh": ">=0.2.0-rc.1" },
+  "engines": {
+    "node": "^22.19.0 || >=24.0.0",
+    "dsh": ">=0.2.0-rc.1"
+  },
   "dsh": {
-    "bundle": { "patch": "./cordis.patch.yml" },
+    "bundle": {
+      "patch": "./cordis.patch.yml"
+    },
     "client": {
       "inject": [
         "@deepseek-ai/dsh-api-remotes",
@@ -29,7 +34,16 @@
       "platform": "web"
     }
   },
-  "files": ["lib", "files/README.md", "cordis.patch.yml", "README.md", "README.zh.md", "LICENSE", "NOTICE"],
+  "files": [
+    "lib",
+    "docs",
+    "files/README.md",
+    "cordis.patch.yml",
+    "README.md",
+    "README.zh.md",
+    "LICENSE",
+    "NOTICE"
+  ],
   "scripts": {
     "build": "tsdown -c tsdown.config.ts && node build-client.mjs",
     "typecheck": "tsc --noEmit -p tsconfig.json",
@@ -54,21 +68,51 @@
     "react": "*"
   },
   "peerDependenciesMeta": {
-    "@deepseek-ai/cordis": { "optional": true },
-    "@deepseek-ai/dsh-api-remotes": { "optional": true },
-    "@deepseek-ai/dsh-api-session-controller": { "optional": true },
-    "@deepseek-ai/dsh-client-locale": { "optional": true },
-    "@deepseek-ai/dsh-client-ui-renderer": { "optional": true },
-    "@deepseek-ai/dsh-client-ui-slots": { "optional": true },
-    "@deepseek-ai/dsh-client-ui-layout": { "optional": true },
-    "@deepseek-ai/dsh-client-ui-sidebar": { "optional": true },
-    "@deepseek-ai/dsh-client-ui-sidebar-right": { "optional": true },
-    "@deepseek-ai/dsh-client-ui-workspace": { "optional": true },
-    "@deepseek-ai/dsh-sandbox-policy": { "optional": true },
-    "@deepseek-ai/dsh-session": { "optional": true },
-    "@deepseek-ai/dsh-util-workspace-path": { "optional": true },
-    "@deepseek-ai/dsh-typert-protocol": { "optional": true },
-    "react": { "optional": true }
+    "@deepseek-ai/cordis": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-api-remotes": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-api-session-controller": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-locale": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-ui-renderer": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-ui-slots": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-ui-layout": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-ui-sidebar": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-ui-sidebar-right": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-client-ui-workspace": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-sandbox-policy": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-session": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-util-workspace-path": {
+      "optional": true
+    },
+    "@deepseek-ai/dsh-typert-protocol": {
+      "optional": true
+    },
+    "react": {
+      "optional": true
+    }
   },
   "devDependencies": {
     "@deepseek-ai/cordis": "^4.0.4",