@linxin666/dsh-client-ui-task-board 0.1.1

package/src/client/css-modules.d.ts

@@ -0,0 +1,5 @@
+/** CSS Modules typing for the tsdown CSS-inline preset (hashed class map). */
+declare module '*.module.css' {
+  const classes: Record<string, string>
+  export default classes
+}

package/src/client/index.ts

@@ -0,0 +1,167 @@
+/**
+ * Task-board client plugin: wires the framework-free core (controller,
+ * execution service, store) to the real client runtime and mounts the two
+ * DOM surfaces — the sidebar entry row and the board view in the center
+ * column.
+ *
+ * Failure policy: DOM mounting problems are logged, never thrown — the web
+ * shell fails the whole boot when a plugin apply throws, and an external
+ * plugin must not take the GUI down.
+ */
+import type { ClientContext, SessionId, WorkspaceId } from '@deepseek-ai/dsh-client-runtime/client'
+import type { ConnectionHandle } from '@deepseek-ai/dsh-client-connection/client'
+import type {} from '@deepseek-ai/dsh-client-ui-slots'
+// Type-only: pulls the locale plugin's Context merge (ctx.locale) and its
+// LocaleNamespaceMap merge table.
+import type {} from '@deepseek-ai/dsh-client-locale/client'
+// Type-only: pulls the settings-surface Context merge (ctx.settingsScope).
+import type {} from '@deepseek-ai/dsh-client-ui-settings/client'
+import { BoardController } from '../core/controller.ts'
+import { ExecutionService } from '../core/execution.ts'
+import { SchedulerService } from '../core/scheduler.ts'
+import { LocalStorageTaskStore } from '../core/store.ts'
+import { mountBoard } from './board-mount.tsx'
+import { mountSidebarEntry } from './sidebar-entry.ts'
+import { TaskBoardSettingsCard, TaskBoardSettingsCardController, type TaskBoardSettings } from './TaskBoardSettingsCard.tsx'
+import { en, zh, type TaskBoardKey } from './locales.ts'
+
+/** Locale namespace this plugin owns. */
+const NS = 'task-board'
+
+/** Settings namespace the settings card edits (the Host plugin registers it). */
+const TASK_BOARD_NS = 'task-board'
+
+declare module '@deepseek-ai/dsh-client-ui-slots' {
+  interface LocaleNamespaceMap {
+    /** Task-board surface copy. */
+    'task-board': TaskBoardKey
+  }
+
+  interface SlotMap {
+    /**
+     * The child slot the Web UI plugin group declares; this card registers
+     * into the group instead of the top-level `settings.plugin.item` list.
+     * Spelled here with the same shape so this package can register without
+     * depending on the sibling UI package.
+     */
+    'web-ui.plugin.item': { kind: 'list'; scope: 'root'; owner: SettingsPluginItemOwnerProps }
+  }
+}
+
+/** Owner share of a plugin card (the section supplies nothing). */
+export interface SettingsPluginItemOwnerProps {
+  /** Marker field: card owner props are intentionally empty. */
+  children?: never
+}
+
+/** Required services (fiber inject waiting — the runtime must be up first). */
+export const inject = ['slots', 'sessions', 'workspaces', 'connection', 'settingsScope', 'locale', 'remote']
+
+/**
+ * Mount the task board.
+ * @param ctx - client root context (services: sessions, workspaces).
+ */
+export function apply(ctx: ClientContext): void {
+  ctx.effect(() => ctx.locale.register(NS, { zh, en }), 'task-board: dictionaries')
+
+  // Plugin configuration card: one staged form over the `task-board` settings
+  // namespace, contributed to the Web UI plugin group.
+  const settingsScope = ctx.settingsScope.bind<TaskBoardSettings>({ namespace: TASK_BOARD_NS })
+  const settingsCard = new TaskBoardSettingsCardController(settingsScope)
+  ctx.slots.inject('web-ui.plugin.item', () => ctx.slots.register({
+    name: 'web-ui.plugin.item',
+    id: 'task-board',
+    order: 110,
+    locale: NS,
+    inject: () => settingsCard.inject(),
+  }, TaskBoardSettingsCard))
+
+  // The sidebar entry and board view mount once the settings scope settles;
+  // while the scope is still loading, the composition default is unknown, so
+  // nothing mounts yet. Only an unavailable scope (no settings surface served)
+  // falls back to the composition default (enabled).
+  let uiDisposer: (() => void) | undefined
+  const mountUi = (): void => {
+    if (uiDisposer !== undefined) return
+    const sessions = ctx.sessions
+    const workspaces = ctx.workspaces
+    const connection = ctx.get('connection') as ConnectionHandle
+
+    // Core wiring: real runtime faces into the framework-free services.
+    const store = new LocalStorageTaskStore()
+    const exec = new ExecutionService({
+      sessions: {
+        list: sessions.list,
+        binding: id => sessions.binding(id as SessionId),
+      },
+      workspaces: {
+        list: workspaces.list,
+        connectWorkspace: id => workspaces.connectWorkspace(id as WorkspaceId),
+      },
+      history: {
+        loadTail: async sessionId => {
+          const response = await connection.api.sessions.history({
+            sessionId: sessionId as SessionId,
+            maxMessages: 20,
+          })
+          return response.result.ok
+            ? { events: response.result.value.events.map(entry => entry.event) }
+            : undefined
+        },
+      },
+    })
+    const controller = new BoardController({
+      store,
+      exec,
+      sessions: {
+        list: sessions.list,
+        open: id => sessions.open(id as SessionId),
+      },
+    })
+    controller.start()
+
+    // Scheduled runs: a browser-side heartbeat that triggers due tasks through
+    // the same run path as the manual Run button. The first tick is gated on
+    // the session list baseline so a page-load catch-up never fires into a
+    // not-yet-ready runtime; tab visibility recovery ticks immediately.
+    const scheduler = new SchedulerService({
+      tasks: () => controller.getSnapshot().tasks,
+      now: () => Date.now(),
+      runTask: id => controller.runTask(id),
+      applySchedule: (id, nextRunAt, lastTriggeredAt) =>
+        controller.applyScheduleNextRun(id, nextRunAt, lastTriggeredAt),
+      ready: () => sessions.list.getSnapshot().phase === 'ready',
+      environment: {
+        addEventListener: (type, listener) => document.addEventListener(type, listener),
+        removeEventListener: (type, listener) => document.removeEventListener(type, listener),
+      },
+    })
+    scheduler.start()
+
+    const disposers: Array<() => void> = []
+    try {
+      disposers.push(mountSidebarEntry(controller))
+      disposers.push(mountBoard(controller))
+    } catch (error) {
+      // DOM failures degrade the board, never the GUI.
+      console.error('[dsh-task-board] mount failed:', error)
+    }
+
+    uiDisposer = () => {
+      for (const dispose of disposers.splice(0)) dispose()
+      scheduler.dispose()
+      controller.dispose()
+      uiDisposer = undefined
+    }
+  }
+  const syncEnabled = (): void => {
+    const snapshot = settingsScope.getSnapshot()
+    const enabled = snapshot.status === 'ready'
+      ? snapshot.value?.enabled ?? true
+      : snapshot.status === 'unavailable'
+    if (enabled) mountUi()
+    else uiDisposer?.()
+  }
+  settingsScope.subscribe(syncEnabled)
+  syncEnabled()
+}

package/src/client/locales.ts

@@ -0,0 +1,211 @@
+/**
+ * Task-board copy: zh-first dictionaries with an English fallback, selected
+ * by the document language. Kept dependency-free (no dsh locale service) so
+ * the DOM-injected entry row and the standalone board tree share one tiny
+ * lookup.
+ */
+
+/** zh dictionary (key-set source of truth). */
+export const zh = {
+  'entry.label': '任务看板',
+  'board.title': '任务看板',
+  'board.close': '返回对话',
+  'board.new': '新建任务',
+  'board.search': '筛选任务…',
+  'board.empty': '这个状态还没有任务',
+  'board.filterAll': '全部',
+  'board.status': '状态',
+  'board.status.backlog': '待规划',
+  'board.status.todo': '待办',
+  'board.status.running': '进行中',
+  'board.status.done': '已完成',
+  'board.status.failed': '已失败',
+  'board.runs': '次执行',
+  'board.updated': '更新于',
+  'board.created': '创建于',
+  'new.title': '标题',
+  'new.titlePlaceholder': '一句话描述要做什么',
+  'new.description': '描述',
+  'new.descriptionPlaceholder': '补充背景、范围与验收（可选）',
+  'new.prompt': '执行 Prompt',
+  'new.promptPlaceholder': '发给 agent 的完整指令（留空则使用标题）',
+  'new.submit': '创建',
+  'new.cancel': '取消',
+  'new.required': '标题不能为空',
+  'detail.title': '任务详情',
+  'detail.close': '关闭',
+  'detail.prompt': '执行 Prompt',
+  'detail.description': '描述',
+  'detail.execution': '执行记录',
+  'detail.noExecution': '尚未执行',
+  'detail.run': '执行',
+  'detail.rerun': '重新执行',
+  'detail.delete': '删除',
+  'detail.viewSession': '查看会话',
+  'detail.noSession': '暂无会话',
+  'detail.executionStarted': '已启动',
+  'detail.executionEnded': '已结束',
+  'detail.result.succeeded': '成功',
+  'detail.result.failed': '失败',
+  'detail.result.cancelled': '已取消',
+  'detail.result.running': '进行中',
+  'delete.title': '删除任务',
+  'delete.confirm': '确定删除「{name}」吗？删除后不可恢复。',
+  'delete.ok': '删除',
+  'delete.cancel': '取消',
+  'status.move.backlog': '移到待规划',
+  'status.move.todo': '移到待办',
+  'exec.error.noWorkspace': '没有可用工作区，无法执行任务',
+  'exec.error.promptRejected': 'Prompt 被拒绝',
+  'run.failed': '执行失败：{error}',
+  'time.justNow': '刚刚',
+  'detail.schedule': '定时运行',
+  'detail.schedule.enable': '启用定时执行',
+  'detail.schedule.cron': 'Cron 表达式',
+  'detail.schedule.presets': '预设',
+  'detail.schedule.preset.daily9': '每天 09:00',
+  'detail.schedule.preset.hourly': '每小时',
+  'detail.schedule.preset.tenMin': '每 10 分钟',
+  'detail.schedule.preset.weeklyMon9': '每周一 09:00',
+  'detail.schedule.nextRun': '下次运行',
+  'detail.schedule.lastTriggered': '上次触发',
+  'detail.schedule.invalid': 'Cron 表达式无效',
+  'detail.schedule.notScheduled': '尚未排程',
+  'detail.schedule.dueSoon': '即将运行',
+  'card.scheduled': '定时',
+  // 插件设置卡片（settings.plugin.item 席位）。
+  'settings.title': '任务看板',
+  'settings.description': '控制看板在 agent 系统提示中的播报行为。',
+  'settings.enabled': '启用任务看板',
+  'settings.enabledHint': '关闭后隐藏侧边栏入口与看板视图。',
+  'settings.announceToAgent': '向 agent 播报任务看板',
+  'settings.announceToAgentHint': '开启：每条 agent 系统提示都会包含本看板的说明；关闭：不播报，agent 仅在用户主动提及时了解看板。',
+  'settings.inherit': '继承',
+  'settings.on': '开',
+  'settings.off': '关',
+  'settings.overridden': '已覆盖',
+  'settings.reset': '恢复默认',
+  'settings.readOnly': '当前部署的设置只读。',
+  'settings.expand': '展开设置',
+  'settings.collapse': '收起设置',
+  'settings.save': '保存',
+  'settings.saving': '保存中…',
+  'settings.discard': '放弃',
+  'settings.unsaved': '未保存',
+  'settings.saveFailed': '部署未接受这些值，已保留供你修改。',
+  'settings.invalidNumber': '请输入数字，留空则使用默认值。',
+} satisfies Record<string, string>
+
+/** en dictionary, complete against the zh key set. */
+export const en: Record<keyof typeof zh, string> = {
+  'entry.label': 'Task Board',
+  'board.title': 'Task Board',
+  'board.close': 'Back to chat',
+  'board.new': 'New Task',
+  'board.search': 'Filter tasks…',
+  'board.empty': 'No tasks in this column',
+  'board.filterAll': 'All',
+  'board.status': 'Status',
+  'board.status.backlog': 'Backlog',
+  'board.status.todo': 'To Do',
+  'board.status.running': 'In Progress',
+  'board.status.done': 'Done',
+  'board.status.failed': 'Failed',
+  'board.runs': 'runs',
+  'board.updated': 'Updated',
+  'board.created': 'Created',
+  'new.title': 'Title',
+  'new.titlePlaceholder': 'What should be done, in one line',
+  'new.description': 'Description',
+  'new.descriptionPlaceholder': 'Background, scope, acceptance criteria (optional)',
+  'new.prompt': 'Run Prompt',
+  'new.promptPlaceholder': 'The full instruction sent to the agent (title is used when blank)',
+  'new.submit': 'Create',
+  'new.cancel': 'Cancel',
+  'new.required': 'Title is required',
+  'detail.title': 'Task Detail',
+  'detail.close': 'Close',
+  'detail.prompt': 'Run Prompt',
+  'detail.description': 'Description',
+  'detail.execution': 'Execution History',
+  'detail.noExecution': 'Not executed yet',
+  'detail.run': 'Run',
+  'detail.rerun': 'Run Again',
+  'detail.delete': 'Delete',
+  'detail.viewSession': 'View Session',
+  'detail.noSession': 'No session',
+  'detail.executionStarted': 'Started',
+  'detail.executionEnded': 'Ended',
+  'detail.result.succeeded': 'Succeeded',
+  'detail.result.failed': 'Failed',
+  'detail.result.cancelled': 'Cancelled',
+  'detail.result.running': 'Running',
+  'delete.title': 'Delete Task',
+  'delete.confirm': 'Delete "{name}"? This cannot be undone.',
+  'delete.ok': 'Delete',
+  'delete.cancel': 'Cancel',
+  'status.move.backlog': 'Move to Backlog',
+  'status.move.todo': 'Move to To Do',
+  'exec.error.noWorkspace': 'No workspace is available to run the task',
+  'exec.error.promptRejected': 'Prompt rejected',
+  'run.failed': 'Run failed: {error}',
+  'time.justNow': 'just now',
+  'detail.schedule': 'Scheduled Runs',
+  'detail.schedule.enable': 'Enable scheduled runs',
+  'detail.schedule.cron': 'Cron expression',
+  'detail.schedule.presets': 'Presets',
+  'detail.schedule.preset.daily9': 'Every day 09:00',
+  'detail.schedule.preset.hourly': 'Every hour',
+  'detail.schedule.preset.tenMin': 'Every 10 minutes',
+  'detail.schedule.preset.weeklyMon9': 'Every Monday 09:00',
+  'detail.schedule.nextRun': 'Next run',
+  'detail.schedule.lastTriggered': 'Last triggered',
+  'detail.schedule.invalid': 'Invalid cron expression',
+  'detail.schedule.notScheduled': 'Not scheduled yet',
+  'detail.schedule.dueSoon': 'Due soon',
+  'card.scheduled': 'scheduled',
+  // Plugin settings card (the `settings.plugin.item` seat).
+  'settings.title': 'Task Board',
+  'settings.description': 'How the board announces itself in each agent system prompt.',
+  'settings.enabled': 'Enable the task board',
+  'settings.enabledHint': 'When off, the sidebar entry and board view are hidden.',
+  'settings.announceToAgent': 'Announce the task board to agents',
+  'settings.announceToAgentHint': 'On: every agent system prompt includes a note about this board. Off: no announcement; agents learn about the board only when you mention it.',
+  'settings.inherit': 'Inherit',
+  'settings.on': 'On',
+  'settings.off': 'Off',
+  'settings.overridden': 'Overridden',
+  'settings.reset': 'Reset to default',
+  'settings.readOnly': 'This deployment stores settings read-only.',
+  'settings.expand': 'Show settings',
+  'settings.collapse': 'Hide settings',
+  'settings.save': 'Save',
+  'settings.saving': 'Saving…',
+  'settings.discard': 'Discard',
+  'settings.unsaved': 'Unsaved',
+  'settings.saveFailed': 'The deployment did not accept these values; they were left for you to correct.',
+  'settings.invalidNumber': 'Enter a number, or leave blank to use the default.',
+}
+
+/** The dictionary key union. */
+export type TaskBoardKey = keyof typeof zh
+
+/** The settings-card slice of the task-board dictionary. */
+export type SettingsCardKey = TaskBoardKey
+
+/** Active dictionary, picked by the document language at call time. */
+export function dictionary(): Record<TaskBoardKey, string> {
+  const lang = typeof document !== 'undefined' ? document.documentElement.lang : 'zh'
+  return lang.toLowerCase().startsWith('en') ? en : zh
+}
+
+/** Translate a key with optional {name} template params. */
+export function t(key: TaskBoardKey, params?: Record<string, string>): string {
+  let text: string = dictionary()[key]
+  if (params !== undefined) {
+    for (const [name, value] of Object.entries(params)) {
+      text = text.replaceAll(`{${name}}`, value)
+    }
+  }
+  return text
+}

package/src/client/settings-card.module.css

@@ -0,0 +1,261 @@
+.card {
+  list-style: none;
+  border: 1px solid var(--dsw-alias-border-l2);
+  border-radius: 8px;
+  background: var(--dsw-alias-bg-layer-3);
+  overflow: hidden;
+  transition: border-color 0.16s, background 0.16s;
+}
+
+.cardOpen {
+  background: var(--dsw-alias-bg-layer-2);
+  border-color: var(--dsw-alias-label-dimmed);
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 10px 14px;
+  border: 0;
+  background: transparent;
+  cursor: pointer;
+  text-align: left;
+  font: inherit;
+}
+
+.header:hover {
+  background: var(--dsw-alias-interactive-bg-hover);
+}
+
+.headText {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  flex: 1;
+  min-width: 0;
+}
+
+.name {
+  font-weight: 600;
+  color: var(--dsw-alias-label-primary);
+}
+
+.description {
+  font-size: 12px;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.pending {
+  font-size: 12px;
+  color: var(--dsw-alias-state-warn-primary);
+}
+
+.chevron {
+  transition: transform 120ms ease;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.chevronOpen {
+  transform: rotate(180deg);
+}
+
+.body {
+  padding: 0 14px 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+.readOnly {
+  margin: 0;
+  font-size: 12px;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.footer {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 8px;
+}
+
+.failed {
+  margin: 0 auto 0 0;
+  font-size: 12px;
+  color: var(--dsw-alias-state-error-primary);
+}
+
+.discard,
+.save {
+  padding: 5px 12px;
+  border-radius: 6px;
+  font: inherit;
+  font-size: 13px;
+  cursor: pointer;
+}
+
+.discard {
+  border: 1px solid var(--dsw-alias-border-l2);
+  background: transparent;
+  color: var(--dsw-alias-label-secondary);
+}
+
+.discard:hover:not(:disabled) {
+  color: var(--dsw-alias-label-primary);
+  border-color: var(--dsw-alias-label-dimmed);
+}
+
+.save {
+  border: 1px solid var(--dsw-alias-button-info-fill);
+  background: var(--dsw-alias-button-info-fill);
+  color: var(--dsw-alias-label-primary-foreground);
+}
+
+.save:hover:not(:disabled) {
+  border-color: var(--dsw-alias-button-info-hover);
+  background: var(--dsw-alias-button-info-hover);
+}
+
+.discard:active:not(:disabled),
+.save:active:not(:disabled) {
+  transform: translateY(1px);
+}
+
+.discard:focus-visible:not(:disabled),
+.save:focus-visible:not(:disabled) {
+  outline: 2px solid var(--dsw-alias-state-business-primary);
+  outline-offset: -2px;
+}
+
+.discard:disabled,
+.save:disabled {
+  opacity: 0.5;
+  cursor: default;
+}
+
+.field {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.label {
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--dsw-alias-label-primary);
+}
+
+.badges {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.badge {
+  font-size: 11px;
+  padding: 1px 6px;
+  border-radius: 999px;
+  background: var(--dsw-alias-interactive-bg-hover-accent);
+  color: var(--dsw-alias-state-business-primary);
+}
+
+.reset {
+  font-size: 11px;
+  border: 0;
+  background: transparent;
+  color: var(--dsw-alias-state-business-primary);
+  cursor: pointer;
+  padding: 0;
+}
+
+.reset:hover:not(:disabled) {
+  text-decoration: underline;
+}
+
+.reset:active:not(:disabled) {
+  text-decoration: underline;
+  opacity: 0.8;
+}
+
+.reset:focus-visible {
+  outline: 2px solid var(--dsw-alias-state-business-primary);
+  outline-offset: -2px;
+}
+
+.reset:disabled {
+  opacity: 0.5;
+  cursor: default;
+}
+
+.input,
+.select {
+  padding: 6px 8px;
+  border: 1px solid var(--dsw-alias-border-l2);
+  border-radius: 6px;
+  font: inherit;
+  font-size: 13px;
+  color: var(--dsw-alias-label-primary);
+  background: var(--dsw-specific-input-major);
+}
+
+.inputInvalid {
+  padding: 6px 8px;
+  border: 1px solid var(--dsw-alias-state-error-primary);
+  border-radius: 6px;
+  font: inherit;
+  font-size: 13px;
+  color: var(--dsw-alias-label-primary);
+}
+
+.input:disabled,
+.select:disabled {
+  opacity: 0.6;
+}
+
+.hint {
+  margin: 0;
+  font-size: 12px;
+  color: var(--dsw-alias-label-secondary);
+}
+
+.invalid {
+  margin: 0;
+  font-size: 12px;
+  color: var(--dsw-alias-state-error-primary);
+}
+
+/* --- polish: header keyboard focus / press, unified motion, reduced-motion --- */
+.header:focus-visible {
+  outline: 2px solid var(--dsw-alias-state-business-primary);
+  outline-offset: -2px;
+}
+
+.header:active {
+  background: var(--dsw-alias-interactive-bg-hover);
+}
+
+.header,
+.discard,
+.save,
+.reset {
+  transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease, transform 120ms ease;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .card,
+  .header,
+  .chevron,
+  .discard,
+  .save,
+  .reset {
+    transition: none;
+  }
+}