@pheem49/mint 1.16.0 → 1.18.0

package/src/renderer/tests/browserArtifacts.browser.tsx

@@ -0,0 +1,68 @@
+import React, { useState } from 'react'
+import { createRoot } from 'react-dom/client'
+import ChatMessageItem from '../shared/components/chat/ChatMessageItem'
+import { installRendererPlatform, type RendererAdapter } from '../shared/platform'
+import { compactAgentProgressForPersistence, reduceLiveAgentProgress } from '../shared/agentProgress'
+import type { AgentProgress } from '../shared/types'
+import '../shared/theme/tokens.css'
+if (new URLSearchParams(location.search).get('platform') === 'desktop') {
+  await import('../src/css/app-shell.css'); await import('../src/css/chat.css')
+} else {
+  await import('../src-web/css/app-shell.css'); await import('../src-web/css/chat.css')
+}
+
+const canvas = document.createElement('canvas'); canvas.width = 960; canvas.height = 600
+const ctx = canvas.getContext('2d')!
+ctx.fillStyle = '#102a25'; ctx.fillRect(0, 0, 960, 600)
+ctx.fillStyle = '#94dcc1'; ctx.font = '36px sans-serif'; ctx.fillText('Search results', 48, 80)
+ctx.fillStyle = '#d8e6e0'; ctx.font = '25px sans-serif'; ctx.fillText('ทดสอบ Mint · Matching result', 48, 165)
+ctx.strokeStyle = '#94dcc1'; ctx.strokeRect(48, 215, 864, 320)
+const image = canvas.toDataURL('image/png')
+installRendererPlatform({ readMcpArtifact: async (id, chat) => {
+  if (id !== 'browser-image' || chat !== 'browser-chat') throw new Error('Artifact unavailable')
+  return image
+} } as RendererAdapter)
+
+const artifacts: AgentProgress = { type: 'ToolArtifacts', data: { callId: 'capture', warnings: [], artifacts: [{ id: 'browser-image', name: 'result.png', mimeType: 'image/png', kind: 'image', size: 12000, chatId: 'browser-chat', callId: 'capture', server: 'browser', metadata: { url: 'http://localhost:3000/search', width: 960, height: 600, capturedAt: '2026-10-19T10:00:00Z' } }] } }
+const original: AgentProgress[] = [
+  { type: 'ToolEnd', data: { action: 'view_image', callId: 'capture', input: { path: 'result.png' }, result: 'Screenshot saved as an artifact.', status: 'success' } }, artifacts,
+  // Reopening the same image should not create another gallery card.
+  { ...artifacts, data: { ...artifacts.data, callId: 'view-again' } },
+  { type: 'RunCompleted', data: { summary: { outcome: 'UNVERIFIED' } as any } },
+]
+const saved = compactAgentProgressForPersistence(Array.from({ length: 45 }, (_, index): AgentProgress => ({ type: 'ToolEnd', data: { action: 'read_file', input: { path: `file-${index}` }, result: 'Read' } })).reduce(reduceLiveAgentProgress, original))
+const noop = () => {}
+function Fixture() {
+  const [other, setOther] = useState(false)
+  return <>
+    <style>{`*{box-sizing:border-box}body{margin:0;padding:20px;background:#101112;color:var(--text-main);font-family:Arial,sans-serif}.fixture{max-width:760px;margin:24px auto}.fixture-controls{display:flex;gap:8px;flex-wrap:wrap}.message-bubble{width:100%}#qa-results{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}.mcp-artifact>span{overflow-wrap:anywhere}`}</style>
+    <div className="fixture-controls"><button id="switch-chat" onClick={() => setOther(v => !v)}>Switch conversation</button></div>
+    <div className="fixture"><ChatMessageItem interaction={{ id: other ? 8 : 7, status: 'completed', aiText: 'Search finished. Visual review remains unverified.', userText: 'เปิดเว็บ กรอกคำค้น แล้วแคปผลให้ดู', createdAt: '2026-10-19T10:00:00Z', agentActivity: other ? [] : JSON.parse(JSON.stringify(saved)) }} copiedId={null} speakingText={null} agentActivitySnapshots={{}} thinkingExpanded={{}} onThinkingExpandedChange={noop} handleCopyMessage={noop} speak={noop} toggleActivity={noop} renderFileChanges={() => null} /></div>
+    <pre id="qa-results">Running…</pre>
+  </>
+}
+createRoot(document.getElementById('root')!).render(<Fixture />)
+const delay = () => new Promise(resolve => setTimeout(resolve, 40))
+async function waitFor(check: () => boolean, label: string) { for (let i = 0; i < 100; i++) { if (check()) return; await delay() } throw new Error(label) }
+const results: string[] = []
+function check(value: unknown, label: string) { if (!value) throw new Error(label); results.push(`PASS ${label}`) }
+async function run() {
+  await waitFor(() => !!document.querySelector<HTMLImageElement>('.mcp-image-button img')?.naturalWidth, 'artifact image loads')
+  check(document.querySelectorAll('.mcp-image-button').length === 1, 'reopened artifact is shown once')
+  check(document.querySelector('[data-completion-status="unverified"]'), 'unverified state survives history serialization')
+  check(!document.querySelector('.agent-activity-toggle[aria-expanded="true"]'), 'image is visible with Activity collapsed')
+  const download = document.querySelector<HTMLAnchorElement>('a[download="result.png"]')
+  check(download?.href.startsWith('data:image/png'), 'original image has a download link')
+  document.querySelector<HTMLButtonElement>('.mcp-image-button')!.click()
+  await waitFor(() => !!document.querySelector('dialog[open]'), 'image expands')
+  check(document.querySelector('dialog[open] img'), 'expanded image is present')
+  document.querySelector<HTMLButtonElement>('dialog[open] button')!.click()
+  await waitFor(() => !document.querySelector('dialog[open]'), 'image closes')
+  document.querySelector<HTMLButtonElement>('#switch-chat')!.click()
+  await waitFor(() => !document.querySelector('.mcp-image-button'), 'other chat has no previous images')
+  document.querySelector<HTMLButtonElement>('#switch-chat')!.click()
+  await waitFor(() => !!document.querySelector<HTMLImageElement>('.mcp-image-button img')?.naturalWidth, 'saved image returns')
+  check(document.documentElement.scrollWidth <= innerWidth, 'cards fit the viewport')
+  document.getElementById('qa-results')!.textContent = results.join('\n') + '\nALL PASS'
+}
+run().catch(error => { document.getElementById('qa-results')!.textContent = `FAIL ${error.message}\n${results.join('\n')}` })

package/src/renderer/tests/chatEscape.browser.html

@@ -0,0 +1 @@
+<!doctype html><html><head><meta charset="utf-8"><title>Chat Escape regression</title></head><body><div id="root"></div><pre id="result">RUNNING</pre><script type="module" src="./chatEscape.browser.tsx"></script></body></html>

package/src/renderer/tests/chatEscape.browser.tsx

@@ -0,0 +1,25 @@
+import React from 'react'
+import { createRoot } from 'react-dom/client'
+import ChatPanel from '../shared/components/chat/ChatPanel'
+import { chatPanelFixture } from './chatPanelFixture'
+import { installRendererPlatform } from '../shared/platform'
+import * as webAdapter from '../src-web/tauri'
+installRendererPlatform(webAdapter)
+let cancellations = 0
+const fixture = chatPanelFixture()
+createRoot(document.getElementById('root')!).render(<>
+  <ChatPanel {...fixture as any} conversation={{ ...fixture.conversation, sending: true }} actions={{ ...fixture.actions, onCancelMessage: () => cancellations++ }} tools={{ ...fixture.tools, open: true }} />
+  <aside className="tool-surface-page"><button id="tool-control">Tool control</button></aside>
+</>)
+async function run() {
+  for (let i = 0; i < 100 && !document.getElementById('chat-input'); i++) await new Promise(resolve => setTimeout(resolve, 40))
+  await new Promise(resolve => setTimeout(resolve, 100))
+  const composer = document.getElementById('chat-input')!
+  composer.focus()
+  composer.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true }))
+  if (cancellations !== 1) throw Error('Escape from chat must cancel while Tools is open')
+  document.getElementById('tool-control')!.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true }))
+  if (cancellations !== 1) throw Error('Escape inside Tools must not cancel chat')
+  document.getElementById('result')!.textContent = JSON.stringify({ status: 'PASS', checks: ['chat Escape cancels with Tools open', 'Tools Escape leaves generation running'] })
+}
+run().catch(error => { document.getElementById('result')!.textContent = JSON.stringify({ status: 'FAIL', error: String(error) }) })

package/src/renderer/tests/chatPerformance.browser.html

@@ -2,7 +2,7 @@
 <body><div id="root"></div><pre id="result">RUNNING</pre><script type="module">
 import React, { useRef, useState } from 'react';
 import { createRoot } from 'react-dom/client';
-import { VirtualChatHistory } from '../shared/components/VirtualChatHistory';
+import { VirtualChatHistory } from '../shared/components/chat/VirtualChatHistory';
 const h = React.createElement;
 const runtimeErrors = [];
 window.addEventListener('error', event => runtimeErrors.push(event.message));

package/src/renderer/tests/collapsedPaste.browser.html

@@ -1,7 +1,7 @@
 <!doctype html><html><head><meta charset="utf-8"><title>Collapsed paste input</title></head><body><div id="root"></div><pre id="result">RUNNING</pre><script type="module">
 import React, { useRef, useState } from 'react';
 import { createRoot } from 'react-dom/client';
-import { CollapsiblePasteInput } from '../shared/components/CollapsiblePasteInput';
+import { CollapsiblePasteInput } from '../shared/components/chat/CollapsiblePasteInput';
 const desktop = new URLSearchParams(location.search).get('surface') === 'desktop';
 if (desktop) await import('../src/css/chat.css'); else await import('../src-web/css/chat.css');
 const submitted = [];

package/src/renderer/tests/composerMenus.browser.html

@@ -2,9 +2,9 @@
 <body><div id="menu-fixture"></div><pre id="result">RUNNING</pre><script type="module">
 import React, { useRef, useState } from 'react';
 import { createRoot } from 'react-dom/client';
-import SlashSuggestions from '../shared/components/SlashSuggestions';
-import SlashChoicePanel from '../shared/components/SlashChoicePanel';
-import ModelSelectorPopover from '../shared/components/ModelSelectorPopover';
+import SlashSuggestions from '../shared/components/chat/SlashSuggestions';
+import SlashChoicePanel from '../shared/components/chat/SlashChoicePanel';
+import ModelSelectorPopover from '../shared/components/chat/ModelSelectorPopover';
 const params = new URLSearchParams(location.search);
 const desktop = params.get('surface') === 'desktop';
 await import('../shared/theme/tokens.css');

package/src/renderer/tests/contextCompaction.browser.html

@@ -1,7 +1,7 @@
 <!doctype html><html><head><meta charset="utf-8"><title>Context compaction status</title></head><body style="background:#111;color:#eee;font-family:system-ui"><div id="root"></div><pre id="result">RUNNING</pre><script type="module">
 import React from 'react';
 import { createRoot } from 'react-dom/client';
-import { ContextCompactionStatus } from '../shared/components/ContextCompactionStatus';
+import { ContextCompactionStatus } from '../shared/components/chat/ContextCompactionStatus';
 import '../shared/css/thinking-status.css';
 document.documentElement.style.setProperty('--text-main','#eeeeee');
 document.documentElement.style.setProperty('--text-muted','#71717a');

package/src/renderer/tests/errorRecovery.browser.html

@@ -1,5 +1,5 @@
 <!doctype html><html><head><meta name="viewport" content="width=device-width, initial-scale=1"><title>Error recovery regression</title></head><body style="margin:0"><div id="root"></div><pre id="result">RUNNING</pre><script type="module">
-import React from 'react';import {createRoot} from 'react-dom/client';import ChunkErrorBoundary from '../shared/components/ChunkErrorBoundary';
+import React from 'react';import {createRoot} from 'react-dom/client';import ChunkErrorBoundary from '../shared/components/app/ChunkErrorBoundary';
 const wait=ms=>new Promise(r=>setTimeout(r,ms)),results=[];const assert=(ok,msg)=>{if(!ok)throw Error(msg);results.push(msg)};
 let fail=true,micRequests=0;Object.defineProperty(navigator,'mediaDevices',{configurable:true,value:{getUserMedia:async()=>{micRequests++;throw Error('Error page must not request microphone')}}});
 function BrokenRoute(){if(fail)throw Error('Fixture route failed to render');return React.createElement('h1',null,'Recovered chat')}

package/src/renderer/tests/glideSelect.browser.html

@@ -8,8 +8,7 @@ const results=[];
 const wait=(ms=60)=>new Promise(resolve=>setTimeout(resolve,ms));
 const assert=(ok,message)=>{if(!ok)throw new Error(message);results.push(message)};
 try {
- const {default:SelectField}=await import('../shared/components/SelectField');
- const {default:GlideSelect}=await import('../shared/components/GlideSelect');
+ const {default:SelectField, GlideSelect}=await import('../shared/components/ui/SelectField');
  const picks=[];
  function Fixture(){
   const [value,setValue]=React.useState('png');

package/src/renderer/tests/glideSelect.preview.html

@@ -5,7 +5,7 @@ import {createRoot} from 'react-dom/client';
 import AudioTab from '../shared/components/Settings/AudioTab';
 import {DEFAULT_CONFIG} from '../shared/constants/config';
 import '../shared/theme/tokens.css';
-import '../src-web/css/settings/base.css';
+import '../shared/css/settings/base.css';
 import '../shared/css/settings/general.css';
 import '../src-web/css/settings/mobile.css';
 function App(){

package/src/renderer/tests/library.browser.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import {createRoot} from 'react-dom/client'
-import LibraryPage from '../shared/components/LibraryPage'
+import LibraryPage from '../shared/components/studio/LibraryPage'
 import {installRendererPlatform,type RendererAdapter} from '../shared/platform'
 import type {LibraryItem,LibraryQuery} from '../shared/types'
 let failAction=false;let offline=false;let openChat='';let contentReads=0
@@ -42,6 +42,9 @@ async function run(){
  check(document.documentElement.scrollWidth<=innerWidth,'long source message fits viewport')
  if(location.search.includes('source-preview')){document.getElementById('qa-results')!.textContent='';return}
  document.dispatchEvent(new KeyboardEvent('keydown',{key:'Escape',bubbles:true}));await waitFor(()=>!document.querySelector('.library-preview'),'Close image preview')
+ click('[data-filter="image"]');await waitFor(()=>Boolean(document.querySelector('.library-grid-sizes')),'Image filter shows grid size controls')
+ click('[data-grid-size="large"]');await waitFor(()=>Boolean(document.querySelector('.library-items.is-grid-large')),'Grid size switches to large')
+ click('[data-grid-size="normal"]');await waitFor(()=>Boolean(document.querySelector('.library-items.is-grid-normal')),'Grid size switches back to normal')
  click('[data-filter="file"]');await waitFor(()=>document.querySelectorAll('.library-item').length===2,'Files filter')
  click('[data-preview="notes"]');await waitFor(()=>Boolean(document.querySelector('.library-preview pre')?.textContent?.includes('Regression reference')),'Document preview')
  check(document.querySelector('.library-preview pre')?.textContent?.includes('Regression reference'),'text preview reads original file')

package/src/renderer/tests/liveOrb.browser.html

@@ -1,7 +1,7 @@
 <!doctype html><html><head><meta name="viewport" content="width=device-width, initial-scale=1"><title>Live orb regression</title></head>
 <body><button id="launcher">Live</button><div id="chat-host" style="position:absolute;left:80px;top:140px;width:260px;height:160px;transform:translateZ(0);overflow:hidden"><div id="root"></div></div><pre id="result">RUNNING</pre><script type="module">
 import React from 'react';import {createRoot} from 'react-dom/client';
-import GeminiLiveOverlay from '../shared/components/GeminiLiveOverlay';
+import GeminiLiveOverlay from '../shared/components/chat/GeminiLiveOverlay';
 import {VoicePoweredOrb} from '../shared/components/ui/voice-powered-orb';
 import '@fontsource/prompt/400.css';import '@fontsource/prompt/500.css';
 import '../shared/theme/tokens.css';import '../src-web/css/app-shell.css';

package/src/renderer/tests/liveVoice.browser.html

@@ -19,6 +19,7 @@ try{
  permission=defer();session=defer();voice.setVoiceMode(true);await wait(50);const live=stream();permission.resolve(live);await wait(50);session.resolve('live');await wait(100);
  assert(voice.isRecording&&voice.analyserRef.current,'active call exposes its existing audio analyser');
  eventHandler({type:'audioChunk',data:btoa('\0\0\0\0')});await wait(50);const ctx=contexts.at(-1);assert(ctx.sources.length===1,'normal streamed playback still works');
+ eventHandler({type:'interrupted'});await wait(50);assert(ctx.sources[0].stopped&&!voice.isSpeaking&&voice.isRecording,'barge-in interruption stops queued playback immediately without closing mic session');
  voice.setVoiceMode(false);await wait(100);
  assert(live.track.stopped&&ctx.state==='closed'&&ctx.sources[0].stopped&&!voice.analyserRef.current,'ending releases microphone, output audio, analyser and audio context');
  const count=ctx.sources.length;eventHandler({type:'audioChunk',data:btoa('\0\0')});await wait(50);assert(ctx.sources.length===count&&contexts.length===1,'late events cannot restart audio after call ends');

package/src/renderer/tests/mediaFixtures.ts

@@ -0,0 +1,32 @@
+/** Small valid documents/media for the real browser decoders; no runtime mocks for rendering. */
+export function samplePdf(): Uint8Array<ArrayBuffer> {
+  const objects = [
+    '<< /Type /Catalog /Pages 2 0 R >>',
+    '<< /Type /Pages /Kids [3 0 R 5 0 R] /Count 2 >>',
+    '<< /Type /Page /Parent 2 0 R /MediaBox [0 0 300 400] /Resources << /Font << /F1 7 0 R >> >> /Contents 4 0 R >>',
+    '',
+    '<< /Type /Page /Parent 2 0 R /MediaBox [0 0 300 400] /Resources << /Font << /F1 7 0 R >> >> /Contents 6 0 R >>',
+    '',
+    '<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica >>',
+  ]
+  for (const [index, label] of [[3, 'Media PDF page one'], [5, 'Media PDF page two']] as const) {
+    const content = `BT /F1 18 Tf 35 300 Td (${label}) Tj ET`
+    objects[index] = `<< /Length ${content.length} >>\nstream\n${content}\nendstream`
+  }
+  let data = '%PDF-1.4\n'
+  const offsets = [0]
+  objects.forEach((object, index) => { offsets.push(data.length); data += `${index + 1} 0 obj\n${object}\nendobj\n` })
+  const crossref = data.length
+  data += `xref\n0 ${objects.length + 1}\n0000000000 65535 f \n`
+  data += offsets.slice(1).map(offset => `${String(offset).padStart(10, '0')} 00000 n \n`).join('')
+  data += `trailer\n<< /Size ${objects.length + 1} /Root 1 0 R >>\nstartxref\n${crossref}\n%%EOF`
+  return new TextEncoder().encode(data)
+}
+export function sampleWav(): ArrayBuffer {
+  const samples = 8000, buffer = new ArrayBuffer(44 + samples * 2), view = new DataView(buffer)
+  const text = (offset: number, value: string) => [...value].forEach((letter, index) => view.setUint8(offset + index, letter.charCodeAt(0)))
+  text(0, 'RIFF'); view.setUint32(4, buffer.byteLength - 8, true); text(8, 'WAVE'); text(12, 'fmt ')
+  view.setUint32(16, 16, true); view.setUint16(20, 1, true); view.setUint16(22, 1, true); view.setUint32(24, 8000, true); view.setUint32(28, 16000, true); view.setUint16(32, 2, true); view.setUint16(34, 16, true); text(36, 'data'); view.setUint32(40, samples * 2, true)
+  for (let i = 0; i < samples; i++) view.setInt16(44 + i * 2, Math.sin(i * Math.PI * 2 * 220 / 8000) * 3000, true)
+  return buffer
+}

package/src/renderer/tests/modInput.browser.html

@@ -1,7 +1,7 @@
 <!doctype html><html><head><meta charset="utf-8"><title>Mod input synchronization</title></head><body><div id="root"></div><pre id="result">RUNNING</pre><script type="module">
 import React from 'react';
 import { createRoot } from 'react-dom/client';
-import { ModUi } from '../shared/components/ModUi';
+import { ModUi } from '../shared/components/extensions/ModsPanel';
 const root = createRoot(document.getElementById('root'));
 const submitted = [];
 const render = value => root.render(React.createElement(ModUi, { node: { type: 'input', label: 'Draft', action: 'save', value }, onAction: (action, value) => submitted.push([action, value]) }));

package/src/renderer/tests/sessionSources.browser.tsx

@@ -1,7 +1,9 @@
 import React, { useState } from 'react'
 import { createRoot } from 'react-dom/client'
-import WorkspaceContextPopover from '../shared/components/WorkspaceContextPopover'
-import SessionSources from '../shared/components/SessionSources'
+import ToolSurfacePage from '../shared/components/workspace/ToolSurfacePage'
+import ToolsPanelToggle from '../shared/components/workspace/ToolsPanelToggle'
+import { useSessionSources } from '../shared/utils/useSessionSources'
+import SessionSources from '../shared/components/workspace/SessionSources'
 import { installRendererPlatform, installWorkspacePlatform, type RendererAdapter, type WorkspacePlatform } from '../shared/platform'
 import type { ConversationSources } from '../shared/types'
 import { sourceAttachments } from '../shared/utils/sourceAttachments'
@@ -30,9 +32,24 @@ installWorkspacePlatform({ getGitBranchInfo: async () => ({ isRepository: true,
 
 function Fixture() {
   const [chatId, setChatId] = useState('A')
+  const [open, setOpen] = useState(false)
+  const [selected, setSelected] = useState(false)
+  const session = useSessionSources(chatId, [], open)
+  const noop = () => {}
+  const close = () => { setOpen(false); requestAnimationFrame(() => document.querySelector<HTMLButtonElement>('.tools-panel-toggle')?.focus()) }
+  const desktop = location.pathname.includes('sessionSources')
+
   return <>
-    <style>{`*{box-sizing:border-box}body{margin:0;background:#111113;color:#e8eaed;font-family:Arial,sans-serif;--text-main:#e8eaed;--text-secondary:#c5cad1;--text-muted:#8b939f;--bg-overlay:#111113;--surface-strong:#25262b;--border:#33353b;--accent:#7edbb5;--border-subtle:#27292d;--bg-surface-soft:#1a1b20;--bg-surface-hover:#22242a}.fixture-bar{display:flex;align-items:center;justify-content:flex-end;gap:12px;height:50px;padding:8px 16px;border-bottom:1px solid #33353b}#qa-results{position:fixed;bottom:6px;left:8px;max-width:calc(100vw - 16px);font-size:10px;white-space:pre-wrap;pointer-events:none}`}</style>
-    <header className="fixture-bar"><span>Session sources fixture</span><button id="switch-chat" onClick={() => setChatId(id => id === 'A' ? 'B' : 'A')}>Switch session</button><WorkspaceContextPopover workspacePath="/workspace/Mint-CLI" terminalCount={0} chatId={chatId} liveProgress={[]} recentChanges={[]} onOpenWorkspace={() => {}} onOpenReview={() => {}} onRefreshWorkspace={() => {}} /></header>
+    <style>{`*{box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden}.assistant-workspace{flex:1;min-width:0}body{margin:0;background:#111113;color:#e8eaed;font-family:Arial,sans-serif;--text-main:#e8eaed;--text-secondary:#c5cad1;--text-muted:#8b939f;--bg-overlay:#111113;--surface-strong:#25262b;--border:#33353b;--accent:#7edbb5;--border-subtle:#27292d;--bg-surface-soft:#1a1b20;--bg-surface-hover:#22242a}.fixture-bar{display:flex;align-items:center;justify-content:flex-end;gap:12px;height:50px;padding:8px 16px;border-bottom:1px solid #33353b}#qa-results{position:fixed;bottom:6px;left:8px;max-width:calc(100vw - 16px);font-size:10px;white-space:pre-wrap;pointer-events:none}`}</style>
+    <header className="fixture-bar"><span>Session sources fixture</span><button id="switch-chat" onClick={() => setChatId(id => id === 'A' ? 'B' : 'A')}>Switch session</button><ToolsPanelToggle open={open} count={0} onToggle={() => setOpen(v => !v)} /></header>
+    <div className={`app-body ${open ? 'tool-surface-active' : ''}`} style={{ position: 'relative', height: 'calc(100dvh - 50px)', display: 'flex' }}>
+      <main className="assistant-workspace"><h1>Conversation</h1><textarea aria-label="Message" defaultValue="Keep my draft" /></main>
+      {open && <ToolSurfacePage surfaces={selected ? [{ id: 'sources', kind: 'sources', title: 'Sources' }] : []} activeSurfaceId={selected ? 'sources' : null} terminalSize={440} desktopTools={desktop}
+        sourceCount={session.sources.length} onOpenSources={() => setSelected(true)}
+        sourcesContent={<SessionSources key={chatId} {...session} onRetry={session.retry} onOpenLibrary={url => { window.history.pushState({}, '', url); window.dispatchEvent(new PopStateEvent('popstate')); close() }} />}
+        onSelect={noop} onClose={() => setSelected(false)} onCloseAll={() => setSelected(false)} onDuplicate={noop} onRename={noop} onCloseOthers={noop} onResizeTerminal={noop} onResizePanel={noop}
+        onOpenTerminal={noop} onOpenBrowser={noop} onOpenReview={noop} onOpenFiles={noop} onOpenMods={noop} onOpenBackgroundTasks={noop} onModsPanelTarget={noop} onBackgroundPanelTarget={noop} onClosePanel={close} />}
+    </div>
     <pre id="qa-results">Running…</pre>
   </>
 }
@@ -43,27 +60,50 @@ const results: string[] = []
 const check = (condition: unknown, name: string) => { if (!condition) throw new Error(name); results.push(`PASS ${name}`) }
 function click(selector: string) { const target = document.querySelector<HTMLElement>(selector); if (!target) throw new Error(`Missing ${selector}`); target.click() }
 async function run() {
-  await waitFor(() => Boolean(document.querySelector('.workspace-context-trigger')), 'Trigger')
-  click('.workspace-context-trigger')
+  await waitFor(() => Boolean(document.querySelector('.tools-panel-toggle')), 'Tools trigger')
+  check(!document.querySelector('.session-sources-toggle'), 'standalone Sources button is removed')
+  click('.tools-panel-toggle')
+  await waitFor(() => document.querySelector('[aria-label="9 session sources"]'), 'Sources count')
+  check(true, 'Tools launcher shows the current session source count')
+  click('[title="Session sources"]')
   await waitFor(() => Boolean(document.querySelector('.session-source-row')), 'Saved sources')
-  check(document.querySelectorAll('.session-source-row').length === 5, 'initial list shows every source category without flooding the popover')
+  check(document.querySelectorAll('.session-source-row').length === 9, 'all session sources are visible without expanding')
   check(document.querySelector<HTMLAnchorElement>('.session-source-row[href^="/library"]')?.getAttribute('href') === '/library?item=reference-item', 'source image links to its Library original')
   check(document.querySelector('.session-source-icon img'), 'sent image has a thumbnail')
   check(preview[0].name === 'reference.png' && (preview[0].thumbnailDataUri?.length || 0) < 262144, 'thumbnail generation preserves name and bounds payload size')
   check(document.querySelector('.session-sources')?.textContent?.includes('Math-Data-Science-Exam.pdf'), 'sent document appears with filename')
   if (location.search.includes('preview')) { document.getElementById('qa-results')!.textContent = ''; return }
-  click('.session-sources-more')
-  await waitFor(() => document.querySelectorAll('.session-source-row').length === 9, 'Expanded list')
-  check(document.querySelectorAll('.session-source-row').length === 9, 'show more reveals all session sources')
+  check(!document.querySelector('.session-sources-more'), 'Sources does not hide items behind Show more')
+  check([...document.querySelectorAll('.session-sources-group h3')].map(el => el.textContent).join('|') === 'Images1|Files6|Web searches2', 'group headings show their counts')
+  const search = document.querySelector<HTMLInputElement>('[aria-label="Search Sources"]')!
+  check(search, 'larger source collections offer search')
+  const enterSearch = async (value: string) => {
+    Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')!.set!.call(search, value)
+    search.dispatchEvent(new Event('input', { bubbles: true }))
+    await delay()
+  }
+  await enterSearch('LEAST_SQUARES')
+  check(document.querySelectorAll('.session-source-row').length === 1 && document.querySelector('.session-source-row')?.textContent?.includes('02_least_squares'), 'search filters names without case sensitivity')
+  await enterSearch('docs.example.com')
+  check(document.querySelectorAll('.session-source-row').length === 1, 'search filters domains')
+  await enterSearch('no-such-source')
+  check(document.querySelector('.session-sources-empty')?.textContent?.includes('No sources match'), 'unmatched search explains its empty result')
+  await enterSearch('')
+  check(document.querySelectorAll('.session-source-row').length === 9, 'clearing search restores every source')
+  const titleStyle = getComputedStyle(document.querySelector('.session-source-copy strong')!)
+  check(titleStyle.webkitLineClamp === '2' && titleStyle.whiteSpace === 'normal', 'source titles allow two lines')
   check(document.querySelector<HTMLAnchorElement>('.session-source-row[href^="https:"]')?.href === 'https://example.com/regression', 'historical web searches link to source pages')
-  const popover = document.querySelector<HTMLElement>('.workspace-context-popover')!
-  check(popover.getBoundingClientRect().right <= innerWidth && popover.getBoundingClientRect().left >= 0, 'popover fits viewport')
-  check(getComputedStyle(popover).overflowY === 'auto', 'expanded sources can scroll')
+  document.getAnimations().forEach(animation => animation.finish())
+  await delay()
+  check(document.documentElement.scrollWidth <= innerWidth, 'Tools does not overflow the page')
+  const popover = document.querySelector<HTMLElement>('.tool-surface-sources')!
+  check(popover.getBoundingClientRect().right <= innerWidth && popover.getBoundingClientRect().left >= 0, 'Sources tool fits viewport')
+  check(getComputedStyle(popover).overflowY === 'auto', 'Sources tool can scroll')
   fail = true; await waitFor(() => Boolean(document.querySelector('.session-sources-error')), 'Error state')
   check(document.querySelectorAll('.session-source-row').length === 9, 'refresh error preserves known sources')
   fail = false; click('.session-sources-error button'); await waitFor(() => !document.querySelector('.session-sources-error'), 'Retry')
   check(true, 'retry recovers')
-  deferA = true; click('.workspace-context-trigger'); await delay(); click('.workspace-context-trigger'); await waitFor(() => Boolean(resolveA), 'Pending A request')
+  deferA = true; click('.tools-panel-toggle'); await delay(); click('.tools-panel-toggle'); await waitFor(() => Boolean(resolveA), 'Pending A request')
   click('#switch-chat'); await waitFor(() => Boolean(document.querySelector('.session-sources-empty')), 'Empty B')
   resolveA!(data); await delay()
   check(document.querySelectorAll('.session-source-row').length === 0, 'late response cannot leak another session sources')
@@ -82,7 +122,14 @@ async function run() {
   document.removeEventListener('click',suppressReload)
   check(preventedByComponent && navigated, 'Library source navigation preserves the live application and composer')
   window.removeEventListener('popstate',navigation)
-  await waitFor(()=>!document.querySelector('.workspace-context-popover'),'Source navigation closes its popover')
+  await waitFor(()=>!document.querySelector('.tool-surface-page'),'Source navigation closes Tools')
+  check(document.querySelector<HTMLTextAreaElement>('textarea')?.value === 'Keep my draft', 'Library navigation preserves the draft')
+  click('.tools-panel-toggle'); await waitFor(() => Boolean(document.querySelector('.tool-surface-sources')), 'Sources reopens')
+  document.querySelector<HTMLButtonElement>('[role="tab"]')!.focus()
+  document.activeElement!.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true }))
+  await waitFor(() => !document.querySelector('.tool-surface-page'), 'Escape closes Sources tool')
+  await waitFor(() => document.activeElement === document.querySelector('.tools-panel-toggle'), 'Escape restores focus to Tools')
+  check(true, 'Escape restores focus to Tools')
   const iconFixture = document.createElement('div')
   document.body.append(iconFixture)
   const iconRoot = createRoot(iconFixture)
@@ -102,6 +149,20 @@ async function run() {
   await waitFor(() => Boolean(iconFixture.querySelector('[href="https://example.com/with-icon"] .is-web svg')), 'Late favicon failure falls back')
   check(Boolean(iconFixture.querySelector('[href="https://example.com/with-icon"]')), 'favicon failure preserves the source link')
   iconRoot.unmount(); iconFixture.remove()
+  let openedArtifact: any = null
+  const artifactFixture = document.createElement('div')
+  document.body.append(artifactFixture)
+  const artifactRoot = createRoot(artifactFixture)
+  artifactRoot.render(<SessionSources sources={[
+    { id: 'img-1', kind: 'image', name: 'photo.png', detail: 'Image', thumbnailDataUri: originalImage },
+  ]} loading={false} error="" onRetry={() => {}} onOpenLibrary={() => {}} onOpenArtifact={art => { openedArtifact = art }} />)
+  await waitFor(() => Boolean(artifactFixture.querySelector('.session-source-row')), 'Image row ready')
+  const imgRow = artifactFixture.querySelector<HTMLAnchorElement>('.session-source-row')!
+  check(imgRow.getAttribute('title')?.includes('Open image preview in Tools'), 'image source row indicates tool preview')
+  imgRow.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, button: 0 }))
+  await waitFor(() => Boolean(openedArtifact), 'Image opens via onOpenArtifact')
+  check(openedArtifact?.type === 'image' && openedArtifact?.path === 'sources/img-1/photo.png', 'image opens as artifact preview')
+  artifactRoot.unmount(); artifactFixture.remove()
   document.getElementById('qa-results')!.textContent = results.join('\n') + '\nALL PASSED'
 }
 run().catch(error => { document.getElementById('qa-results')!.textContent = results.join('\n') + `\nFAIL ${error.message}` })

package/src/renderer/tests/toolsPanel.browser.tsx

@@ -1,9 +1,9 @@
 import React, { useState } from 'react'
 import { createRoot } from 'react-dom/client'
-import ToolSurfacePage, { type ToolSurface } from '../shared/components/ToolSurfacePage'
-import ToolsPanelToggle from '../shared/components/ToolsPanelToggle'
-import { ModsPanel } from '../shared/components/ModsPanel'
-import { BackgroundTerminals } from '../shared/components/BackgroundTerminals'
+import ToolSurfacePage, { type ToolSurface } from '../shared/components/workspace/ToolSurfacePage'
+import ToolsPanelToggle from '../shared/components/workspace/ToolsPanelToggle'
+import { ModsPanel } from '../shared/components/extensions/ModsPanel'
+import { BackgroundTerminals } from '../shared/components/workspace/BackgroundTerminals'
 import { installRendererPlatform, type RendererAdapter } from '../shared/platform'
 import type { BackgroundJob } from '../shared/types'
 
@@ -51,7 +51,7 @@ function Fixture() {
       <main className="assistant-workspace"><h1>Conversation</h1><p>{workspace}</p><div className="fixture-composer"><ModsPanel workspacePath={workspace} chatId="chat-a" panelTarget={modsTarget} onOpen={() => utility('mods')} /><textarea aria-label="Message" placeholder="Ask Mint…" /></div></main>
       {open && <ToolSurfacePage surfaces={surfaces} activeSurfaceId={active} workspacePath={workspace} terminalSize={440} desktopTools={desktop} backgroundTaskCount={count}
         onSelect={setActive} onClose={id => { setSurfaces(s => s.filter(v => v.id !== id)); setActive(null) }} onCloseAll={noop} onDuplicate={noop} onRename={noop} onCloseOthers={noop} onResizeTerminal={noop} onResizePanel={noop}
-        onOpenTerminal={noop} onOpenBrowser={noop} onOpenReview={noop} onOpenFiles={noop} onOpenMods={() => utility('mods')} onOpenBackgroundTasks={() => utility('background')} onModsPanelTarget={setModsTarget} onBackgroundPanelTarget={setTasksTarget} onClosePanel={() => setOpen(false)} />}
+        onOpenSources={noop} onOpenTerminal={noop} onOpenBrowser={noop} onOpenReview={noop} onOpenFiles={noop} onOpenMods={() => utility('mods')} onOpenBackgroundTasks={() => utility('background')} onModsPanelTarget={setModsTarget} onBackgroundPanelTarget={setTasksTarget} onClosePanel={() => setOpen(false)} />}
       <BackgroundTerminals workspacePath={workspace} panelTarget={tasksTarget} onCountChange={setCount} />
     </div>
     <pre id="qa-results">Running…</pre>

package/src/renderer/tests/viewedImages.browser.tsx

@@ -1,8 +1,8 @@
 import React, { useState } from 'react'
 import { createRoot } from 'react-dom/client'
-import ChatMessageItem from '../shared/components/ChatMessageItem'
-import { ProgressActivity } from '../shared/components/ProgressActivity'
-import ViewedImages from '../shared/components/ViewedImages'
+import ChatMessageItem from '../shared/components/chat/ChatMessageItem'
+import { ProgressActivity } from '../shared/components/activity/AgentActivityDrawer'
+import ViewedImages from '../shared/components/activity/ViewedImages'
 import type { AgentProgress } from '../shared/types'
 import { compactAgentProgressForPersistence, reduceLiveAgentProgress } from '../shared/agentProgress'
 import '../shared/theme/tokens.css'

package/src/renderer/tests/voiceDictation.browser.html

@@ -0,0 +1,101 @@
+<!doctype html><html><head><meta charset="utf-8"><title>Mint dictation regression checks</title></head>
+<body><div id="root"></div><pre id="result">RUNNING</pre><script type="module">
+import React from 'react'; import {createRoot} from 'react-dom/client';
+import {useSpeechToText} from '../shared/utils/speech';
+import {useNativeVoiceInput} from '../shared/utils/useNativeVoiceInput';
+const wait=()=>new Promise(resolve=>setTimeout(resolve,30));
+const assert=(ok,message)=>{if(!ok)throw Error(message)};
+let root,voice,changeDraft,changeChat,recognition,transcript,finishTranscript;let endDelay=0;
+const writes=[],sends=[],checks=[];
+class Recognition {
+ constructor(){recognition=this;this.results=[]}
+ start(){setTimeout(()=>this.onstart?.(),0)}
+ stop(){setTimeout(()=>this.onend?.(),endDelay)}
+ abort(){}
+ result(text,final=true,index=this.results.length){
+  const result=[{transcript:text}];result.isFinal=final;this.results[index]=result;
+  this.onresult?.({resultIndex:index,results:this.results});
+ }
+}
+window.SpeechRecognition=Recognition;
+function Web(){
+ const [message,setMessage]=React.useState('Existing');changeDraft=setMessage;const [chatId,setChatId]=React.useState('chat-a');changeChat=setChatId;
+ voice=useSpeechToText({chatId,message,sending:false,isSpeaking:false,onSetMessage:text=>{writes.push(text);setMessage(text)},onSendVoiceMessage:async text=>sends.push(text)});
+ return null;
+}
+function Native(){
+ const [message,setMessage]=React.useState('Existing');changeDraft=setMessage;const [chatId,setChatId]=React.useState('chat-a');changeChat=setChatId;
+ voice=useNativeVoiceInput({chatId,message,onSetMessage:text=>{writes.push(text);setMessage(text)},onSendVoiceMessage:async text=>sends.push(text),
+  startRecording:async()=>{},cancelRecording:async()=>{},stopRecordingAndTranscribe:()=>transcript});
+ return null;
+}
+async function mount(Component){
+ if(root){root.unmount();await wait()}
+ writes.length=0;sends.length=0;root=createRoot(document.getElementById('root'));
+ root.render(React.createElement(Component));await wait();
+}
+async function check(name,run){try{await run();checks.push('PASS '+name)}catch(error){checks.push('FAIL '+name+': '+error.message)}}
+window.runVoiceDictationChecks=async()=>{
+ await check('web retains every final phrase and never sends',async()=>{
+  await mount(Web);await voice.startRecognition();await wait();
+  recognition.result('First sentence. ');recognition.result('Second sentence.');
+  assert(writes.length===0&&sends.length===0,'must wait for stop');
+  voice.stopRecognition();await wait();
+  assert(writes.join('|')==='Existing First sentence. Second sentence.',JSON.stringify({writes,sends}));
+  assert(sends.length===0,'dictation sent a chat message');
+ });
+ await check('web replaces interim results without duplicating final results',async()=>{
+  await mount(Web);await voice.startRecognition();await wait();
+  recognition.result('hello ',true);recognition.result('worl',false);
+  recognition.result('world',true,1);recognition.result('world',true,1);
+  changeDraft('Edited draft');await wait();voice.stopRecognition();await wait();
+  assert(writes.join('|')==='Edited draft hello world',JSON.stringify(writes));
+  assert(sends.length===0,'dictation sent a chat message');
+ });
+ await check('web cancel discards all recognized phrases',async()=>{
+  await mount(Web);await voice.startRecognition();await wait();recognition.result('discard');
+  voice.cancelRecognition();await wait();assert(writes.length===0&&sends.length===0,'canceled text was applied');
+ });
+ await check('desktop stop appends to latest draft and never sends',async()=>{
+  await mount(Native);transcript=new Promise(resolve=>{finishTranscript=resolve});
+  await voice.startRecognition();await wait();const stop=voice.stopRecognition();
+  changeDraft('Edited while transcribing');await wait();finishTranscript('  Native words  ');await stop;await wait();
+  assert(writes.join('|')==='Edited while transcribing Native words',JSON.stringify({writes,sends}));
+  assert(sends.length===0,'desktop sent a chat message');
+ });
+ await check('desktop cancellation during transcription leaves draft alone',async()=>{
+  await mount(Native);transcript=new Promise(resolve=>{finishTranscript=resolve});
+  await voice.startRecognition();await wait();const stop=voice.stopRecognition();
+  const cancel=voice.cancelRecognition();finishTranscript('discard');await stop;await cancel;await wait();
+  assert(writes.length===0&&sends.length===0,'canceled text was applied');
+ });
+ await check('desktop empty transcript leaves draft alone',async()=>{
+  await mount(Native);transcript=Promise.resolve('  ');await voice.startRecognition();await wait();
+  await voice.stopRecognition();await wait();assert(writes.length===0&&sends.length===0,'empty text changed the draft');
+ });
+ await check('desktop discards delayed transcript after switching chats',async()=>{
+  await mount(Native);transcript=new Promise(resolve=>{finishTranscript=resolve});await voice.startRecognition();await wait();
+  const stopping=voice.stopRecognition();changeChat('chat-b');changeDraft('Other chat draft');await wait();
+  finishTranscript('private words from chat A');await stopping;await wait();
+  assert(writes.length===0&&sends.length===0,'old transcript was inserted into the new chat');
+ });
+ await check('web discards pending recognition after switching chats',async()=>{
+  await mount(Web);await voice.startRecognition();await wait();recognition.result('private words from chat A');
+  endDelay=80;voice.stopRecognition();changeChat('chat-b');changeDraft('Other chat draft');await wait();await new Promise(resolve=>setTimeout(resolve,100));endDelay=0;
+  assert(writes.length===0&&sends.length===0,'old recognition was inserted into the new chat');
+ });
+ await check('unsupported browser shows popup and leaves draft alone',async()=>{
+  await mount(Web);const original=window.SpeechRecognition,webkit=window.webkitSpeechRecognition,alert=window.alert;const popups=[];
+  try{
+   window.SpeechRecognition=undefined;window.webkitSpeechRecognition=undefined;window.alert=text=>popups.push(text);
+   const started=await voice.startRecognition();await wait();
+   assert(started===false&&!voice.isRecording&&!voice.voiceMode,'unsupported browser entered recording mode');
+   assert(popups.length===1&&popups[0].includes('Chrome or Edge'),'unsupported popup missing');
+   assert(writes.length===0&&sends.length===0,'unsupported microphone changed the draft');
+  }finally{window.SpeechRecognition=original;window.webkitSpeechRecognition=webkit;window.alert=alert}
+ });
+ root.unmount();root=null;
+ document.getElementById('result').textContent=checks.join('\n');
+ return checks;
+}
+</script></body></html>

package/src/renderer/tests/voicePill.browser.html

@@ -2,7 +2,7 @@
 <body style="background:#18181b;color:#f5f5f5;font-family:system-ui;margin:32px"><h1>Mint VoicePill</h1><div id="root" style="padding:24px 140px"></div><pre id="result">RUNNING</pre>
 <script type="module">
 import React from 'react';import {createRoot} from 'react-dom/client';
-import VoicePill from '../shared/components/VoicePill';
+import VoicePill from '../shared/components/chat/VoicePill';
 import {useNativeVoiceInput} from '../shared/utils/useNativeVoiceInput';
 import {useSpeechToText} from '../shared/utils/speech';
 const wait=(ms=60)=>new Promise(done=>setTimeout(done,ms));const lines=[];
@@ -44,7 +44,7 @@ try {
  const calls=[];let ready;
  function NativeFixture(){
   const voice=useNativeVoiceInput({startRecording:()=>new Promise(resolve=>{calls.push('start');ready=resolve}),
-   cancelRecording:async()=>{calls.push('discard')},stopRecordingAndTranscribe:async()=>{calls.push('transcribe');return 'Native words'},onSendVoiceMessage:async text=>calls.push('send:'+text)});
+   cancelRecording:async()=>{calls.push('discard')},stopRecordingAndTranscribe:async()=>{calls.push('transcribe');return 'Native words'},message:'Existing',onSetMessage:text=>calls.push('draft:'+text),onSendVoiceMessage:async text=>calls.push('send:'+text)});
   return React.createElement(VoicePill,{active:voice.isRecording,onStart:voice.startRecognition,
    onStop:e=>['tap','release','key'].includes(e.reason)?voice.stopRecognition():voice.cancelRecognition()});
  }
@@ -54,7 +54,7 @@ try {
  assert(calls.join(',')==='start,discard'&&button().getAttribute('aria-pressed')==='false','native pending-start cancellation discards without transcription');
  pointer('pointerdown');await wait();ready();await wait();pointer('pointerup');await wait();
  assert(button().getAttribute('aria-pressed')==='true','native success opens listening capsule');
- await tap();await wait();assert(calls.at(-2)==='transcribe'&&calls.at(-1)==='send:Native words','normal native stop sends one transcript');
+ await tap();await wait();assert(calls.at(-2)==='transcribe'&&calls.at(-1)==='draft:Existing Native words'&&!calls.some(call=>call.startsWith('send:')),'normal native stop appends transcript to composer without sending');
  root.render(React.createElement('div'));await wait();
  const instances=[],messages=[],sends=[];let denied=false;
  class Recognition {

package/src/renderer/tests/voicePill.preview.html

@@ -1,7 +1,7 @@
 <!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Mint VoicePill composer preview</title></head>
 <body><div id="root"></div><pre id="result">PREVIEW</pre><script type="module">
 import React from 'react';import {createRoot} from 'react-dom/client';
-import VoicePill from '../shared/components/VoicePill';
+import VoicePill from '../shared/components/chat/VoicePill';
 import '../shared/theme/tokens.css';import '../src-web/css/chat.css';
 if(location.search.includes('mobile')) await import('../src-web/css/mobile.css');
 const frames=new Map();let id=0;