@pheem49/mint 1.14.0 → 1.16.0

package/src/renderer/shared/conversation/transport.test.ts

@@ -0,0 +1,163 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import * as desktop from '../../src/tauri'
+import * as web from '../../src-web/tauri'
+import type { AgentProgress } from '../types'
+
+const native = vi.hoisted(() => ({ invoke: vi.fn() }))
+vi.mock('@tauri-apps/api/core', () => ({
+  invoke: native.invoke,
+  Channel: class { onmessage = (_event: unknown) => {} },
+}))
+
+const response = { provider: 'test', model: 'test-model', text: 'สวัสดี' }
+const encoder = new TextEncoder()
+function streamResponse(text: string, byteByByte = false) {
+  const bytes = encoder.encode(text)
+  const body = new ReadableStream<Uint8Array>({ start(controller) {
+    if (byteByByte) for (const byte of bytes) controller.enqueue(Uint8Array.of(byte))
+    else controller.enqueue(bytes)
+    controller.close()
+  } })
+  return new Response(body)
+}
+const done = JSON.stringify({ type: 'done', response })
+
+beforeEach(() => {
+  vi.stubGlobal('window', {
+    location: { hostname: 'mint.test', port: '9000', protocol: 'http:' },
+    localStorage: { getItem: () => 'owner-token' },
+  })
+  native.invoke.mockReset()
+})
+afterEach(() => { vi.unstubAllGlobals(); vi.restoreAllMocks() })
+
+describe.each([['Desktop', desktop], ['Web', web]] as const)('%s Conversation transport', (_name, adapter) => {
+  it('sends plan mode and authenticated conversation context over HTTP', async () => {
+    let request: any
+    let authorization: string | null = null
+    let url = ''
+    vi.stubGlobal('fetch', async (input: string, init: RequestInit) => {
+      url = input
+      request = JSON.parse(init.body as string)
+      authorization = new Headers(init.headers).get('Authorization')
+      return streamResponse(done + '\n')
+    })
+    await expect(adapter.streamChatMessage('inspect', () => {}, 'image1 image2', 'audio', 'video',
+      'instructions', undefined, null, '/project', 'chat-1', 'agent-1', true, 'mcp-1')).resolves.toEqual(response)
+    expect(request).toEqual({ message: 'inspect [Image #1] [Image #2] [Video #1]',
+      systemInstruction: 'instructions', imageDataUri: 'image1 image2', audioDataUri: 'audio', videoDataUri: 'video',
+      documentAttachment: null, workspacePath: '/project', chatId: 'chat-1', agentId: 'agent-1', planMode: true, pinnedMcpServer: 'mcp-1' })
+    expect(authorization).toBe('Bearer owner-token')
+    expect(url).toBe(_name === 'Desktop' ? 'http://mint.test:3000/api/chat-stream' : '/api/chat-stream')
+  })
+
+  it('reads ordered events across split UTF-8 bytes and a final line without newline', async () => {
+    const progress: AgentProgress = { type: 'ThinkingDelta', data: { id: 'thought-1', delta: 'คิด', elapsed_ms: 10 } }
+    const approval = { RunShell: { command: 'pwd', mode: 'normal', background: false } }
+    const res = streamResponse([
+      JSON.stringify({ type: 'started', interactionId: 42 }),
+      JSON.stringify({ type: 'chunk', chunk: 'สวัสดี' }),
+      JSON.stringify({ type: 'progress', progress }),
+      JSON.stringify({ type: 'approval-requested', token: 'approval-1', approval }), done,
+    ].join('\r\n'), true)
+    vi.stubGlobal('fetch', async () => res)
+    const events: unknown[] = []
+    await expect(adapter.streamChatMessage('hello', chunk => events.push(chunk), undefined, undefined, undefined,
+      undefined, event => events.push(event), undefined, undefined, undefined, undefined, undefined, undefined,
+      event => events.push(event), id => events.push(id))).resolves.toEqual(response)
+    expect(events).toEqual([42, 'สวัสดี', progress, { token: 'approval-1', approval }])
+    expect(res.body!.locked).toBe(false)
+  })
+
+  it('propagates callback failures and releases the response stream', async () => {
+    const failure = new Error('consumer failed')
+    const res = streamResponse(JSON.stringify({ type: 'chunk', chunk: 'hello' }) + '\n' + done + '\n')
+    vi.stubGlobal('fetch', async () => res)
+    await expect(adapter.streamChatMessage('hello', () => { throw failure })).rejects.toBe(failure)
+    expect(res.body!.locked).toBe(false)
+  })
+
+  it('rejects incomplete streams and releases the reader', async () => {
+    const res = streamResponse('{"type":"chunk","chunk":"partial"}\n')
+    vi.stubGlobal('fetch', async () => res)
+    await expect(adapter.streamChatMessage('hello', () => {})).rejects.toThrow('without a final response')
+    expect(res.body!.locked).toBe(false)
+  })
+
+  it('preserves HTTP errors returned before streaming starts', async () => {
+    vi.stubGlobal('fetch', async () => new Response('{"text":"approval unavailable"}', { status: 403 }))
+    await expect(adapter.streamChatMessage('hello', () => {})).rejects.toThrow('approval unavailable')
+  })
+
+  it('keeps valid events after malformed and unknown lines', async () => {
+    vi.spyOn(console, 'error').mockImplementation(() => {})
+    vi.stubGlobal('fetch', async () => streamResponse('broken json\n{"type":"future"}\n' + done + '\n'))
+    await expect(adapter.streamChatMessage('hello', () => {})).resolves.toEqual(response)
+  })
+
+  it('sends plan mode for non-streaming HTTP requests too', async () => {
+    let request: any
+    vi.stubGlobal('fetch', async (_url: string, init: RequestInit) => {
+      request = JSON.parse(init.body as string)
+      return Response.json(response)
+    })
+    // The platform contract should support the same option on both operations.
+    await adapter.sendChatMessage('hello', undefined, undefined, undefined, undefined, undefined, 'chat-1', undefined, true)
+    expect(request).toMatchObject({ message: 'hello', chatId: 'chat-1', planMode: true })
+  })
+
+  it('preserves IPC ownership, events and the backend attachment receipt', async () => {
+    ;(window as any).__TAURI_INTERNALS__ = {}
+    let request: any
+    let owner: unknown
+    const pictures: unknown[] = []
+    let attachmentMetadata: unknown
+    native.invoke.mockImplementation(async (command: string, args: any) => {
+      if (command === 'save_pictures') { pictures.push(args); return }
+      request = args.request; owner = args.ownerToken; attachmentMetadata = args.attachmentMetadata
+      args.onEvent.onmessage({ type: 'started', interactionId: 7 })
+      args.onEvent.onmessage({ type: 'chunk', chunk: 'hello' })
+      args.onEvent.onmessage({ type: 'progress', progress: { type: 'ThinkingDelta', data: { id: 'thought-1', delta: 'working', elapsed_ms: 10 } } })
+      return response
+    })
+    const events: unknown[] = []
+    await expect(adapter.streamChatMessage('hello', value => events.push(value), 'image1 image2', undefined, 'video1',
+      'system', value => events.push(value), undefined, '/project', 'chat-1', 'agent-1', true, 'mcp-1',
+      undefined, id => events.push(id), { requestId: 'submission-1', imageNames: ['one.png', 'two.png'], videoNames: ['clip.mp4'] })).resolves.toEqual(response)
+    expect(request).toMatchObject({ planMode: true, chatId: 'chat-1', pinnedMcpServer: 'mcp-1' })
+    expect(owner).toBe('owner-token')
+    expect(events).toEqual([7, 'hello', { type: 'ThinkingDelta', data: { id: 'thought-1', delta: 'working', elapsed_ms: 10 } }])
+    expect(pictures).toEqual([])
+    expect(attachmentMetadata).toEqual({ requestId: 'submission-1', imageNames: ['one.png', 'two.png'], videoNames: ['clip.mp4'] })
+  })
+
+  it('defaults to ordinary agent mode and preserves existing media markers', async () => {
+    let request: any
+    vi.stubGlobal('fetch', async (_url: string, init: RequestInit) => {
+      request = JSON.parse(init.body as string)
+      return streamResponse(done + '\n')
+    })
+    await adapter.streamChatMessage('hello [Image #1] [Video #1]', () => {}, 'image', undefined, 'video')
+    expect(request).toMatchObject({ message: 'hello [Image #1] [Video #1]', systemInstruction: '', planMode: false })
+  })
+
+  it('preserves non-streaming error responses', async () => {
+    vi.stubGlobal('fetch', async () => Response.json({ message: 'access denied' }, { status: 403 }))
+    await expect(adapter.sendChatMessage('hello')).resolves.toEqual({ provider: 'error', model: 'error', text: 'access denied' })
+    vi.stubGlobal('fetch', async () => Response.json({ unrelated: true }))
+    await expect(adapter.sendChatMessage('hello')).resolves.toMatchObject({ provider: 'error', text: expect.stringContaining('invalid chat response') })
+  })
+
+  it('sends authenticated plan mode in non-streaming IPC', async () => {
+    ;(window as any).__TAURI_INTERNALS__ = {}
+    let captured: any
+    native.invoke.mockImplementation(async (command: string, args: any) => {
+      expect(command).toBe('send_chat_message')
+      captured = args
+      return response
+    })
+    await expect(adapter.sendChatMessage('hello', undefined, undefined, undefined, undefined, undefined,
+      'chat-1', undefined, true)).resolves.toEqual(response)
+    expect(captured).toMatchObject({ ownerToken: 'owner-token', request: { chatId: 'chat-1', planMode: true } })
+  })
+})

package/src/renderer/shared/conversation/transport.ts

@@ -0,0 +1,159 @@
+import type { MintPlatformApi } from '../platform'
+import type { AgentProgress, ChatResponse, DocumentAttachment, AttachmentMetadata } from '../types'
+
+type ConversationOperations = Pick<MintPlatformApi, 'sendChatMessage' | 'streamChatMessage'>
+type TransportEnvironment = {
+  isNative(): boolean
+  apiBase(): string
+  fetch(input: RequestInfo | URL, init?: RequestInit): Promise<Response>
+  ownerToken(): string | null
+}
+
+type StreamEvent =
+  | { type: 'started'; interactionId: number }
+  | { type: 'chunk'; chunk: string }
+  | { type: 'progress'; progress: AgentProgress }
+  | { type: 'approval-requested'; token: string; approval: any }
+  | { type: 'done'; response: ChatResponse }
+
+type StreamCallbacks = {
+  onChunk(chunk: string): void
+  onProgress?: (progress: AgentProgress) => void
+  onApprovalRequested?: (payload: { token: string; approval: any }) => void
+  onTurnStarted?: (interactionId: number) => void
+}
+
+function deliverEvent(event: StreamEvent, callbacks: StreamCallbacks): ChatResponse | undefined {
+  switch (event?.type) {
+    case 'chunk': callbacks.onChunk(event.chunk); break
+    case 'started': callbacks.onTurnStarted?.(event.interactionId); break
+    case 'progress': callbacks.onProgress?.(event.progress); break
+    case 'approval-requested': callbacks.onApprovalRequested?.({ token: event.token, approval: event.approval }); break
+    case 'done': return event.response
+  }
+}
+
+async function readStream(response: Response, callbacks: StreamCallbacks): Promise<ChatResponse> {
+  const reader = response.body?.getReader()
+  if (!reader) throw new Error('No response body reader')
+  const decoder = new TextDecoder()
+  let buffer = ''
+  let finalResponse: ChatResponse | undefined
+  const consumeLine = (line: string) => {
+    if (!line.trim()) return
+    let event: StreamEvent
+    try {
+      event = JSON.parse(line)
+    } catch (error) {
+      console.error('Failed to parse stream line:', line, error)
+      return
+    }
+    // Consumer failures are transport failures, not malformed JSON.
+    const result = deliverEvent(event, callbacks)
+    if (result) finalResponse = result
+  }
+  try {
+    while (true) {
+      const { value, done } = await reader.read()
+      buffer += done ? decoder.decode() : decoder.decode(value, { stream: true })
+      const lines = buffer.split('\n')
+      buffer = lines.pop() || ''
+      for (const line of lines) consumeLine(line)
+      if (done) {
+        consumeLine(buffer)
+        break
+      }
+    }
+    if (finalResponse) return finalResponse
+    throw new Error('Stream closed without a final response')
+  } catch (error) {
+    await reader.cancel(error).catch(() => {})
+    throw error
+  } finally {
+    reader.releaseLock()
+  }
+}
+
+function withMediaPlaceholders(message: string, imageDataUri?: string | null, videoDataUri?: string | null) {
+  for (const [kind, uris] of [['Image', imageDataUri], ['Video', videoDataUri]] as const) {
+    if (uris && !message.includes(`[${kind} #1]`)) {
+      const markers = uris.split(/\s+/).filter(Boolean).map((_, index) => `[${kind} #${index + 1}]`).join(' ')
+      if (markers) message = `${message} ${markers}`
+    }
+  }
+  return message
+}
+
+/** Shared wire contract; adapters supply runtime detection, address and authentication. */
+export function createConversationTransport(environment: TransportEnvironment): ConversationOperations {
+  const requestBody = (message: string, imageDataUri?: string | null, audioDataUri?: string | null,
+    videoDataUri?: string | null, systemInstruction = '', documentAttachment?: DocumentAttachment | null,
+    workspacePath?: string | null, chatId?: string | null, agentId?: string | null, planMode = false,
+    pinnedMcpServer?: string | null, attachmentMetadata?: AttachmentMetadata) => ({
+    ...(attachmentMetadata ? { attachmentMetadata } : {}),
+    message: withMediaPlaceholders(message, imageDataUri, videoDataUri), systemInstruction,
+    imageDataUri, audioDataUri, videoDataUri, documentAttachment, workspacePath, chatId, agentId, planMode, pinnedMcpServer,
+  })
+
+  const validate = (request: ReturnType<typeof requestBody>) => {
+    const body = JSON.stringify(request)
+    if (new TextEncoder().encode(body).byteLength > 32 * 1024 * 1024) throw new Error('Attachments exceed the 32 MiB request limit. Send fewer files at once.')
+    return body
+  }
+  const post = (route: string, request: ReturnType<typeof requestBody>) => environment.fetch(`${environment.apiBase()}/${route}`, {
+    method: 'POST', headers: { 'Content-Type': 'application/json' }, body: validate(request),
+  })
+
+
+  return {
+    async sendChatMessage(message, imageDataUri, audioDataUri, videoDataUri, documentAttachment,
+      workspacePath, chatId, agentId, planMode, attachmentMetadata) {
+      const request = requestBody(message, imageDataUri, audioDataUri, videoDataUri, '', documentAttachment,
+        workspacePath, chatId, agentId, planMode, undefined, attachmentMetadata)
+      if (!environment.isNative()) {
+        try {
+          const response = await post('chat', request)
+          const data = await response.json().catch(() => null)
+          if (!response.ok) return { provider: 'error', model: 'error',
+            text: data?.text || data?.message || data?.status || `Local API returned HTTP ${response.status}` }
+          if (!data || typeof data.text !== 'string') return {
+            provider: 'error', model: 'error', text: 'Local API returned an invalid chat response.',
+          }
+          return data
+        } catch (error) {
+          console.error('Failed to send chat message to local server:', error)
+          return { provider: 'error', model: 'error', text: `Failed to connect to Local API Server: ${error}` }
+        }
+      }
+      validate(request)
+      const { invoke } = await import('@tauri-apps/api/core')
+      const response = await invoke<ChatResponse>('send_chat_message', { ownerToken: environment.ownerToken(), request, ...(attachmentMetadata ? { attachmentMetadata } : {}) })
+      return response
+    },
+
+    async streamChatMessage(message, onChunk, imageDataUri, audioDataUri, videoDataUri, systemInstruction,
+      onProgress, documentAttachment, workspacePath, chatId, agentId, planMode, pinnedMcpServer,
+      onApprovalRequested, onTurnStarted, attachmentMetadata) {
+      const request = requestBody(message, imageDataUri, audioDataUri, videoDataUri, systemInstruction,
+        documentAttachment, workspacePath, chatId, agentId, planMode, pinnedMcpServer, attachmentMetadata)
+      const callbacks = { onChunk, onProgress, onApprovalRequested, onTurnStarted }
+      if (!environment.isNative()) {
+        const response = await post('chat-stream', request)
+        if (!response.ok) {
+          const data = await response.json().catch(() => null)
+          throw new Error(data?.text || data?.message || `HTTP ${response.status}`)
+        }
+        return readStream(response, callbacks)
+      }
+      validate(request)
+      const { invoke, Channel } = await import('@tauri-apps/api/core')
+      const onEvent = new Channel<StreamEvent>()
+      onEvent.onmessage = event => { deliverEvent(event, callbacks) }
+      // Native approvals arrive via the global tool-approval-requested event bus.
+      const response = await invoke<ChatResponse>('stream_chat_message', {
+        ownerToken: environment.ownerToken(), request, onEvent, ...(attachmentMetadata ? { attachmentMetadata } : {}),
+      })
+      return response
+    },
+  }
+}

package/src/renderer/shared/conversation/useConversationCoordinator.ts

@@ -0,0 +1,64 @@
+import { useEffect, useRef, useState, useSyncExternalStore } from 'react'
+import type { ConversationState } from './coordinator'
+import { createConversationLifecycle, type ConversationEffects, type ConversationTransport } from './lifecycle'
+import { conversationPlatform } from '../platform'
+
+interface CoordinatorOptions extends ConversationEffects {
+  conversationId: string
+  draftKeyPrefix: string
+  workspaceStorageKey: string
+  historyVisible: boolean
+}
+
+/** React adapter: persistence and browser signals enter the same lifecycle tests use. */
+export function useConversationCoordinator(
+  initial: Partial<ConversationState>,
+  options: CoordinatorOptions,
+  transport: ConversationTransport = conversationPlatform,
+) {
+  const latest = useRef(options)
+  latest.current = options
+  const [actions] = useState(() => createConversationLifecycle(options.conversationId, initial, transport, {
+    onError: error => latest.current.onError?.(error),
+    onApproval: (approval, chatId) => latest.current.onApproval?.(approval, chatId),
+    onReply: (response, chatId) => latest.current.onReply?.(response, chatId),
+    onActivityPersisted: id => latest.current.onActivityPersisted?.(id),
+    onRunCompleted: () => latest.current.onRunCompleted?.(),
+    onVisibleRunCompleted: chatId => latest.current.onVisibleRunCompleted?.(chatId),
+  }, {
+    read: id => window.localStorage.getItem(`${latest.current.draftKeyPrefix}${id}`) || '',
+    write: (id, text) => {
+      const key = `${latest.current.draftKeyPrefix}${id}`
+      if (text) window.localStorage.setItem(key, text)
+      else window.localStorage.removeItem(key)
+    },
+  }))
+  const conversation = useSyncExternalStore(actions.subscribe, actions.getSnapshot, actions.getSnapshot)
+
+  useEffect(() => actions.watch({ window, document }, options.historyVisible),
+    [actions, options.historyVisible, conversation.conversationId])
+
+  useEffect(() => {
+    const timer = window.setTimeout(() => {
+      try {
+        const key = `${options.draftKeyPrefix}${conversation.conversationId}`
+        if (conversation.message) window.localStorage.setItem(key, conversation.message)
+        else window.localStorage.removeItem(key)
+      } catch {
+        // Draft persistence is best-effort in private browsing modes.
+      }
+    }, 300)
+    return () => window.clearTimeout(timer)
+  }, [conversation.message, conversation.conversationId, options.draftKeyPrefix])
+
+  useEffect(() => {
+    try {
+      if (conversation.workspacePath) window.localStorage.setItem(options.workspaceStorageKey, conversation.workspacePath)
+      else window.localStorage.removeItem(options.workspaceStorageKey)
+    } catch {
+      // Workspace persistence is best-effort in private browsing modes.
+    }
+  }, [conversation.workspacePath, options.workspaceStorageKey])
+
+  return { conversation, actions }
+}

package/src/renderer/shared/css/agent-observability.css

@@ -5,14 +5,17 @@
 
 /* --- Run Summary Dashboard --- */
 .run-summary-card {
-  border-radius: var(--radius-lg, 10px);
+  border-radius: var(--radius-lg, 12px);
   border: 1px solid var(--border-light, rgba(255, 255, 255, 0.08));
   background: color-mix(in srgb, var(--surface-bg, #252527) 80%, transparent);
   backdrop-filter: var(--glass-blur, blur(12px));
   -webkit-backdrop-filter: var(--glass-blur, blur(12px));
-  padding: 12px 14px;
-  margin-bottom: 10px;
+  padding: 12px;
+  margin-bottom: 0;
   color: var(--text-main, #e8e8ea);
+  min-width: 0;
+  max-width: 100%;
+  overflow: hidden;
 }
 
 .run-summary-header {
@@ -20,18 +23,29 @@
   align-items: center;
   justify-content: space-between;
   border-bottom: 1px solid var(--border, rgba(255, 255, 255, 0.08));
-  padding-bottom: 8px;
+  padding-bottom: 10px;
   margin-bottom: 10px;
+  gap: 10px;
+  min-width: 0;
+}
+
+.run-summary-title,
+.run-summary-header > div {
+  min-width: 0;
+  max-width: 100%;
 }
 
 .run-summary-title {
   display: flex;
   align-items: center;
-  gap: 8px;
-  font-size: 0.82rem;
-  font-weight: 600;
+  flex: 1 1 auto;
+  gap: 9px;
   color: var(--text-main, #e8e8ea);
 }
+.run-summary-title > svg { flex: 0 0 auto; color: var(--accent, #10b981); }
+.run-summary-heading { display: grid; gap: 2px; min-width: 0; }
+.run-summary-heading strong { font-size: 0.8rem; font-weight: 650; line-height: 1.25; }
+.run-summary-heading small { overflow: hidden; color: var(--text-muted); font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.65rem; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
 
 .run-summary-badge {
   display: inline-flex;
@@ -41,6 +55,7 @@
   border-radius: var(--radius-full, 999px);
   font-size: 0.72rem;
   font-weight: 600;
+  white-space: nowrap;
 }
 
 .run-summary-badge.success {
@@ -63,18 +78,22 @@
 
 .run-kpi-grid {
   display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
+  grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 8px;
+  min-width: 0;
 }
+@media (max-width: 360px) { .run-kpi-grid { grid-template-columns: minmax(0, 1fr); } }
 
 .run-kpi-box {
-  background: color-mix(in srgb, var(--input-bg, #2c2c2e) 60%, transparent);
-  border: 1px solid var(--border, rgba(255, 255, 255, 0.06));
+  background: var(--bg-surface-soft, color-mix(in srgb, var(--input-bg, #2c2c2e) 45%, transparent));
+  border: 1px solid var(--border-subtle, var(--border));
   border-radius: var(--radius-md, 8px);
-  padding: 8px 10px;
+  padding: 9px 10px;
   display: flex;
   flex-direction: column;
   gap: 3px;
+  min-width: 0;
+  overflow: hidden;
 }
 
 .run-kpi-label {
@@ -86,8 +105,9 @@
 }
 
 .run-kpi-value {
-  font-size: 0.95rem;
-  font-weight: 700;
+  font-size: 1rem;
+  font-variant-numeric: tabular-nums;
+  font-weight: 650;
   color: var(--text-main, #e8e8ea);
 }
 
@@ -99,12 +119,13 @@
 
 .run-timeline-container {
   margin-top: 12px;
+  min-width: 0;
 }
 
 .run-timeline-title {
   font-size: 0.68rem;
   font-weight: 600;
-  text-transform: uppercase;
+  text-transform: none;
   letter-spacing: 0.05em;
   color: var(--text-muted, #8f8f94);
   margin-bottom: 6px;
@@ -116,6 +137,7 @@
   gap: 4px;
   max-height: 160px;
   overflow-y: auto;
+  min-width: 0;
 }
 
 .run-timeline-item {
@@ -128,6 +150,9 @@
   border: 1px solid var(--border, rgba(255, 255, 255, 0.04));
   font-size: 0.75rem;
   transition: background 0.15s ease;
+  gap: 8px;
+  min-width: 0;
+  overflow: hidden;
 }
 
 .run-timeline-item:hover {
@@ -139,6 +164,8 @@
   align-items: center;
   gap: 8px;
   min-width: 0;
+  flex: 1;
+  overflow: hidden;
 }
 
 .run-timeline-step {
@@ -154,6 +181,8 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  min-width: 0;
+  flex: 0 1 auto;
 }
 
 .run-timeline-target {
@@ -167,6 +196,8 @@
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 220px;
+  min-width: 0;
+  flex: 0 1 auto;
 }
 
 .run-timeline-note-failed {
@@ -250,7 +281,7 @@
 
 .plan-task-item.in-progress {
   background: color-mix(in srgb, var(--accent, #10b981) 12%, transparent);
-  color: var(--accent-hover, #34d399);
+  color: var(--interactive-fg-hover);
 }
 
 .plan-task-item.completed {