修复审批请求在聊天中无提示且无法响应 (#467)

* fix: support run approval prompts in chat * fix(chat): render approval prompts * fix(chat): dedupe approval pattern labels * chore: sync approval flow with current main - update Hermes Agent approval support guidance to PR #21899 - initialize Hermes table schemas in session-sync tests
2026-05-08 16:59:36 +02:00
parent 51fde26797
commit 56c7b59eaf
12 changed files with 767 additions and 9 deletions
@@ -1,4 +1,5 @@
 import { io, type Socket } from 'socket.io-client'
+import type { ApprovalChoice } from '../../utils/approval-commands'
 import { request, getBaseUrlValue, getApiKey } from '../client'

 export type ContentBlock =
@@ -39,6 +40,14 @@ export interface RunEvent {
  /** Final response text on `run.completed`. May be empty/null if the agent
   * silently swallowed an upstream error — see chat store for fallback. */
  output?: string | null
+  command?: string
+  description?: string
+  pattern_key?: string
+  pattern_keys?: string[]
+  choices?: ApprovalChoice[]
+  resolved?: number
+  choice?: ApprovalChoice
+  all?: boolean
  usage?: {
    input_tokens: number
    output_tokens: number
@@ -75,6 +84,8 @@ const sessionEventHandlers = new Map<string, {
  onCompressionCompleted: (event: RunEvent) => void
  onAbortStarted: (event: RunEvent) => void
  onAbortCompleted: (event: RunEvent) => void
+  onApprovalRequest: (event: RunEvent) => void
+  onApprovalResponded: (event: RunEvent) => void
  onUsageUpdated: (event: RunEvent) => void
  onRunQueued?: (event: RunEvent) => void
 }>()
@@ -275,6 +286,32 @@ function globalAbortCompletedHandler(event: RunEvent): void {
  sessionEventHandlers.delete(sid)
 }

+/**
+ * Global approval.request event handler
+ */
+function globalApprovalRequestHandler(event: RunEvent): void {
+  const sid = event.session_id
+  if (!sid) return
+
+  const handlers = sessionEventHandlers.get(sid)
+  if (handlers?.onApprovalRequest) {
+    handlers.onApprovalRequest(event)
+  }
+}
+
+/**
+ * Global approval.responded event handler
+ */
+function globalApprovalRespondedHandler(event: RunEvent): void {
+  const sid = event.session_id
+  if (!sid) return
+
+  const handlers = sessionEventHandlers.get(sid)
+  if (handlers?.onApprovalResponded) {
+    handlers.onApprovalResponded(event)
+  }
+}
+
 /**
 * Global usage.updated event handler
 */
@@ -310,6 +347,8 @@ export function registerSessionHandlers(
    onCompressionCompleted: (event: RunEvent) => void
    onAbortStarted: (event: RunEvent) => void
    onAbortCompleted: (event: RunEvent) => void
+    onApprovalRequest: (event: RunEvent) => void
+    onApprovalResponded: (event: RunEvent) => void
    onUsageUpdated: (event: RunEvent) => void
    onRunQueued?: (event: RunEvent) => void
  }
@@ -392,6 +431,11 @@ export function connectChatRun(): Socket {
    chatRunSocket.on('abort.started', globalAbortStartedHandler)
    chatRunSocket.on('abort.completed', globalAbortCompletedHandler)

+    // Approval events
+    chatRunSocket.on('approval.requested', globalApprovalRequestHandler)
+    chatRunSocket.on('approval.request', globalApprovalRequestHandler)
+    chatRunSocket.on('approval.responded', globalApprovalRespondedHandler)
+
    // Usage events
    chatRunSocket.on('usage.updated', globalUsageUpdatedHandler)

@@ -519,6 +563,14 @@ export function startRunViaSocket(
      closed = true
      onDone()
    },
+    onApprovalRequest: (evt: RunEvent) => {
+      if (closed) return
+      onEvent(evt)
+    },
+    onApprovalResponded: (evt: RunEvent) => {
+      if (closed) return
+      onEvent(evt)
+    },
    onUsageUpdated: (evt: RunEvent) => {
      if (closed) return
      onEvent(evt)
@@ -544,6 +596,16 @@ export function startRunViaSocket(
  }
 }

+export function submitApprovalViaSocket(
+  sessionId: string,
+  choice: ApprovalChoice,
+  all = false,
+): Socket {
+  const socket = connectChatRun()
+  socket.emit('approval.respond', { session_id: sessionId, choice, all })
+  return socket
+}
+
 export async function fetchModels(): Promise<{ data: Array<{ id: string }> }> {
  return request('/api/hermes/v1/models')
 }
@@ -195,7 +195,7 @@ function handleDrop(e: DragEvent) {

 function handleSend() {
  const text = inputText.value.trim()
-  if (!text && attachments.value.length === 0) return
+  if (!canSend.value) return

  chatStore.sendMessage(text, attachments.value.length > 0 ? attachments.value : undefined)
  inputText.value = ''
@@ -595,11 +595,15 @@ onBeforeUnmount(() => {
              <MarkdownRenderer v-else-if="message.content" :content="message.content" />
            </template>

-            <!-- Render assistant message content -->
+            <!-- Render assistant/system message content -->
            <MarkdownRenderer
              v-if="message.role === 'assistant' && message.content && !parsedThinking.body"
              :content="message.content"
            />
+            <MarkdownRenderer
+              v-else-if="message.role === 'system' && message.content"
+              :content="message.content"
+            />

            <span v-if="message.isStreaming && !message.content" class="streaming-dots">
              <span></span><span></span><span></span>
@@ -1,4 +1,4 @@
-import { startRunViaSocket, resumeSession, registerSessionHandlers, unregisterSessionHandlers, getChatRunSocket, type RunEvent, type ContentBlock as ContentBlockImport } from '@/api/hermes/chat'
+import { startRunViaSocket, resumeSession, registerSessionHandlers, unregisterSessionHandlers, getChatRunSocket, submitApprovalViaSocket, type RunEvent, type ContentBlock as ContentBlockImport } from '@/api/hermes/chat'
 import { deleteSession as deleteSessionApi, fetchSession, fetchSessions, type HermesMessage, type SessionSummary } from '@/api/hermes/sessions'
 import { getApiKey } from '@/api/client'
 import { defineStore } from 'pinia'
@@ -8,6 +8,7 @@ import { useProfilesStore } from './profiles'
 import { useSettingsStore } from './settings'
 import { primeCompletionSound, playCompletionSound } from '@/utils/completion-sound'
 import { detectThinkingBoundary } from '@/utils/thinking-parser'
+import { parseApprovalCommand } from '@/utils/approval-commands'

 // Re-export ContentBlock for convenience
 export type ContentBlock = ContentBlockImport
@@ -496,6 +497,10 @@ export const useChatStore = defineStore('chat', () => {
                  compressed: e.compressed ?? false,
                  error: e.error,
                })
+              } else if (e.event === 'approval.requested' || e.event === 'approval.request') {
+                addApprovalRequestMessage(sessionId, { ...e, event: 'approval.request' })
+              } else if (e.event === 'approval.responded') {
+                addApprovalResponseMessage(sessionId, e)
              } else if (e.event === 'abort.started') {
                setAbortState({ aborting: true, synced: null })
              } else if (e.event === 'abort.completed') {
@@ -628,6 +633,88 @@ export const useChatStore = defineStore('chat', () => {
    target.updatedAt = Date.now()
  }

+  function addApprovalRequestMessage(sessionId: string, evt: RunEvent) {
+    const msgs = getSessionMsgs(sessionId)
+    const last = msgs[msgs.length - 1]
+    if (last?.isStreaming) {
+      updateMessage(sessionId, last.id, { isStreaming: false })
+    }
+
+    const command = (evt.command || '').trim()
+    const description = (evt.description || '').trim()
+    const patterns = Array.from(new Set([
+      ...((evt as any).pattern_keys || []),
+      evt.pattern_key,
+    ].filter(Boolean))) as string[]
+    const patternText = patterns.join(', ')
+    const choices = Array.isArray(evt.choices) && evt.choices.length > 0
+      ? evt.choices
+      : ['once', 'session', 'always', 'deny']
+    const alreadyShown = msgs.some(m =>
+      m.role === 'system' &&
+      m.content.includes('Approval required') &&
+      (!command || m.content.includes(command)) &&
+      (!description || m.content.includes(description)) &&
+      (!patternText || m.content.includes(patternText)),
+    )
+    if (alreadyShown) return
+
+    const details = [
+      description ? `Reason: ${description}` : '',
+      patternText ? `Patterns: ${patternText}` : '',
+      choices.length ? `Choices: ${choices.join(', ')}` : '',
+      command ? `Command:\n\`\`\`\n${command}\n\`\`\`` : '',
+    ].filter(Boolean).join('\n\n')
+
+    addMessage(sessionId, {
+      id: uid(),
+      role: 'system',
+      content: `Approval required\n\n${details || 'The agent is waiting for your approval.'}\n\nReply with /approve to approve once, /approve session, /approve always, or /deny. Use /approve all or /deny all only to resolve all currently pending approval requests for this run.`,
+      timestamp: Date.now(),
+    })
+  }
+
+  function addApprovalResponseMessage(sessionId: string, evt: RunEvent) {
+    const choiceLabel = (() => {
+      switch (evt.choice) {
+        case 'once': return 'approved once'
+        case 'session': return 'approved for this session'
+        case 'always': return 'always allowed'
+        case 'deny': return 'denied'
+        default: return 'resolved'
+      }
+    })()
+    const resolved = typeof evt.resolved === 'number' ? evt.resolved : 0
+    const error = (evt as any).error
+    const content = error
+      ? `Approval response failed: ${error}`
+      : resolved > 0
+        ? `Approval ${choiceLabel}. Resolved ${resolved} pending request${resolved === 1 ? '' : 's'}.`
+        : `No pending approval request was found to ${evt.choice || 'resolve'}.`
+    const msgs = getSessionMsgs(sessionId)
+    const alreadyShown = msgs.some(m => m.role === 'system' && m.content === content)
+    if (alreadyShown) return
+    addMessage(sessionId, {
+      id: uid(),
+      role: 'system',
+      content,
+      timestamp: Date.now(),
+    })
+  }
+
+  function submitApprovalCommand(sessionId: string, content: string): boolean {
+    const approval = parseApprovalCommand(content)
+    if (!approval) return false
+    addMessage(sessionId, {
+      id: uid(),
+      role: 'user',
+      content: content.trim(),
+      timestamp: Date.now(),
+    })
+    submitApprovalViaSocket(sessionId, approval.choice, approval.all)
+    return true
+  }
+
  function primeCompletionBellIfEnabled() {
    if (useSettingsStore().display.bell_on_complete) {
      primeCompletionSound()
@@ -641,7 +728,13 @@ export const useChatStore = defineStore('chat', () => {
  }

  async function sendMessage(content: string, attachments?: Attachment[]) {
-    if ((!content.trim() && !(attachments && attachments.length > 0))) return
+    const trimmed = content.trim()
+    if (isStreaming.value) {
+      const sid = activeSessionId.value
+      if (sid && !attachments?.length && submitApprovalCommand(sid, trimmed)) return
+    }
+
+    if ((!trimmed && !(attachments && attachments.length > 0))) return

    primeCompletionBellIfEnabled()

@@ -950,6 +1043,17 @@ export const useChatStore = defineStore('chat', () => {
              break
            }

+            case 'approval.request':
+            case 'approval.requested': {
+              addApprovalRequestMessage(sid, { ...evt, event: 'approval.request' })
+              break
+            }
+
+            case 'approval.responded': {
+              addApprovalResponseMessage(sid, evt)
+              break
+            }
+
            case 'run.completed': {
              const msgs = getSessionMsgs(sid)
              const lastMsg = activeAssistantMessageId
@@ -1361,6 +1465,17 @@ export const useChatStore = defineStore('chat', () => {
          break
        }

+        case 'approval.request':
+        case 'approval.requested': {
+          addApprovalRequestMessage(sid, { ...evt, event: 'approval.request' })
+          break
+        }
+
+        case 'approval.responded': {
+          addApprovalResponseMessage(sid, evt)
+          break
+        }
+
        case 'run.completed': {
          const hasQueue = (evt as any).queue_remaining > 0
          if (hasQueue) {
@@ -1509,6 +1624,8 @@ export const useChatStore = defineStore('chat', () => {
      onCompressionCompleted: (evt) => handleEvent(evt),
      onAbortStarted: (evt) => handleEvent(evt),
      onAbortCompleted: (evt) => handleEvent(evt),
+      onApprovalRequest: (evt) => handleEvent(evt),
+      onApprovalResponded: (evt) => handleEvent(evt),
      onUsageUpdated: (evt) => handleEvent(evt),
      onRunQueued: (evt) => handleEvent(evt),
    })
@@ -0,0 +1,29 @@
+export type ApprovalChoice = 'once' | 'session' | 'always' | 'deny'
+
+export interface ApprovalCommand {
+  choice: ApprovalChoice
+  all: boolean
+}
+
+const APPROVAL_COMMAND_RE = /^\/(approve|deny)(?:\s+(session|always|all))?\s*$/i
+
+export function parseApprovalCommand(input: string): ApprovalCommand | null {
+  const match = input.trim().match(APPROVAL_COMMAND_RE)
+  if (!match) return null
+
+  const verb = match[1].toLowerCase()
+  const modifier = match[2]?.toLowerCase()
+
+  if (verb === 'deny') {
+    if (modifier && modifier !== 'all') return null
+    return { choice: 'deny', all: modifier === 'all' }
+  }
+
+  if (modifier === 'session') return { choice: 'session', all: false }
+  if (modifier === 'always') return { choice: 'always', all: false }
+  return { choice: 'once', all: modifier === 'all' }
+}
+
+export function isApprovalCommand(input: string): boolean {
+  return parseApprovalCommand(input) != null
+}
@@ -149,6 +149,8 @@ interface SessionMessage {
  codex_reasoning_items?: string | null
 }

+type ApprovalChoice = 'once' | 'session' | 'always' | 'deny'
+
 interface QueuedRun {
  queue_id: string
  input: string | ContentBlock[]
@@ -268,6 +270,13 @@ export class ChatRunSocket {
        void this.handleAbort(socket, data.session_id)
      }
    })
+
+    socket.on('approval.respond', (data: { session_id?: string; choice?: ApprovalChoice; all?: boolean }) => {
+      const choice = data.choice
+      if (data.session_id && (choice === 'once' || choice === 'session' || choice === 'always' || choice === 'deny')) {
+        void this.handleApprovalRespond(socket, data.session_id, choice, data.all === true)
+      }
+    })
  }
  private handleMessage(messages: SessionMessage[], sid: string): any[] {
    let _messages = []
@@ -881,6 +890,7 @@ export class ChatRunSocket {

      const headers: Record<string, string> = { 'Content-Type': 'application/json' }
      if (apiKey) headers['Authorization'] = `Bearer ${apiKey}`
+      if (session_id) headers['X-Hermes-Session-Key'] = this.getGatewaySessionKey(session_id)
      // Convert input from ContentBlock[] to Anthropic format (with base64 images)
      if (isContentBlockArray(input)) {
        body.input = await convertContentBlocks(input)
@@ -940,12 +950,13 @@ export class ChatRunSocket {
      const eventsUrl = new URL(`${upstream}/v1/runs/${runId}/events`)

      // Use Authorization header instead of query parameter for better compatibility
-      const eventSourceInit: any = apiKey ? {
+      const eventSourceInit: any = (apiKey || session_id) ? {
        fetch: (url: string, init: any = {}) => fetch(url, {
          ...init,
          headers: {
            ...(init.headers || {}),
-            Authorization: `Bearer ${apiKey}`,
+            ...(apiKey ? { Authorization: `Bearer ${apiKey}` } : {}),
+            ...(session_id ? { 'X-Hermes-Session-Key': this.getGatewaySessionKey(session_id) } : {}),
          },
        }),
      } : {}
@@ -967,6 +978,19 @@ export class ChatRunSocket {
            logger.info('[chat-run-socket] upstream event: %s', parsed.event)
          }

+          // Surface structured approval protocol events immediately instead of
+          // letting the client sit in a silent working state.  New API-server
+          // builds emit approval.request; older payloads with approval_required
+          // are normalized only for compatibility while the upstream rolls out.
+          const approvalPayload = this.normalizeApprovalRequest(parsed, runId)
+          if (approvalPayload) {
+            if (session_id) this.replaceState(session_id, 'approval.request', approvalPayload)
+            emit('approval.request', approvalPayload)
+            if (parsed.event === 'approval_required' || parsed.event === 'approval.requested' || parsed.event === 'approval.request') {
+              return
+            }
+          }
+
          // Track messages into sessionMap
          if (session_id) {
            const state = this.sessionMap.get(session_id)
@@ -1250,8 +1274,13 @@ export class ChatRunSocket {
    const apiKey = this.gatewayManager.getApiKey(profile) || undefined

    try {
-      const headers: Record<string, string> = { 'Content-Type': 'application/json' }
-      if (apiKey) headers['Authorization'] = `Bearer ${apiKey}`
+      const headers: Record<string, string> = {
+        'Content-Type': 'application/json',
+        'X-Hermes-Session-Key': this.getGatewaySessionKey(sessionId),
+      }
+      if (apiKey) {
+        headers['Authorization'] = `Bearer ${apiKey}`
+      }

      logger.info({ sessionId, runId, upstream }, '[chat-run-socket][abort] calling upstream stop')
      await fetch(`${upstream}/v1/runs/${runId}/stop`, {
@@ -1282,6 +1311,77 @@ export class ChatRunSocket {
    await this.markAbortCompleted(socket, sessionId, runId)
  }

+  private async handleApprovalRespond(socket: Socket, sessionId: string, choice: ApprovalChoice, all: boolean) {
+    const state = this.sessionMap.get(sessionId)
+    const runId = state?.runId
+    if (!state?.isWorking || !runId) {
+      this.emitToSession(socket, sessionId, 'approval.responded', {
+        event: 'approval.responded',
+        choice,
+        all,
+        resolved: 0,
+        error: 'No active run for this session',
+      })
+      return
+    }
+
+    const profile = state.profile || 'default'
+    const upstream = this.gatewayManager.getUpstream(profile).replace(/\/$/, '')
+    const apiKey = this.gatewayManager.getApiKey(profile) || undefined
+    const sessionKey = this.getGatewaySessionKey(sessionId)
+    const headers: Record<string, string> = {
+      'Content-Type': 'application/json',
+      'X-Hermes-Session-Key': sessionKey,
+    }
+    if (apiKey) headers['Authorization'] = `Bearer ${apiKey}`
+
+    const unsupported = await this.getApprovalCapabilityError(upstream, headers)
+    if (unsupported) {
+      const event = {
+        event: 'approval.responded',
+        run_id: runId,
+        choice,
+        all,
+        resolved: 0,
+        error: unsupported,
+      }
+      this.replaceState(sessionId, 'approval.responded', event)
+      this.emitToSession(socket, sessionId, 'approval.responded', event)
+      return
+    }
+
+    let resolved = 0
+    let error = ''
+    try {
+      const res = await fetch(`${upstream}/v1/runs/${runId}/approval`, {
+        method: 'POST',
+        headers,
+        body: JSON.stringify({ choice, all }),
+        signal: AbortSignal.timeout(30_000),
+      })
+      if (!res.ok) {
+        const text = await res.text().catch(() => '')
+        error = `Upstream ${res.status}: ${text}`
+      } else {
+        const json = await res.json().catch(() => ({})) as any
+        resolved = Number(json.resolved ?? 0) || 0
+      }
+    } catch (err: any) {
+      error = err?.message || 'Approval resolve failed'
+    }
+
+    const event = {
+      event: 'approval.responded',
+      run_id: runId,
+      choice,
+      all,
+      resolved,
+      ...(error ? { error } : {}),
+    }
+    this.replaceState(sessionId, 'approval.responded', event)
+    this.emitToSession(socket, sessionId, 'approval.responded', event)
+  }
+
  /** Mark a session run as completed/failed so reconnecting clients get notified */
  private async markCompleted(socket: Socket, sessionId: string, _info: { event: string; run_id?: string }) {
    const state = this.sessionMap.get(sessionId)
@@ -1637,8 +1737,59 @@ export class ChatRunSocket {
      logger.info('[chat-run-socket] enqueued ephemeral session %s for deletion', hermesSessionId)
    } catch { /* best-effort */ }
  }
+  private async getApprovalCapabilityError(upstream: string, headers: Record<string, string>): Promise<string | null> {
+    try {
+      const res = await fetch(`${upstream}/v1/capabilities`, {
+        method: 'GET',
+        headers,
+        signal: AbortSignal.timeout(10_000),
+      })
+      if (!res.ok) {
+        return `Hermes Agent API does not advertise approval support; upgrade to Hermes Agent main or a build containing NousResearch/hermes-agent#21899. (/v1/capabilities returned ${res.status})`
+      }
+      const caps = await res.json().catch(() => ({})) as any
+      const features = caps?.features || {}
+      const endpoints = caps?.endpoints || {}
+      if (features.approval_events === true && features.run_approval_response === true && endpoints.run_approval?.path) {
+        return null
+      }
+      return 'Hermes Agent API does not support run approval control plane; upgrade to Hermes Agent main or a build containing NousResearch/hermes-agent#21899.'
+    } catch (err: any) {
+      return `Unable to verify Hermes Agent approval capabilities: ${err?.message || 'capability request failed'}`
+    }
+  }


+  /** Get stable gateway approval/memory key for a Web UI chat session. */
+  private getGatewaySessionKey(sessionId: string): string {
+    return `webui:${sessionId}`.replace(/[\r\n\x00]/g, '_')
+  }
+
+  private normalizeApprovalRequest(parsed: any, runId?: string): any | null {
+    const eventName = parsed?.event
+    const status = parsed?.status || parsed?.data?.status || parsed?.output?.status
+    const isApprovalEvent = eventName === 'approval_required' || eventName === 'approval.requested' || eventName === 'approval.request'
+    if (!isApprovalEvent && status !== 'approval_required') return null
+
+    const source = parsed?.data && typeof parsed.data === 'object'
+      ? parsed.data
+      : parsed?.output && typeof parsed.output === 'object'
+        ? parsed.output
+        : parsed
+
+    return {
+      event: 'approval.request',
+      run_id: parsed?.run_id || runId,
+      timestamp: parsed?.timestamp || Date.now() / 1000,
+      command: source?.command,
+      description: source?.description,
+      pattern_key: source?.pattern_key,
+      pattern_keys: source?.pattern_keys,
+      choices: Array.isArray(source?.choices) ? source.choices : ['once', 'session', 'always', 'deny'],
+      message: source?.message,
+    }
+  }
+
  /** Get or create session state in sessionMap */
  private getOrCreateSession(sessionId: string): SessionState {
    let state = this.sessionMap.get(sessionId)