@evanbobo/colco4dsh 0.1.3 → 0.1.4

package/README.md

@@ -5,7 +5,7 @@ A DSH (DeepSeek Harness) plugin for Colco. A **Colco** row in DSH's left sidebar
 ## Requirements
 
 - DSH 0.2.x (`engines.dsh: ">=0.2.0 <0.3.0"`), Node 20.3 or later.
-- The `colco` CLI from `@evanbobo/colco` 0.22.0 or later on `PATH` (`npm i -g @evanbobo/colco`), logged in: `npx @evanbobo/colco add` saves the server and a read/write API key in `~/.colco/config.json`, or set `COLCO_AGENT_TOKEN`. `colco whoami` should show you. The plugin calls `colco … --json` and nothing else; it never talks to the Colco server itself.
+- The `colco` CLI from `@evanbobo/colco` 0.23.0 or later on `PATH` (`npm i -g @evanbobo/colco`), logged in: `npx @evanbobo/colco add` saves the server and a read/write API key in `~/.colco/config.json`, or set `COLCO_AGENT_TOKEN`. `colco whoami` should show you. The plugin calls `colco … --json` and nothing else; it never talks to the Colco server itself. The My tasks board (`colco tasks`) and the rules.json dialog (`colco runner rules get|set`) are the reason for that minimum.
 
 ## Install
 
@@ -32,8 +32,10 @@ The bundle inserts the row `{ id: colco, name: '@evanbobo/colco4dsh' }`. To chan
 
 ## What it does
 
-- Page **Colco** (the left-sidebar row above More; on a narrow window, the icon in the collapsed rail): the runner's state and how many steps run now, with Start (installs the login service) and Stop; one card per active run, with the task link; open decisions with their options in Colco's order, the recommended one marked, an optional note and Answer; and a setup form for label → workflow rows and folders. For a folder that is missing, not a git repository or without origin, it shows a git command to copy, built from the Colco repository you pick; it never runs git itself. It refreshes every 10 seconds while the page is open. The copy is English and Chinese and follows DSH's language setting.
-- The page talks only to the plugin's own routes under `/plugins/colco4dsh/api`, which accept requests only from this machine's DSH page (loopback, DSH's origin, DSH's sign-in cookie, and a custom header on every POST) and run `colco … --json`.
+- Page **Colco** (the left-sidebar row above More; on a narrow window, the icon in the collapsed rail): the runner's state and how many steps run now, with Start (installs the login service) and Stop; one card per active run, with the task link; open decisions with their options in Colco's order, the recommended one marked, an optional note and Answer; a setup form for label → workflow rows and folders, and an **Edit rules.json** button that opens a dialog over the raw `~/.colco/rules.json`. The dialog saves through `colco runner rules set`, which checks the rules and backs up the old file first. Invalid JSON or rules are shown and nothing is replaced. If the file changed after the dialog loaded it, the save is refused and the dialog shows the file as it is now, so you choose between keeping the file on disk and overwriting it. For a folder that is missing, not a git repository or without origin, it shows a git command to copy, built from the Colco repository you pick; it never runs git itself. It refreshes every 10 seconds while the page is open. The copy is English and Chinese and follows DSH's language setting.
+- Page **My tasks** (the section below the decisions on the same page): the tasks assigned to you in every active Colco project you belong to, grouped by status (in progress, blocked, in review, to do, backlog, done), 25 per page, with a project filter, a status filter and a pager. Each row shows the project, the priority and the due date, and its title opens the task in Colco. The board is read-only: change tasks in Colco. Tasks of other people, archived projects and projects you have left never appear. It reloads every minute and when you press Refresh; if `colco tasks` fails, only this section shows the error.
+- A red dot on the Colco icon marks an open decision, also while the page is closed. The icon and the page share one status read, refreshed every 10 seconds while DSH is visible. The dot has an accessible label with the count, clears as soon as you answer, and is not shown when the read fails.
+- The page talks only to the plugin's own routes under `/plugins/colco4dsh/api`, which accept requests only from this machine's DSH page (loopback, DSH's origin, DSH's sign-in cookie, and a custom header on every POST) and run `colco … --json`. `GET tasks?project=&status=&page=` accepts nothing else, so a request cannot name another person.
 - Tool `colco_status`: your runner's state, your active runs (queued, running or uncertain) and your open decisions. Read-only.
 - Tool `colco_answer_decision { id, index?, text? }`: with `index`, answers the decision with that option. Without `index`, it shows the decision as a question card and answers with the option you pick. A skipped card or a free-text reply answers nothing.
 - Skill `colco-decisions`: tells the agent to show each open decision with `ask_user_question` (options in Colco's order, the recommended one marked, not moved) and to answer only with your choice.
@@ -43,7 +45,7 @@ Colco text (task titles, decision text, options, summaries) reaches the model in
 ## What it does not do
 
 - No question cards without a conversation turn; the Colco page is where decisions show up at any time.
-- No stopping or retrying single runs (use `colco run stop|retry`), and no editing of agents or workflows (edit `~/.colco/rules.json`; Save keeps them as they are).
+- No stopping or retrying single runs (use `colco run stop|retry`), and the setup form does not edit agents or workflows (use Edit rules.json; Save in the form keeps them as they are).
 - The skill is named `colco-decisions` so it does not hide the `colco` Skill that `@evanbobo/colco` installs.
 
 ## Develop

package/client.js

@@ -6,7 +6,7 @@ window.__ModuleLoader__.load({
   id: "@evanbobo/colco4dsh",
   factory(require) {
     const React = require("react");
-    const { createElement: h, Fragment, useCallback, useEffect, useRef, useState } = React;
+    const { createElement: h, Fragment, useCallback, useEffect, useState } = React;
 
     /** Base path of the Host routes. DSH serves plugin bundles under /plugins; this longer prefix belongs to us. */
     const API = "/plugins/colco4dsh/api";
@@ -90,6 +90,8 @@ window.__ModuleLoader__.load({
       "setup.foldersHint": "The git repositories the runner may work in.",
       "setup.path": "Folder path",
       "setup.addFolder": "Add folder",
+      "setup.dsh": "Let workflow steps use DSH",
+      "setup.dshHint": "Adds a DSH agent to the rules. A step uses it only when its rules name it; the plugin alone never claims or reassigns tasks.",
       "setup.ok": "Git repository, origin {origin}",
       "setup.unchecked": "Not checked yet; saving checks it.",
       "setup.missingFolder": "The folder does not exist.",
@@ -109,6 +111,60 @@ window.__ModuleLoader__.load({
       "setup.duplicateLabel": "The label {label} appears twice.",
       "setup.incomplete": "Every label row needs both a label and a workflow.",
       "setup.notOnServer": "{label} (not on the server)",
+      "panel.openDecision": "{count} open decision waiting for you",
+      "panel.openDecisions": "{count} open decisions waiting for you",
+      "runner.editRulesFile": "Edit rules.json",
+      "file.title": "Edit rules.json",
+      "file.loading": "Loading rules.json",
+      "file.loadFailed": "Could not load rules.json: {message}",
+      "file.path": "File: {path}",
+      "file.missing": "There is no rules.json yet; saving creates it.",
+      "file.diskInvalid": "The file on disk has these problems:",
+      "file.label": "rules.json contents",
+      "file.hint": "Saving checks the rules, keeps a backup of the old file and refuses if the file changed after it was loaded.",
+      "file.save": "Save",
+      "file.saving": "Saving",
+      "file.close": "Close",
+      "file.saved": "Saved {path}",
+      "file.savedBackup": "Saved {path}; the previous file is at {backup}",
+      "file.saveFailed": "The rules were not saved: {message}",
+      "file.conflict": "rules.json changed outside this dialog. Review the file on disk, then choose which version to keep.",
+      "file.diskLabel": "Current file on disk",
+      "file.useDisk": "Use the file on disk",
+      "file.overwrite": "Overwrite with my version",
+      "tasks.title": "My tasks",
+      "tasks.loading": "Loading your tasks",
+      "tasks.error": "Could not load your tasks: {message}",
+      "tasks.refresh": "Refresh",
+      "tasks.empty": "No tasks are assigned to you.",
+      "tasks.emptyFiltered": "No tasks match these filters.",
+      "tasks.pageEmpty": "There are no tasks on this page.",
+      "tasks.filterProject": "Project",
+      "tasks.filterStatus": "Status",
+      "tasks.allProjects": "All projects",
+      "tasks.allStatuses": "All statuses",
+      "tasks.optionCount": "{name} ({count})",
+      "tasks.projectGone": "Project #{id}",
+      "tasks.status.in_progress": "In progress",
+      "tasks.status.blocked": "Blocked",
+      "tasks.status.review": "In review",
+      "tasks.status.todo": "To do",
+      "tasks.status.backlog": "Backlog",
+      "tasks.status.done": "Done",
+      "tasks.priority.high": "High",
+      "tasks.priority.medium": "Medium",
+      "tasks.priority.low": "Low",
+      "tasks.priorityTag": "{priority} priority",
+      "tasks.due": "Due {date}",
+      "tasks.noDue": "No due date",
+      "tasks.groupCount": "{shown} of {total}",
+      "tasks.range": "{from}–{to} of {total}",
+      "tasks.pageOf": "Page {page} of {pages}",
+      "tasks.previous": "Previous",
+      "tasks.next": "Next",
+      "tasks.pager": "Task pages",
+      "tasks.untitled": "Task #{id}",
+      "tasks.refreshLabel": "Refresh my tasks",
     };
     const zh = {
       "panel.title": "Colco",
@@ -176,6 +232,8 @@ window.__ModuleLoader__.load({
       "setup.foldersHint": "Runner \u53ef\u4ee5\u5de5\u4f5c\u7684 git \u4ed3\u5e93\u76ee\u5f55\u3002",
       "setup.path": "\u6587\u4ef6\u5939\u8def\u5f84",
       "setup.addFolder": "\u6dfb\u52a0\u6587\u4ef6\u5939",
+      "setup.dsh": "\u8ba9\u5de5\u4f5c\u6d41\u6b65\u9aa4\u53ef\u4ee5\u4f7f\u7528 DSH",
+      "setup.dshHint": "\u5728\u89c4\u5219\u91cc\u52a0\u5165\u4e00\u4e2a DSH agent\u3002\u53ea\u6709\u89c4\u5219\u91cc\u660e\u786e\u6307\u5b9a\u5b83\u7684\u6b65\u9aa4\u624d\u4f1a\u7528\u5230\uff1b\u4ec5\u5b89\u88c5\u63d2\u4ef6\u4e0d\u4f1a\u9886\u53d6\u6216\u6539\u6d3e\u4efb\u52a1\u3002",
       "setup.ok": "git \u4ed3\u5e93\uff0corigin \u4e3a {origin}",
       "setup.unchecked": "\u5c1a\u672a\u68c0\u67e5\uff1b\u4fdd\u5b58\u540e\u4f1a\u68c0\u67e5\u3002",
       "setup.missingFolder": "\u6587\u4ef6\u5939\u4e0d\u5b58\u5728\u3002",
@@ -195,6 +253,60 @@ window.__ModuleLoader__.load({
       "setup.duplicateLabel": "\u6807\u7b7e {label} \u51fa\u73b0\u4e86\u4e24\u6b21\u3002",
       "setup.incomplete": "\u6bcf\u4e00\u884c\u6807\u7b7e\u90fd\u9700\u8981\u540c\u65f6\u9009\u62e9\u6807\u7b7e\u548c\u5de5\u4f5c\u6d41\u3002",
       "setup.notOnServer": "{label}\uff08\u670d\u52a1\u5668\u4e0a\u6ca1\u6709\uff09",
+      "panel.openDecision": "{count} \u4e2a\u5f85\u4f60\u51b3\u7b56",
+      "panel.openDecisions": "{count} \u4e2a\u5f85\u4f60\u51b3\u7b56",
+      "runner.editRulesFile": "\u7f16\u8f91 rules.json",
+      "file.title": "\u7f16\u8f91 rules.json",
+      "file.loading": "\u6b63\u5728\u52a0\u8f7d rules.json",
+      "file.loadFailed": "\u65e0\u6cd5\u52a0\u8f7d rules.json\uff1a{message}",
+      "file.path": "\u6587\u4ef6\uff1a{path}",
+      "file.missing": "\u8fd8\u6ca1\u6709 rules.json\uff1b\u4fdd\u5b58\u65f6\u4f1a\u521b\u5efa\u5b83\u3002",
+      "file.diskInvalid": "\u78c1\u76d8\u4e0a\u7684\u6587\u4ef6\u6709\u4ee5\u4e0b\u95ee\u9898\uff1a",
+      "file.label": "rules.json \u5185\u5bb9",
+      "file.hint": "\u4fdd\u5b58\u524d\u4f1a\u68c0\u67e5\u89c4\u5219\u5e76\u5907\u4efd\u539f\u6587\u4ef6\uff1b\u5982\u679c\u6587\u4ef6\u5728\u52a0\u8f7d\u540e\u88ab\u6539\u8fc7\uff0c\u4fdd\u5b58\u4f1a\u88ab\u62d2\u7edd\u3002",
+      "file.save": "\u4fdd\u5b58",
+      "file.saving": "\u6b63\u5728\u4fdd\u5b58",
+      "file.close": "\u5173\u95ed",
+      "file.saved": "\u5df2\u4fdd\u5b58 {path}",
+      "file.savedBackup": "\u5df2\u4fdd\u5b58 {path}\uff1b\u539f\u6587\u4ef6\u5728 {backup}",
+      "file.saveFailed": "\u89c4\u5219\u672a\u4fdd\u5b58\uff1a{message}",
+      "file.conflict": "rules.json \u5728\u6b64\u5bf9\u8bdd\u6846\u4e4b\u5916\u88ab\u6539\u8fc7\u3002\u8bf7\u5148\u67e5\u770b\u78c1\u76d8\u4e0a\u7684\u6587\u4ef6\uff0c\u518d\u9009\u62e9\u4fdd\u7559\u54ea\u4e2a\u7248\u672c\u3002",
+      "file.diskLabel": "\u78c1\u76d8\u4e0a\u7684\u5f53\u524d\u6587\u4ef6",
+      "file.useDisk": "\u4f7f\u7528\u78c1\u76d8\u4e0a\u7684\u6587\u4ef6",
+      "file.overwrite": "\u7528\u6211\u7684\u7248\u672c\u8986\u76d6",
+      "tasks.title": "\u6211\u7684\u4efb\u52a1",
+      "tasks.loading": "\u6b63\u5728\u52a0\u8f7d\u4f60\u7684\u4efb\u52a1",
+      "tasks.error": "\u65e0\u6cd5\u52a0\u8f7d\u4f60\u7684\u4efb\u52a1\uff1a{message}",
+      "tasks.refresh": "\u5237\u65b0",
+      "tasks.empty": "\u6ca1\u6709\u5206\u914d\u7ed9\u4f60\u7684\u4efb\u52a1\u3002",
+      "tasks.emptyFiltered": "\u6ca1\u6709\u7b26\u5408\u7b5b\u9009\u6761\u4ef6\u7684\u4efb\u52a1\u3002",
+      "tasks.pageEmpty": "\u8fd9\u4e00\u9875\u6ca1\u6709\u4efb\u52a1\u3002",
+      "tasks.filterProject": "\u9879\u76ee",
+      "tasks.filterStatus": "\u72b6\u6001",
+      "tasks.allProjects": "\u5168\u90e8\u9879\u76ee",
+      "tasks.allStatuses": "\u5168\u90e8\u72b6\u6001",
+      "tasks.optionCount": "{name}\uff08{count} \u4e2a\uff09",
+      "tasks.projectGone": "\u9879\u76ee #{id}",
+      "tasks.status.in_progress": "\u8fdb\u884c\u4e2d",
+      "tasks.status.blocked": "\u963b\u585e",
+      "tasks.status.review": "\u5f85\u9a8c\u6536",
+      "tasks.status.todo": "\u5f85\u529e",
+      "tasks.status.backlog": "\u5f85\u6574\u7406",
+      "tasks.status.done": "\u5df2\u5b8c\u6210",
+      "tasks.priority.high": "\u9ad8",
+      "tasks.priority.medium": "\u4e2d",
+      "tasks.priority.low": "\u4f4e",
+      "tasks.priorityTag": "{priority}\u4f18\u5148\u7ea7",
+      "tasks.due": "\u622a\u6b62 {date}",
+      "tasks.noDue": "\u65e0\u622a\u6b62\u65e5\u671f",
+      "tasks.groupCount": "\u672c\u9875 {shown} \u4e2a\uff0c\u5171 {total} \u4e2a",
+      "tasks.range": "\u7b2c {from}\u2013{to} \u4e2a\uff0c\u5171 {total} \u4e2a",
+      "tasks.pageOf": "\u7b2c {page} / {pages} \u9875",
+      "tasks.previous": "\u4e0a\u4e00\u9875",
+      "tasks.next": "\u4e0b\u4e00\u9875",
+      "tasks.pager": "\u4efb\u52a1\u5206\u9875",
+      "tasks.untitled": "\u4efb\u52a1 #{id}",
+      "tasks.refreshLabel": "\u5237\u65b0\u6211\u7684\u4efb\u52a1",
     };
 
     /**
@@ -327,6 +439,31 @@ window.__ModuleLoader__.load({
       return { rules: { ...(rules ?? {}), labels, folders } };
     }
 
+    /**
+     * Whether the rules define a DSH agent (an agent whose `use` is `dsh`).
+     * @param {Record<string, unknown> | null} rules - the rules object on disk.
+     */
+    function hasDshAgent(rules) {
+      const agents = rules && rules.agents && typeof rules.agents === "object" && !Array.isArray(rules.agents) ? Object.values(rules.agents) : [];
+      return agents.some((agent) => agent && typeof agent === "object" && agent.use === "dsh");
+    }
+
+    /**
+     * The rules with a DSH agent added (`on`) or every DSH agent removed. Nothing else changes: other agents, workflows
+     * and labels stay, a DSH agent that already exists keeps its settings, and a name already taken by another agent
+     * is never overwritten. A step that still names a removed agent is refused by the CLI's rules check on save.
+     * @param {Record<string, unknown> | null} rules - the rules object on disk, or null when there is none.
+     * @param {boolean} on - whether workflow steps may use DSH.
+     */
+    function withDshAgent(rules, on) {
+      const agents = rules && rules.agents && typeof rules.agents === "object" && !Array.isArray(rules.agents) ? rules.agents : {};
+      if (on === hasDshAgent(rules)) return rules ?? { agents: on ? { dsh: { use: "dsh", permissionMode: "workspace-write" } } : {} };
+      if (!on) return { ...rules, agents: Object.fromEntries(Object.entries(agents).filter(([, agent]) => !(agent && typeof agent === "object" && agent.use === "dsh"))) };
+      let name = "dsh";
+      for (let n = 2; Object.prototype.hasOwnProperty.call(agents, name); n += 1) name = `dsh-${n}`;
+      return { ...(rules ?? {}), agents: { ...agents, [name]: { use: "dsh", permissionMode: "workspace-write" } } };
+    }
+
     /** Page styles: DSH theme tokens with plain fallbacks, scoped to .c4d-page and .c4d and removed with the page. */
     const CSS = `
 .c4d-page{display:flex;flex-direction:column;flex:1;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;color:var(--dsw-alias-label-primary,#1f2328);background:var(--dsw-alias-bg-base,transparent)}
@@ -384,9 +521,9 @@ window.__ModuleLoader__.load({
 
     /**
      * The header: runner state, steps running now, and Start, Stop, Refresh and Edit rules.
-     * @param {{ t: Function, runner: object | null | undefined, loading: boolean, busy: string | undefined, actionError: string | undefined, setupOpen: boolean, onAction: (name: "start" | "stop") => void, onRefresh: () => void, onEditRules: () => void, updatedAt: number | undefined }} props
+     * @param {{ t: Function, runner: object | null | undefined, loading: boolean, busy: string | undefined, actionError: string | undefined, setupOpen: boolean, onAction: (name: "start" | "stop") => void, onRefresh: () => void, onEditRules: () => void, onEditRulesFile?: () => void, updatedAt: number | undefined }} props
      */
-    function RunnerHeader({ t, runner, loading, busy, actionError, setupOpen, onAction, onRefresh, onEditRules, updatedAt }) {
+    function RunnerHeader({ t, runner, loading, busy, actionError, setupOpen, onAction, onRefresh, onEditRules, onEditRulesFile, updatedAt }) {
       const display = runner ? runner.display : loading ? "loading" : "unknown";
       const running = display === "running";
       const steps = running && typeof runner.busy === "number"
@@ -406,7 +543,8 @@ window.__ModuleLoader__.load({
           h("button", { type: "button", className: "c4d-primary", disabled: busy !== undefined || running || display === "not_configured", "aria-busy": busy === "start", onClick: () => onAction("start"), title: t("runner.startHint") }, t("runner.start")),
           h("button", { type: "button", disabled: busy !== undefined || display === "not_configured", "aria-busy": busy === "stop", onClick: () => onAction("stop") }, t("runner.stop")),
           h("button", { type: "button", onClick: onRefresh }, t("runner.refresh")),
-          setupOpen ? null : h("button", { type: "button", onClick: onEditRules }, t("runner.editRules"))),
+          setupOpen ? null : h("button", { type: "button", onClick: onEditRules }, t("runner.editRules")),
+          onEditRulesFile ? h("button", { type: "button", "aria-haspopup": "dialog", onClick: onEditRulesFile }, t("runner.editRulesFile")) : null),
         h(ErrorLine, { message: actionError }),
         updatedAt ? h("p", { className: "c4d-muted" }, t("runner.updated", { time: new Date(updatedAt).toLocaleTimeString() })) : null);
     }
@@ -517,6 +655,7 @@ window.__ModuleLoader__.load({
     function SetupForm({ t, data, options, optionsError, notice, canClose, onSave, onClose }) {
       const [form, setForm] = useState(() => rulesToForm(data.rules));
       const [repos, setRepos] = useState({});
+      const [dsh, setDsh] = useState(() => hasDshAgent(data.rules));
       const [saving, setSaving] = useState(false);
       const [error, setError] = useState(undefined);
       const [errors, setErrors] = useState([]);
@@ -537,7 +676,7 @@ window.__ModuleLoader__.load({
         setError(undefined);
         setErrors([]);
         try {
-          await onSave(built.rules);
+          await onSave(withDshAgent(built.rules, dsh));
         } catch (failure) {
           setError(t("setup.saveFailed", { message: failure instanceof Error ? failure.message : String(failure) }));
           setErrors(failure instanceof ApiError ? failure.errors : []);
@@ -578,6 +717,10 @@ window.__ModuleLoader__.load({
           onRemove: () => setForm((prev) => ({ ...prev, folders: prev.folders.filter((_, at) => at !== index) })),
         }))),
         h("div", { className: "c4d-row" }, h("button", { type: "button", onClick: () => setForm((prev) => ({ ...prev, folders: [...prev.folders, { path: "" }] })) }, t("setup.addFolder"))),
+        h("label", { className: "c4d-row" },
+          h("input", { type: "checkbox", "data-colco4dsh-dsh": true, checked: dsh, onChange: (event) => setDsh(event.target.checked) }),
+          h("span", null, t("setup.dsh"))),
+        h("p", { className: "c4d-muted" }, t("setup.dshHint")),
         h(ErrorLine, { message: error }),
         errors.length ? h("ul", { className: "c4d-error" }, errors.map((line, index) => h("li", { key: index }, line))) : null,
         h("div", { className: "c4d-row" },
@@ -625,46 +768,299 @@ window.__ModuleLoader__.load({
       return h(SetupForm, { key: revision, t, data: loaded.data, options: loaded.options, optionsError: loaded.optionsError, notice, canClose, onSave: save, onClose });
     }
 
+    // ---- Edit rules.json dialog -------------------------------------------------------------------------------
+    // A native <dialog> over the raw ~/.colco/rules.json. It loads the text with its content hash, saves through the
+    // CLI's validation and backup, and sends the hash back: if the file changed in the meantime the save is refused and
+    // the dialog shows the file as it is now, so an outside edit is reviewed and never overwritten silently.
+    const { useRef } = React;
+
+    /** Dialog styles: capped by the viewport so the dialog fits narrow screens; the controls wrap. */
+    const DIALOG_CSS = `
+.c4d-dialog{box-sizing:border-box;width:min(760px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);margin:auto;padding:0;overflow:hidden;border:1px solid var(--dsw-alias-border-l2,#d0d7de);border-radius:var(--dsw-radius-md,12px);background:var(--dsw-alias-bg-layer-1,#fff);color:var(--dsw-alias-label-primary,#1f2328)}
+.c4d-dialog::backdrop{background:rgba(0,0,0,.4)}
+.c4d-dialog-body{display:flex;flex-direction:column;gap:10px;max-height:calc(100dvh - 26px);overflow:auto;padding:16px}
+.c4d-dialog textarea.c4d-file{min-height:min(320px,40dvh);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:18px;white-space:pre;overflow:auto}
+.c4d-dialog-actions{display:flex;flex-wrap:wrap;gap:8px}
+@media (max-width:767px){.c4d-dialog{width:calc(100vw - 16px);max-width:calc(100vw - 16px)}.c4d-dialog-body{padding:12px}.c4d-dialog-actions button{flex:1 1 140px}}
+`;
+
+    /** Read the raw rules.json text, its hash and its check result. */
+    function loadRulesFile() {
+      return call("rules/file");
+    }
+
     /**
-     * The whole tab: runner header, active runs, open decisions and Setup. Refreshes every POLL_MS while `visible`.
-     * `initialStatus` and `initialSetup` seed the first render (server rendering in tests performs no request).
-     * @param {{ t: Function, visible: boolean, initialStatus?: object, initialSetup?: { data: object, options: object } }} props
+     * Save the text. `baseHash` is the hash of the file as loaded (null when there was no file). A file that changed
+     * since then is not written: the result is `{ status: "conflict", current }` with the file as it is now. Invalid
+     * text and denied access throw an ApiError.
+     * @param {string} text
+     * @param {string | null} baseHash
      */
-    function ColcoPanel({ t, visible, initialStatus, initialSetup }) {
-      const [status, setStatus] = useState(initialStatus);
-      const [loadError, setLoadError] = useState(undefined);
-      const [updatedAt, setUpdatedAt] = useState(undefined);
-      const [busy, setBusy] = useState(undefined);
-      const [actionError, setActionError] = useState(undefined);
-      const [setupRequested, setSetupRequested] = useState(false);
-      const inFlight = useRef(undefined);
-      const refresh = useCallback(async () => {
-        if (inFlight.current) return inFlight.current.promise;
+    async function saveRulesFile(text, baseHash) {
+      try {
+        const reply = await call("rules/file", { method: "POST", body: { text, baseHash } });
+        return { status: "saved", path: reply.path, backup: reply.backup ?? null, hash: reply.hash ?? null };
+      } catch (failure) {
+        if (failure instanceof ApiError && failure.status === 409) return { status: "conflict", current: await loadRulesFile() };
+        throw failure;
+      }
+    }
+
+    /**
+     * The Edit rules.json dialog. `initial` seeds the state for tests; otherwise it loads the file when it opens.
+     * @param {{ t: Function, initial?: { file?: object, loadError?: string, draft?: string, error?: string, errors?: string[], conflict?: object, notice?: string }, onSaved: () => void, onClose: () => void }} props
+     */
+    function RulesFileDialog({ t, initial = {}, onSaved, onClose }) {
+      const ref = useRef(null);
+      const [file, setFile] = useState(initial.file);
+      const [loadError, setLoadError] = useState(initial.loadError);
+      const [draft, setDraft] = useState(initial.draft ?? initial.file?.text ?? "");
+      const [saving, setSaving] = useState(false);
+      const [error, setError] = useState(initial.error);
+      const [errors, setErrors] = useState(initial.errors ?? []);
+      const [conflict, setConflict] = useState(initial.conflict);
+      const [notice, setNotice] = useState(initial.notice);
+      const message = (failure) => (failure instanceof Error ? failure.message : String(failure));
+      // Open as a modal dialog: the browser traps focus, closes on Escape and restores focus to the button.
+      useEffect(() => {
+        const element = ref.current;
+        if (element && typeof element.showModal === "function" && !element.open) element.showModal();
+        return () => { if (element && element.open) element.close(); };
+      }, []);
+      useEffect(() => {
+        if (file || loadError) return undefined;
+        let live = true;
+        loadRulesFile().then((loaded) => {
+          if (!live) return;
+          setFile(loaded);
+          setDraft(loaded.text);
+        }, (failure) => { if (live) setLoadError(t("file.loadFailed", { message: message(failure) })); });
+        return () => { live = false; };
+      }, [file, loadError, t]);
+      /** Save the draft against the hash `base`; a conflict opens the review, an error stays in the dialog. */
+      const submit = async (base) => {
+        setSaving(true);
+        setError(undefined);
+        setErrors([]);
+        setNotice(undefined);
+        try {
+          const result = await saveRulesFile(draft, base);
+          if (result.status === "conflict") {
+            setConflict(result.current);
+            return;
+          }
+          setConflict(undefined);
+          let reloaded;
+          try {
+            reloaded = await loadRulesFile();
+          } catch {
+            reloaded = undefined;
+          }
+          setFile(reloaded ?? { ...file, exists: true, text: draft, hash: result.hash, valid: true, errors: [] });
+          if (reloaded) setDraft(reloaded.text);
+          setNotice(result.backup ? t("file.savedBackup", { path: result.path, backup: result.backup }) : t("file.saved", { path: result.path ?? "rules.json" }));
+          onSaved();
+        } catch (failure) {
+          setError(t("file.saveFailed", { message: message(failure) }));
+          setErrors(failure instanceof ApiError ? failure.errors : []);
+        } finally {
+          setSaving(false);
+        }
+      };
+      /** Drop the draft and take the file as it is now. */
+      const useDisk = () => {
+        setFile(conflict);
+        setDraft(conflict.text);
+        setConflict(undefined);
+      };
+      /** Save the draft over the file as it is now (its new hash), after the user has reviewed it. */
+      const overwrite = () => {
+        const current = conflict;
+        setFile(current);
+        setConflict(undefined);
+        void submit(current.hash ?? null);
+      };
+      const failed = Boolean(error) || errors.length > 0;
+      return h("dialog", { ref, className: "c4d-dialog", "aria-labelledby": "c4d-file-title", "data-colco4dsh-rules-file": true, onClose },
+        h("style", null, DIALOG_CSS),
+        h("div", { className: "c4d-dialog-body" },
+          h("h2", { id: "c4d-file-title" }, t("file.title")),
+          loadError ? h(ErrorLine, { message: loadError }) : null,
+          !file && !loadError ? h("p", { className: "c4d-muted", role: "status" }, t("file.loading")) : null,
+          file ? h(Fragment, null,
+            h("p", { className: "c4d-muted" }, t("file.path", { path: file.path ?? "rules.json" })),
+            !file.exists ? h("p", null, t("file.missing")) : null,
+            file.exists && !file.valid && file.errors.length ? h(Fragment, null, h("p", null, t("file.diskInvalid")), h("ul", { className: "c4d-error" }, file.errors.map((line, index) => h("li", { key: index }, line)))) : null,
+            notice ? h("p", { role: "status", className: "c4d-ok" }, notice) : null,
+            conflict ? h("div", { className: "c4d-section" },
+              h("p", { role: "alert", className: "c4d-error" }, t("file.conflict")),
+              h("label", { htmlFor: "c4d-file-disk", className: "c4d-muted" }, t("file.diskLabel")),
+              h("textarea", { id: "c4d-file-disk", className: "c4d-file", rows: 10, readOnly: true, spellCheck: false, value: conflict.text }),
+              conflict.exists && !conflict.valid && conflict.errors.length ? h("ul", { className: "c4d-error" }, conflict.errors.map((line, index) => h("li", { key: index }, line))) : null) : null,
+            h("label", { htmlFor: "c4d-file-text", className: "c4d-muted" }, t("file.label")),
+            h("textarea", {
+              id: "c4d-file-text", className: "c4d-file", rows: 14, spellCheck: false, value: draft, readOnly: Boolean(conflict) || saving,
+              "aria-invalid": failed ? "true" : undefined, "aria-describedby": failed ? "c4d-file-errors" : undefined,
+              onChange: (event) => setDraft(event.target.value),
+            }),
+            failed ? h("div", { id: "c4d-file-errors", role: "alert", className: "c4d-error" },
+              error ? h("p", null, error) : null,
+              errors.length ? h("ul", null, errors.map((line, index) => h("li", { key: index }, line))) : null) : null,
+            conflict ? null : h("p", { className: "c4d-muted" }, t("file.hint"))) : null,
+          h("div", { className: "c4d-dialog-actions" },
+            file && !conflict ? h("button", { type: "button", className: "c4d-primary", disabled: saving, "aria-busy": saving, onClick: () => void submit(file.hash ?? null) }, saving ? t("file.saving") : t("file.save")) : null,
+            conflict ? h("button", { type: "button", onClick: useDisk }, t("file.useDisk")) : null,
+            conflict ? h("button", { type: "button", className: "c4d-primary", disabled: saving, onClick: overwrite }, t("file.overwrite")) : null,
+            h("button", { type: "button", onClick: onClose }, t("file.close")))));
+    }
+
+    // ---- Shared status store (open-decision dot) -------------------------------------------------------------
+    // One store holds the last `GET status` read and one poller refreshes it, for the sidebar icon and the Colco page
+    // alike. It polls while at least one of them is mounted and DSH is visible, so the icon's dot follows the
+    // runner's decisions even when the page is closed.
+    const { useSyncExternalStore } = React;
+
+    /**
+     * Count the open decisions of a status reply. A reply whose decisions section failed counts as none.
+     * @param {object | undefined} status
+     */
+    function countOpen(status) {
+      if (!status || (status.errors && status.errors.decisions) || !Array.isArray(status.decisions)) return 0;
+      return status.decisions.filter((decision) => decision.state === undefined || decision.state === "open").length;
+    }
+
+    /**
+     * Build one status store.
+     * `snapshot.openCount` is the number behind the dot; it is 0 after a failed read, so a failure never shows a dot.
+     * @param {{ fetchStatus?: (signal: AbortSignal) => Promise<object>, initialStatus?: object, doc?: { visibilityState?: string, addEventListener: Function, removeEventListener: Function } | undefined, timers?: { setInterval: Function, clearInterval: Function }, pollMs?: number }} [options]
+     */
+    function createStatusStore({ fetchStatus = (signal) => call("status", { signal }), initialStatus, doc = globalThis.document, timers = globalThis, pollMs = POLL_MS } = {}) {
+      const listeners = new Set();
+      /** Ids answered here; a read that started earlier may still list them, so they are filtered out of every reply. */
+      const answeredIds = new Set();
+      let inFlight;
+      let timer;
+      let stopWatching;
+
+      /** The snapshot for one status, its last error and update time. */
+      const derive = (status, error, updatedAt) => ({ status, error, updatedAt, openCount: error ? 0 : countOpen(status) });
+      /** The status without the decisions answered here. */
+      const withoutAnswered = (status) => (status && Array.isArray(status.decisions) && answeredIds.size
+        ? { ...status, decisions: status.decisions.filter((decision) => !answeredIds.has(decision.id)) }
+        : status);
+      let snapshot = derive(initialStatus, undefined, undefined);
+      /** Replace the snapshot and tell every listener. */
+      const publish = (next) => {
+        snapshot = next;
+        for (const listener of [...listeners]) listener();
+      };
+
+      /** Read the status once; a read already in flight is shared. A failure keeps the old status and sets the error. */
+      const refresh = () => {
+        if (inFlight) return inFlight.promise;
         const controller = new AbortController();
-        const promise = call("status", { signal: controller.signal }).then((reply) => {
-          setStatus(reply);
-          setLoadError(undefined);
-          setUpdatedAt(Date.now());
+        let request;
+        try {
+          request = Promise.resolve(fetchStatus(controller.signal));
+        } catch (failure) {
+          request = Promise.reject(failure);
+        }
+        const promise = request.then((reply) => {
+          if (!controller.signal.aborted) publish(derive(withoutAnswered(reply), undefined, Date.now()));
         }, (failure) => {
-          if (!controller.signal.aborted) setLoadError(failure instanceof Error ? failure.message : String(failure));
+          if (!controller.signal.aborted) publish(derive(snapshot.status, failure instanceof Error ? failure.message : String(failure), snapshot.updatedAt));
         }).finally(() => {
-          if (inFlight.current?.controller === controller) inFlight.current = undefined;
+          if (inFlight && inFlight.controller === controller) inFlight = undefined;
         });
-        inFlight.current = { controller, promise };
+        inFlight = { controller, promise };
         return promise;
-      }, []);
-      useEffect(() => () => inFlight.current?.controller.abort(), []);
-      useEffect(() => {
-        if (!visible) return undefined;
-        const tick = () => { if (document.visibilityState !== "hidden") void refresh(); };
+      };
+
+      /** Start polling: one read now, then one per interval while the document is not hidden, and one on becoming visible. */
+      const start = () => {
+        const tick = () => { if (!doc || doc.visibilityState !== "hidden") void refresh(); };
         tick();
-        const timer = setInterval(tick, POLL_MS);
-        document.addEventListener("visibilitychange", tick);
-        return () => {
-          clearInterval(timer);
-          document.removeEventListener("visibilitychange", tick);
-        };
-      }, [visible, refresh]);
+        timer = timers.setInterval(tick, pollMs);
+        if (doc) doc.addEventListener("visibilitychange", tick);
+        stopWatching = () => { if (doc) doc.removeEventListener("visibilitychange", tick); };
+      };
+      /** Stop polling and abort a read in flight. */
+      const stop = () => {
+        timers.clearInterval(timer);
+        stopWatching?.();
+        if (inFlight) {
+          inFlight.controller.abort();
+          inFlight = undefined;
+        }
+      };
+
+      return {
+        /** @returns the current snapshot; the same object until something changes. */
+        getSnapshot: () => snapshot,
+        /** Listen for changes; the first listener starts the poller and the last one stops it. */
+        subscribe(listener) {
+          listeners.add(listener);
+          if (listeners.size === 1) start();
+          return () => {
+            listeners.delete(listener);
+            if (listeners.size === 0) stop();
+          };
+        },
+        refresh,
+        /** Take an answered decision out of the list at once, so its dot clears before the next read. */
+        answered(id) {
+          answeredIds.add(id);
+          if (snapshot.status) publish(derive(withoutAnswered(snapshot.status), snapshot.error, snapshot.updatedAt));
+        },
+      };
+    }
+
+    /** The store the sidebar icon and the page share; created on first use, idle until something subscribes. */
+    let sharedStore;
+    /** The shared store. */
+    function sharedStatusStore() {
+      sharedStore ??= createStatusStore();
+      return sharedStore;
+    }
+
+    /**
+     * Follow a store from a component.
+     * @param {ReturnType<typeof createStatusStore>} store
+     */
+    function useStatusSnapshot(store) {
+      return useSyncExternalStore(store.subscribe, store.getSnapshot, store.getSnapshot);
+    }
+
+    /**
+     * Send an answer, clear the decision's dot at once, then refresh. A failed answer throws and leaves the dot.
+     * @param {ReturnType<typeof createStatusStore>} store
+     * @param {number} id - decision id.
+     * @param {number} index - chosen option.
+     * @param {string | undefined} text - optional note.
+     */
+    async function submitAnswer(store, id, index, text) {
+      await call("answer", { method: "POST", body: text === undefined ? { id, index } : { id, index, text } });
+      store.answered(id);
+      await store.refresh();
+    }
+
+    /**
+     * The whole tab: runner header, active runs, open decisions and Setup. It reads the shared status store,
+     * which refreshes every POLL_MS while DSH is visible. `initialStatus` seeds a private store and `initialSetup` seeds
+     * Setup (server rendering in tests performs no request); `store` passes a store in.
+     * @param {{ t: Function, initialStatus?: object, initialSetup?: { data: object, options: object }, store?: object }} props
+     */
+    function ColcoPanel({ t, initialStatus, initialSetup, store: given }) {
+      const [store] = useState(() => given ?? (initialStatus ? createStatusStore({ initialStatus }) : sharedStatusStore()));
+      const { status, error: loadError, updatedAt } = useStatusSnapshot(store);
+      const [busy, setBusy] = useState(undefined);
+      const [actionError, setActionError] = useState(undefined);
+      const [setupRequested, setSetupRequested] = useState(false);
+      const [fileOpen, setFileOpen] = useState(false);
+      const [rulesVersion, setRulesVersion] = useState(0);
+      const refresh = store.refresh;
+      // Subscribing (above) starts the shared poller; this read makes a page opened later show fresh data at once.
+      useEffect(() => { void refresh(); }, [refresh]);
       /** Run Start or Stop, then refresh; a failure shows under the buttons. */
       const act = async (name) => {
         setBusy(name);
@@ -679,10 +1075,7 @@ window.__ModuleLoader__.load({
         await refresh();
       };
       /** Answer a decision, then refresh; the card shows a failure itself. */
-      const answer = async (id, index, text) => {
-        await call("answer", { method: "POST", body: text === undefined ? { id, index } : { id, index, text } });
-        await refresh();
-      };
+      const answer = (id, index, text) => submitAnswer(store, id, index, text);
       const runner = status?.runner ?? null;
       const needsSetup = runner !== null && (runner.display === "not_configured" || runner.display === "rules_error");
       const setupOpen = needsSetup || setupRequested;
@@ -690,29 +1083,201 @@ window.__ModuleLoader__.load({
       const now = Date.now();
       return h("div", { className: "c4d", "data-colco4dsh-panel": runner?.display ?? "loading" },
         h("style", null, CSS),
-        h(RunnerHeader, { t, runner, loading: status === undefined && !loadError, busy, actionError, setupOpen, onAction: act, onRefresh: () => void refresh(), onEditRules: () => setSetupRequested(true), updatedAt }),
+        h(RunnerHeader, { t, runner, loading: status === undefined && !loadError, busy, actionError, setupOpen, onAction: act, onRefresh: () => void refresh(), onEditRules: () => setSetupRequested(true), onEditRulesFile: () => setFileOpen(true), updatedAt }),
         h(ErrorLine, { message: loadError }),
         ["runner", "runs", "decisions"].map((section) => (errors[section] ? h(ErrorLine, { key: section, message: t("error.section", { section: t(`section.${section}`), message: errors[section] }) }) : null)),
-        setupOpen ? h(SetupPanel, { t, initial: initialSetup, canClose: !needsSetup, onSaved: () => void refresh(), onClose: () => setSetupRequested(false) }) : null,
+        setupOpen ? h(SetupPanel, { key: rulesVersion, t, initial: initialSetup, canClose: !needsSetup, onSaved: () => void refresh(), onClose: () => setSetupRequested(false) }) : null,
+        fileOpen ? h(RulesFileDialog, { t, onSaved: () => { setRulesVersion((value) => value + 1); void refresh(); }, onClose: () => setFileOpen(false) }) : null,
         h("section", { className: "c4d-section", "aria-label": t("runs.title") },
           h("h2", null, t("runs.title")),
           status && status.runs.length ? h("ul", null, status.runs.map((run) => h(RunCard, { key: run.id, t, run, now }))) : h("p", { className: "c4d-muted" }, status ? t("runs.empty") : t("state.loading"))),
         h("section", { className: "c4d-section", "aria-label": t("decisions.title") },
           h("h2", null, t("decisions.title")),
-          status && status.decisions.length ? h("ul", null, status.decisions.map((decision) => h(DecisionCard, { key: decision.id, t, decision, onAnswer: answer }))) : h("p", { className: "c4d-muted" }, status ? t("decisions.empty") : t("state.loading"))));
+          status && status.decisions.length ? h("ul", null, status.decisions.map((decision) => h(DecisionCard, { key: decision.id, t, decision, onAnswer: answer }))) : h("p", { className: "c4d-muted" }, status ? t("decisions.empty") : t("state.loading"))),
+        h(MyTasksBoard, { t }));
+    }
+
+    // ---- My tasks board -------------------------------------------------------------------------------------
+    // The tasks assigned to the signed-in user, read only, grouped by status and paged by the server (GET tasks).
+    // Task changes continue in Colco: every title links there and nothing on the board writes.
+
+    /** How often the board reloads while the page is open. Slower than the status poll, because tasks change in Colco. */
+    const BOARD_POLL_MS = 60000;
+    /** The statuses of a task in the order the server lists them: work in flight first, done last. */
+    const BOARD_STATUSES = ["in_progress", "blocked", "review", "todo", "backlog", "done"];
+
+    /** Board styles: wrapping and clamping so long titles and narrow windows cannot push the page sideways. No angle brackets or quotes, because React escapes them inside style text. */
+    const BOARD_CSS = `
+.c4d-board{min-width:0}
+.c4d-board-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
+.c4d-board-bar select{flex:1 1 180px;max-width:100%;min-width:0;text-overflow:ellipsis}
+.c4d-board-group{display:flex;flex-direction:column;gap:8px;min-width:0}
+.c4d-board-head{flex-wrap:nowrap}
+.c4d-task{min-width:0;gap:4px}
+.c4d-task-title{overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
+.c4d-task-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0}
+.c4d-task-meta .c4d-tag{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.c4d-board-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
+@media (max-width:480px){.c4d-board-bar select{flex-basis:100%}.c4d-board-pager{justify-content:center}}
+`;
+
+    /**
+     * The route path for a board query: only the filters that are set and a page after the first.
+     * @param {{ page: number, project?: number, status?: string }} query
+     */
+    function boardPath(query) {
+      const params = [];
+      if (query.project !== undefined) params.push(`project=${query.project}`);
+      if (query.status !== undefined) params.push(`status=${encodeURIComponent(query.status)}`);
+      if (query.page > 1) params.push(`page=${query.page}`);
+      return params.length ? `tasks?${params.join("&")}` : "tasks";
+    }
+
+    /**
+     * The query after one change from the board. A new project or status goes back to page 1, because the old page
+     * number means nothing for another set of tasks; an empty value clears that filter; a bad page becomes 1.
+     * @param {{ page: number, project?: number, status?: string }} query - the current query.
+     * @param {{ project?: string, status?: string, page?: number | string }} change - one change from a select or the pager.
+     */
+    function changeBoardQuery(query, change) {
+      const next = { ...query };
+      if ("project" in change) {
+        const id = Number(change.project);
+        next.project = change.project !== "" && Number.isSafeInteger(id) && id >= 1 ? id : undefined;
+        next.page = 1;
+      }
+      if ("status" in change) {
+        next.status = BOARD_STATUSES.includes(change.status) ? change.status : undefined;
+        next.page = 1;
+      }
+      if ("page" in change) {
+        const page = Number(change.page);
+        next.page = Number.isSafeInteger(page) && page >= 1 ? page : 1;
+      }
+      return next;
+    }
+
+    /**
+     * One task: its title (a link into Colco when the link is http or https), then project, priority and due date.
+     * The title is clamped to two lines by CSS and kept whole in the title attribute.
+     * @param {{ t: Function, task: object }} props
+     */
+    function TaskRow({ t, task }) {
+      const title = task.title || t("tasks.untitled", { id: task.id });
+      const linked = typeof task.link === "string" && /^https?:\/\//i.test(task.link);
+      return h("li", { className: "c4d-card c4d-task", "data-colco4dsh-task": task.id, "data-status": task.status },
+        h("p", { className: "c4d-task-title", title }, linked ? h("a", { href: task.link, target: "_blank", rel: "noopener noreferrer" }, title) : title),
+        h("div", { className: "c4d-task-meta" },
+          task.projectName ? h("span", { className: "c4d-tag", title: task.projectName }, task.projectName) : null,
+          task.priority ? h("span", { className: "c4d-tag", "data-priority": task.priority, "data-tone": task.priority === "high" ? "warn" : undefined }, t("tasks.priorityTag", { priority: t(`tasks.priority.${task.priority}`) })) : null,
+          h("span", { className: "c4d-muted" }, task.dueDate ? t("tasks.due", { date: task.dueDate }) : t("tasks.noDue"))));
+    }
+
+    /**
+     * The tasks of one status on this page. The heading count is the status's total across pages; a group that
+     * continues on another page says how many of its tasks are shown here.
+     * @param {{ t: Function, status: string, tasks: object[], total: number }} props
+     */
+    function TaskGroup({ t, status, tasks, total }) {
+      const count = Math.max(total, tasks.length);
+      return h("section", { className: "c4d-board-group", "aria-label": t(`tasks.status.${status}`), "data-colco4dsh-group": status },
+        h("div", { className: "c4d-row c4d-board-head" },
+          h("h3", null, t(`tasks.status.${status}`)),
+          h("span", { className: "c4d-tag" }, tasks.length < count ? t("tasks.groupCount", { shown: tasks.length, total: count }) : String(count))),
+        h("ul", null, tasks.map((task) => h(TaskRow, { key: task.id, t, task }))));
+    }
+
+    /**
+     * The board for one reply of GET tasks: Refresh, the project and status filters, the status groups and the pager.
+     * `reply` is undefined until the first load; a failed refresh keeps the last reply under the alert.
+     * @param {{ t: Function, query: { page: number, project?: number, status?: string }, reply: object | undefined, loading: boolean, error: string | undefined, onQuery: (change: object) => void, onRefresh: () => void }} props
+     */
+    function TaskBoard({ t, query, reply, loading, error, onQuery, onRefresh }) {
+      const filtered = query.project !== undefined || query.status !== undefined;
+      const byStatus = new Map();
+      if (reply) for (const task of reply.tasks) byStatus.set(task.status, [...byStatus.get(task.status) ?? [], task]);
+      const projectKnown = !reply || query.project === undefined || reply.projects.some((project) => project.id === query.project);
+      const showFilters = reply && (reply.total > 0 || filtered);
+      const first = reply ? (reply.page - 1) * reply.pageSize + 1 : 1;
+      return h("section", { className: "c4d-section c4d-board", "aria-label": t("tasks.title"), "aria-busy": loading, "data-colco4dsh-board": reply ? "ready" : error ? "error" : "loading" },
+        h("style", null, BOARD_CSS),
+        h("div", { className: "c4d-row" },
+          h("h2", null, t("tasks.title")),
+          h("button", { type: "button", "aria-label": t("tasks.refreshLabel"), disabled: loading, onClick: onRefresh }, t("tasks.refresh"))),
+        error ? h(ErrorLine, { message: t("tasks.error", { message: error }) }) : null,
+        !reply && !error ? h("p", { className: "c4d-muted" }, t("tasks.loading")) : null,
+        showFilters ? h("div", { className: "c4d-board-bar" },
+          h("select", { "aria-label": t("tasks.filterProject"), value: query.project === undefined ? "" : String(query.project), onChange: (event) => onQuery({ project: event.target.value }) },
+            h("option", { value: "" }, t("tasks.allProjects")),
+            reply.projects.map((project) => h("option", { key: project.id, value: String(project.id) }, t("tasks.optionCount", { name: project.name, count: project.count }))),
+            projectKnown ? null : h("option", { value: String(query.project) }, t("tasks.projectGone", { id: query.project }))),
+          h("select", { "aria-label": t("tasks.filterStatus"), value: query.status ?? "", onChange: (event) => onQuery({ status: event.target.value }) },
+            h("option", { value: "" }, t("tasks.allStatuses")),
+            reply.counts.map((entry) => h("option", { key: entry.status, value: entry.status }, t("tasks.optionCount", { name: t(`tasks.status.${entry.status}`), count: entry.count }))))) : null,
+        reply && reply.total === 0 ? h("p", { className: "c4d-muted" }, filtered ? t("tasks.emptyFiltered") : t("tasks.empty")) : null,
+        reply && reply.total > 0 && reply.tasks.length === 0 ? h("p", { className: "c4d-muted" }, t("tasks.pageEmpty")) : null,
+        reply ? reply.counts.map((entry) => (byStatus.has(entry.status) ? h(TaskGroup, { key: entry.status, t, status: entry.status, tasks: byStatus.get(entry.status), total: entry.count }) : null)) : null,
+        reply && (reply.pages > 1 || reply.page > 1) ? h("nav", { className: "c4d-board-pager", "aria-label": t("tasks.pager") },
+          h("button", { type: "button", disabled: reply.page <= 1, onClick: () => onQuery({ page: Math.min(reply.page - 1, reply.pages) }) }, t("tasks.previous")),
+          h("span", null, t("tasks.pageOf", { page: reply.page, pages: reply.pages })),
+          reply.tasks.length ? h("span", { className: "c4d-muted" }, t("tasks.range", { from: first, to: first + reply.tasks.length - 1, total: reply.total })) : null,
+          h("button", { type: "button", disabled: reply.page >= reply.pages, onClick: () => onQuery({ page: reply.page + 1 }) }, t("tasks.next"))) : null);
     }
 
+    /**
+     * The board with its data: loads GET tasks for the current filters and page, reloads every BOARD_POLL_MS while
+     * the page is visible, and steps back to the last page when the current one has emptied (tasks finished meanwhile).
+     * `initial` seeds the first render (server rendering in tests performs no request).
+     * @param {{ t: Function, initial?: { reply: object } }} props
+     */
+    function MyTasksBoard({ t, initial }) {
+      const [query, setQuery] = useState({ page: 1 });
+      const [reply, setReply] = useState(initial ? initial.reply : undefined);
+      const [error, setError] = useState(undefined);
+      const [loading, setLoading] = useState(!initial);
+      const [revision, setRevision] = useState(0);
+      useEffect(() => {
+        const controller = new AbortController();
+        setLoading(true);
+        call(boardPath(query), { signal: controller.signal }).then((next) => {
+          if (controller.signal.aborted) return;
+          setReply(next);
+          setError(undefined);
+          setLoading(false);
+          if (next.tasks.length === 0 && next.total > 0 && query.page > next.pages) setQuery((current) => changeBoardQuery(current, { page: next.pages }));
+        }, (failure) => {
+          if (controller.signal.aborted) return;
+          setError(failure instanceof Error ? failure.message : String(failure));
+          setLoading(false);
+        });
+        return () => controller.abort();
+      }, [query, revision]);
+      useEffect(() => {
+        const timer = setInterval(() => { if (document.visibilityState !== "hidden") setRevision((value) => value + 1); }, BOARD_POLL_MS);
+        return () => clearInterval(timer);
+      }, []);
+      return h(TaskBoard, { t, query, reply, loading, error, onQuery: (change) => setQuery((current) => changeBoardQuery(current, change)), onRefresh: () => setRevision((value) => value + 1) });
+    }
+
+    /** What the board adds to the factory's exports, for the tests. */
+    const BOARD_EXPORTS = { TaskBoard, MyTasksBoard, changeBoardQuery, boardPath };
+
     /** English copy for hosts without DSH's locale service (tests, other hosts). */
     const fallbackT = translator(en);
 
     /**
-     * Glyph of the left-sidebar row. Decorative: the sidebar owns the button, its label and the selected state.
-     * @param {{ size: number, active?: boolean }} props - the edge the sidebar asks for.
+     * Glyph of the left-sidebar row. The sidebar owns the button, its label and the selected state. The glyph is
+     * decorative, except that a red dot inside its 24 by 24 box, with an accessible count, marks open decisions.
+     * It follows the shared status store, so it updates while the Colco page is closed.
+     * @param {{ size: number, active?: boolean, t?: Function, store?: object }} props - the edge the sidebar asks for; `t` and `store` are for tests and hosts.
      */
-    function ColcoPanelIcon({ size }) {
-      return h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.7, strokeLinecap: "round", "aria-hidden": "true", focusable: "false" },
+    function ColcoPanelIcon({ size, t, store }) {
+      const { openCount } = useStatusSnapshot(store ?? sharedStatusStore());
+      const label = openCount > 0 ? (t ?? fallbackT)(openCount === 1 ? "panel.openDecision" : "panel.openDecisions", { count: openCount }) : undefined;
+      return h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.7, strokeLinecap: "round", ...label ? { role: "img", "aria-label": label } : { "aria-hidden": "true" }, focusable: "false" },
         h("path", { d: "M16.6 7.4a6.5 6.5 0 1 0 0 9.2" }),
-        h("circle", { cx: 18.4, cy: 12, r: 1.7, fill: "currentColor", stroke: "none" }));
+        h("circle", { cx: 18.4, cy: 12, r: 1.7, fill: "currentColor", stroke: "none" }),
+        openCount > 0 ? h("circle", { cx: 19.5, cy: 4.5, r: 3, stroke: "none", "data-colco4dsh-dot": "true", style: { fill: "var(--dsw-alias-state-error-primary,#cf222e)" } }) : null);
     }
 
     /**
@@ -750,6 +1315,6 @@ window.__ModuleLoader__.load({
       )), "colco4dsh: sidebar row");
     }
 
-    return { inject: ["slots", "locale"], apply, ColcoPage, ColcoPanel, ColcoPanelIcon, SetupForm, translator, call, ApiError, dictionaries: { en, zh }, shellQuote, fixCommand, rulesToForm, formToRules, formatDuration, API, ACTION_HEADER, PANEL_ID, NS };
+    return { inject: ["slots", "locale"], apply, createStatusStore, submitAnswer, loadRulesFile, saveRulesFile, RulesFileDialog, ColcoPage, ColcoPanel, ColcoPanelIcon, SetupForm, translator, call, ApiError, dictionaries: { en, zh }, shellQuote, fixCommand, rulesToForm, formToRules, hasDshAgent, withDshAgent, formatDuration, API, ACTION_HEADER, PANEL_ID, NS, ...BOARD_EXPORTS };
   },
 });

package/lib/cli.mjs

@@ -15,7 +15,7 @@ const MAX_BUFFER = 4 * 1024 * 1024;
  * The first @evanbobo/colco release with the runner commands and their `--json` output that this plugin calls.
  * The plugin and the CLI have separate version lines, so this is the only place that ties them together.
  */
-export const MIN_COLCO_VERSION = "0.22.0";
+export const MIN_COLCO_VERSION = "0.23.0";
 
 /**
  * How a colco CLI from before the runner commands answers them: it rejects the command or the --json option.

package/lib/routes.mjs

@@ -6,6 +6,7 @@ import { ColcoCliError, runColco } from "./cli.mjs";
 import { decisionCards, runCards, runnerHeader, stringList } from "./dashboard.mjs";
 import { LIMITS, compactDecision, field } from "./format.mjs";
 import { answerArgs } from "./plugin.mjs";
+import { boardArgs, boardReply, parseBoardQuery } from "./tasks.mjs";
 
 /** Path prefix of every route. DSH serves plugin bundles under `/plugins`; this longer prefix wins over it. */
 export const ROUTE_PREFIX = "/plugins/colco4dsh/api";
@@ -272,6 +273,61 @@ async function saveRules(colco, rules) {
   }
 }
 
+/** Largest rules.json text, in bytes, that the "Edit rules.json" dialog reads or saves; it keeps the JSON body under MAX_BODY_BYTES. */
+export const MAX_RULES_TEXT_BYTES = 48 * 1024;
+
+/** A content hash as `colco runner rules get` prints it: 64 lower-case hex digits. */
+const HASH_PATTERN = /^[0-9a-f]{64}$/;
+
+/**
+ * The reply of `GET rules/file`: the raw rules.json text and its content hash from `colco runner rules get`.
+ * A hash that is not 64 hex digits is dropped (null), and a file over MAX_RULES_TEXT_BYTES is refused instead of cut.
+ * @param {Record<string, unknown>} body - `colco runner rules get --json`.
+ */
+function rulesFileReply(body) {
+  const text = typeof body.text === "string" ? body.text : "";
+  if (Buffer.byteLength(text) > MAX_RULES_TEXT_BYTES) throw new RouteError(413, `rules.json is larger than ${MAX_RULES_TEXT_BYTES} bytes; edit it in an editor`);
+  return {
+    path: typeof body.path === "string" ? body.path : undefined,
+    exists: body.exists === true,
+    text,
+    hash: typeof body.hash === "string" && HASH_PATTERN.test(body.hash) ? body.hash : null,
+    valid: body.valid === true,
+    errors: stringList(body.errors, LIMITS.warning),
+  };
+}
+
+/**
+ * Save the dialog's rules.json text through `colco runner rules set --raw --expect-hash`. The text travels on stdin
+ * only. `baseHash` (the hash the dialog loaded, or null for "there was no file") is required, so a save cannot skip
+ * the conflict check. Invalid text becomes 422 with colco's errors, and a file changed elsewhere becomes 409.
+ * @param {(args: string[], extra?: { stdin?: string }) => Promise<Record<string, unknown>>} colco
+ * @param {unknown} input - the request body `{ text, baseHash }`.
+ */
+async function saveRulesFile(colco, input) {
+  if (!isObject(input)) throw new RouteError(400, "send { text, baseHash } as a JSON object");
+  const { text, baseHash } = input;
+  if (typeof text !== "string" || !text.trim()) throw new RouteError(400, "text must be the rules.json content");
+  if (Buffer.byteLength(text) > MAX_RULES_TEXT_BYTES) throw new RouteError(400, `text must be at most ${MAX_RULES_TEXT_BYTES} bytes`);
+  if (!("baseHash" in input) || !(baseHash === null || (typeof baseHash === "string" && HASH_PATTERN.test(baseHash)))) {
+    throw new RouteError(400, "baseHash must be the hash of the file you loaded (64 hex digits), or null when there was no file");
+  }
+  try {
+    const body = await colco(["runner", "rules", "set", "--json", "--raw", "--expect-hash", baseHash ?? "none"], { stdin: text });
+    return { ok: true, path: typeof body.path === "string" ? body.path : undefined, backup: typeof body.backup === "string" ? body.backup : null, hash: typeof body.hash === "string" && HASH_PATTERN.test(body.hash) ? body.hash : null };
+  } catch (error) {
+    const failure = error instanceof ColcoCliError ? error.body : undefined;
+    const code = isObject(failure?.error) ? failure.error.code : undefined;
+    const message = isObject(failure?.error) && typeof failure.error.message === "string" ? failure.error.message.slice(0, LIMITS.text) : undefined;
+    if (code === "invalid_rules") throw new RouteError(422, message ?? "the rules are invalid", { errors: stringList(failure.errors, LIMITS.warning) });
+    if (code === "conflict") {
+      const hash = isObject(failure.current) ? failure.current.hash : undefined;
+      throw new RouteError(409, message ?? "rules.json changed since it was loaded", { conflict: true, currentHash: typeof hash === "string" && HASH_PATTERN.test(hash) ? hash : null });
+    }
+    throw error;
+  }
+}
+
 /**
  * Answer one open decision with the option the user clicked.
  * @param {(args: string[]) => Promise<Record<string, unknown>>} colco
@@ -319,6 +375,19 @@ async function stop(colco) {
   return { ok: true, stopped: body.stopped === true };
 }
 
+/**
+ * The reply of `GET tasks`: one page of the tasks assigned to the signed-in user, from `colco tasks --json`. The
+ * query is checked first and nothing but a project id, a status and a page reaches the command; whose tasks they
+ * are is decided by the API key colco holds, never by the request.
+ * @param {(args: string[]) => Promise<Record<string, unknown>>} colco
+ * @param {URLSearchParams} search - the request's query string.
+ */
+async function myTasks(colco, search) {
+  const query = parseBoardQuery(search);
+  if (!query.ok) throw new RouteError(400, query.error);
+  return boardReply(await colco(boardArgs(query.value)));
+}
+
 /**
  * A short message for any thrown value.
  * @param {unknown} error
@@ -370,10 +439,12 @@ export function createRouteHandler(services) {
     return pendingStatus;
   };
 
-  /** name → method → handler; POST handlers receive the parsed body. */
+  /** name → method → handler; POST handlers receive the parsed body, every handler the request's query string. */
   const table = {
     "/status": { GET: () => sharedStatus() },
+    "/tasks": { GET: (_body, search) => myTasks(colco, search) },
     "/rules": { GET: () => colco(["runner", "rules", "--json"]).then(rulesReply), POST: (body) => saveRules(colco, body) },
+    "/rules/file": { GET: () => colco(["runner", "rules", "get", "--json"]).then(rulesFileReply), POST: (body) => saveRulesFile(colco, body) },
     "/options": { GET: () => colco(["runner", "options", "--json"]).then(optionsReply) },
     "/answer": { POST: (body) => answer(colco, body) },
     "/start": { POST: () => start(colco) },
@@ -383,7 +454,8 @@ export function createRouteHandler(services) {
   return async function handle(req, res) {
     let close = false;
     try {
-      const pathname = new URL(req.url ?? "/", "http://colco4dsh.invalid").pathname;
+      const url = new URL(req.url ?? "/", "http://colco4dsh.invalid");
+      const pathname = url.pathname;
       const route = table[pathname.slice(ROUTE_PREFIX.length)];
       admit(req, services);
       if (!route) throw new RouteError(404, "no such colco4dsh route");
@@ -403,7 +475,7 @@ export function createRouteHandler(services) {
           throw error;
         }
       }
-      reply(req, res, 200, await handler(body));
+      reply(req, res, 200, await handler(body, url.searchParams));
     } catch (error) {
       const code = statusOf(error);
       if (code === 500) services.logger?.warn("colco4dsh: route failed", error);

package/lib/tasks.mjs

@@ -0,0 +1,158 @@
+// The My Tasks board's side of the plugin: what the browser may ask for, the colco command that asks it, and how
+// colco's reply is shaped before the page sees it. Pure functions, so the route stays a thin wrapper and every rule
+// here is testable without a process or a socket.
+import { field } from "./format.mjs";
+import { safeLink } from "./dashboard.mjs";
+
+/** Tasks per page. The plugin sets it; the browser cannot. */
+export const BOARD_PAGE_SIZE = 25;
+
+/** Highest page the board asks for; the same cap the Colco server enforces. */
+export const MAX_BOARD_PAGE = 10000;
+
+/** Longest task title and project name kept; the server allows 200 and 80 characters. */
+const TITLE_MAX = 200;
+const PROJECT_NAME_MAX = 80;
+
+/** Most project choices kept for the filter. */
+const PROJECT_CHOICES_MAX = 200;
+
+/** The statuses of a task in board order, as the Colco server lists them: work in flight first, done last. */
+export const BOARD_STATUSES = ["in_progress", "blocked", "review", "todo", "backlog", "done"];
+
+/** Task priorities Colco knows. */
+const PRIORITIES = new Set(["high", "medium", "low"]);
+
+/** The only query keys the route accepts. */
+const QUERY_KEYS = new Set(["project", "status", "page"]);
+
+/**
+ * Parse the query of `GET tasks`. Only a project id, one of the six statuses and a page number pass, written as plain
+ * digits or exact words, each at most once. Anything else, including a key that could name a person, is refused, so
+ * nothing the browser sends can reach the colco command as an option or as free text.
+ * @param {URLSearchParams} search
+ * @returns {{ ok: true, value: { project?: number, status?: string, page: number } } | { ok: false, error: string }}
+ */
+export function parseBoardQuery(search) {
+  for (const key of new Set(search.keys())) {
+    if (!QUERY_KEYS.has(key)) return { ok: false, error: `unknown query parameter: ${key.slice(0, 40)}` };
+    if (search.getAll(key).length > 1) return { ok: false, error: `${key} may be given only once` };
+  }
+  const value = { page: 1 };
+  if (search.has("project")) {
+    const project = search.get("project");
+    if (!/^[1-9]\d{0,14}$/.test(project)) return { ok: false, error: "project must be a project id: digits, starting at 1" };
+    value.project = Number(project);
+  }
+  if (search.has("status")) {
+    const status = search.get("status");
+    if (!BOARD_STATUSES.includes(status)) return { ok: false, error: `status must be one of ${BOARD_STATUSES.join(", ")}` };
+    value.status = status;
+  }
+  if (search.has("page")) {
+    const page = search.get("page");
+    if (!/^[1-9]\d{0,4}$/.test(page) || Number(page) > MAX_BOARD_PAGE) return { ok: false, error: `page must be a number from 1 to ${MAX_BOARD_PAGE}` };
+    value.page = Number(page);
+  }
+  return { ok: true, value };
+}
+
+/**
+ * The colco arguments for a parsed query. Each value becomes its own argv element; the page size is the plugin's.
+ * @param {{ project?: number, status?: string, page?: number }} query - the value from parseBoardQuery.
+ */
+export function boardArgs(query) {
+  return [
+    "tasks", "--json",
+    ...query.project !== undefined ? ["--project-id", String(query.project)] : [],
+    ...query.status !== undefined ? ["--status", query.status] : [],
+    "--page", String(query.page ?? 1),
+    "--page-size", String(BOARD_PAGE_SIZE),
+  ];
+}
+
+/**
+ * A string cut to `max` characters, or undefined when the value is not a non-empty string.
+ * @param {unknown} value
+ * @param {number} max
+ */
+function text(value, max) {
+  return typeof value === "string" && value ? value.slice(0, max) : undefined;
+}
+
+/**
+ * A positive safe integer, or undefined.
+ * @param {unknown} value
+ */
+function positive(value) {
+  return Number.isSafeInteger(value) && value >= 1 ? value : undefined;
+}
+
+/**
+ * A non-negative safe integer, or the fallback.
+ * @param {unknown} value
+ * @param {number} fallback
+ */
+function count(value, fallback = 0) {
+  return Number.isSafeInteger(value) && value >= 0 ? value : fallback;
+}
+
+/**
+ * One task for the board, or undefined when it lacks a usable id or status. Only these fields are kept, so a
+ * description or assignee a future server adds never reaches the browser; the link must be an http(s) URL.
+ * @param {Record<string, unknown>} raw - one entry of `tasks` from `colco tasks --json`.
+ */
+function boardTask(raw) {
+  const id = positive(raw.id);
+  if (id === undefined || !BOARD_STATUSES.includes(raw.status)) return undefined;
+  return {
+    id,
+    projectId: positive(raw.projectId),
+    projectName: text(raw.projectName, PROJECT_NAME_MAX),
+    title: text(raw.title, TITLE_MAX),
+    status: raw.status,
+    priority: PRIORITIES.has(raw.priority) ? raw.priority : undefined,
+    dueDate: typeof raw.dueDate === "string" && /^\d{4}-\d{2}-\d{2}$/.test(raw.dueDate) ? raw.dueDate : null,
+    updatedAt: text(raw.updatedAt, 40),
+    link: safeLink(raw.link),
+  };
+}
+
+/**
+ * The reply of `GET tasks`: the page of tasks, the paging numbers, one count per status in board order and the
+ * projects to filter by, each type-checked and cut. A reply without a `tasks` array fails like any malformed colco
+ * reply instead of showing an empty board.
+ * @param {Record<string, unknown>} body - `colco tasks --json`.
+ */
+export function boardReply(body) {
+  const raw = field(body, "tasks", "array", "colco tasks");
+  const pageSize = positive(body.pageSize) && body.pageSize <= 100 ? body.pageSize : BOARD_PAGE_SIZE;
+  const total = count(body.total);
+
+  const perStatus = new Map();
+  if (Array.isArray(body.counts)) {
+    for (const entry of body.counts) {
+      if (entry !== null && typeof entry === "object" && BOARD_STATUSES.includes(entry.status) && !perStatus.has(entry.status)) perStatus.set(entry.status, count(entry.count));
+    }
+  }
+
+  const projects = [];
+  if (Array.isArray(body.projects)) {
+    for (const entry of body.projects) {
+      if (projects.length === PROJECT_CHOICES_MAX) break;
+      const id = entry !== null && typeof entry === "object" ? positive(entry.id) : undefined;
+      const name = id === undefined ? undefined : text(entry.name, PROJECT_NAME_MAX);
+      if (id !== undefined && name !== undefined) projects.push({ id, name, count: count(entry.count) });
+    }
+  }
+
+  return {
+    tasks: raw.map(boardTask).filter((task) => task !== undefined).slice(0, pageSize),
+    page: positive(body.page) && body.page <= MAX_BOARD_PAGE ? body.page : 1,
+    pageSize,
+    total,
+    pages: Math.max(1, Math.ceil(total / pageSize)),
+    counts: BOARD_STATUSES.map((status) => ({ status, count: perStatus.get(status) ?? 0 })),
+    projects,
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@evanbobo/colco4dsh",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "private": false,
   "description": "DSH plugin for Colco: a Colco page in the left sidebar with your runner, active runs and open decisions, plus chat tools to see and answer them",
   "type": "module",