claude-ws 0.3.97 → 0.3.99

package/src/components/auth/auth-error-message.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { useState } from 'react';
+import { useTranslations } from 'next-intl';
 import { AlertCircle, Settings2 } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { AgentProviderDialog, isProviderAuthError } from './agent-provider-dialog';
@@ -15,6 +16,7 @@ interface AuthErrorMessageProps {
  * Shows when authentication/provider errors are detected
  */
 export function AuthErrorMessage({ message, className }: AuthErrorMessageProps) {
+  const t = useTranslations('auth');
   const [dialogOpen, setDialogOpen] = useState(false);
 
   // Only show if it's an auth-related error
@@ -29,7 +31,7 @@ export function AuthErrorMessage({ message, className }: AuthErrorMessageProps)
           <AlertCircle className="h-5 w-5 text-destructive shrink-0 mt-0.5" />
           <div className="flex-1 space-y-3">
             <div className="text-sm text-destructive font-medium">
-              Authentication Error
+              {t('authenticationError')}
             </div>
             <div className="text-sm text-muted-foreground">
               {message}
@@ -41,7 +43,7 @@ export function AuthErrorMessage({ message, className }: AuthErrorMessageProps)
               className="gap-2"
             >
               <Settings2 className="h-4 w-4" />
-              Config Agent Provider
+              {t('configAgentProvider')}
             </Button>
           </div>
         </div>
@@ -59,6 +61,7 @@ export function AuthErrorMessage({ message, className }: AuthErrorMessageProps)
  * Inline button for showing in tool results or smaller contexts
  */
 export function ConfigProviderButton({ className }: { className?: string }) {
+  const t = useTranslations('auth');
   const [dialogOpen, setDialogOpen] = useState(false);
 
   return (
@@ -70,7 +73,7 @@ export function ConfigProviderButton({ className }: { className?: string }) {
         className={className}
       >
         <Settings2 className="h-4 w-4 mr-2" />
-        Config Agent Provider
+        {t('configAgentProvider')}
       </Button>
 
       <AgentProviderDialog

package/src/components/editor/code-editor-with-inline-edit.tsx

@@ -33,6 +33,7 @@ import { useContextMentionStore } from '@/stores/context-mention-store';
 import { useTaskStore } from '@/stores/task-store';
 import { useState } from 'react';
 import { toast } from 'sonner';
+import { useTranslations } from 'next-intl';
 
 interface EditorPosition {
   lineNumber?: number;
@@ -75,6 +76,7 @@ export function CodeEditorWithInlineEdit({
   onSelectionChange,
 }: CodeEditorWithInlineEditProps) {
   const { theme } = useTheme();
+  const t = useTranslations('editor');
   const containerRef = useRef<HTMLDivElement>(null);
   const editorViewRef = useRef<EditorView | null>(null);
   const [height, setHeight] = useState<number>(400);
@@ -340,7 +342,7 @@ export function CodeEditorWithInlineEdit({
   const handleAddToContext = useCallback(
     (selection: ContextSelection) => {
       if (!selectedTaskId) {
-        toast.error('Select a task first to add context');
+        toast.error(t('selectTaskFirst'));
         return;
       }
 
@@ -365,7 +367,7 @@ export function CodeEditorWithInlineEdit({
     (startLine: number, endLine: number) => {
       if (!filePath) return;
       if (!selectedTaskId) {
-        toast.error('Select a task first to add context');
+        toast.error(t('selectTaskFirst'));
         return;
       }
 

package/src/components/editor/file-diff-resolver-modal.tsx

@@ -15,6 +15,7 @@ import { Button } from '@/components/ui/button';
 import { AlertTriangle, Copy, ArrowLeft, Check, Plus } from 'lucide-react';
 import { cn } from '@/lib/utils';
 import { toast } from 'sonner';
+import { useTranslations } from 'next-intl';
 
 interface FileDiffResolverModalProps {
   /** Whether the modal is open */
@@ -53,6 +54,8 @@ export function FileDiffResolverModal({
   onKeepLocal,
   onMerge,
 }: FileDiffResolverModalProps) {
+  const t = useTranslations('editor');
+
   // Working copy of local content that user can modify via inserts
   const [workingContent, setWorkingContent] = useState(localContent);
   const localScrollRef = useRef<HTMLDivElement>(null);
@@ -81,7 +84,7 @@ export function FileDiffResolverModal({
     // Insert the remote line with >>>>> marker before it
     lines.splice(insertAfterLocalLine, 0, '>>>>> REMOTE', remoteLine);
     setWorkingContent(lines.join('\n'));
-    toast.success('Line inserted with marker');
+    toast.success(t('lineInserted'));
   }, [workingContent]);
 
   // Insert all lines from a remote block
@@ -90,7 +93,7 @@ export function FileDiffResolverModal({
     // Insert marker before the block and all remote lines
     lines.splice(insertAfterLocalLine, 0, '>>>>> REMOTE', ...remoteLines, '<<<<< END REMOTE');
     setWorkingContent(lines.join('\n'));
-    toast.success(`${remoteLines.length} line(s) inserted with markers`);
+    toast.success(t('linesInserted', { count: remoteLines.length }));
   }, [workingContent]);
 
   // Insert deletion marker for lines that exist in local but not remote
@@ -106,34 +109,34 @@ export function FileDiffResolverModal({
     lines.splice(startPosition, 0, '>>>>> REMOTE DELETED');
 
     setWorkingContent(lines.join('\n'));
-    toast.success(lineCount > 1 ? 'Deletion markers inserted' : 'Deletion marker inserted');
+    toast.success(lineCount > 1 ? t('deletionMarkersInserted') : t('deletionMarkerInserted'));
   }, [workingContent]);
 
   // Handle keeping local (dismiss all remote changes)
   const handleKeepLocal = useCallback(() => {
     onKeepLocal();
     onClose();
-    toast.success('Kept local changes');
+    toast.success(t('keptLocalChanges'));
   }, [onKeepLocal, onClose]);
 
   // Handle accepting remote entirely
   const handleAcceptRemote = useCallback(() => {
     onAcceptRemote();
     onClose();
-    toast.success('Accepted remote changes');
+    toast.success(t('acceptedRemoteChanges'));
   }, [onAcceptRemote, onClose]);
 
   // Handle applying the working (merged) content
   const handleApplyMerged = useCallback(() => {
     onMerge(workingContent);
     onClose();
-    toast.success('Applied merged changes');
+    toast.success(t('appliedMergedChanges'));
   }, [workingContent, onMerge, onClose]);
 
   // Copy content to clipboard
   const handleCopy = useCallback(async (content: string, label: string) => {
     await navigator.clipboard.writeText(content);
-    toast.success(`Copied ${label} to clipboard`);
+    toast.success(t('copiedToClipboard', { label }));
   }, []);
 
   // Sync scroll between panels
@@ -159,32 +162,32 @@ export function FileDiffResolverModal({
         <DialogHeader>
           <DialogTitle className="flex items-center gap-2">
             <AlertTriangle className="size-5 text-amber-500" />
-            File Changed Externally
+            {t('fileChangedExternally')}
           </DialogTitle>
           <DialogDescription>
             <span className="font-mono text-xs bg-muted px-1.5 py-0.5 rounded">{fileName}</span>
-            {' '}has been modified on disk. Click <Plus className="inline size-3" /> to insert remote lines into your version.
+            {' '}{t('hasBeenModified')} <Plus className="inline size-3" /> {t('toInsertRemoteLines')}
           </DialogDescription>
         </DialogHeader>
 
         {/* Stats bar */}
         <div className="flex items-center gap-4 text-sm">
-          <span className="text-muted-foreground">Differences:</span>
+          <span className="text-muted-foreground">{t('differences')}</span>
           {hasChanges ? (
             <>
               <span className="text-blue-600 dark:text-blue-400">
-                {diffBlocks.filter(b => b.type === 'added').reduce((sum, b) => sum + b.remoteLines.length, 0)} new in remote
+                {diffBlocks.filter(b => b.type === 'added').reduce((sum, b) => sum + b.remoteLines.length, 0)} {t('newInRemote')}
               </span>
               <span className="text-green-600 dark:text-green-400">
-                {diffBlocks.filter(b => b.type === 'removed').reduce((sum, b) => sum + b.localLines.length, 0)} only in local
+                {diffBlocks.filter(b => b.type === 'removed').reduce((sum, b) => sum + b.localLines.length, 0)} {t('onlyInLocal')}
               </span>
             </>
           ) : (
-            <span className="text-green-600 dark:text-green-400">✓ Files are identical</span>
+            <span className="text-green-600 dark:text-green-400">✓ {t('filesIdentical')}</span>
           )}
           {hasLocalModifications && (
             <span className="text-amber-600 dark:text-amber-400 ml-auto text-xs">
-              • Modified from original
+              • {t('modifiedFromOriginal')}
             </span>
           )}
         </div>
@@ -195,13 +198,13 @@ export function FileDiffResolverModal({
           <div className="flex flex-col border rounded-md overflow-hidden">
             <div className="flex items-center justify-between px-3 py-1.5 bg-muted/50 border-b">
               <span className="text-xs font-medium text-muted-foreground">
-                Local {hasLocalModifications && '(modified)'}
+                {t('local')} {hasLocalModifications && t('modified')}
               </span>
               <Button
                 variant="ghost"
                 size="icon-sm"
                 onClick={() => handleCopy(workingContent, 'local content')}
-                title="Copy local content"
+                title={t('copyLocalContent')}
               >
                 <Copy className="size-3.5" />
               </Button>
@@ -221,12 +224,12 @@ export function FileDiffResolverModal({
           {/* Remote (right) */}
           <div className="flex flex-col border rounded-md overflow-hidden">
             <div className="flex items-center justify-between px-3 py-1.5 bg-muted/50 border-b">
-              <span className="text-xs font-medium text-muted-foreground">Remote (Disk)</span>
+              <span className="text-xs font-medium text-muted-foreground">{t('remoteDisk')}</span>
               <Button
                 variant="ghost"
                 size="icon-sm"
                 onClick={() => handleCopy(remoteContent, 'remote content')}
-                title="Copy remote content"
+                title={t('copyRemoteContent')}
               >
                 <Copy className="size-3.5" />
               </Button>
@@ -250,15 +253,15 @@ export function FileDiffResolverModal({
         <DialogFooter className="gap-2 sm:gap-2 flex-wrap">
           <Button variant="outline" onClick={handleKeepLocal} className="gap-2">
             <ArrowLeft className="size-4" />
-            Keep Local Only
+            {t('keepLocalOnly')}
           </Button>
           <Button variant="outline" onClick={handleAcceptRemote} className="gap-2">
-            Accept Remote Only
+            {t('acceptRemoteOnly')}
           </Button>
           {hasLocalModifications && (
             <Button variant="default" onClick={handleApplyMerged} className="gap-2">
               <Check className="size-4" />
-              Apply Merged
+              {t('applyMerged')}
             </Button>
           )}
         </DialogFooter>
@@ -432,6 +435,7 @@ interface DiffPanelLocalProps {
 }
 
 function DiffPanelLocal({ diffBlocks, workingLines }: DiffPanelLocalProps) {
+  const t = useTranslations('editor');
   let lineNumber = 0;
 
   return (
@@ -490,7 +494,7 @@ function DiffPanelLocal({ diffBlocks, workingLines }: DiffPanelLocalProps) {
               className="px-2 py-0.5 flex bg-blue-500/10 text-muted-foreground/50 italic"
             >
               <span className="w-8 text-right mr-2 shrink-0">+</span>
-              <span className="flex-1">{block.remoteLines.length} line(s) in remote</span>
+              <span className="flex-1">{t('linesInRemote', { count: block.remoteLines.length })}</span>
             </div>
           );
         }
@@ -512,6 +516,7 @@ interface DiffPanelRemoteProps {
 }
 
 function DiffPanelRemote({ diffBlocks, remoteLines, onInsertLine, onInsertBlock, onInsertDeletedMarker }: DiffPanelRemoteProps) {
+  const t = useTranslations('editor');
   let lineNumber = 0;
   let currentLocalLine = 0;
 
@@ -564,7 +569,7 @@ function DiffPanelRemote({ diffBlocks, remoteLines, onInsertLine, onInsertBlock,
                     size="icon-sm"
                     className="opacity-0 group-hover:opacity-100 shrink-0 ml-1 h-5 w-5"
                     onClick={() => onInsertLine(line, insertPosition)}
-                    title="Insert this line into local"
+                    title={t('insertLineIntoLocal')}
                   >
                     <Plus className="size-3" />
                   </Button>
@@ -587,7 +592,7 @@ function DiffPanelRemote({ diffBlocks, remoteLines, onInsertLine, onInsertBlock,
                   onClick={() => onInsertBlock(block.remoteLines, insertPosition)}
                 >
                   <Plus className="size-3" />
-                  Insert all {block.remoteLines.length} lines
+                  {t('insertAllLines', { count: block.remoteLines.length })}
                 </Button>
               </div>
             );
@@ -603,7 +608,7 @@ function DiffPanelRemote({ diffBlocks, remoteLines, onInsertLine, onInsertBlock,
               className="px-2 py-0.5 flex items-center justify-between bg-green-500/10 gap-2"
             >
               <span className="text-muted-foreground/70 text-xs italic">
-                − {deletedLineCount} line(s) deleted in remote
+                − {t('linesDeletedInRemote', { count: deletedLineCount })}
               </span>
               <Button
                 variant="outline"
@@ -612,7 +617,7 @@ function DiffPanelRemote({ diffBlocks, remoteLines, onInsertLine, onInsertBlock,
                 onClick={() => onInsertDeletedMarker(insertPosition, deletedLineCount)}
               >
                 <Plus className="size-3" />
-                Mark as deleted
+                {t('markAsDeleted')}
               </Button>
             </div>
           );

package/src/components/editor/inline-edit-dialog.tsx

@@ -12,6 +12,7 @@ import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { X, Loader2, Check, RotateCcw } from 'lucide-react';
 import { useInlineEditStore } from '@/stores/inline-edit-store';
+import { useTranslations } from 'next-intl';
 
 interface InlineEditDialogProps {
   filePath: string;
@@ -21,6 +22,8 @@ interface InlineEditDialogProps {
 }
 
 export function InlineEditDialog({ filePath, onSubmit, onAccept, onReject }: InlineEditDialogProps) {
+  const t = useTranslations('editor');
+  const tCommon = useTranslations('common');
   const [instruction, setInstruction] = useState('');
   const inputRef = useRef<HTMLInputElement>(null);
   const popupRef = useRef<HTMLDivElement>(null);
@@ -155,7 +158,7 @@ export function InlineEditDialog({ filePath, onSubmit, onAccept, onReject }: Inl
             className="flex items-center gap-1.5 text-xs bg-emerald-600/20 text-emerald-400 hover:bg-emerald-600/30 hover:text-emerald-300 font-medium px-2.5 py-1 rounded-md transition-colors"
           >
             <Check className="size-3" />
-            Accept
+            {t('accept')}
             <kbd className="text-[10px] text-emerald-600 bg-emerald-950/50 px-1 py-0.5 rounded">⌘↵</kbd>
           </button>
 
@@ -165,7 +168,7 @@ export function InlineEditDialog({ filePath, onSubmit, onAccept, onReject }: Inl
             className="flex items-center gap-1.5 text-xs bg-zinc-700/30 text-zinc-400 hover:bg-zinc-700/50 hover:text-zinc-300 font-medium px-2.5 py-1 rounded-md transition-colors"
           >
             <RotateCcw className="size-3" />
-            Reject
+            {t('reject')}
             <kbd className="text-[10px] text-zinc-600 bg-zinc-800/50 px-1 py-0.5 rounded">Esc</kbd>
           </button>
         </div>
@@ -187,7 +190,7 @@ export function InlineEditDialog({ filePath, onSubmit, onAccept, onReject }: Inl
       <div className="bg-[#1e1e1e] border border-[#3c3c3c] rounded-lg shadow-xl p-2 flex items-center gap-2">
         <Input
           ref={inputRef}
-          placeholder="Describe the change you want..."
+          placeholder={t('describeChange')}
           value={instruction}
           onChange={(e) => setInstruction(e.target.value)}
           onKeyDown={handleKeyDown}
@@ -197,14 +200,14 @@ export function InlineEditDialog({ filePath, onSubmit, onAccept, onReject }: Inl
 
         {error && (
           <span className="text-xs text-red-400 truncate max-w-[80px]" title={error}>
-            Error
+            {t('error')}
           </span>
         )}
 
         {isGenerating ? (
           <div className="flex items-center gap-2 text-zinc-400 text-xs">
             <Loader2 className="size-4 animate-spin" />
-            <span>Generating...</span>
+            <span>{tCommon('generating')}</span>
           </div>
         ) : (
           <Button
@@ -213,7 +216,7 @@ export function InlineEditDialog({ filePath, onSubmit, onAccept, onReject }: Inl
             disabled={!instruction.trim()}
             className="h-7 px-3 bg-violet-600 hover:bg-violet-700 text-white text-xs font-medium"
           >
-            Submit
+            {tCommon('submit')}
           </Button>
         )}
 

package/src/components/editor/selection-mention-popup.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect, useCallback, useRef } from 'react';
 import { AtSign } from 'lucide-react';
 import { EditorView } from '@codemirror/view';
 import { cn } from '@/lib/utils';
+import { useTranslations } from 'next-intl';
 
 interface SelectionMentionPopupProps {
   containerRef: React.RefObject<HTMLDivElement | null>;
@@ -16,6 +17,7 @@ export function SelectionMentionPopup({
   editorViewRef,
   onAddToContext,
 }: SelectionMentionPopupProps) {
+  const t = useTranslations('editor');
   const [visible, setVisible] = useState(false);
   const [position, setPosition] = useState<{ x: number; y: number } | null>(null);
   const [selection, setSelection] = useState<{ startLine: number; endLine: number } | null>(null);
@@ -142,7 +144,7 @@ export function SelectionMentionPopup({
         transform: 'translateX(-100%)', // Align to right
       }}
       onClick={handleClick}
-      title={`Add ${lineRange} to chat context`}
+      title={t('addLinesToChat', { startLine: selection.startLine, endLine: selection.endLine })}
     >
       <AtSign className="size-3" />
       <span className="text-xs font-medium">{lineRange}</span>

package/src/components/header/project-selector.tsx

@@ -22,6 +22,7 @@ import {
 import { useProjectStore } from '@/stores/project-store';
 import { ProjectSettingsDialog } from '@/components/project-settings/project-settings-dialog';
 import { getFolderName } from '@/lib/utils';
+import { useTranslations } from 'next-intl';
 
 interface ProjectSelectorProps {
   onAddProject?: () => void;
@@ -29,6 +30,7 @@ interface ProjectSelectorProps {
 
 // Content component for reuse in mobile dropdown
 export function ProjectSelectorContent({ onAddProject }: ProjectSelectorProps) {
+  const tCommon = useTranslations('common');
   const {
     projects,
     selectedProjectIds,
@@ -76,7 +78,7 @@ export function ProjectSelectorContent({ onAddProject }: ProjectSelectorProps) {
         onCheckedChange={() => selectAllProjects()}
         className="px-2 py-1.5"
       >
-        All Projects
+        {tCommon('allProjects')}
       </DropdownMenuCheckboxItem>
       <DropdownMenuSeparator />
 
@@ -84,7 +86,7 @@ export function ProjectSelectorContent({ onAddProject }: ProjectSelectorProps) {
       <div className="max-h-[180px] overflow-y-auto">
         {projects.length === 0 ? (
           <div className="px-2 py-1.5 text-sm text-muted-foreground">
-            No projects yet
+            {tCommon('noProjectsYet')}
           </div>
         ) : (
           projects.map((project) => {
@@ -195,6 +197,7 @@ export function ProjectSelectorContent({ onAddProject }: ProjectSelectorProps) {
 }
 
 export function ProjectSelector({ onAddProject }: ProjectSelectorProps) {
+  const tCommon = useTranslations('common');
   const {
     projects,
     selectedProjectIds,
@@ -203,11 +206,11 @@ export function ProjectSelector({ onAddProject }: ProjectSelectorProps) {
 
   // Compute display text
   const allMode = isAllProjectsMode();
-  let displayText = 'All Projects';
+  let displayText = tCommon('allProjects');
   if (!allMode) {
     if (selectedProjectIds.length === 1) {
       const project = projects.find(p => p.id === selectedProjectIds[0]);
-      displayText = project ? getFolderName(project.name) : 'Select Project';
+      displayText = project ? getFolderName(project.name) : tCommon('selectProject');
     } else if (selectedProjectIds.length > 1) {
       displayText = `${selectedProjectIds.length} projects`;
     }

package/src/components/header.tsx

@@ -1,7 +1,7 @@
 'use client';
 
-import { useState } from 'react';
-import { Settings, Plus, Search, PanelLeft, PanelRight, FolderTree, Terminal, X } from 'lucide-react';
+import { useState, useEffect } from 'react';
+import { Settings, Plus, Search, PanelLeft, PanelRight, FolderTree, MessageCircleQuestion, Network, Terminal, X } from 'lucide-react';
 import Image from 'next/image';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
@@ -25,6 +25,8 @@ import { useTerminalStore } from '@/stores/terminal-store';
 import { useProjectStore } from '@/stores/project-store';
 import { useSettingsUIStore } from '@/stores/settings-ui-store';
 import { ProjectSelector, ProjectSelectorContent } from '@/components/header/project-selector';
+import { useQuestionsStore } from '@/stores/questions-store';
+import { useWorkflowStore } from '@/stores/workflow-store';
 import { useTranslations } from 'next-intl';
 
 interface HeaderProps {
@@ -43,7 +45,16 @@ export function Header({ onCreateTask, onAddProject, searchQuery: externalSearch
   const { setOpen: setSettingsOpen } = useSettingsUIStore();
   const { isOpen: terminalOpen, togglePanel: toggleTerminal } = useTerminalStore();
   const { activeProjectId, selectedProjectIds } = useProjectStore();
+  const { pendingQuestions, fetchQuestions, isOpen: questionsPanelOpen, togglePanel: toggleQuestionsPanel } = useQuestionsStore();
+  const questionCount = pendingQuestions.size;
+  const { isOpen: workflowPanelOpen, togglePanel: toggleWorkflowPanel, getActiveAgentCount } = useWorkflowStore();
+  const activeAgentCount = getActiveAgentCount();
   const [searchOpen, setSearchOpen] = useState(false);
+
+  // Fetch pending questions on mount
+  useEffect(() => {
+    fetchQuestions(selectedProjectIds);
+  }, [selectedProjectIds.join(',')]);
   const [internalSearchQuery, setInternalSearchQuery] = useState('');
   const searchQuery = externalSearchQuery !== undefined ? externalSearchQuery : internalSearchQuery;
   const setSearchQuery = onSearchChange || setInternalSearchQuery;
@@ -102,7 +113,7 @@ export function Header({ onCreateTask, onAddProject, searchQuery: externalSearch
               <button
                 onClick={() => setSearchQuery('')}
                 className="absolute right-2 top-2 h-5 w-5 flex items-center justify-center rounded-sm hover:bg-muted-foreground/20 transition-colors"
-                aria-label="Clear search"
+                aria-label={t('clearSearch')}
               >
                 <X className="h-3.5 w-3.5 text-muted-foreground" />
               </button>
@@ -161,6 +172,61 @@ export function Header({ onCreateTask, onAddProject, searchQuery: externalSearch
             </div>
           </div>
 
+          {/* Questions panel toggle */}
+          <TooltipProvider>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <Button
+                  variant={questionsPanelOpen ? 'secondary' : 'ghost'}
+                  size="icon"
+                  onClick={() => {
+                    fetchQuestions(selectedProjectIds);
+                    toggleQuestionsPanel();
+                  }}
+                  className="shrink-0 relative"
+                >
+                  <MessageCircleQuestion className="h-4 w-4" />
+                  {questionCount > 0 && (
+                    <span className="absolute -top-1 -right-1 h-4 min-w-4 px-1 flex items-center justify-center text-[10px] font-medium bg-amber-500 text-white rounded-full">
+                      {questionCount}
+                    </span>
+                  )}
+                </Button>
+              </TooltipTrigger>
+              <TooltipContent>
+                <p>
+                  Pending questions{questionCount > 0 ? ` (${questionCount})` : ''}
+                </p>
+              </TooltipContent>
+            </Tooltip>
+          </TooltipProvider>
+
+          {/* Workflow panel toggle */}
+          <TooltipProvider>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <Button
+                  variant={workflowPanelOpen ? 'secondary' : 'ghost'}
+                  size="icon"
+                  onClick={toggleWorkflowPanel}
+                  className="shrink-0 relative"
+                >
+                  <Network className="h-4 w-4" />
+                  {activeAgentCount > 0 && (
+                    <span className="absolute -top-1 -right-1 h-4 min-w-4 px-1 flex items-center justify-center text-[10px] font-medium bg-blue-500 text-white rounded-full">
+                      {activeAgentCount}
+                    </span>
+                  )}
+                </Button>
+              </TooltipTrigger>
+              <TooltipContent>
+                <p>
+                  Agent workflow{activeAgentCount > 0 ? ` (${activeAgentCount})` : ''}
+                </p>
+              </TooltipContent>
+            </Tooltip>
+          </TooltipProvider>
+
           {/* Terminal toggle */}
           <TooltipProvider>
             <Tooltip>
@@ -226,7 +292,7 @@ export function Header({ onCreateTask, onAddProject, searchQuery: externalSearch
               <button
                 onClick={() => setSearchQuery('')}
                 className="absolute right-2 top-2 h-5 w-5 flex items-center justify-center rounded-sm hover:bg-muted-foreground/20 transition-colors"
-                aria-label="Clear search"
+                aria-label={t('clearSearch')}
               >
                 <X className="h-3.5 w-3.5 text-muted-foreground" />
               </button>

package/src/components/kanban/column.tsx

@@ -62,6 +62,17 @@ export function Column({ status, title, tasks, attemptCounts = new Map(), onCrea
             <span className="text-xs text-muted-foreground bg-muted px-2 py-1 rounded-full">
               {tasks.length}
             </span>
+            {isArchiveColumn && tasks.length > 0 && (
+              <Button
+                variant="ghost"
+                size="sm"
+                className="h-6 w-6 p-0 text-muted-foreground hover:text-destructive hover:bg-destructive/10"
+                onClick={handleEmptyColumn}
+                title={t('deleteAllTasks', { count: tasks.length, status: title })}
+              >
+                <Trash2 className="h-3 w-3" />
+              </Button>
+            )}
             {isTodoColumn && onCreateTask && (
               <Button
                 variant="default"