@pheem49/mint 1.14.0 → 1.16.0

package/src/renderer/src/components/SettingsWindow.tsx

@@ -1,4 +1,14 @@
+import { Bell } from 'lucide-react'
+import NotificationsTab from '../../shared/components/Settings/NotificationsTab'
 import React, { useState, useEffect, useRef } from 'react'
+import '../css/settings/base.css'
+import '../../shared/css/settings/general.css'
+import '../../shared/css/settings/profile.css'
+import '../../shared/css/settings/automation.css'
+import '../../shared/css/settings/theme.css'
+import '../../shared/css/settings/plugins.css'
+import '../../shared/css/settings/agents.css'
+import '../../shared/css/settings/shortcuts.css'
 import { getProfileValue, setProfileValue, setActiveModel, authUpdateProfile } from '../tauri'
 import { useAuthUser } from '../../shared/components/AuthGate'
 import { useProviderModels } from '../hooks/useProviderModels'
@@ -31,12 +41,12 @@ export type {
   CustomProviderConfig,
 } from '../../shared/types'
 
-import { DEFAULT_CONFIG } from '../../shared/constants/config'
+import { DEFAULT_CONFIG, migrateFontFamily, migrateTypographyScale, migrateTuiTheme } from '../../shared/constants/config'
 export { DEFAULT_CONFIG }
 import { applyThemeStyles } from '../../shared/utils/ui'
 import { APP_VERSION } from '../../shared/version'
 
-type TabType = 'sect-general' | 'sect-profile' | 'sect-audio' | 'sect-automation' | 'sect-theme' | 'sect-plugins' | 'sect-shortcuts' | 'sect-memory' | 'sect-agents'
+type TabType = 'sect-notifications' | 'sect-general' | 'sect-profile' | 'sect-audio' | 'sect-automation' | 'sect-theme' | 'sect-plugins' | 'sect-shortcuts' | 'sect-memory' | 'sect-agents'
 
 interface SettingsNavItem {
   id: TabType
@@ -46,6 +56,7 @@ interface SettingsNavItem {
 }
 
 const SETTINGS_NAV: SettingsNavItem[] = [
+  { id: 'sect-notifications', label: 'Notifications', group: 'Workspace', icon: <Bell size={14} aria-hidden="true" /> },
   {
     id: 'sect-general',
     label: 'General',
@@ -100,8 +111,8 @@ const SETTINGS_NAV: SettingsNavItem[] = [
   },
   {
     id: 'sect-memory',
-    label: 'Memory & Profile',
-    group: 'Workspace',
+    label: 'Personal Memory',
+    group: 'Account',
     icon: (
       <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
         <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
@@ -256,7 +267,7 @@ export default function SettingsWindow() {
         }
         
         if (loadedConfig) {
-          const merged = { ...DEFAULT_CONFIG, ...loadedConfig }
+          const merged = { ...DEFAULT_CONFIG, ...migrateTuiTheme(migrateTypographyScale(migrateFontFamily(loadedConfig))) }
           setConfig(merged)
           
           // sync helper custom models
@@ -562,6 +573,27 @@ export default function SettingsWindow() {
     const updated = { ...config, [field]: value }
     setConfig(updated)
     applyThemeStyles(updated)
+    // Assistant Presence is a live window preference; save it immediately so
+    // closing Settings before pressing Save does not discard the choice.
+    if (field === 'showDesktopWidget' && window.settingsApi) {
+      void window.settingsApi.saveSettings(updated).catch((error) => {
+        console.error('Failed to save Assistant Presence setting:', error)
+      })
+    }
+  }
+
+  const updateFields = (patch: Partial<typeof DEFAULT_CONFIG>) => {
+    const updated = { ...config, ...patch }
+    setConfig(updated)
+    applyThemeStyles(updated)
+    // Theme choices are immediately visible in this window. Persist the same
+    // complete patch so the main window receives one consistent theme update
+    // instead of retaining a stale combination such as glass + no blur.
+    if (window.settingsApi) {
+      void window.settingsApi.saveSettings(updated).catch((error) => {
+        console.error('Failed to save live theme settings:', error)
+      })
+    }
   }
 
   return (
@@ -666,6 +698,8 @@ export default function SettingsWindow() {
             />
           )}
 
+          {activeTab === 'sect-notifications' && <NotificationsTab settings={config.notificationSettings} onChange={value => updateField('notificationSettings', value)} />}
+
           {activeTab === 'sect-profile' && (
             <ProfileTab
               name={profileName}
@@ -703,6 +737,7 @@ export default function SettingsWindow() {
             <ThemeTab
               config={config}
               updateField={updateField}
+              updateFields={updateFields}
             />
           )}
 
@@ -731,6 +766,14 @@ export default function SettingsWindow() {
               config={config}
               updateField={updateField}
               dynamicOllamaModels={dynamicOllamaModels}
+              providerModels={{
+                gemini: dynamicGeminiModels,
+                anthropic: dynamicAnthropicModels,
+                openai: dynamicOpenAIModels,
+                openrouter: dynamicOpenRouterModels,
+                deepseek: dynamicDeepSeekModels,
+                local_openai: dynamicLocalModels,
+              }}
             />
           )}
         </div>

package/src/renderer/src/components/SpotlightWindow.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useEffect, useRef } from 'react'
+import '../css/spotlight.css'
 import { evaluateArithmetic } from '../calculator'
 
 const COMMANDS = [

package/src/renderer/src/components/WidgetWindow.tsx

@@ -1,8 +1,9 @@
 import React, { useState, useEffect } from 'react'
+import '../css/widget.css'
+import { getCurrentWindow } from '@tauri-apps/api/window'
 
 export default function WidgetWindow() {
   const [state, setState] = useState('idle')
-
   useEffect(() => {
     if (window.widgetAPI?.onStateChange) {
       window.widgetAPI.onStateChange((newState: string) => {
@@ -13,12 +14,26 @@ export default function WidgetWindow() {
 
   const stateLabel = state.charAt(0).toUpperCase() + state.slice(1)
 
+  const handleMouseDown = (event: React.MouseEvent<HTMLButtonElement>) => {
+    if (event.button !== 0) return
+    void getCurrentWindow().startDragging().catch((error) => {
+      console.error('Failed to drag Assistant Presence:', error)
+    })
+  }
+
   return (
     <div id="widget-container" className={`state-${state}`}>
       <div className="aura-container">
         <div className="aura"></div>
       </div>
-      <div className="character-body">
+      <button
+        type="button"
+        className="character-body"
+        aria-label={`Open Mint chat. Assistant is ${stateLabel.toLowerCase()}.`}
+        title="Open Mint chat"
+        onClick={() => void window.widgetAPI.openChat()}
+        onMouseDown={handleMouseDown}
+      >
         {/* Eyes / Face */}
         <div className="eyes">
           <div className="eye left"></div>
@@ -26,7 +41,16 @@ export default function WidgetWindow() {
         </div>
         {/* Mouth/Indicator */}
         <div className="mouth"></div>
-      </div>
+      </button>
+      <button
+        type="button"
+        className="widget-hide-btn"
+        aria-label="Turn off Assistant Presence"
+        title="Turn off Assistant Presence"
+        onClick={() => void window.widgetAPI.setVisible(false)}
+      >
+        ×
+      </button>
       {/* Status Badge */}
       <div className="status-badge" id="status-badge">
         {stateLabel}

package/src/renderer/src/components/WorkspacePanel.tsx

@@ -1,5 +1,12 @@
-import React, { useEffect, useState } from 'react'
-import { getWorkspaceTree, type WorkspaceTreeEntry, createWorkspaceFile, createWorkspaceFolder, deleteWorkspaceItem } from '../tauri'
+import React, { useCallback, useEffect, useRef, useState } from 'react'
+import { createPortal } from 'react-dom'
+import WorkspacePreviewActions from '@shared/components/WorkspacePreviewActions'
+import WorkspacePaneResizer from '@shared/components/WorkspacePaneResizer'
+import { WorkspaceSnapshotReader } from '@shared/utils/workspaceSnapshot'
+import { detectArtifactType } from '@shared/components/ArtifactPreviewPanel'
+import { workspacePlatform } from '@shared/platform'
+import { announceWorkspaceChange, useWorkspaceUndo } from '@shared/workspaceUndo'
+import type { WorkspaceSnapshot, WorkspaceTreeEntry } from '@shared/types'
 import {
   materialFolderIcon,
   materialFileIcon,
@@ -9,12 +16,15 @@ import {
 
 
 interface WorkspacePanelProps {
+  onOpenPreview?: (root: string, path: string) => Promise<void>
+  onOpenHtml?: (root: string, path: string, mode: 'external' | 'mint') => Promise<void>
   agentMode: boolean
   sending: boolean
   workspacePath: string
   onEnableAgentMode: () => void
   onSetMessage: (message: string) => void
   onWorkspaceReady: (path: string) => void
+  refreshRevision?: number
 }
 
 const FILE_LABEL: Record<string, string> = {
@@ -29,7 +39,14 @@ const FILE_LABEL: Record<string, string> = {
 }
 
 
-function TreeNode({ entry, level, onRefresh, workspacePath }: { entry: WorkspaceTreeEntry; level: number; onRefresh: () => void; workspacePath: string; key?: string }) {
+interface WorkspaceMenu {
+  entry: WorkspaceTreeEntry
+  x: number
+  y: number
+  trigger: HTMLButtonElement
+}
+
+function TreeNode({ entry, level, onContextMenu }: { entry: WorkspaceTreeEntry; level: number; onContextMenu: (event: React.MouseEvent<HTMLButtonElement>, entry: WorkspaceTreeEntry) => void; key?: string }) {
   const [open, setOpen] = useState(level < 1)
   const isDirectory = entry.kind === 'directory'
   const hasChildren = entry.children.length > 0
@@ -38,20 +55,6 @@ function TreeNode({ entry, level, onRefresh, workspacePath }: { entry: Workspace
   const materialIcon = isDirectory ? materialFolderIcon(entry.name, open) : materialFileIcon(entry.name, fileExtension)
   const dragText = `@${entry.path}`
 
-  const handleContextMenu = async (event: React.MouseEvent) => {
-    event.preventDefault()
-    const confirmed = confirm(`Are you sure you want to delete "${entry.name}"?`)
-    if (!confirmed) return
-
-    try {
-      const absolutePath = `${workspacePath}/${entry.path}`
-      await deleteWorkspaceItem(absolutePath)
-      onRefresh()
-    } catch (err) {
-      alert(`Failed to delete item: ${err instanceof Error ? err.message : String(err)}`)
-    }
-  }
-
   return (
     <div className="workspace-tree-node">
       <button
@@ -59,7 +62,8 @@ function TreeNode({ entry, level, onRefresh, workspacePath }: { entry: Workspace
         className={`workspace-tree-row ${isDirectory ? 'is-directory' : 'is-file'}`}
         style={{ paddingLeft: `${level * 16 + 8}px` }}
         onClick={() => isDirectory && hasChildren && setOpen((current) => !current)}
-        onContextMenu={handleContextMenu}
+        onContextMenu={(event) => onContextMenu(event, entry)}
+        aria-haspopup="menu"
         title={entry.path}
         draggable
         onDragStart={(event) => {
@@ -83,7 +87,7 @@ function TreeNode({ entry, level, onRefresh, workspacePath }: { entry: Workspace
       {isDirectory && open && hasChildren && (
         <div className="workspace-tree-children">
           {entry.children.map((child) => (
-            <TreeNode key={child.path} entry={child} level={level + 1} onRefresh={onRefresh} workspacePath={workspacePath} />
+            <TreeNode key={child.path} entry={child} level={level + 1} onContextMenu={onContextMenu} />
           ))}
         </div>
       )}
@@ -91,46 +95,214 @@ function TreeNode({ entry, level, onRefresh, workspacePath }: { entry: Workspace
   )
 }
 
-export default function WorkspacePanel({ agentMode, sending, workspacePath, onEnableAgentMode, onSetMessage, onWorkspaceReady }: WorkspacePanelProps) {
+export default function WorkspacePanel({ agentMode, sending, workspacePath, onEnableAgentMode, onSetMessage, onWorkspaceReady, refreshRevision = 0, onOpenHtml, onOpenPreview }: WorkspacePanelProps) {
   const [tree, setTree] = useState<WorkspaceTreeEntry | null>(null)
+  const [revision, setRevision] = useState(0)
+  const revisionRef = useRef(0)
+  const snapshotReaderRef = useRef<WorkspaceSnapshotReader | null>(null)
+  const mountedRef = useRef(false)
+  useEffect(() => {
+    mountedRef.current = true
+    const reader = new WorkspaceSnapshotReader(operation => workspacePlatform.getWorkspaceSnapshot(operation))
+    snapshotReaderRef.current = reader
+    return () => { mountedRef.current = false; reader.dispose(); snapshotReaderRef.current = null }
+  }, [])
   const [error, setError] = useState('')
+  const [menu, setMenu] = useState<WorkspaceMenu | null>(null)
+  const [editTarget, setEditTarget] = useState<{ entry: WorkspaceTreeEntry; mode: 'rename' | 'move'; value: string } | null>(null)
+  const [mutationPending, setMutationPending] = useState(false)
+  const menuRef = useRef<HTMLDivElement>(null)
+  const trashInFlightRef = useRef(false)
+  const workspacePathRef = useRef(workspacePath)
+  workspacePathRef.current = workspacePath
 
-  const refresh = async () => {
+  const closeMenu = useCallback(() => {
+    menu?.trigger.focus()
+    setMenu(null)
+  }, [menu])
+
+  useEffect(() => { setMenu(null); setEditTarget(null) }, [workspacePath])
+
+  useEffect(() => {
+    if (!menu) return
+    menuRef.current?.querySelector('button')?.focus()
+    const closeOnOutsidePointer = (event: PointerEvent) => {
+      if (!menuRef.current?.contains(event.target as Node)) setMenu(null)
+    }
+    const closeOnKey = (event: KeyboardEvent) => {
+      if (event.key === 'Escape' || event.key === 'Tab') {
+        if (event.key === 'Escape') event.preventDefault()
+        closeMenu()
+      }
+    }
+    const dismiss = () => setMenu(null)
+    document.addEventListener('pointerdown', closeOnOutsidePointer)
+    document.addEventListener('keydown', closeOnKey)
+    window.addEventListener('resize', dismiss)
+    window.addEventListener('blur', dismiss)
+    document.addEventListener('scroll', dismiss, true)
+    return () => {
+      document.removeEventListener('pointerdown', closeOnOutsidePointer)
+      document.removeEventListener('keydown', closeOnKey)
+      window.removeEventListener('resize', dismiss)
+      window.removeEventListener('blur', dismiss)
+      document.removeEventListener('scroll', dismiss, true)
+    }
+  }, [menu, closeMenu])
+
+  const handleContextMenu = (event: React.MouseEvent<HTMLButtonElement>, entry: WorkspaceTreeEntry) => {
+    event.preventDefault()
+    event.stopPropagation()
+    if (trashInFlightRef.current) return
+    const bounds = event.currentTarget.getBoundingClientRect()
+    const type = detectArtifactType(entry.name)
+    const previewActions = entry.kind === 'file'
+      ? Number(!!onOpenPreview && type !== 'code') + Number(!!onOpenHtml && type === 'html')
+      : 0
+    const menuHeight = 132 + previewActions * 34
+    setMenu({
+      entry,
+      x: Math.max(8, Math.min(event.clientX || bounds.left, window.innerWidth - 200)),
+      y: Math.max(8, Math.min(event.clientY || bounds.bottom, window.innerHeight - menuHeight)),
+      trigger: event.currentTarget,
+    })
+  }
+
+  const handleMoveToTrash = async () => {
+    if (!menu || trashInFlightRef.current) return
+    const { entry } = menu
+    const root = workspacePath
+    trashInFlightRef.current = true
+    setMutationPending(true)
+    closeMenu()
+    try {
+      const { confirm } = await import('@tauri-apps/plugin-dialog')
+      const confirmed = await confirm(`Move "${entry.name}"${entry.kind === 'directory' ? ' and all its contents' : ''} to Trash? You can restore it from your system Trash.`, {
+        title: 'Move to Trash',
+        kind: 'warning',
+        okLabel: 'Move to Trash',
+        cancelLabel: 'Cancel',
+      })
+      if (!confirmed || workspacePathRef.current !== root) return
+      setError('')
+      const snapshot = await workspacePlatform.deleteWorkspaceItem({ root, relativePath: entry.path, revision: revisionRef.current })
+      if (workspacePathRef.current === root) {
+        applySnapshot(snapshot)
+      }
+      announceWorkspaceChange(snapshot)
+    } catch (reason) {
+      if (workspacePathRef.current === root) setError(reason instanceof Error ? reason.message : String(reason))
+    } finally {
+      trashInFlightRef.current = false
+      setMutationPending(false)
+    }
+  }
+
+  const applySnapshot = useCallback((snapshot: WorkspaceSnapshot) => {
+    if (!mountedRef.current || workspacePathRef.current !== workspacePath) return
+    setTree(snapshot.tree)
+    revisionRef.current = snapshot.revision
+    setRevision(snapshot.revision)
+    if (snapshot.path !== workspacePath) onWorkspaceReady(snapshot.path)
+  }, [onWorkspaceReady, workspacePath])
+  const history = useWorkspaceUndo(workspacePath, refreshRevision, applySnapshot)
+
+  const openHtml = async (mode: 'external' | 'mint') => {
+    if (!menu || !onOpenHtml || mutationPending) return
+    const { entry } = menu
+    const root = workspacePath
+    closeMenu()
+    setMutationPending(true)
+    setError('')
+    try { await onOpenHtml(root, entry.path, mode) }
+    catch (reason) { if (workspacePathRef.current === root) setError(reason instanceof Error ? reason.message : String(reason)) }
+    finally { setMutationPending(false) }
+  }
+
+  const openPreview = async () => {
+    if (!menu || !onOpenPreview || mutationPending) return
+    const { entry } = menu
+    const root = workspacePath
+    closeMenu()
+    setMutationPending(true)
+    setError('')
+    try { await onOpenPreview(root, entry.path) }
+    catch (reason) { if (workspacePathRef.current === root) setError(reason instanceof Error ? reason.message : String(reason)) }
+    finally { setMutationPending(false) }
+  }
+
+  const openMoveDialog = (mode: 'rename' | 'move') => {
+    if (!menu || mutationPending) return
+    const { entry } = menu
+    setEditTarget({ entry, mode, value: mode === 'rename' ? entry.name : entry.path })
+    setError('')
+    closeMenu()
+  }
+
+  const handleMove = async (event: React.FormEvent) => {
+    event.preventDefault()
+    if (!editTarget || trashInFlightRef.current) return
+    const { entry, mode, value } = editTarget
+    const root = workspacePath
+    const name = value.trim()
+    if (!name || (mode === 'rename' && /[\\/]/.test(name))) {
+      setError('Enter a valid name without path separators.'); return
+    }
+    const parent = entry.path.split('/').slice(0, -1).join('/')
+    const destination = mode === 'rename' ? [parent, name].filter(Boolean).join('/') : name
+    if (destination === entry.path) { setEditTarget(null); return }
+    trashInFlightRef.current = true
+    setMutationPending(true)
+    try {
+      const snapshot = await workspacePlatform.moveWorkspaceItem({ root, relativePath: entry.path, revision: revisionRef.current }, destination)
+      if (workspacePathRef.current === root) {
+        applySnapshot(snapshot)
+        setEditTarget(null)
+        setError('')
+      }
+      announceWorkspaceChange(snapshot)
+    } catch (reason) {
+      if (workspacePathRef.current === root) setError(reason instanceof Error ? reason.message : String(reason))
+    } finally {
+      trashInFlightRef.current = false
+      setMutationPending(false)
+    }
+  }
+  const refresh = useCallback(async () => {
     if (!workspacePath.trim()) {
       setError('')
       setTree(null)
       return
     }
-
     try {
       setError('')
-      const nextTree = await getWorkspaceTree(workspacePath)
-      setTree(nextTree)
-      if (nextTree.path !== workspacePath) onWorkspaceReady(nextTree.path)
+      const snapshot = await snapshotReaderRef.current?.refresh({ root: workspacePath, relativePath: '', revision: revisionRef.current })
+      if (snapshot) applySnapshot(snapshot)
     } catch (reason) {
-      setError(reason instanceof Error ? reason.message : String(reason))
+      if (mountedRef.current && workspacePathRef.current === workspacePath) setError(reason instanceof Error ? reason.message : String(reason))
     }
-  }
+  }, [applySnapshot, workspacePath])
 
   useEffect(() => {
-    refresh()
+    void refresh()
 
-    // Refresh when the window gains focus (e.g., switching back from VS Code)
-    const handleFocus = () => {
-      refresh()
+    // There is no filesystem event stream behind this native snapshot API.
+    // Catch up immediately when returning to the app and use a low-frequency
+    // fallback only while this panel is actually visible and focused.
+    const refreshWhenActive = () => {
+      if (document.visibilityState === 'visible' && document.hasFocus()) void refresh()
     }
-    window.addEventListener('focus', handleFocus)
+    window.addEventListener('focus', refreshWhenActive)
+    document.addEventListener('visibilitychange', refreshWhenActive)
 
-    // Poll every 15 seconds to catch edits/updates in real-time
-    const interval = setInterval(() => {
-      refresh()
-    }, 15000)
+    const interval = window.setInterval(refreshWhenActive, 30000)
 
     return () => {
-      window.removeEventListener('focus', handleFocus)
+      window.removeEventListener('focus', refreshWhenActive)
+      document.removeEventListener('visibilitychange', refreshWhenActive)
       clearInterval(interval)
     }
-  }, [workspacePath])
+  }, [workspacePath, refreshRevision, refresh])
 
   const handleCreateFile = async () => {
     if (!workspacePath.trim()) return
@@ -139,9 +311,9 @@ export default function WorkspacePanel({ agentMode, sending, workspacePath, onEn
 
     try {
       setError('')
-      const fullPath = `${workspacePath}/${name.trim()}`
-      await createWorkspaceFile(fullPath)
-      await refresh()
+      const snapshot = await workspacePlatform.createWorkspaceFile({ root: workspacePath, relativePath: name.trim(), revision })
+      applySnapshot(snapshot)
+      announceWorkspaceChange(snapshot)
     } catch (err) {
       setError(err instanceof Error ? err.message : String(err))
     }
@@ -154,36 +326,45 @@ export default function WorkspacePanel({ agentMode, sending, workspacePath, onEn
 
     try {
       setError('')
-      const fullPath = `${workspacePath}/${name.trim()}`
-      await createWorkspaceFolder(fullPath)
-      await refresh()
+      const snapshot = await workspacePlatform.createWorkspaceFolder({ root: workspacePath, relativePath: name.trim(), revision })
+      applySnapshot(snapshot)
+      announceWorkspaceChange(snapshot)
     } catch (err) {
       setError(err instanceof Error ? err.message : String(err))
     }
   }
 
   return (
-    <section className="workspace-panel">
+    <section className="workspace-panel" id="workspace-file-panel">
+      <WorkspacePaneResizer />
       <header className="workspace-panel-header">
-        <div>
-          <span className="workspace-kicker">Agent Workspace</span>
-          <h2>Workspace</h2>
+        <div className="workspace-title-group">
+          <span className="workspace-title-icon material-icon folder" aria-hidden="true">
+            <img src={folderOpenIcon} alt="" draggable={false} />
+          </span>
+          <div className="workspace-title-copy">
+            <h2 title={workspacePath || 'Workspace'}>{tree?.name || workspacePath.split(/[\\/]/).filter(Boolean).pop() || 'Workspace'}</h2>
+          </div>
+          <span className="workspace-agent-pill" data-state={sending ? 'thinking' : agentMode ? 'agent' : 'idle'}>
+            {sending ? 'Running' : agentMode ? 'Agent mode' : 'Manual'}
+          </span>
+        </div>
+        <div className="workspace-panel-actions" aria-label="Workspace actions">
+          <button type="button" onClick={handleCreateFile} disabled={!workspacePath.trim()} aria-label="New file" title="New file">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.7" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6M12 11v6M9 14h6"/></svg>
+          </button>
+          <button type="button" onClick={handleCreateFolder} disabled={!workspacePath.trim()} aria-label="New folder" title="New folder">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.7" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M3 7a2 2 0 0 1 2-2h5l2 2h7a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M12 10v6M9 13h6"/></svg>
+          </button>
+          <button type="button" onClick={refresh} disabled={!workspacePath.trim()} aria-label="Refresh workspace" title="Refresh workspace">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.7" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M20 7v5h-5M4 17v-5h5"/><path d="M5.6 9a7 7 0 0 1 11.55-2.6L20 12M4 12l2.85 5.6A7 7 0 0 0 18.4 15"/></svg>
+          </button>
         </div>
-        <span className="workspace-agent-pill" data-state={sending ? 'thinking' : agentMode ? 'agent' : 'idle'}>
-          {sending ? 'Running' : agentMode ? 'Agent mode' : 'Manual'}
-        </span>
       </header>
 
-      <div className="workspace-panel-actions">
-        <button type="button" onClick={handleCreateFile} disabled={!workspacePath.trim()}>New File</button>
-        <button type="button" onClick={handleCreateFolder} disabled={!workspacePath.trim()}>New Folder</button>
-        <button type="button" onClick={refresh} disabled={!workspacePath.trim()}>Refresh</button>
-      </div>
-
       <div className="workspace-tree-shell">
-        {error ? (
-          <div className="workspace-tree-empty">{error}</div>
-        ) : tree ? (
+        {(error || history.error) && <div className="workspace-history-error" role="alert">{error || history.error}</div>}
+        {tree ? (
           <>
             <div className="workspace-root-row">
               <span className="workspace-tree-chevron" data-open="true" aria-hidden="true" />
@@ -194,14 +375,41 @@ export default function WorkspacePanel({ agentMode, sending, workspacePath, onEn
             </div>
             <div className="workspace-tree">
               {tree.children.map((entry) => (
-                <TreeNode key={entry.path} entry={entry} level={0} onRefresh={refresh} workspacePath={workspacePath} />
+                <TreeNode key={entry.path} entry={entry} level={0} onContextMenu={handleContextMenu} />
               ))}
             </div>
           </>
         ) : (
           <div className="workspace-tree-empty">Select a project to show workspace files.</div>
         )}
+
       </div>
+      {menu && createPortal(
+        <div ref={menuRef} className="workspace-file-menu" role="menu" aria-label={`Actions for ${menu.entry.name}`} style={{ left: menu.x, top: menu.y }} onContextMenu={(event) => event.preventDefault()}>
+          <WorkspacePreviewActions
+            entry={menu.entry}
+            pending={mutationPending}
+            onOpenHtml={onOpenHtml ? () => { void openHtml('external') } : undefined}
+            onPreview={onOpenPreview ? () => { void openPreview() } : undefined}
+          />
+          <button type="button" role="menuitem" onClick={() => openMoveDialog('rename')}>Rename…</button>
+          <button type="button" role="menuitem" onClick={() => openMoveDialog('move')}>Move…</button>
+          <button type="button" role="menuitem" className="is-danger" onClick={handleMoveToTrash}>Move to Trash</button>
+        </div>,
+        document.body,
+      )}
+      {editTarget && createPortal(
+        <div className="workspace-file-dialog-backdrop" onMouseDown={(event) => { if (event.target === event.currentTarget && !mutationPending) setEditTarget(null) }}>
+          <form className="workspace-file-dialog" role="dialog" aria-modal="true" aria-labelledby="workspace-file-dialog-title" onSubmit={handleMove} onKeyDown={(event) => { if (event.key === 'Escape' && !mutationPending) setEditTarget(null) }}>
+            <h3 id="workspace-file-dialog-title">{editTarget.mode === 'rename' ? 'Rename' : 'Move'} {editTarget.entry.name}</h3>
+            <label>{editTarget.mode === 'rename' ? 'New name' : 'Destination path relative to workspace'}
+              <input autoFocus value={editTarget.value} disabled={mutationPending} onChange={(event) => setEditTarget({ ...editTarget, value: event.target.value })} />
+            </label>
+            {error && <p role="alert">{error}</p>}
+            <div><button type="button" disabled={mutationPending} onClick={() => setEditTarget(null)}>Cancel</button><button type="submit" disabled={mutationPending}>{mutationPending ? 'Saving…' : editTarget.mode === 'rename' ? 'Rename' : 'Move'}</button></div>
+          </form>
+        </div>, document.body,
+      )}
     </section>
   )
 }