refactor: move task execution logic to store

jonathanlab · jonathanlab · commit ad27a47235a0 · 2025-09-29T16:21:25.000+02:00
diff --git a/src/main/services/agent.ts b/src/main/services/agent.ts
@@ -20,8 +20,6 @@ export function registerAgentIpc(taskControllers: Map<string, TaskController>, g
             throw new Error('prompt and repoPath are required');
         }
 
-        // Now using top-level import since we're compiling to ES modules
-
         const agent = createAgent(
             new ClaudeCodeAgent({
                 permissionMode: 'bypassPermissions'
@@ -97,8 +95,8 @@ export function registerAgentIpc(taskControllers: Map<string, TaskController>, g
         const { taskId, stream } = await agent.run({
             prompt: fullPrompt,
             repoPath,
-            signal: abortController.signal,
-        } as any);
+            permissionMode: 'auto',
+        });
 
         const channel = `agent-event:${taskId}`;
 
diff --git a/src/renderer/components/TaskDetail.tsx b/src/renderer/components/TaskDetail.tsx
@@ -1,24 +1,28 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { Flex, Box, Heading, Text, Badge, Button, Link, SegmentedControl, DataList } from '@radix-ui/themes';
+import React, { useEffect } from 'react';
+import { Flex, Box, Text, Badge, Button, Link, SegmentedControl, DataList, Code } from '@radix-ui/themes';
 import { Task } from '@shared/types';
 import { format } from 'date-fns';
-import { useAuthStore } from '../stores/authStore';
 import { useStatusBarStore } from '../stores/statusBarStore';
+import { useTaskExecutionStore } from '../stores/taskExecutionStore';
 import { LogView } from './LogView';
 
 interface TaskDetailProps {
   task: Task;
 }
 
 export function TaskDetail({ task }: TaskDetailProps) {
-  const { client } = useAuthStore();
   const { setStatusBar, reset } = useStatusBarStore();
-  const [isRunning, setIsRunning] = useState(false);
-  const [logs, setLogs] = useState<any[]>([]);
-  const [repoPath, setRepoPath] = useState<string | null>(null);
-  const [currentTaskId, setCurrentTaskId] = useState<string | null>(null);
-  const unsubscribeRef = useRef<null | (() => void)>(null);
-  const [runMode, setRunMode] = useState<'local' | 'cloud'>('local');
+  const {
+    getTaskState,
+    setRunMode: setStoreRunMode,
+    selectRepositoryForTask,
+    runTask,
+    cancelTask,
+  } = useTaskExecutionStore();
+
+  // Get persistent state for this task
+  const taskState = getTaskState(task.id);
+  const { isRunning, logs, repoPath, runMode } = taskState;
 
   useEffect(() => {
     setStatusBar({
@@ -41,203 +45,31 @@ export function TaskDetail({ task }: TaskDetailProps) {
     };
   }, [setStatusBar, reset, isRunning]);
 
-  const handleSelectRepo = async () => {
-    try {
-      const selected = await window.electronAPI.selectDirectory();
-      if (selected) {
-        const isRepo = await window.electronAPI.validateRepo(selected);
-        if (!isRepo) {
-          setLogs(prev => [...prev, `Selected folder is not a git repository: ${selected}`]);
-          return;
-        }
-        const canWrite = await window.electronAPI.checkWriteAccess(selected);
-        if (!canWrite) {
-          setLogs(prev => [...prev, `No write permission in selected folder: ${selected}`]);
-          const { response } = await window.electronAPI.showMessageBox({
-            type: 'warning',
-            title: 'Folder is not writable',
-            message: 'The selected folder is not writable by the app.',
-            detail: 'Grant access by selecting a different folder or adjusting permissions.',
-            buttons: ['Grant Access', 'Cancel'],
-            defaultId: 0,
-            cancelId: 1,
-          });
-          if (response === 0) {
-            // Let user reselect and validate again
-            return handleSelectRepo();
-          }
-          return;
-        }
-        setRepoPath(selected);
-      }
-    } catch (err) {
-      setLogs(prev => [...prev, `Error selecting directory: ${err instanceof Error ? err.message : String(err)}`]);
-    }
+  // Simple event handlers that delegate to store actions
+  const handleSelectRepo = () => {
+    selectRepositoryForTask(task.id);
   };
 
-  const handleRunTask = async () => {
-    if (isRunning) return;
-
-    // Ensure repo path is selected
-    let effectiveRepoPath = repoPath;
-    if (!effectiveRepoPath) {
-      await handleSelectRepo();
-      effectiveRepoPath = repoPath;
-    }
-    if (!effectiveRepoPath) {
-      setLogs(prev => [...prev, 'No repository folder selected. ']);
-      return;
-    }
-    const isRepo = await window.electronAPI.validateRepo(effectiveRepoPath);
-    if (!isRepo) {
-      setLogs(prev => [...prev, `Selected folder is not a git repository: ${effectiveRepoPath}`]);
-      return;
-    }
-    const canWrite = await window.electronAPI.checkWriteAccess(effectiveRepoPath);
-    if (!canWrite) {
-      setLogs(prev => [...prev, `No write permission in selected folder: ${effectiveRepoPath}`]);
-      const { response } = await window.electronAPI.showMessageBox({
-        type: 'warning',
-        title: 'Folder is not writable',
-        message: 'This folder is not writable by the app.',
-        detail: 'Grant access by selecting a different folder or adjusting permissions.',
-        buttons: ['Grant Access', 'Cancel'],
-        defaultId: 0,
-        cancelId: 1,
-      });
-      if (response === 0) {
-        await handleSelectRepo();
-      }
-      return;
-    }
-
-    // Build a helpful prompt for the agent
-    const promptLines: string[] = [];
-    promptLines.push(`Task: ${task.title}`);
-    if (task.description) {
-      promptLines.push('Description:');
-      promptLines.push(task.description);
-    }
-    const prompt = promptLines.join('\n');
-
-    setIsRunning(true);
-    setLogs([
-      { type: 'text', ts: Date.now(), content: `Starting ${runMode} Claude Code agent...` },
-      { type: 'text', ts: Date.now(), content: `Repo: ${effectiveRepoPath}` },
-    ]);
-
-    try {
-      const { taskId, channel } = await window.electronAPI.agentStart({
-        prompt,
-        repoPath: effectiveRepoPath,
-        model: 'claude-4-sonnet',
-      });
-      setCurrentTaskId(taskId);
-
-      // Subscribe to streaming events
-      if (unsubscribeRef.current) {
-        unsubscribeRef.current();
-        unsubscribeRef.current = null;
-      }
-      unsubscribeRef.current = window.electronAPI.onAgentEvent(channel, (ev: any) => {
-        switch (ev?.type) {
-          case 'token':
-            if (typeof ev.content === 'string' && ev.content.trim().length > 0) {
-              setLogs(prev => [...prev, { type: 'text', ts: ev.ts || Date.now(), content: ev.content }]);
-            }
-            break;
-          case 'status':
-            if (ev.phase) {
-              setLogs(prev => [...prev, { type: 'status', ts: ev.ts || Date.now(), phase: ev.phase }]);
-            } else if (ev.message) {
-              setLogs(prev => [...prev, { type: 'text', ts: ev.ts || Date.now(), content: ev.message }]);
-            }
-            break;
-          case 'tool_call':
-            setLogs(prev => [
-              ...prev,
-              { type: 'tool_call', ts: ev.ts || Date.now(), toolName: ev.toolName || ev.tool || ev.name || 'unknown-tool', callId: ev.callId, args: ev.args ?? ev.input },
-            ]);
-            break;
-          case 'tool_result':
-            setLogs(prev => [
-              ...prev,
-              { type: 'tool_result', ts: ev.ts || Date.now(), toolName: ev.toolName || ev.tool || ev.name || 'unknown-tool', callId: ev.callId, result: ev.result ?? ev.output },
-            ]);
-            break;
-          case 'diff':
-            setLogs(prev => [
-              ...prev,
-              { type: 'diff', ts: ev.ts || Date.now(), file: ev.file || ev.path || '', patch: ev.patch ?? ev.patchText ?? ev.diff, summary: ev.summary },
-            ]);
-            break;
-          case 'file_write':
-            setLogs(prev => [
-              ...prev,
-              { type: 'file_write', ts: ev.ts || Date.now(), path: ev.path || '', bytes: ev.bytes },
-            ]);
-            break;
-          case 'metric':
-            setLogs(prev => [
-              ...prev,
-              { type: 'metric', ts: ev.ts || Date.now(), key: ev.key || '', value: ev.value ?? 0, unit: ev.unit },
-            ]);
-            break;
-          case 'artifact':
-            setLogs(prev => [
-              ...prev,
-              { type: 'artifact', ts: ev.ts || Date.now(), kind: ev.kind || 'artifact', content: ev.content },
-            ]);
-            break;
-          case 'error':
-            setLogs(prev => [...prev, { type: 'text', ts: ev.ts || Date.now(), level: 'error', content: `error: ${ev.message || 'Unknown error'}` }]);
-            setIsRunning(false);
-            break;
-          case 'done':
-            setLogs(prev => [...prev, { type: 'text', ts: ev.ts || Date.now(), content: ev.success ? 'Agent run completed' : 'Agent run ended with errors' }]);
-            setIsRunning(false);
-            if (unsubscribeRef.current) {
-              unsubscribeRef.current();
-              unsubscribeRef.current = null;
-            }
-            break;
-          default:
-            setLogs(prev => [...prev, `event: ${JSON.stringify(ev)}`]);
-        }
-      });
-    } catch (error) {
-      setLogs(prev => [...prev, `Error starting agent: ${error instanceof Error ? error.message : 'Unknown error'}`]);
-      setIsRunning(false);
-    }
+  const handleRunTask = () => {
+    runTask(task.id, task);
   };
 
-  const handleCancel = async () => {
-    if (!currentTaskId) return;
-    try {
-      await window.electronAPI.agentCancel(currentTaskId);
-    } catch { }
-    setIsRunning(false);
-    if (unsubscribeRef.current) {
-      unsubscribeRef.current();
-      unsubscribeRef.current = null;
-    }
+  const handleCancel = () => {
+    cancelTask(task.id);
   };
 
-  useEffect(() => {
-    return () => {
-      if (unsubscribeRef.current) {
-        unsubscribeRef.current();
-        unsubscribeRef.current = null;
-      }
-    };
-  }, []);
+  const handleRunModeChange = (value: string) => {
+    setStoreRunMode(task.id, value as 'local' | 'cloud');
+  };
 
   return (
     <Flex height="100%">
       {/* Left pane - Task details */}
       <Box width="50%" className="border-r border-gray-6" overflowY="auto">
         <Box p="4">
-          <Heading size="5" mb="4">{task.title}</Heading>
+          <Box mb="4">
+            <Code size="5">{task.title}</Code>
+          </Box>
 
           <DataList.Root>
             <DataList.Item>
@@ -308,7 +140,7 @@ export function TaskDetail({ task }: TaskDetailProps) {
               <DataList.Value>
                 <SegmentedControl.Root
                   value={runMode}
-                  onValueChange={(value) => setRunMode(value as 'local' | 'cloud')}
+                  onValueChange={handleRunModeChange}
                 >
                   <SegmentedControl.Item value="local">Local</SegmentedControl.Item>
                   <SegmentedControl.Item value="cloud">Cloud</SegmentedControl.Item>
diff --git a/src/renderer/stores/taskExecutionStore.ts b/src/renderer/stores/taskExecutionStore.ts
