@pheem49/mint 1.15.0 → 1.17.0

package/src/renderer/shared/utils/agentActivity.ts

@@ -3,8 +3,9 @@
  * Agent activity parsing and transformation logic.
  * Shared by both Desktop and Web ChatPanel — do NOT duplicate this.
  */
-import type { AgentProgress } from '../types'
+import type { AgentProgress, ActivePlan, RunTelemetrySummary } from '../types'
 import { isInternalCot } from '../agentProgress'
+import { viewedImageDataUri, viewedImagesFrom, type ViewedImageItem } from './viewedImages'
 
 export interface AgentActivity {
   label: string
@@ -12,8 +13,10 @@ export interface AgentActivity {
   kind: 'file' | 'folder' | 'search' | 'terminal' | 'tool' | 'calc'
   state: 'active' | 'done' | 'error' | 'retry'
   action?: string
+  callId?: string
   /** Raw ToolEnd output text, shown when the row is expanded in the UI. */
   result?: string
+  viewedImage?: ViewedImageItem
 }
 
 export interface AgentActivityGroup {
@@ -41,9 +44,28 @@ export interface AgentActivityView {
   timeline?: TimelineItem[]
 }
 
+export function isDummyValue(value: unknown): boolean {
+  if (typeof value !== 'string') return false
+  const lower = value.trim().toLowerCase()
+  return (
+    lower === 'null' ||
+    lower === 'undefined' ||
+    lower === 'none' ||
+    lower === 'nil' ||
+    lower === '(null)' ||
+    lower === '""' ||
+    lower === "''"
+  )
+}
+
 function activityDetail(input: Record<string, unknown>, key: string): string {
+  if (!input || typeof input !== 'object') return ''
   const value = input[key]
-  return typeof value === 'string' && value.trim() ? value : ''
+  if (typeof value === 'string') {
+    const trimmed = value.trim()
+    return isDummyValue(trimmed) ? '' : trimmed
+  }
+  return ''
 }
 
 export function formatActivityTarget(value: string): string {
@@ -70,9 +92,53 @@ export function describeTool(action: string, input: Record<string, unknown>): Ag
     activityDetail(input, 'prompt') ||
     activityDetail(input, 'searchTerm') ||
     activityDetail(input, 'search_term')
-  const command = activityDetail(input, 'command') || activityDetail(input, 'cmd')
+  let command =
+    activityDetail(input, 'command') ||
+    activityDetail(input, 'cmd') ||
+    activityDetail(input, 'script') ||
+    activityDetail(input, 'exec') ||
+    activityDetail(input, 'code') ||
+    activityDetail(input, 'bash') ||
+    activityDetail(input, 'sh')
+
+  if (!command && input && typeof input === 'object') {
+    if (typeof input.arguments === 'object' && input.arguments !== null) {
+      const nested = input.arguments as Record<string, unknown>
+      command =
+        activityDetail(nested, 'command') ||
+        activityDetail(nested, 'cmd') ||
+        activityDetail(nested, 'script') ||
+        activityDetail(nested, 'exec') ||
+        activityDetail(nested, 'code') ||
+        activityDetail(nested, 'bash') ||
+        activityDetail(nested, 'sh')
+    } else if (typeof input.arguments === 'string') {
+      try {
+        const parsed = JSON.parse(input.arguments)
+        if (parsed && typeof parsed === 'object') {
+          command =
+            activityDetail(parsed, 'command') ||
+            activityDetail(parsed, 'cmd') ||
+            activityDetail(parsed, 'script') ||
+            activityDetail(parsed, 'exec') ||
+            activityDetail(parsed, 'code') ||
+            activityDetail(parsed, 'bash') ||
+            activityDetail(parsed, 'sh')
+        }
+      } catch {
+        // best-effort
+      }
+    }
+  }
+
+  if (!command && typeof (input as unknown) === 'string') {
+    const raw = (input as unknown as string).trim()
+    if (raw && !raw.startsWith('{') && !isDummyValue(raw)) command = raw
+  }
+
   const name = activityDetail(input, 'name')
   const tool = activityDetail(input, 'tool')
+  const server = activityDetail(input, 'server')
   const symbol = activityDetail(input, 'symbol') || activityDetail(input, 'ticker')
   const filter = activityDetail(input, 'filter')
   const expression = activityDetail(input, 'expression') || activityDetail(input, 'expr') || activityDetail(input, 'math')
@@ -80,32 +146,59 @@ export function describeTool(action: string, input: Record<string, unknown>): Ag
   const url = activityDetail(input, 'url')
   const selector = activityDetail(input, 'selector')
 
-  const fallbackTarget =
-    action === 'web_search' || action === 'search_code' || action === 'knowledge_search'
-      ? (query || '(empty query)')
-      : action === 'read_file' || action === 'write_file'
-        ? (path || '(empty path)')
-        : action === 'find_definition' || action === 'find_references'
-          ? (symbol || '(empty symbol)')
-          : action === 'run_tests'
-            ? (filter || '(all tests)')
-            : action === 'run_typecheck' || action === 'run_linter'
-              ? (path || 'workspace')
-              : action === 'run_shell'
-                ? (command || '(empty command)')
-                : action === 'calculation'
-                  ? (expression || '(math expression)')
-                  : action === 'weather'
-                    ? (city || '(location)')
-                    : action === 'stock'
-                      ? (query || symbol || '(symbol)')
-                      : action === 'browser_open'
-                        ? (url || '(url)')
-                        : action === 'browser_click'
-                          ? (selector || '(element)')
-                          : action.replaceAll('_', ' ')
-
-  const rawTarget = path || query || command || expression || symbol || city || url || selector || filter || name || tool || fallbackTarget
+  let rawTarget = ''
+  switch (action) {
+    case 'run_shell':
+      rawTarget = command || '(empty command)'
+      break
+    case 'web_search':
+    case 'search_code':
+    case 'knowledge_search':
+      rawTarget = query || '(empty query)'
+      break
+    case 'read_file':
+    case 'write_file':
+    case 'view_image':
+      rawTarget = path || '(empty path)'
+      break
+    case 'find_definition':
+    case 'find_references':
+      rawTarget = symbol || '(empty symbol)'
+      break
+    case 'run_tests':
+      rawTarget = filter || '(all tests)'
+      break
+    case 'run_typecheck':
+    case 'run_linter':
+      rawTarget = path || 'workspace'
+      break
+    case 'calculation':
+    case 'calculator':
+      rawTarget = expression || '(math expression)'
+      break
+    case 'weather':
+      rawTarget = city || '(location)'
+      break
+    case 'stock':
+      rawTarget = query || symbol || '(symbol)'
+      break
+    case 'browser_open':
+    case 'browser_navigate':
+      rawTarget = url || '(url)'
+      break
+    case 'browser_click':
+      rawTarget = selector || '(element)'
+      break
+    case 'mcp_tool':
+      rawTarget = tool ? (server ? `${server}/${tool}` : tool) : (name || 'mcp tool')
+      break
+    case 'note_write':
+      rawTarget = name || path || '(note)'
+      break
+    default:
+      rawTarget = path || query || command || expression || symbol || city || url || selector || filter || name || tool || action.replaceAll('_', ' ')
+      break
+  }
 
   // Append line range for read_file when startLine / endLine are available
   let target = rawTarget
@@ -131,7 +224,8 @@ export function describeTool(action: string, input: Record<string, unknown>): Ag
 
   return {
     // Raw tool/action identifier, matching how the CLI labels activity (e.g. "[web_search]").
-    label: action,
+    label: action === 'read_file' && activityDetail(input, 'skill_name')
+      ? `Reading skill: ${activityDetail(input, 'skill_name')}` : action,
     target: formatActivityTarget(target),
     kind: activityKind(action, target),
     state: 'active',
@@ -250,6 +344,16 @@ function finalizeGroup(group: AgentActivityGroup): AgentActivityGroup {
 }
 
 export function activitiesFrom(progress: AgentProgress[]): AgentActivityView {
+  const cached = activityCache.get(progress)
+  if (cached?.length === progress.length) return cached.view
+  const view = deriveActivitiesFrom(progress)
+  activityCache.set(progress, { length: progress.length, view })
+  return view
+}
+
+const activityCache = new WeakMap<AgentProgress[], { length: number; view: AgentActivityView }>()
+
+function deriveActivitiesFrom(progress: AgentProgress[]): AgentActivityView {
   const activities: AgentActivity[] = []
   const timeline: TimelineItem[] = []
   let currentGroup: AgentActivityGroup | null = null
@@ -268,9 +372,18 @@ export function activitiesFrom(progress: AgentProgress[]): AgentActivityView {
 
   for (const event of progress) {
     if (event.type === 'ToolStart') {
+      if (event.data.subagent) continue
       const item = describeTool(event.data.action, event.data.input)
+      item.callId = event.data.callId
       activities.push(item)
 
+      // Keep each skill's lifecycle visible instead of hiding it in a files group.
+      if (event.data.action === 'read_file' && activityDetail(event.data.input, 'skill_name')) {
+        flushGroup()
+        timeline.push({ id: `skill-${nextId++}`, kind: 'activity', activity: item })
+        continue
+      }
+
       const actionKey = item.action || item.label
       if (!currentGroup || currentGroup.action !== actionKey) {
         flushGroup()
@@ -292,10 +405,24 @@ export function activitiesFrom(progress: AgentProgress[]): AgentActivityView {
         }
       }
     } else if (event.type === 'ToolEnd') {
+      if (event.data.subagent) continue
+      const finished = describeTool(event.data.action, event.data.input)
       for (let index = activities.length - 1; index >= 0; index -= 1) {
         if (activities[index].state !== 'active') continue
-        activities[index].state = event.data.result.startsWith('Error:') ? 'error' : 'done'
-        activities[index].result = event.data.result
+        if (event.data.callId && activities[index].callId !== event.data.callId) continue
+        if (activities[index].action !== finished.action || activities[index].target !== finished.target) continue
+        activities[index].state = event.data.status ? (event.data.status === 'success' ? 'done' : 'error') : /^(Error:|Blocked|User denied)/.test(event.data.result) ? 'error' : 'done'
+        const viewedImage = event.data.action === 'view_image' ? viewedImageDataUri(event.data.result) : null
+        activities[index].result = viewedImage ? event.data.result.replace(viewedImage, '[Image displayed below]') : event.data.result
+        if (event.data.action === 'read_file') {
+          const loaded = event.data.result.match(/^\[Loaded skill: ([^\n]+)\]\n/)
+          if (loaded) activities[index].label = `Loaded skill: ${loaded[1]}`
+          else if (activities[index].label.startsWith('Reading skill:')) {
+            activities[index].label = activities[index].state === 'error'
+              ? activities[index].label.replace('Reading skill:', 'Failed to read skill:')
+              : activities[index].label.replace('Reading skill:', 'Read skill preview:')
+          }
+        }
         if (activities[index].action === 'ask_user' && event.data.result.startsWith('User answered:')) {
           const answer = event.data.result.replace('User answered:', '').trim()
           activities[index].target = `(Answered: "${answer}") ${activities[index].target}`
@@ -309,6 +436,12 @@ export function activitiesFrom(progress: AgentProgress[]): AgentActivityView {
         const hasRetry = currentGroup.items.some((it) => it.state === 'retry')
         currentGroup.state = hasActive ? 'active' : hasDone ? 'done' : hasRetry ? 'retry' : hasError ? 'error' : 'done'
       }
+    } else if (event.type === 'ContextCompaction') {
+      if (event.data.subagent) continue
+      if (event.data.status !== 'started') {
+        flushGroup()
+        timeline.push({ id: `context-${nextId++}`, kind: 'thought', thought: event.data.message })
+      }
     } else if (event.type === 'Thought') {
       const text = event.data?.thought?.trim()
       if (text) {
@@ -381,6 +514,32 @@ export function activitiesFrom(progress: AgentProgress[]): AgentActivityView {
     }
   }
 
+  const viewedImages = viewedImagesFrom(progress)
+  if (viewedImages.length > 0) {
+    const byCallId = new Map<string, ViewedImageItem>()
+    const byPath = new Map<string, ViewedImageItem[]>()
+    for (const img of viewedImages) {
+      if (img.id) byCallId.set(img.id, img)
+      if (img.path) {
+        const list = byPath.get(img.path) || []
+        list.push(img)
+        byPath.set(img.path, list)
+      }
+    }
+    for (const act of activities) {
+      if (act.action === 'view_image' && act.state === 'done') {
+        if (act.callId && byCallId.has(act.callId)) {
+          act.viewedImage = byCallId.get(act.callId)
+        } else if (byPath.has(act.target)) {
+          const list = byPath.get(act.target)!
+          if (list.length > 0) {
+            act.viewedImage = list.shift()
+          }
+        }
+      }
+    }
+  }
+
   const items = activities.slice(-25)
   return { summary: activitySummary(activities), items, groups: groupActivities(items), timeline: timeline.slice(-60) }
 }
@@ -456,3 +615,33 @@ export function cleanIntermediateThought(text: string): string {
   cleaned = cleaned.replace(/^[\s•\-\*]+\s*/, '')
   return cleaned.trim() || text.trim()
 }
+
+export function extractLatestPlan(progress: AgentProgress[]): ActivePlan | undefined {
+  for (let i = progress.length - 1; i >= 0; i--) {
+    const event = progress[i]
+    if (event.type === 'PlanUpdated') {
+      return event.data.plan
+    }
+  }
+  return undefined
+}
+
+export function extractLatestRunSummary(progress: AgentProgress[]): RunTelemetrySummary | undefined {
+  for (let i = progress.length - 1; i >= 0; i--) {
+    const event = progress[i]
+    if (event.type === 'RunCompleted') {
+      return event.data.summary
+    }
+  }
+  return undefined
+}
+
+export function hasSubagentActivity(progress: AgentProgress[]): boolean {
+  return progress.some(
+    (e) =>
+      e.type === 'SubagentStarted' ||
+      e.type === 'SubagentFinished' ||
+      ((e.type === 'ToolStart' || e.type === 'ToolEnd') &&
+        (e.data.subagent || e.data.action === 'dispatch_agents' || e.data.action === 'dispatch_subagent')),
+  )
+}

package/src/renderer/shared/utils/approval.tsx

@@ -13,6 +13,12 @@ export interface ApprovalDetails {
   isDangerous: boolean
 }
 
+// Skill changes require a decision for this proposal, including in sessions
+// where ordinary tool requests have already been allowed.
+export function requiresExplicitApproval(approval: Record<string, unknown> | undefined): boolean {
+  return !!approval?.SkillWrite
+}
+
 function parseDiffStats(diffText?: string): string {
   if (!diffText) return ''
   let additions = 0
@@ -44,6 +50,7 @@ export function renderApprovalDetails(approval: any): ApprovalDetails {
     const { server, tool, arguments: args } = approval.McpTool
     return { title: `Run MCP Tool: ${server}/${tool}`, body: typeof args === 'string' ? args : JSON.stringify(args, null, 2), reason: 'Running external MCP tool.', isDangerous: false }
   }
+  if (approval.SkillWrite) return { title: 'Save Skill', body: `Path: ${approval.SkillWrite.path}`, reason: 'This changes instructions used in future tasks. Review the proposed changes before saving.', isDangerous: false }
   if (approval.UserApproval) return { title: approval.UserApproval.title, body: approval.UserApproval.prompt, reason: 'The agent requested explicit approval.', isDangerous: false }
   if (approval.AskUser) {
     const hasOptions = Array.isArray(approval.AskUser.options) && approval.AskUser.options.length > 0

package/src/renderer/shared/utils/artifactBrowser.test.ts

@@ -0,0 +1,80 @@
+import { describe, expect, it, vi } from 'vitest'
+import { installRendererPlatform } from '../platform'
+import * as desktopAdapter from '../../src/tauri'
+import { openArtifactInMintBrowser } from './artifactBrowser'
+
+const native = vi.hoisted(() => ({ invoke: vi.fn(async () => undefined) }))
+vi.mock('@tauri-apps/api/core', () => ({ invoke: native.invoke }))
+
+const url = 'http://127.0.0.1:12345/site/index.html'
+describe('opening a preview in Mint Browser', () => {
+  it('opens an existing served URL through Mint Browser on Desktop', async () => {
+    const opened: string[] = []
+    await openArtifactInMintBrowser({ path: 'site/index.html', url }, '/projects/Demo', {
+      desktop: true,
+      startPreview: async () => { throw new Error('An existing URL must be reused') },
+      openMintBrowser: async (target) => { opened.push(target) },
+    })
+    expect(opened).toEqual([url])
+  })
+  it('serves chat artifacts from their pinned project before opening Mint Browser', async () => {
+    const actions: unknown[] = []
+    await openArtifactInMintBrowser({ path: 'site/index.html', workspacePath: '/projects/Original' }, '/projects/Other', {
+      desktop: true,
+      startPreview: async (root, path, mint) => { actions.push([root, path, mint]); return { url, jobId: 'preview-1' } },
+      openMintBrowser: async (target) => { actions.push(target) },
+    })
+    expect(actions).toEqual([['/projects/Original', 'site/index.html', false], url])
+  })
+  it('opens the controlled browser through the authenticated local backend on Web', async () => {
+    const requests: unknown[] = []
+    await openArtifactInMintBrowser({ path: 'site/index.html', url, workspacePath: '/projects/Demo' }, undefined, {
+      desktop: false,
+      startPreview: async (root, path, mint) => { requests.push([root, path, mint]); return { url, jobId: 'preview-1' } },
+      openMintBrowser: async () => { throw new Error('Web must not call native IPC') },
+    })
+    expect(requests).toEqual([['/projects/Demo', 'site/index.html', true]])
+  })
+  it('reports browser launch failures so the button can show an error', async () => {
+    await expect(openArtifactInMintBrowser({ path: 'site/index.html', url }, undefined, {
+      desktop: true,
+      startPreview: async () => { throw new Error('Unexpected server startup') },
+      openMintBrowser: async () => { throw new Error('Chrome unavailable') },
+    })).rejects.toThrow('Chrome unavailable')
+  })
+  it('does not start a server without a source project', async () => {
+    await expect(openArtifactInMintBrowser({ path: 'site/index.html' }, undefined, {
+      desktop: true,
+      startPreview: async () => { throw new Error('Unexpected server startup') },
+      openMintBrowser: async () => { throw new Error('Unexpected browser startup') },
+    })).rejects.toThrow('Select a project')
+  })
+})
+
+it('sends the existing open_mint_browser IPC command for the default Desktop action', async () => {
+  installRendererPlatform({ ...desktopAdapter, isTauriRuntime: () => true })
+  native.invoke.mockClear()
+  await openArtifactInMintBrowser({ path: 'site/index.html', url }, undefined)
+  expect(native.invoke).toHaveBeenCalledWith('open_mint_browser', { url })
+})
+
+it.each([
+  ['/projects/Demo', '/projects/Demo/site/index.html', 'site/index.html'],
+  ['C:\\Projects\\Demo', 'c:\\projects\\demo\\site\\index.html', 'site/index.html'],
+])('opens absolute artifact paths relative to their source project %s', async (root, path, relative) => {
+  const requests: unknown[] = []
+  await openArtifactInMintBrowser({ path, workspacePath: root }, '/projects/Other', {
+    desktop: true,
+    startPreview: async (workspace, file, mint) => { requests.push([workspace, file, mint]); return { url, jobId: 'preview-1' } },
+    openMintBrowser: async () => {},
+  })
+  expect(requests).toEqual([[root, relative, false]])
+})
+
+it('rejects an absolute artifact from a different project without starting a server', async () => {
+  await expect(openArtifactInMintBrowser({ path: '/projects/Demo-copy/index.html', workspacePath: '/projects/Demo' }, undefined, {
+    desktop: true,
+    startPreview: async () => { throw new Error('Unexpected server startup') },
+    openMintBrowser: async () => {},
+  })).rejects.toThrow('outside its source project')
+})

package/src/renderer/shared/utils/artifactBrowser.ts

@@ -0,0 +1,41 @@
+import type { ArtifactFile } from './artifacts'
+import { runtimePlatform, workspacePlatform } from '../platform'
+
+interface BrowserApi {
+  desktop: boolean
+  startPreview(root: string, path: string, mintBrowser: boolean): Promise<{ url: string; jobId: string }>
+  openMintBrowser(url: string): Promise<void>
+}
+
+export async function openArtifactInMintBrowser(
+  artifact: ArtifactFile,
+  workspace: string | undefined,
+  api: BrowserApi = {
+    desktop: runtimePlatform.isTauriRuntime(),
+    startPreview: (root, path, mint) => workspacePlatform.startHtmlPreview(root, path, mint),
+    openMintBrowser: async (url) => {
+      const { invoke } = await import('@tauri-apps/api/core')
+      await invoke('open_mint_browser', { url })
+    },
+  },
+): Promise<void> {
+  if (api.desktop && artifact.url) {
+    await api.openMintBrowser(artifact.url)
+    return
+  }
+  const root = (artifact.workspacePath ?? workspace)?.trim()
+  if (!root) throw new Error('Select a project before opening its preview in Mint Browser')
+  let path = artifact.path.replace(/\\/g, '/')
+  if (/^(\/|[a-z]:\/)/i.test(path)) {
+    const normalizedRoot = root.replace(/\\/g, '/').replace(/\/+$/, '')
+    const prefix = `${normalizedRoot}/`
+    const windows = /^[a-z]:\//i.test(normalizedRoot) || normalizedRoot.startsWith('//')
+    if (!(windows ? path.toLowerCase().startsWith(prefix.toLowerCase()) : path.startsWith(prefix))) {
+      throw new Error('This file is outside its source project')
+    }
+    path = path.slice(prefix.length)
+  }
+  // The authenticated local Web endpoint launches the same automation browser on the backend.
+  const preview = await api.startPreview(root, path, !api.desktop)
+  if (api.desktop) await api.openMintBrowser(preview.url)
+}

package/src/renderer/shared/utils/artifacts.ts

@@ -0,0 +1,55 @@
+export type ArtifactType =
+  | 'html'
+  | 'svg'
+  | 'markdown'
+  | 'image'
+  | 'code'
+  | 'file'
+  | 'pdf'
+  | 'audio'
+  | 'video'
+
+export type ViewportMode = 'desktop' | 'tablet' | 'mobile'
+
+export interface ArtifactFile {
+  path: string
+  workspacePath?: string
+  url?: string
+  content?: string
+  type?: ArtifactType
+  mimeType?: string
+  byteLength?: number
+  objectUrl?: boolean
+  range?: boolean
+}
+
+export function detectArtifactType(filePath: string): ArtifactType {
+  const lower = filePath.toLowerCase()
+  if (lower.endsWith('.html') || lower.endsWith('.htm')) return 'html'
+  if (/\.(png|jpe?g|gif|webp|ico)$/.test(lower)) return 'image'
+  if (lower.endsWith('.svg')) return 'svg'
+  if (lower.endsWith('.md') || lower.endsWith('.markdown')) return 'markdown'
+  if (lower.endsWith('.pdf')) return 'pdf'
+  if (/\.(mp3|wav|ogg|oga|opus|flac|m4a|aac|weba)$/.test(lower)) return 'audio'
+  if (/\.(mp4|m4v|webm|ogv|mov)$/.test(lower)) return 'video'
+  return 'code'
+}
+
+export function getFileLanguage(filePath: string): string {
+  const ext = filePath.split('.').pop()?.toLowerCase() || ''
+  const map: Record<string, string> = {
+    js: 'javascript',
+    jsx: 'javascript',
+    ts: 'typescript',
+    tsx: 'typescript',
+    html: 'html',
+    htm: 'html',
+    css: 'css',
+    json: 'json',
+    rs: 'rust',
+    py: 'python',
+    svg: 'xml',
+    md: 'markdown',
+  }
+  return map[ext] || ext || 'plaintext'
+}

package/src/renderer/shared/utils/contextCompaction.test.tsx

@@ -0,0 +1,48 @@
+import React from 'react'
+import { renderToStaticMarkup } from 'react-dom/server'
+import { describe, expect, it } from 'vitest'
+import { activeCompactionFrom } from './contextCompaction'
+import { ContextCompactionStatus } from '../components/chat/ContextCompactionStatus'
+import { activitiesFrom } from './agentActivity'
+import type { AgentProgress } from '../types'
+
+const started = { type: 'ContextCompaction', data: { status: 'started', message: 'Summarizing earlier steps to continue working' } } as const
+const completed = { type: 'ContextCompaction', data: { status: 'completed', message: 'Context compacted' } } as const
+const failed = { type: 'ContextCompaction', data: { status: 'failed', message: 'Context compaction failed: provider unavailable. Continuing with the original context.' } } as const
+
+describe('context compaction progress', () => {
+  it('keeps compaction active until its terminal event, then allows normal working status', () => {
+    expect(activeCompactionFrom([started, { type: 'Thinking', data: { elapsed_secs: 10 } }])?.message).toContain('Summarizing earlier steps')
+    expect(activeCompactionFrom([started, completed])).toBeNull()
+    expect(activeCompactionFrom([started, failed])).toBeNull()
+    expect(activeCompactionFrom([started, completed, started])).not.toBeNull()
+  })
+  it('renders the elapsed timer, explanatory text and animated gradient label', () => {
+    const html = renderToStaticMarkup(<ContextCompactionStatus elapsedSeconds={12} />)
+    expect(html).toContain('Compacting context')
+    expect(html).toContain('12s')
+    expect(html).toContain('Summarizing earlier steps to continue working')
+    expect(html).toContain('thinking-status-label')
+    expect(html).toContain('role="status"')
+  })
+  it('keeps completion and actionable failure visible in activity history, without a completed start row', () => {
+    const timeline = activitiesFrom([started, completed, started, failed]).timeline
+    expect(timeline?.map(item => 'thought' in item ? item.thought : '')).toEqual([completed.data.message, failed.data.message])
+  })
+})
+
+it('keeps the collective timer active until all parallel subagents finish', () => {
+  const a = { ...started, data: { ...started.data, subagent: 'A' } }
+  const b = { ...started, data: { ...started.data, subagent: 'B' } }
+  const doneA = { ...completed, data: { ...completed.data, subagent: 'A' } }
+  const doneB = { ...completed, data: { ...completed.data, subagent: 'B' } }
+  expect(activeCompactionFrom([a, b, doneA])?.index).toBe(0)
+  expect(activeCompactionFrom([a, b, doneA, doneB])).toBeNull()
+})
+
+it('keeps repeated-name subagents active until every lifecycle finishes', () => {
+  const child = { ...started, data: { ...started.data, subagent: 'reviewer' } }
+  const done = { ...completed, data: { ...completed.data, subagent: 'reviewer' } }
+  expect(activeCompactionFrom([child, child, done])?.index).toBe(0)
+  expect(activeCompactionFrom([child, child, done, done])).toBeNull()
+})

package/src/renderer/shared/utils/contextCompaction.ts

@@ -0,0 +1,21 @@
+import type { AgentProgress } from '../types'
+
+export function activeCompactionFrom(progress: AgentProgress[]) {
+  const pending = new Map<string, { count: number; data: Extract<AgentProgress, { type: 'ContextCompaction' }>['data'] }>()
+  let cycleIndex = 0
+  for (let index = 0; index < progress.length; index++) {
+    const event = progress[index]
+    if (event.type !== 'ContextCompaction') continue
+    const scope = event.data.subagent ?? ''
+    if (event.data.status === 'started') {
+      if (pending.size === 0) cycleIndex = index
+      pending.set(scope, { count: (pending.get(scope)?.count ?? 0) + 1, data: event.data })
+    } else {
+      const entry = pending.get(scope)
+      if (entry && entry.count > 1) entry.count--
+      else pending.delete(scope)
+    }
+  }
+  const active = pending.values().next().value
+  return active ? { ...active.data, index: cycleIndex } : null
+}

package/src/renderer/shared/utils/effectVisibility.ts

@@ -0,0 +1,9 @@
+// Each renderer window owns its visibility listener for its lifetime.
+const initialized = new WeakSet<Document>()
+export function initializeEffectVisibility(): void {
+  if (typeof document === 'undefined' || !document.addEventListener || initialized.has(document)) return
+  initialized.add(document)
+  const update = () => document.documentElement.setAttribute('data-effects-hidden', String(document.hidden))
+  document.addEventListener('visibilitychange', update)
+  update()
+}