dsh-taskboard 0.5.0 → 0.5.2

package/src/client/board/TaskFormModal.tsx

@@ -13,7 +13,7 @@ import type { BoardController } from '../controller.ts'
 import type { TaskTemplateSpec } from '../../shared/api.ts'
 import type { ChecklistItem, IsolationMode, Urgency } from '../../shared/protocol.ts'
 import { MAX_CHECKLIST_ITEMS, defaultIsolationOf, nextCronTime, parseCron } from '../../shared/protocol.ts'
-import { fmtTime } from './TaskBoard.tsx'
+import { fmtTime } from './format.ts'
 
 /** One row of the configured model catalog (from llm.models). */
 export interface CatalogModel { provider: string; model: string; name?: string }
@@ -144,6 +144,10 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
       : (prefill?.checklist ?? []).map(text => ({ text, checked: false })),
   )
   const titleRef = useRef<HTMLInputElement>(null)
+  // One in-flight write at a time: the foot buttons disable while a
+  // create/update/run round-trip is pending — a double click used to fire
+  // duplicate creates (and runs) before the first one returned (review P0).
+  const [busy, setBusy] = useState(false)
 
   // Focus the title and close on Esc while the dialog is open.
   useEffect(() => {
@@ -155,9 +159,9 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
     return () => document.removeEventListener('keydown', onKey)
   }, [controller])
 
-  // Model catalog: the plugin face provides it when the runtime is up.
+  // Model catalog: the controller exposes the installed face when the runtime is up.
   useEffect(() => {
-    const face = (controller as unknown as { modelCatalog?: () => Promise<CatalogModel[]> }).modelCatalog
+    const face = controller.modelCatalog
     if (face === undefined) return
     void face().then(setCatalog).catch(() => setCatalog([]))
   }, [controller])
@@ -166,14 +170,18 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
   // create mode (unless a template pinned one) so executions run with a
   // real tool set out of the box.
   useEffect(() => {
-    const face = (controller as unknown as { presetCatalog?: () => Promise<{ presets: Array<{ id: string; name?: string }>; defaultId?: string }> }).presetCatalog
+    const face = controller.presetCatalog
     if (face === undefined) return
     void face().then(roster => {
       setPresets(roster.presets)
       setPresetDefault(roster.defaultId)
-      if (task?.presetId === undefined && initialPreset === '' && roster.defaultId !== undefined) setPresetId(roster.defaultId)
+      // CREATE mode only (review P1): pre-selecting in edit mode would
+      // silently pin the deployment default onto tasks that deliberately
+      // follow it. In create mode `task` is undefined, so checking
+      // `initialPreset` (template pin) alone is sufficient.
+      if (!editing && initialPreset === '' && roster.defaultId !== undefined) setPresetId(roster.defaultId)
     }).catch(() => setPresets([]))
-  }, [controller, task?.presetId, initialPreset])
+  }, [controller, editing, task?.presetId, initialPreset])
 
   // Live cron validation + next-run preview (same math as the host).
   const cronMatch = mode === 'scheduled' ? parseCron(cron.trim()) : null
@@ -208,13 +216,14 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
   const filledRows = (): CheckRow[] => checkRows.map(r => ({ ...r, text: r.text.trim() })).filter(r => r.text.length > 0)
 
   const submit = (): void => {
-    if (!valid) return
+    if (!valid || busy) return
     const picked = model !== '' ? (JSON.parse(model) as { provider: string; model: string }) : undefined
     const isolationOut = isolationPayload()
     const presetOut = presetPayload()
     const rows = filledRows()
-    if (editing) {
-      void controller.update(task.id, task.version, {
+    setBusy(true)
+    const action = editing
+      ? controller.update(task.id, task.version, {
         title,
         description,
         prompt,
@@ -228,8 +237,7 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
         // [] clears the checklist (host deletes the field on empty).
         checklist: rows.length > 0 ? rows : null,
       })
-    } else {
-      void controller.create({
+      : controller.create({
         title,
         workspaceId,
         urgency,
@@ -241,18 +249,19 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
         ...(presetOut !== undefined ? { presetId: presetOut } : {}),
         ...(rows.length > 0 ? { checklist: rows.map(r => r.text) } : {}),
       })
-    }
+    void action.catch(() => undefined).finally(() => setBusy(false))
   }
 
   /** Save the form, then immediately trigger a manual run of the task. */
   const submitAndRun = (): void => {
-    if (!valid || runBlocked) return
+    if (!valid || runBlocked || busy) return
     const picked = model !== '' ? (JSON.parse(model) as { provider: string; model: string }) : undefined
     const isolationOut = isolationPayload()
     const presetOut = presetPayload()
     const rows = filledRows()
-    if (editing) {
-      void (async () => {
+    setBusy(true)
+    void (async () => {
+      if (editing) {
         const saved = await controller.update(task.id, task.version, {
           title,
           description,
@@ -266,9 +275,7 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
           checklist: rows.length > 0 ? rows : null,
         })
         if (saved) await controller.run(task.id)
-      })()
-    } else {
-      void (async () => {
+      } else {
         const id = await controller.create({
           title,
           workspaceId,
@@ -282,8 +289,8 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
           ...(rows.length > 0 ? { checklist: rows.map(r => r.text) } : {}),
         })
         if (id !== undefined) await controller.run(id)
-      })()
-    }
+      }
+    })().catch(() => undefined).finally(() => setBusy(false))
   }
 
   const hint = !valid
@@ -450,13 +457,13 @@ export function TaskFormModal({ controller, task }: { controller: BoardControlle
             <button
               type="button"
               className="dsh-atb-btn"
-              disabled={!valid || runBlocked}
-              title={runBlocked ? '任务正在执行中，不能重复发起' : '保存后立即发起执行（新会话）'}
+              disabled={!valid || runBlocked || busy}
+              title={runBlocked ? '任务正在执行中，不能重复发起' : busy ? '正在提交…' : '保存后立即发起执行（新会话）'}
               onClick={submitAndRun}
             >
               ⚡ 立即执行
             </button>
-            <button type="button" className="dsh-atb-btn" data-primary="true" disabled={!valid} onClick={submit}>
+            <button type="button" className="dsh-atb-btn" data-primary="true" disabled={!valid || busy} onClick={submit}>
               {editing ? '保存修改' : '创建任务'}
             </button>
           </span>

package/src/client/board/format.ts

@@ -0,0 +1,26 @@
+/**
+ * Pure display helpers shared by the board components.
+ *
+ * Review P2: these lived in TaskBoard.tsx and were imported back out by
+ * TaskCard/TaskDetail/TaskFormModal, forming import cycles with the view
+ * root. They have no component dependencies — they belong here.
+ *
+ * @module dsh-taskboard/client/board/format
+ */
+import type { TaskRecord } from '../../shared/protocol.ts'
+
+/** Format an epoch ms as a short local stamp. */
+export function fmtTime(ms: number | undefined): string {
+  if (ms === undefined) return ''
+  const d = new Date(ms)
+  const pad = (n: number) => String(n).padStart(2, '0')
+  return `${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`
+}
+
+/** A claim idle for longer than this is highlighted as stale (ms). */
+export const STALE_CLAIM_MS = 30 * 60_000
+
+/** Whether the task's claim is stale (in_progress, held, idle too long). */
+export function isStaleClaim(task: TaskRecord, now: number): boolean {
+  return task.status === 'in_progress' && task.claimedAt !== undefined && now - task.claimedAt > STALE_CLAIM_MS
+}

package/src/client/board/labels.ts

@@ -0,0 +1,44 @@
+/**
+ * Centralized zh-CN display labels for the board UI.
+ *
+ * Review P2: the same status/urgency/outcome text used to live in three
+ * components (TaskBoard / TaskCard / TaskDetail) and drifted — adding a
+ * status meant three edits, missing one leaked the raw English key.
+ *
+ * @module dsh-taskboard/client/board/labels
+ */
+import type { TaskStatus, Urgency } from '../../shared/protocol.ts'
+
+/** Column headers on the five-column main board (+ secondary tab). */
+export const COLUMN_LABELS: Readonly<Record<TaskStatus, string>> = {
+  backlog: '待规划',
+  todo: '待办',
+  in_progress: '进行中',
+  in_review: '待验收',
+  done: '已完成',
+  canceled: '已取消',
+  archived: '已归档',
+}
+
+/** Status pill text (detail pane) — historical wording kept verbatim:
+ *  terminal states read short here, the column headers carry the full forms. */
+export const STATUS_LABEL: Readonly<Record<TaskStatus, string>> = {
+  backlog: '待规划', todo: '待办', in_progress: '进行中', in_review: '待验收',
+  done: '完成', canceled: '取消', archived: '归档',
+}
+
+/** Move-button verbs (shorter than the pill text). */
+export const MOVE_LABEL: Readonly<Record<TaskStatus, string>> = {
+  backlog: '待规划', todo: '待办', in_progress: '进行中', in_review: '待验收',
+  done: '完成', canceled: '取消', archived: '归档',
+}
+
+/** Urgency chip labels. */
+export const URGENCY_LABEL: Readonly<Record<Urgency, string>> = {
+  urgent: '紧急', normal: '一般', relaxed: '不急',
+}
+
+/** Execution outcome labels. */
+export const OUTCOME_LABEL: Readonly<Record<string, string>> = {
+  running: '执行中', succeeded: '成功', failed: '失败', cancelled: '已取消',
+}

package/src/client/board-mount.tsx

@@ -4,11 +4,14 @@
  * conversation content while the board is active. Toggling rides a data
  * attribute on <html> — no React involvement in the shell.
  *
- * Column matching is DUAL (0.4.2): the dev shell marks the column with
- * `data-pane="conversation"`; the DSH Desktop shell (dsh-client-ui-layout)
- * dropped data-pane entirely and uses CSS-Module hashed class names
- * (`pI_x6G_centerCol`) — the class-substring fallback keeps both mounting,
- * exactly like sidebar-entry's `[class*="sidebarCol"]` fallback.
+ * Column matching is TRIPLE-generation: the dev shell marks the column
+ * with `data-pane="conversation"`; the official layout shell
+ * (dsh-client-ui-layout) dropped data-pane and uses CSS-Module hashed
+ * class names (`pI_x6G_centerCol`) — and DSH Desktop's non-compat
+ * (extended) mode disables the official layout row entirely, owning the
+ * columns itself (`main.dshDesktopConversationSurface`, 0.5.2) — the
+ * fallbacks keep all three mounting, exactly like sidebar-entry's column
+ * selector.
  *
  * @module dsh-taskboard/client/board-mount
  */
@@ -20,7 +23,7 @@ import { ENTRY_SELECTOR } from './sidebar-entry.ts'
 /** The injected board container. */
 export const BOARD_VIEW_SELECTOR = '[data-dsh-atb-view]'
 
-const CONVERSATION_COLUMN_SELECTOR = '[data-pane="conversation"], [class*="centerCol"]'
+const CONVERSATION_COLUMN_SELECTOR = '[data-pane="conversation"], [class*="centerCol"], .dshDesktopConversationSurface'
 const ACTIVE_ATTR = 'data-dsh-atb-active'
 /** Sibling panels' activation attributes, evicted when this board opens. */
 const OTHER_ACTIVE_ATTRS = ['data-dsh-taskboard-active', 'data-dsh-ssh-active']

package/src/client/controller.ts

@@ -109,7 +109,14 @@ export class BoardController {
   private disposed = false
   private disposeStream: (() => void) | undefined
   private refreshInFlight: Promise<void> | undefined
+  /** Newest change-frame revision seen on the SSE stream (S16 refresh chase). */
+  private seenRevision: number | undefined
   private sessionJumper: ((sessionId: string) => Promise<SessionJumpResult>) | undefined
+  /** Composer catalog faces, installed formally by the client entry (T13). */
+  private readonly catalogFaces: {
+    models?: () => Promise<Array<{ provider: string; model: string; name?: string }>>
+    presets?: () => Promise<{ presets: Array<{ id: string; name?: string }>; defaultId?: string }>
+  } = {}
 
   /** @param client - the route client. */
   constructor(private readonly client: TaskboardClient) {}
@@ -140,8 +147,10 @@ export class BoardController {
     void this.refresh()
     this.disposeStream = this.client.stream(
       (change: ChangeEvent) => {
-        this.setState({ ledger: { ...this.state.ledger, revision: change.revision } })
+        this.seenRevision = change.revision
         // Any change invalidates the full snapshot; refetch (cheap, local).
+        // No intermediate revision-only setState — the refresh result is the
+        // single render a frame produces (review P2: frames rendered twice).
         void this.refresh()
       },
       () => { void this.refresh() },
@@ -153,15 +162,23 @@ export class BoardController {
     if (this.refreshInFlight !== undefined) return this.refreshInFlight
     this.refreshInFlight = (async () => {
       try {
-        const [ledger, workspaces] = await Promise.all([
-          this.client.state(),
-          this.client.workspaces(),
-        ])
-        let selected: TaskRecord | undefined
-        if (this.state.selectedId !== undefined) {
-          selected = ledger.tasks.find(t => t.id === this.state.selectedId)
+        // S16: a change frame landing while a fetch is in flight used to
+        // strand the board on a stale snapshot forever (the deduped request
+        // predates the newest frame and no further event arrives). Chase the
+        // newest seen revision — bounded rounds, then give up until the next
+        // frame.
+        for (let round = 0; round < 3; round++) {
+          const [ledger, workspaces] = await Promise.all([
+            this.client.state(),
+            this.client.workspaces(),
+          ])
+          let selected: TaskRecord | undefined
+          if (this.state.selectedId !== undefined) {
+            selected = ledger.tasks.find(t => t.id === this.state.selectedId)
+          }
+          this.setState({ ledger, workspaces, error: undefined, selectedId: selected === undefined ? undefined : this.state.selectedId })
+          if (this.seenRevision === undefined || ledger.revision >= this.seenRevision) break
         }
-        this.setState({ ledger, workspaces, error: undefined, selectedId: selected === undefined ? undefined : this.state.selectedId })
       } catch (error) {
         this.setState({ error: error instanceof Error ? error.message : String(error) })
       } finally {
@@ -260,6 +277,26 @@ export class BoardController {
     this.sessionJumper = jumper
   }
 
+  /** T13: formal installers for the composer catalog faces (was a monkeypatch from the client entry). */
+  installModelCatalog(fn: () => Promise<Array<{ provider: string; model: string; name?: string }>>): void {
+    this.catalogFaces.models = fn
+  }
+
+  /** T13: formal installer for the preset roster face. */
+  installPresetRoster(fn: () => Promise<{ presets: Array<{ id: string; name?: string }>; defaultId?: string }>): void {
+    this.catalogFaces.presets = fn
+  }
+
+  /** The installed model catalog face, when the runtime provides one. */
+  get modelCatalog(): (() => Promise<Array<{ provider: string; model: string; name?: string }>>) | undefined {
+    return this.catalogFaces.models
+  }
+
+  /** The installed preset roster face, when the runtime provides one. */
+  get presetCatalog(): (() => Promise<{ presets: Array<{ id: string; name?: string }>; defaultId?: string }>) | undefined {
+    return this.catalogFaces.presets
+  }
+
   /**
    * Jump to an execution's session (open it in the GUI). On success the board
    * closes so the conversation shows; a deleted-or-archived session reports
@@ -373,13 +410,18 @@ export class BoardController {
     }
   }
 
-  /** Append a user comment. */
-  async comment(id: string, body: string): Promise<void> {
+  /**
+   * Append a user comment. Returns whether it landed — the composer keeps its
+   * text on failure (T13: it used to clear unconditionally and lose the draft).
+   */
+  async comment(id: string, body: string): Promise<boolean> {
     try {
       await this.client.comment(id, body)
       await this.refresh()
+      return true
     } catch (error) {
       this.setState({ error: error instanceof Error ? error.message : String(error) })
+      return false
     }
   }
 
@@ -490,7 +532,8 @@ export class BoardController {
   async duplicate(task: TaskRecord): Promise<void> {
     try {
       await this.client.create({
-        title: `${task.title}（副本）`,
+        // Keep the suffix under the host's 200-char title cap (review P1).
+        title: `${task.title.slice(0, 196)}（副本）`,
         workspaceId: task.workspaceId,
         urgency: task.urgency,
         description: task.description.length > 0 ? task.description : undefined,
@@ -620,7 +663,11 @@ export class BoardController {
   /** Download the task list as a CSV (BOM-prefixed for Excel + Chinese text). */
   exportCsv(): void {
     const esc = (v: unknown): string => {
-      const s = String(v ?? '')
+      let s = String(v ?? '')
+      // S17: formula-injection guard — title/description are agent-controllable
+      // and a cell starting with = + - @ would be EXECUTED as a formula by
+      // Excel; neutralize with a leading apostrophe.
+      if (/^[=+\-@\t\r]/.test(s)) s = `'${s}`
       return /[",\n\r]/.test(s) ? `"${s.replace(/"/g, '""')}"` : s
     }
     const header = ['id', 'title', 'status', 'urgency', 'blocked', 'project', 'claimedBy', 'mode', 'cron', 'nextRunAt', 'model', 'createdAt', 'updatedAt', 'comments', 'executions']

package/src/client/index.ts

@@ -52,11 +52,13 @@ export function apply(ctx: ClientContextFace): void {
     const client = createClient()
     const controller = new BoardController(client)
 
-    // Model catalog for the composer: llm.models over the connection RPC.
+    // Model catalog for the composer: llm.models over the connection RPC —
+    // installed through the controller's formal installer (T13: no more
+    // monkeypatched instance properties).
     const connection = ctx.get?.('connection') as ConnectionFace | undefined
     if (connection !== undefined) {
       type CatalogRow = { provider: string; model: string; name?: string }
-      ;(controller as unknown as { modelCatalog?: () => Promise<CatalogRow[]> }).modelCatalog = async (): Promise<CatalogRow[]> => {
+      controller.installModelCatalog(async (): Promise<CatalogRow[]> => {
         const response = await connection.api.llm.models({})
         if (!response.result.ok) return []
         const out: CatalogRow[] = []
@@ -66,13 +68,13 @@ export function apply(ctx: ClientContextFace): void {
           }
         }
         return out
-      }
+      })
 
       // Preset roster for the composer (0.3.3): agentPreset.list over the
       // connection RPC — [{id, name}] plus which one is the deployment
       // default (the form pre-selects it on create).
       type PresetRow = { id: string; name?: string }
-      ;(controller as unknown as { presetCatalog?: () => Promise<{ presets: PresetRow[]; defaultId?: string }> }).presetCatalog = async (): Promise<{ presets: PresetRow[]; defaultId?: string }> => {
+      controller.installPresetRoster(async (): Promise<{ presets: PresetRow[]; defaultId?: string }> => {
         const list = connection.api.agentPresets
         if (list === undefined) return { presets: [] }
         const response = await list.list({})
@@ -80,7 +82,7 @@ export function apply(ctx: ClientContextFace): void {
         const presets = response.result.value.presets.map((p: { id: string; name?: string }) => ({ id: p.id, name: p.name }))
         const def = response.result.value.presets.find((p: { id: string; isDefault: boolean }) => p.isDefault)
         return { presets, ...(def !== undefined ? { defaultId: def.id } : {}) }
-      }
+      })
     }
 
     // Session navigation for execution rows: resolved LAZILY on every jump —

package/src/client/sidebar-entry.ts

@@ -19,15 +19,22 @@ import type { BoardController } from './controller.ts'
 /** Stable data attribute identifying this entry row. */
 export const ENTRY_SELECTOR = '[data-dsh-atb-entry]'
 
-/** Inline icon (16px nav-icon look). */
-const ICON = '<svg viewBox="0 0 16 16" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="2.5" width="12" height="11" rx="1.5"/><path d="M2 6.5h12M6.5 6.5v7"/></svg>'
+/** Inline icon: a three-lane kanban board (16px nav-icon look). */
+const ICON = '<svg viewBox="0 0 16 16" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="2" width="12" height="12" rx="2"/><path d="M6 2v12M10 2v12"/></svg>'
 
 /**
  * Find the sidebar shell root element, or undefined while not yet mounted.
- * (Same as the working family plugins: sidebarCol pane → logoRow owner.)
+ * Triple-generation matching (0.5.2): the dev shell's data-pane pane, the
+ * official layout's CSS-Module sidebarCol, and DSH Desktop's non-compat
+ * (extended) frame — which disables the official ui-layout row and owns
+ * the columns itself (aside.dshDesktopSidebarSurface >
+ * div.dshDesktopUpstreamSidebar wrapping the unchanged official sidebar).
+ * logoRow-owner resolution is identical on all three generations.
  */
 function sidebarRoot(): HTMLElement | undefined {
-  const column = document.querySelector<HTMLElement>('[data-pane="sidebar"], [class*="sidebarCol"]')
+  const column = document.querySelector<HTMLElement>(
+    '[data-pane="sidebar"], [class*="sidebarCol"], .dshDesktopUpstreamSidebar, .dshDesktopSidebarSurface',
+  )
   if (column === null) return undefined
   const logoOwner = column.querySelector<HTMLElement>('[class*="logoRow"]')?.parentElement
   return logoOwner ?? (column.firstElementChild as HTMLElement | undefined)
@@ -196,7 +203,11 @@ interface AtbDebug { attempts: number; found: boolean; placed: boolean }
 export function mountSidebarEntry(controller: BoardController): () => void {
   const entry = createEntry(controller)
   const debug: AtbDebug = { attempts: 0, found: false, placed: false }
-  ;(window as unknown as { __atbDebug?: AtbDebug }).__atbDebug = debug
+  // Debug handle only where the GUI runs locally; never on remote origins.
+  const host = globalThis.location?.hostname
+  if (host === 'localhost' || host === '127.0.0.1') {
+    ;(window as unknown as { __atbDebug?: AtbDebug }).__atbDebug = debug
+  }
   let root: HTMLElement | undefined
   let placed = false
 

package/src/client/styles.ts

@@ -69,10 +69,12 @@ export const STYLES = `
 .dsh-atb-search { width: 130px; }
 .dsh-atb-badge[data-kind="stale"] { background: rgba(217,130,43,.15); color: #d9822b; }
 
-/* 0.4.2: dual column matching — dev shell's data-pane pane OR the Desktop
- * shell's CSS-Module hashed centerCol (see board-mount.tsx). */
+/* Triple-generation column matching — dev shell's data-pane pane, the
+ * official layout shell's CSS-Module hashed centerCol (0.4.2), or DSH
+ * Desktop's non-compat extended frame surface (0.5.2, see board-mount.tsx). */
 html[data-dsh-atb-active] [data-pane="conversation"] > *:not([data-dsh-atb-view]),
-html[data-dsh-atb-active] [class*="centerCol"] > *:not([data-dsh-atb-view]) { display: none !important; }
+html[data-dsh-atb-active] [class*="centerCol"] > *:not([data-dsh-atb-view]),
+html[data-dsh-atb-active] .dshDesktopConversationSurface > *:not([data-dsh-atb-view]) { display: none !important; }
 .dsh-atb-view { display: none; }
 html[data-dsh-atb-active] .dsh-atb-view { display: flex; flex-direction: column; height: 100%; overflow: hidden; }