@pheem49/mint 1.16.0 → 1.17.0

package/src/renderer/src-web/tauri.ts

@@ -1,5 +1,8 @@
+import { createWorkspaceMediaReader } from '../shared/utils/workspaceMedia'
+import { createWorkspaceImageReader } from '../shared/utils/workspaceImage'
 import { createLibraryTransport } from '../shared/library/transport'
 import { createSourcesTransport } from '../shared/conversation/sourcesTransport'
+import { createExternalLinkInterceptor } from '../shared/utils/externalLinks'
 export * from '../shared/types'
 import type { MintPlatformApi } from '../shared/platform'
 import { createConversationTransport } from '../shared/conversation/transport'
@@ -467,6 +470,17 @@ export const { sendChatMessage, streamChatMessage } = createConversationTranspor
   ownerToken: getStoredAuthToken,
 })
 
+export async function speechRequest(request: import('../shared/speech/types').SpeechRequest): Promise<import('../shared/speech/types').SpeechReply> {
+  if (isTauriRuntime()) {
+    const { invoke } = await import('@tauri-apps/api/core')
+    return invoke('speech_request', { request })
+  }
+  const response = await authFetch(`${getLocalApiBase()}/speech`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(request) })
+  const result = await response.json()
+  if (!response.ok) throw new Error(result.error || 'Speech request failed')
+  return result
+}
+
 export async function getTtsUrls(text: string): Promise<TtsUrl[]> {
   if (typeof window === 'undefined') return []
   if (!isTauriRuntime()) return []
@@ -652,6 +666,12 @@ export async function saveInteractionAgentActivity(
   await invoke('save_interaction_agent_activity', { interactionId, activity })
 }
 
+export async function pendingCompanionChat(acknowledgedId?: string): Promise<string | null> {
+  if (!isTauriRuntime()) return null
+  const { invoke } = await import('@tauri-apps/api/core')
+  return invoke<string | null>('pending_companion_chat', { acknowledgedId: acknowledgedId ?? null })
+}
+
 export async function listChatSessions(): Promise<ChatSession[]> {
   if (typeof window === 'undefined' || !isTauriRuntime()) {
     const API_BASE = getApiBase();
@@ -1004,7 +1024,43 @@ export function convertFileSrc(filePath: string, protocol = 'asset'): string {
   return `https://asset.localhost/${encodeURIComponent(path)}`;
 }
 
+/**
+ * Opens an external URL in the system's default browser (via Tauri desktop action in Tauri runtime,
+ * or window.open in fallback browser environments).
+ */
+export async function openExternal(url: string): Promise<any> {
+  if (isTauriRuntime()) {
+    const { invoke } = await import('@tauri-apps/api/core')
+    return invoke('run_desktop_action', { action: { type: 'open_url', target: url } })
+  }
+  if (typeof window !== 'undefined') {
+    return window.open(url, '_blank', 'noopener,noreferrer')
+  }
+}
+
+let activeWebLinkInterceptorCleanup: (() => void) | null = null
+
+const baseInstallExternalLinkInterceptor = createExternalLinkInterceptor(openExternal)
+
+/**
+ * Global link interceptor: Catches clicks on anchor tags pointing to external URLs
+ * and opens them via Tauri desktop actions when running in a Tauri webview.
+ */
+export const installExternalLinkInterceptor = (
+  targetDocument: Document | null = typeof document !== 'undefined' ? document : null
+): () => void => {
+  if (!targetDocument || !isTauriRuntime()) return () => {}
+  return baseInstallExternalLinkInterceptor(targetDocument)
+}
+
 export function installTauriAdapters() {
+  if (typeof document !== 'undefined' && isTauriRuntime()) {
+    if (activeWebLinkInterceptorCleanup) {
+      activeWebLinkInterceptorCleanup()
+    }
+    activeWebLinkInterceptorCleanup = installExternalLinkInterceptor(document)
+  }
+
   if (typeof window === 'undefined' || !isTauriRuntime()) {
     console.warn(`Not running inside Tauri. Connecting to local API server fallback at ${getApiBase()}.`);
     const API_BASE = getApiBase();
@@ -1041,9 +1097,7 @@ export function installTauriAdapters() {
         window.location.hash = '#/';
       },
       quitApp: () => undefined,
-      openExternal: async (url: string) => {
-        window.open(url, '_blank', 'noopener,noreferrer')
-      },
+      openExternal: (url: string) => openExternal(url),
       openFolder: async () => ({ success: false, message: 'Opening local folders is only available in the desktop app.' }),
     };
 
@@ -1226,6 +1280,7 @@ export function installTauriAdapters() {
       clearAiNotifications: clearBrowserNotifications,
       getTtsUrls: async () => [],
       setAiState: () => {},
+      openExternal: (url: string) => openExternal(url),
     };
     return;
   }
@@ -1271,10 +1326,7 @@ export function installTauriAdapters() {
       const { invoke } = await import('@tauri-apps/api/core')
       return void invoke('exit_app')
     },
-    openExternal: async (url) => {
-      const { invoke } = await import('@tauri-apps/api/core')
-      return invoke('run_desktop_action', { action: { type: 'open_url', target: url } })
-    },
+    openExternal: (url: string) => openExternal(url),
     openFolder: async (path) => {
       const { invoke } = await import('@tauri-apps/api/core')
       return invoke('open_folder', { path })
@@ -1416,6 +1468,7 @@ export function installTauriAdapters() {
       const { invoke } = await import('@tauri-apps/api/core')
       return void invoke('set_ai_state', { state })
     },
+    openExternal: (url: string) => openExternal(url),
   }
 }
 
@@ -2269,6 +2322,10 @@ export async function undoGitCheckpoint(
   }
 }
 
+export const readWorkspaceMedia = createWorkspaceMediaReader({ isNative: isTauriRuntime, apiBase: getLocalApiBase, fetch: authFetch, convertFileSrc })
+
+export const readWorkspaceImage = createWorkspaceImageReader({ isNative: isTauriRuntime, apiBase: getLocalApiBase, fetch: authFetch })
+
 export const readWorkspaceFile = async (path: string, workspacePath?: string): Promise<string> => {
   if (!isTauriRuntime()) {
     try {
@@ -2325,14 +2382,14 @@ const _apiCheck: MintPlatformApi = {
   detectSystemTools,
   sendChatMessage,
   streamChatMessage,
-  getTtsUrls,
+  getTtsUrls, speechRequest,
   cancelChatMessage,
   getRecentInteractions,
   getConversationSnapshot,
   getConversationChanges,
   saveSystemInteraction,
   saveInteractionAgentActivity,
-  listChatSessions,
+  listChatSessions, pendingCompanionChat,
   updateChatSessionWorkspace,
   deleteChatSession,
   renameChatSession,
@@ -2374,7 +2431,8 @@ const _apiCheck: MintPlatformApi = {
   listGitCheckpoints,
   rollbackGitCheckpoint,
   undoGitCheckpoint,
-  readWorkspaceFile,
+  readWorkspaceFile, readWorkspaceImage, readWorkspaceMedia,
+  openExternal,
   testMcpConnection,
 }
 
@@ -2401,12 +2459,12 @@ export async function startHtmlPreview(root: string, relativePath: string, mintB
 }
 
 /** Loads artifacts by ID; no server-provided filesystem path is accepted. */
-export async function readMcpArtifact(id: string): Promise<string> {
+export async function readMcpArtifact(id: string, chatId?: string): Promise<string> {
   if (isTauriRuntime()) {
     const { invoke } = await import('@tauri-apps/api/core')
-    return invoke<string>('read_mcp_artifact', { id })
+    return invoke<string>('read_mcp_artifact', { id, chatId })
   }
-  const response = await authFetch(`${getApiBase()}/mcp-artifacts/${encodeURIComponent(id)}`)
+  const response = await authFetch(`${getApiBase()}/mcp-artifacts/${encodeURIComponent(id)}${chatId ? `?chatId=${encodeURIComponent(chatId)}` : ''}`)
   if (!response.ok) throw new Error('Artifact unavailable')
   return URL.createObjectURL(await response.blob())
 }

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

@@ -0,0 +1 @@
+<!doctype html><html data-theme="dark"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"></head><body><div id="root"></div><script type="module" src="./browserArtifacts.browser.tsx"></script></body></html>

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: 'browser_screenshot', callId: 'capture', input: {}, 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

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/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'