dsh-taskboard 0.6.6 → 0.7.0

package/src/client/api.ts

@@ -7,6 +7,7 @@
  */
 import type {
   ApiResult,
+  AttachmentUpload,
   ChangeEvent,
   CreateTaskBody,
   DeleteTaskBody,
@@ -17,10 +18,14 @@ import type {
   MergeBranchResponse,
   ModelCatalogResponse,
   MoveTaskBody,
+  MoveTaskResponse,
+  SessionArchiveResult,
   PromptCompletionsResponse,
   RejectTaskBody,
   RunTaskBody,
   SettingsResponse,
+  StorageMigrationResult,
+  StorageStatus,
   StateResponse,
   TaskRecord,
   TaskTemplate,
@@ -58,6 +63,17 @@ async function post<T>(path: string, body: unknown): Promise<T> {
   return unwrap<T>(res)
 }
 
+/** Upload raw image bytes; a custom header keeps the route outside simple CSRF requests. */
+async function uploadImage(file: Blob): Promise<AttachmentUpload> {
+  const res = await fetch('/dsh-taskboard/assets', {
+    method: 'POST',
+    headers: { 'content-type': file.type, 'x-dsh-taskboard-upload': '1' },
+    body: file,
+    signal: AbortSignal.timeout(30_000),
+  })
+  return unwrap<AttachmentUpload>(res)
+}
+
 /** Route client face (the controller consumes this narrow surface). */
 export interface TaskboardClient {
   state(): Promise<StateResponse>
@@ -65,10 +81,13 @@ export interface TaskboardClient {
   create(body: CreateTaskBody): Promise<TaskSummary>
   get(id: string): Promise<TaskRecord>
   update(id: string, body: UpdateTaskBody): Promise<TaskSummary>
-  move(id: string, body: MoveTaskBody): Promise<TaskSummary>
+  move(id: string, body: MoveTaskBody): Promise<MoveTaskResponse>
+  archiveSessions?(id: string): Promise<SessionArchiveResult>
   /** Quick-reject (card ✗): back to todo + optional comment, one mutation. */
   reject(id: string, body: RejectTaskBody): Promise<TaskSummary>
   comment(id: string, bodyText: string): Promise<CommentRecord>
+  /** Persist an image and return the short Markdown-safe URL. */
+  uploadImage(file: Blob): Promise<AttachmentUpload>
   remove(id: string, body: DeleteTaskBody): Promise<{ trashed?: boolean; purged?: boolean }>
   /** Trigger a manual run (fresh in-project session); `reuse: true` = 续跑. */
   run(id: string, body?: RunTaskBody): Promise<{ executionId: string; sessionId: string }>
@@ -98,6 +117,11 @@ export interface TaskboardClient {
   settings(): Promise<SettingsResponse>
   /** Replace board settings (whole-object semantics; affects new tasks only). */
   updateSettings(body: UpdateSettingsBody): Promise<SettingsResponse>
+  /** Inspect and validate the host-side data directory. */
+  storage(): Promise<StorageStatus>
+  checkStorage(directory: string): Promise<StorageStatus>
+  /** Move ledger, templates, and attachments together. */
+  migrateStorage(directory: string): Promise<StorageMigrationResult>
   /** Prompt completions for skills and slash commands (0.5.5). */
   promptCompletions(): Promise<PromptCompletionsResponse>
   /** Model catalog and agent preset roster (0.5.5). */
@@ -115,8 +139,10 @@ export function createClient(): TaskboardClient {
     get: id => get<TaskRecord>(`/dsh-taskboard/tasks/${encodeURIComponent(id)}`),
     update: (id, body) => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/update`, body),
     move: (id, body) => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/move`, body),
+    archiveSessions: id => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/archive-sessions`, {}),
     reject: (id, body) => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/reject`, body),
     comment: (id, bodyText) => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/comment`, { body: bodyText }),
+    uploadImage,
     remove: (id, body) => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/delete`, body),
     run: (id, body) => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/run`, body ?? {}),
     cancel: id => post(`/dsh-taskboard/tasks/${encodeURIComponent(id)}/cancel`, {}),
@@ -138,6 +164,14 @@ export function createClient(): TaskboardClient {
     templateDelete: id => post('/dsh-taskboard/templates/delete', { id }),
     settings: () => get<SettingsResponse>('/dsh-taskboard/settings'),
     updateSettings: body => post('/dsh-taskboard/settings/update', body),
+    storage: () => get<StorageStatus>('/dsh-taskboard/storage'),
+    checkStorage: directory => post<StorageStatus>('/dsh-taskboard/storage/check', { directory }),
+    migrateStorage: directory => unwrap<StorageMigrationResult>(fetch('/dsh-taskboard/storage/migrate', {
+      method: 'POST',
+      headers: { 'content-type': 'application/json' },
+      body: JSON.stringify({ directory }),
+      signal: AbortSignal.timeout(120_000),
+    })),
     promptCompletions: () => get<PromptCompletionsResponse>('/dsh-taskboard/prompt-completions'),
     modelCatalog: () => get<ModelCatalogResponse>('/dsh-taskboard/model-catalog'),
     stream(onChange, onGap) {

package/src/client/board/SettingsModal.tsx

@@ -1,13 +1,12 @@
 /**
  * Board-settings modal (0.5.0): the user-owned defaults applied when a NEW
- * task is created without an explicit choice. Currently one section — 默认执行
- * 隔离 (worktree vs original directory); further sections can slot into the
- * body below. Saving goes through the host route (whole-object replace) and
+ * task is created without an explicit choice, plus the host data-directory
+ * migration surface. Saving goes through host routes and
  * the SSE change stream refreshes every open view.
  *
  * @module dsh-taskboard/client/board/SettingsModal
  */
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 import type { BoardController } from '../controller.ts'
 import { DEFAULT_ISOLATION, defaultPermissionOf, defaultSyncExternalSessionsOf, type IsolationMode, type PermissionMode } from '../../shared/protocol.ts'
 import { useT, type Translate } from '../i18n/runtime.ts'
@@ -32,7 +31,16 @@ export function SettingsModal({ controller }: { controller: BoardController }) {
   const [draftIso, setDraftIso] = useState<IsolationMode>(currentIso)
   const [draftSync, setDraftSync] = useState<boolean>(currentSync)
   const [draftPerm, setDraftPerm] = useState<PermissionMode>(currentPerm)
+  const [storagePath, setStoragePath] = useState(state.storage?.currentDirectory ?? '')
+  const [storageTouched, setStorageTouched] = useState(false)
+  const [storageBusy, setStorageBusy] = useState(false)
   const dirty = draftIso !== currentIso || draftSync !== currentSync || draftPerm !== currentPerm
+  const effectiveStoragePath = storagePath.trim().length === 0 ? state.storage?.defaultDirectory ?? '' : storagePath.trim()
+  const storageDirty = state.storage !== undefined && effectiveStoragePath !== state.storage.currentDirectory
+
+  useEffect(() => {
+    if (!storageTouched && state.storage !== undefined) setStoragePath(state.storage.currentDirectory)
+  }, [state.storage, storageTouched])
 
   const save = (): void => {
     void controller.updateSettings({
@@ -145,6 +153,61 @@ export function SettingsModal({ controller }: { controller: BoardController }) {
               {t('set.perm.current', { current: currentPerm === 'read-only' ? t('set.perm.readOnlyName') : currentPerm === 'danger-full-access' ? t('set.perm.fullName') : t('set.perm.writeName') })}
             </span>
           </section>
+
+          <section className="dsh-atb-diag-sec">
+            <h4>{t('set.storage.heading')}</h4>
+            <p className="dsh-atb-isolation-note">{t('set.storage.hint')}</p>
+            <input
+              className="dsh-atb-input dsh-atb-storage-path"
+              value={storagePath}
+              disabled={state.storage === undefined || storageBusy}
+              placeholder={state.storage?.defaultDirectory ?? t('set.storage.loading')}
+              onChange={e => { setStoragePath(e.target.value); setStorageTouched(true) }}
+            />
+            {state.storage !== undefined && (
+              <div className="dsh-atb-storage-meta">
+                <span>{t('set.storage.current', { path: state.storage.currentDirectory })}</span>
+                <span>{t('set.storage.assets', { count: state.storage.assetCount, size: (state.storage.assetBytes / 1024 / 1024).toFixed(1) })}</span>
+                {state.storage.error !== undefined && <span className="dsh-atb-storage-error">{state.storage.error}</span>}
+              </div>
+            )}
+            <div className="dsh-atb-storage-actions">
+              <button
+                type="button"
+                className="dsh-atb-btn"
+                disabled={state.storage === undefined || storageBusy}
+                onClick={() => { setStoragePath(state.storage?.defaultDirectory ?? ''); setStorageTouched(true) }}
+              >
+                {t('set.storage.default')}
+              </button>
+              <button
+                type="button"
+                className="dsh-atb-btn"
+                disabled={state.storage === undefined || storageBusy || effectiveStoragePath.length === 0}
+                onClick={() => {
+                  setStorageBusy(true)
+                  void controller.checkStorage(effectiveStoragePath).finally(() => setStorageBusy(false))
+                }}
+              >
+                {t('set.storage.check')}
+              </button>
+              <button
+                type="button"
+                className="dsh-atb-btn"
+                data-primary="true"
+                disabled={!storageDirty || storageBusy}
+                onClick={() => {
+                  if (!window.confirm(t('set.storage.confirm', { from: state.storage?.currentDirectory ?? '', to: effectiveStoragePath }))) return
+                  setStorageBusy(true)
+                  void controller.migrateStorage(effectiveStoragePath).then(ok => {
+                    if (ok) { setStorageTouched(false); setStoragePath(effectiveStoragePath) }
+                  }).finally(() => setStorageBusy(false))
+                }}
+              >
+                {storageBusy ? t('set.storage.migrating') : t('set.storage.migrate')}
+              </button>
+            </div>
+          </section>
         </div>
 
         <div className="dsh-atb-modal-foot">

package/src/client/board/SlashPromptInput.tsx

@@ -11,6 +11,7 @@ import { createPortal } from 'react-dom'
 import type { BoardController } from '../controller.ts'
 import type { PromptCompletionItem } from '../../shared/api.ts'
 import { useT, type Translate } from '../i18n/runtime.ts'
+import { IMAGE_ACCEPT, acceptedImageFiles, imageAlt, imageMarkdown, insertImageMarkdown } from '../image-insert.ts'
 
 /** Default built-in slash commands (descriptions resolve through t at render,
  * so they follow the GUI language live; host-provided items override by name). */
@@ -65,6 +66,8 @@ export interface SlashPromptInputProps {
   autoFocus?: boolean
   className?: string
   ariaLabel?: string
+  allowImages?: boolean
+  onUploadingChange?: (uploading: boolean) => void
 }
 
 /**
@@ -81,11 +84,14 @@ export function SlashPromptInput({
   autoFocus = false,
   className,
   ariaLabel,
+  allowImages = false,
+  onUploadingChange,
 }: SlashPromptInputProps) {
   const t = useT()
   const textareaRef = useRef<HTMLTextAreaElement>(null)
   const popupRef = useRef<HTMLDivElement>(null)
   const listRef = useRef<HTMLDivElement>(null)
+  const fileInputRef = useRef<HTMLInputElement>(null)
   // Inline fixed-position style for the portaled popup (set by positionPopup).
   const [popupStyle, setPopupStyle] = useState<CSSProperties>({})
 
@@ -106,6 +112,40 @@ export function SlashPromptInput({
   const [slashQuery, setSlashQuery] = useState('')
   const [slashStart, setSlashStart] = useState(-1)
   const [selectedIndex, setSelectedIndex] = useState(0)
+  const [uploading, setUploading] = useState(false)
+
+  const uploadFiles = async (rawFiles: Iterable<File>): Promise<void> => {
+    const files = acceptedImageFiles(rawFiles)
+    if (!allowImages || controller === undefined || files.length === 0 || uploading) return
+    setUploading(true)
+    onUploadingChange?.(true)
+    const element = textareaRef.current
+    let nextValue = element?.value ?? value
+    let start = element?.selectionStart ?? nextValue.length
+    let end = element?.selectionEnd ?? start
+    let changed = false
+    try {
+      for (const file of files) {
+        const asset = await controller.uploadImage(file)
+        if (asset === undefined) continue
+        const next = insertImageMarkdown(nextValue, start, end, imageMarkdown(asset, imageAlt(file.name, t('image.defaultAlt'))))
+        nextValue = next.value
+        start = next.cursor
+        end = start
+        changed = true
+      }
+      if (changed) {
+        onChange(nextValue)
+        setTimeout(() => {
+          textareaRef.current?.focus()
+          textareaRef.current?.setSelectionRange(start, start)
+        }, 0)
+      }
+    } finally {
+      setUploading(false)
+      onUploadingChange?.(false)
+    }
+  }
 
   // Fetch host completions if controller provided
   useEffect(() => {
@@ -282,7 +322,7 @@ export function SlashPromptInput({
           value={value}
           rows={rows}
           maxLength={maxLength}
-          disabled={disabled}
+          disabled={disabled || uploading}
           autoFocus={autoFocus}
           placeholder={placeholder}
           aria-label={ariaLabel}
@@ -293,6 +333,25 @@ export function SlashPromptInput({
           onKeyUp={checkSlashTrigger}
           onClick={checkSlashTrigger}
           onKeyDown={handleKeyDown}
+          onPaste={e => {
+            const files = acceptedImageFiles(e.clipboardData.files)
+            if (allowImages && files.length > 0) {
+              e.preventDefault()
+              void uploadFiles(files)
+            }
+          }}
+          onDragOver={e => {
+            // Browsers keep DataTransfer.files empty while dragging over a
+            // page; the concrete files become readable only on drop.
+            if (allowImages && e.dataTransfer.types.includes('Files')) e.preventDefault()
+          }}
+          onDrop={e => {
+            const files = acceptedImageFiles(e.dataTransfer.files)
+            if (allowImages && files.length > 0) {
+              e.preventDefault()
+              void uploadFiles(files)
+            }
+          }}
         />
 
         {/* Slash Autocomplete Popup — portaled to document.body so the
@@ -329,6 +388,26 @@ export function SlashPromptInput({
         )}
       </div>
 
+      {allowImages && (
+        <div className="dsh-atb-image-actions">
+          <input
+            ref={fileInputRef}
+            type="file"
+            accept={IMAGE_ACCEPT}
+            multiple
+            hidden
+            onChange={e => {
+              if (e.target.files !== null) void uploadFiles(e.target.files)
+              e.target.value = ''
+            }}
+          />
+          <button type="button" className="dsh-atb-image-add" disabled={disabled || uploading} onClick={() => fileInputRef.current?.click()}>
+            {uploading ? t('image.uploading') : t('image.add')}
+          </button>
+          <span className="dsh-atb-image-hint">{t('image.hint')}</span>
+        </div>
+      )}
+
       {/* Bottom helper toolbar */}
       <div className="dsh-atb-prompt-foot">
         <span className="dsh-atb-prompt-tip">

package/src/client/board/TaskBoard.tsx

@@ -11,6 +11,7 @@ import { MAIN_STATUSES, canTransition } from '../../shared/protocol.ts'
 import { PLUGIN_VERSION } from '../../shared/version.ts'
 import { COLUMN_KEYS, URGENCY_KEYS } from './labels.ts'
 import { useT } from '../i18n/runtime.ts'
+import { localizeBuiltinName, localizeBuiltinTask } from '../i18n/templates.ts'
 import { fmtTime, isStaleClaim } from './format.ts'
 import { DRAG_TYPE, TaskCard } from './TaskCard.tsx'
 import { TaskDetail } from './TaskDetail.tsx'
@@ -88,17 +89,21 @@ export function TaskBoard({ controller }: { controller: BoardController }) {
               <div className="dsh-atb-newmenu-backdrop" onClick={closeMenu} />
               <div className="dsh-atb-newmenu-list">
                 <button type="button" className="dsh-atb-newmenu-opt" onClick={() => { closeMenu(); controller.setComposer(true) }}>{t('board.action.blankTask')}</button>
-                {state.templates.map(t => (
-                  <button
-                    key={t.id}
-                    type="button"
-                    className="dsh-atb-newmenu-opt"
-                    title={t.task.description !== undefined && t.task.description.length > 0 ? t.task.description.slice(0, 120) : t.name}
-                    onClick={() => { closeMenu(); controller.newFromTemplate(t.task) }}
-                  >
-                    {t.name}
-                  </button>
-                ))}
+                {state.templates.map(t => {
+                  const name = localizeBuiltinName(t)
+                  const spec = localizeBuiltinTask(t)
+                  return (
+                    <button
+                      key={t.id}
+                      type="button"
+                      className="dsh-atb-newmenu-opt"
+                      title={spec.description !== undefined && spec.description.length > 0 ? spec.description.slice(0, 120) : name}
+                      onClick={() => { closeMenu(); controller.newFromTemplate(spec) }}
+                    >
+                      {name}
+                    </button>
+                  )
+                })}
                 <div className="dsh-atb-newmenu-sep" />
                 <button type="button" className="dsh-atb-newmenu-opt" onClick={() => { closeMenu(); controller.openTemplateManager() }}>{t('board.action.manageTemplates')}</button>
               </div>

package/src/client/board/TaskDetail.tsx

@@ -7,14 +7,15 @@
  *
  * @module dsh-taskboard/client/board/TaskDetail
  */
-import { useEffect, useState, type ReactNode } from 'react'
+import { useEffect, useRef, useState, type ReactNode } from 'react'
 import type { BoardController } from '../controller.ts'
-import type { ExecutionRecord, TaskRecord } from '../../shared/protocol.ts'
-import { canTransition, checklistProgress } from '../../shared/protocol.ts'
+import type { CommentRecord, ExecutionRecord, TaskRecord } from '../../shared/protocol.ts'
+import { canTransition, checklistProgress, taskAssociatedSessionIds } from '../../shared/protocol.ts'
 import { useAlert } from './AlertModal.tsx'
 import { fmtTime, isStaleClaim } from './format.ts'
 import { MOVE_KEYS, OUTCOME_KEYS, STATUS_KEYS, URGENCY_KEYS } from './labels.ts'
-import { useT } from '../i18n/runtime.ts'
+import { useT, type Translate } from '../i18n/runtime.ts'
+import { IMAGE_ACCEPT, acceptedImageFiles, imageAlt, imageMarkdown, insertImageMarkdown } from '../image-insert.ts'
 
 /** Statuses a user may move this task to, per the state machine. */
 function moveTargets(task: TaskRecord): TaskRecord['status'][] {
@@ -28,6 +29,26 @@ function shortId(id: string | undefined): string {
   return id.replace(/^session-(taskboard-)?/, '').slice(0, 8)
 }
 
+/**
+ * Render a comment body, localizing host-generated system messages (0.6.4).
+ * System comments carry a `systemKey` (+ flat params, or structured per-repo
+ * rows for the multi-repo merge summary); user/agent comments render raw.
+ */
+export function commentBody(t: Translate, c: CommentRecord): string {
+  if (c.systemKey === undefined) return c.body
+  if (c.systemRows !== undefined) {
+    const summary = c.systemRows
+      .map(r => {
+        const label = r.repo === '' ? t('iso.repo.root') : r.repo
+        const mark = r.outcome === 'merged' ? '✓' : r.outcome === 'noop' ? '⟲' : '✗'
+        return r.outcome === 'failed' && r.error !== undefined ? `${label} ${mark} ${r.error}` : `${label} ${mark}`
+      })
+      .join(' · ')
+    return t(c.systemKey, { summary })
+  }
+  return t(c.systemKey, c.systemParams)
+}
+
 /** Execution duration between start and end. */
 function duration(startedAt: number | undefined, endedAt: number | undefined): string {
   if (startedAt === undefined || endedAt === undefined) return ''
@@ -494,9 +515,13 @@ function IsolationBlock({ task, controller }: { task: TaskRecord; controller: Bo
 export function TaskDetail({ task, controller, now }: { task: TaskRecord; controller: BoardController; now?: number }) {
   const t = useT()
   const [comment, setComment] = useState('')
+  const [commentUploading, setCommentUploading] = useState(false)
+  const commentRef = useRef<HTMLTextAreaElement>(null)
+  const commentFileRef = useRef<HTMLInputElement>(null)
   const [confirmDone, setConfirmDone] = useState(false)
   const [confirmPurge, setConfirmPurge] = useState(false)
   const [confirmCancel, setConfirmCancel] = useState(false)
+  const [confirmArchive, setConfirmArchive] = useState(false)
   // Top action buttons (duplicate / save-as-template / run / reuse-run)
   // share one in-flight guard: a double click used to fire duplicate runs or
   // copies while the first round-trip was still pending (review P0).
@@ -510,6 +535,9 @@ export function TaskDetail({ task, controller, now }: { task: TaskRecord; contro
   const unchecked = (task.checklist ?? []).filter(i => !i.checked).length
   const sessionExecution = [...task.executions].reverse().find(e => e.sessionId !== undefined)
   const targetSessionId = runningExecution?.sessionId ?? sessionExecution?.sessionId ?? (task.claimedBy?.startsWith('session-') ? task.claimedBy : undefined)
+  const associatedSessions = taskAssociatedSessionIds(task)
+  const archiveState = controller.getSnapshot()
+  const archiveResult = archiveState.sessionArchive?.taskId === task.id ? archiveState.sessionArchive.result : undefined
 
   /** Fire one top action under the shared busy guard; re-enable on settle. */
   const runAction = (action: () => Promise<unknown>): void => {
@@ -518,6 +546,42 @@ export function TaskDetail({ task, controller, now }: { task: TaskRecord; contro
     void action().catch(() => undefined).finally(() => setActionBusy(false))
   }
 
+  const postComment = (): void => {
+    if (commentUploading || comment.trim().length === 0) return
+    void controller.comment(task.id, comment).then(ok => { if (ok) setComment('') })
+  }
+
+  const uploadCommentImages = async (rawFiles: Iterable<File>): Promise<void> => {
+    const files = acceptedImageFiles(rawFiles)
+    if (files.length === 0 || commentUploading) return
+    setCommentUploading(true)
+    const element = commentRef.current
+    let nextValue = element?.value ?? comment
+    let start = element?.selectionStart ?? nextValue.length
+    let end = element?.selectionEnd ?? start
+    let changed = false
+    try {
+      for (const file of files) {
+        const asset = await controller.uploadImage(file)
+        if (asset === undefined) continue
+        const next = insertImageMarkdown(nextValue, start, end, imageMarkdown(asset, imageAlt(file.name, t('image.defaultAlt'))))
+        nextValue = next.value
+        start = next.cursor
+        end = start
+        changed = true
+      }
+      if (changed) {
+        setComment(nextValue)
+        setTimeout(() => {
+          commentRef.current?.focus()
+          commentRef.current?.setSelectionRange(start, start)
+        }, 0)
+      }
+    } finally {
+      setCommentUploading(false)
+    }
+  }
+
   /** Jump to an execution's session; prompt precisely when it cannot open. */
   const jumpToSession = (sessionId: string): void => {
     void controller.openSession(sessionId).then(result => {
@@ -680,10 +744,21 @@ export function TaskDetail({ task, controller, now }: { task: TaskRecord; contro
 
       <ChecklistBlock task={task} controller={controller} />
 
+      {archiveResult !== undefined && (
+        <div role="status" className="dsh-atb-confirm">
+          <span>{t('detail.move.archiveResult', { n: archiveResult.archived.length })}</span>
+          {archiveResult.failed.map(item => <span key={item.sessionId}>{item.sessionId}: {item.error}</span>)}
+          {archiveResult.unsupported.length > 0 && <span>{t('detail.move.archiveUnsupported')} {archiveResult.unsupported.join(', ')}</span>}
+        </div>
+      )}
+      {task.status === 'archived' && associatedSessions.length > 0 && archiveState.archiveSessionsSupported && (
+        <button type="button" className="dsh-atb-btn" disabled={actionBusy} onClick={() => runAction(() => controller.retryArchiveSessions(task.id))}>{t('detail.move.archiveRetry')}</button>
+      )}
       <div className="dsh-atb-detail-actions">
         <div className="dsh-atb-movebtns">
-          {moveTargets(task).map(to => to === 'done'
-            ? (confirmDone
+          {moveTargets(task).map(to => {
+            if (to === 'done') {
+              return confirmDone
                 ? (
                     <span key={to} className="dsh-atb-confirm">
                       <span className="dsh-atb-confirm-label" data-tone={unchecked > 0 ? 'bad' : undefined}>
@@ -693,12 +768,83 @@ export function TaskDetail({ task, controller, now }: { task: TaskRecord; contro
                       <button type="button" className="dsh-atb-btn" onClick={() => setConfirmDone(false)}>{t('shared.cancel')}</button>
                     </span>
                   )
-                : <button key={to} type="button" className="dsh-atb-movebtn" data-to={to} onClick={() => setConfirmDone(true)}>{t('detail.move.to', { status: t(MOVE_KEYS[to]) })}</button>)
-            : (
-                <button key={to} type="button" className="dsh-atb-movebtn" data-to={to} onClick={() => void controller.move(task.id, task.version, to)}>
+                : <button key={to} type="button" className="dsh-atb-movebtn" data-to={to} onClick={() => { setConfirmDone(true); setConfirmArchive(false) }}>{t('detail.move.to', { status: t(MOVE_KEYS[to]) })}</button>
+            }
+            if (to === 'archived') {
+              if (confirmArchive) {
+                return (
+                  <span key={to} className="dsh-atb-confirm">
+                    <span className="dsh-atb-confirm-label">
+                      {associatedSessions.length === 1
+                        ? t('detail.move.confirmArchiveSessionWithId', { id: shortId(associatedSessions[0]) })
+                        : associatedSessions.length > 1
+                          ? t('detail.move.confirmArchiveSessionCount', { n: associatedSessions.length })
+                          : t('detail.move.confirmArchive')}
+                    </span>
+                    {associatedSessions.length > 0 && <span className="dsh-atb-confirm-label">{associatedSessions.join(', ')}</span>}
+                    {associatedSessions.length > 0 ? (
+                      <>
+                        <button
+                          type="button"
+                          className="dsh-atb-btn"
+                          disabled={!archiveState.archiveSessionsSupported || actionBusy}
+                          title={!archiveState.archiveSessionsSupported ? t('detail.move.archiveUnsupported') : undefined}
+                          onClick={() => {
+                            runAction(() => controller.move(task.id, task.version, 'archived', { archiveSessions: true }))
+                            setConfirmArchive(false)
+                          }}
+                        >
+                          {t('detail.move.archiveWithSession')}
+                        </button>
+                        <button
+                          type="button"
+                          className="dsh-atb-btn"
+                          onClick={() => {
+                            runAction(() => controller.move(task.id, task.version, 'archived', { archiveSessions: false }))
+                            setConfirmArchive(false)
+                          }}
+                        >
+                          {t('detail.move.archiveCardOnly')}
+                        </button>
+                      </>
+                    ) : (
+                      <button
+                        type="button"
+                        className="dsh-atb-btn"
+                        data-primary="true"
+                        onClick={() => {
+                          void controller.move(task.id, task.version, 'archived')
+                          setConfirmArchive(false)
+                        }}
+                      >
+                        {t('detail.move.confirm')}
+                      </button>
+                    )}
+                    <button type="button" className="dsh-atb-btn" onClick={() => setConfirmArchive(false)}>{t('shared.cancel')}</button>
+                  </span>
+                )
+              }
+              return (
+                <button
+                  key={to}
+                  type="button"
+                  className="dsh-atb-movebtn"
+                  data-to={to}
+                  onClick={() => {
+                    setConfirmArchive(true)
+                    setConfirmDone(false)
+                  }}
+                >
                   {t('detail.move.to', { status: t(MOVE_KEYS[to]) })}
                 </button>
-              ))}
+              )
+            }
+            return (
+              <button key={to} type="button" className="dsh-atb-movebtn" data-to={to} onClick={() => void controller.move(task.id, task.version, to)}>
+                {t('detail.move.to', { status: t(MOVE_KEYS[to]) })}
+              </button>
+            )
+          })}
           <button type="button" className="dsh-atb-movebtn" data-to="blocked" onClick={() => void controller.toggleBlocked(task)}>
             {task.blocked ? t('detail.blocked.unmark') : t('detail.blocked.mark')}
           </button>
@@ -730,7 +876,7 @@ export function TaskDetail({ task, controller, now }: { task: TaskRecord; contro
                         <b>{c.threadId !== undefined ? `agent ${shortId(c.threadId)}` : t('detail.comments.user')}</b>
                         <span>{fmtTime(c.createdAt)}</span>
                       </div>
-                      <div className="dsh-atb-bubble-body">{c.body}</div>
+                      <div className="dsh-atb-bubble-body"><MarkdownContent text={commentBody(t, c)} /></div>
                     </div>
                   </div>
                 ))}
@@ -738,24 +884,47 @@ export function TaskDetail({ task, controller, now }: { task: TaskRecord; contro
             )}
         <div className="dsh-atb-composer">
           <textarea
+            ref={commentRef}
             className="dsh-atb-composer-input"
             value={comment}
             placeholder={t('detail.composer.placeholder')}
+            disabled={commentUploading}
             onChange={e => setComment(e.target.value)}
             onKeyDown={e => {
-              if ((e.ctrlKey || e.metaKey) && e.key === 'Enter' && comment.trim().length > 0) {
+              if ((e.ctrlKey || e.metaKey) && e.key === 'Enter' && comment.trim().length > 0 && !commentUploading) {
                 // T13: keep the draft when the post fails (reject 表单同样保留).
-                void controller.comment(task.id, comment).then(ok => { if (ok) setComment('') })
+                postComment()
               }
             }}
+            onPaste={e => {
+              const files = acceptedImageFiles(e.clipboardData.files)
+              if (files.length > 0) { e.preventDefault(); void uploadCommentImages(files) }
+            }}
+            onDragOver={e => { if (e.dataTransfer.types.includes('Files')) e.preventDefault() }}
+            onDrop={e => {
+              const files = acceptedImageFiles(e.dataTransfer.files)
+              if (files.length > 0) { e.preventDefault(); void uploadCommentImages(files) }
+            }}
           />
+          <input
+            ref={commentFileRef}
+            type="file"
+            accept={IMAGE_ACCEPT}
+            multiple
+            hidden
+            onChange={e => {
+              if (e.target.files !== null) void uploadCommentImages(e.target.files)
+              e.target.value = ''
+            }}
+          />
+          <button type="button" className="dsh-atb-image-add" disabled={commentUploading} title={t('image.add')} onClick={() => commentFileRef.current?.click()}>
+            {commentUploading ? '…' : '🖼'}
+          </button>
           <button
             type="button"
             className="dsh-atb-composer-send"
-            disabled={comment.trim().length === 0}
-            onClick={() => {
-              void controller.comment(task.id, comment).then(ok => { if (ok) setComment('') })
-            }}
+            disabled={comment.trim().length === 0 || commentUploading}
+            onClick={postComment}
           >
             {t('detail.composer.send')}
           </button>