prompt-language-shell 0.4.2 → 0.4.4

package/dist/services/tool-registry.js

@@ -33,6 +33,7 @@ class ToolRegistry {
 // Create singleton instance
 export const toolRegistry = new ToolRegistry();
 // Register built-in tools
+import { answerTool } from '../tools/answer.tool.js';
 import { introspectTool } from '../tools/introspect.tool.js';
 import { planTool } from '../tools/plan.tool.js';
 toolRegistry.register('plan', {
@@ -43,3 +44,7 @@ toolRegistry.register('introspect', {
     schema: introspectTool,
     instructionsPath: 'config/INTROSPECT.md',
 });
+toolRegistry.register('answer', {
+    schema: answerTool,
+    instructionsPath: 'config/ANSWER.md',
+});

package/dist/tools/answer.tool.js

@@ -0,0 +1,18 @@
+export const answerTool = {
+    name: 'answer',
+    description: 'Answer questions and provide up-to-date information using web search. Called after PLAN has identified an answer request and user has confirmed. Searches the web for current data and provides concise, helpful responses formatted for terminal display.',
+    input_schema: {
+        type: 'object',
+        properties: {
+            question: {
+                type: 'string',
+                description: 'The question or information request from the user. Should be a clear, complete question.',
+            },
+            answer: {
+                type: 'string',
+                description: 'The answer to the question. Must be concise and well-formatted. Maximum 4 lines of text, each line maximum 80 characters. Use natural line breaks for readability.',
+            },
+        },
+        required: ['question', 'answer'],
+    },
+};

package/dist/types/types.js

@@ -10,6 +10,8 @@ export var ComponentName;
     ComponentName["Confirm"] = "confirm";
     ComponentName["Introspect"] = "introspect";
     ComponentName["Report"] = "report";
+    ComponentName["Answer"] = "answer";
+    ComponentName["AnswerDisplay"] = "answerDisplay";
 })(ComponentName || (ComponentName = {}));
 export var TaskType;
 (function (TaskType) {

package/dist/ui/Answer.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Box, Text, useInput } from 'ink';
+import { getTextColor } from '../services/colors.js';
+import { Spinner } from './Spinner.js';
+const MIN_PROCESSING_TIME = 1000;
+export function Answer({ question, state, service, onError, onComplete, onAborted, }) {
+    const done = state?.done ?? false;
+    const isCurrent = done === false;
+    const [error, setError] = useState(null);
+    const [isLoading, setIsLoading] = useState(state?.isLoading ?? !done);
+    useInput((input, key) => {
+        if (key.escape && isLoading && !done) {
+            setIsLoading(false);
+            onAborted();
+        }
+    }, { isActive: isLoading && !done });
+    useEffect(() => {
+        // Skip processing if done
+        if (done) {
+            return;
+        }
+        // Skip processing if no service available
+        if (!service) {
+            setError('No service available');
+            setIsLoading(false);
+            return;
+        }
+        let mounted = true;
+        async function process(svc) {
+            const startTime = Date.now();
+            try {
+                // Call answer tool
+                const result = await svc.processWithTool(question, 'answer');
+                const elapsed = Date.now() - startTime;
+                const remainingTime = Math.max(0, MIN_PROCESSING_TIME - elapsed);
+                await new Promise((resolve) => setTimeout(resolve, remainingTime));
+                if (mounted) {
+                    // Extract answer from result
+                    const answer = result.answer || '';
+                    setIsLoading(false);
+                    onComplete?.(answer);
+                }
+            }
+            catch (err) {
+                const elapsed = Date.now() - startTime;
+                const remainingTime = Math.max(0, MIN_PROCESSING_TIME - elapsed);
+                await new Promise((resolve) => setTimeout(resolve, remainingTime));
+                if (mounted) {
+                    const errorMessage = err instanceof Error ? err.message : 'Unknown error occurred';
+                    setIsLoading(false);
+                    if (onError) {
+                        onError(errorMessage);
+                    }
+                    else {
+                        setError(errorMessage);
+                    }
+                }
+            }
+        }
+        process(service);
+        return () => {
+            mounted = false;
+        };
+    }, [question, done, service, onComplete, onError]);
+    // Return null when done (like Introspect)
+    if (done || (!isLoading && !error)) {
+        return null;
+    }
+    return (_jsxs(Box, { alignSelf: "flex-start", flexDirection: "column", children: [isLoading && (_jsxs(Box, { children: [_jsx(Text, { color: getTextColor(isCurrent), children: "Finding answer. " }), _jsx(Spinner, {})] })), error && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "red", children: ["Error: ", error] }) }))] }));
+}

package/dist/ui/AnswerDisplay.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { Colors } from '../services/colors.js';
+export function AnswerDisplay({ answer }) {
+    // Split answer into lines and display with indentation
+    const lines = answer.split('\n');
+    return (_jsx(Box, { flexDirection: "column", paddingLeft: 2, children: lines.map((line, index) => (_jsx(Text, { color: Colors.Text.Active, children: line }, index))) }));
+}

package/dist/ui/Command.js

@@ -1,6 +1,7 @@
 import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import { Box, Text, useInput } from 'ink';
+import { getTextColor } from '../services/colors.js';
 import { Spinner } from './Spinner.js';
 const MIN_PROCESSING_TIME = 1000; // purely for visual effect
 export function Command({ command, state, service, children, onError, onComplete, onAborted, }) {
@@ -58,5 +59,6 @@ export function Command({ command, state, service, children, onError, onComplete
             mounted = false;
         };
     }, [command, done, service]);
-    return (_jsxs(Box, { alignSelf: "flex-start", flexDirection: "column", children: [_jsxs(Box, { children: [_jsxs(Text, { color: "gray", children: ["> pls ", command] }), isLoading && (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsx(Spinner, {})] }))] }), error && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "red", children: ["Error: ", error] }) })), children] }));
+    const isCurrent = done === false;
+    return (_jsxs(Box, { alignSelf: "flex-start", flexDirection: "column", children: [_jsxs(Box, { children: [_jsxs(Text, { color: getTextColor(isCurrent), children: ["> pls ", command] }), isLoading && (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsx(Spinner, {})] }))] }), error && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "red", children: ["Error: ", error] }) })), children] }));
 }

package/dist/ui/Component.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { ComponentName } from '../types/types.js';
+import { Answer } from './Answer.js';
+import { AnswerDisplay } from './AnswerDisplay.js';
 import { Command } from './Command.js';
 import { Confirm } from './Confirm.js';
 import { Config } from './Config.js';
@@ -25,8 +27,11 @@ export const Component = React.memo(function Component({ def, debug, }) {
             const state = def.state;
             return _jsx(Command, { ...props, state: state });
         }
-        case ComponentName.Plan:
-            return _jsx(Plan, { ...def.props, debug: debug });
+        case ComponentName.Plan: {
+            const props = def.props;
+            const state = def.state;
+            return _jsx(Plan, { ...props, state: state, debug: debug });
+        }
         case ComponentName.Feedback:
             return _jsx(Feedback, { ...def.props });
         case ComponentName.Message:
@@ -48,5 +53,12 @@ export const Component = React.memo(function Component({ def, debug, }) {
         }
         case ComponentName.Report:
             return _jsx(Report, { ...def.props });
+        case ComponentName.Answer: {
+            const props = def.props;
+            const state = def.state;
+            return _jsx(Answer, { ...props, state: state });
+        }
+        case ComponentName.AnswerDisplay:
+            return _jsx(AnswerDisplay, { ...def.props });
     }
 });

package/dist/ui/Config.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { Box, Text, useFocus, useInput } from 'ink';
 import TextInput from 'ink-text-input';
-import { Colors } from '../types/colors.js';
+import { Colors } from '../services/colors.js';
 export var StepType;
 (function (StepType) {
     StepType["Text"] = "text";

package/dist/ui/Confirm.js

@@ -1,9 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { Box, Text, useInput } from 'ink';
-import { Colors } from '../types/colors.js';
+import { Colors } from '../services/colors.js';
 export function Confirm({ message, state, onConfirmed, onCancelled, }) {
     const done = state?.done ?? false;
+    const isCurrent = done === false;
     const [selectedIndex, setSelectedIndex] = React.useState(0); // 0 = Yes, 1 = No
     useInput((input, key) => {
         if (done)
@@ -33,9 +34,9 @@ export function Confirm({ message, state, onConfirmed, onCancelled, }) {
     ];
     if (done) {
         // When done, show both the message and user's choice in timeline
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: message }) }), _jsx(Box, { children: _jsxs(Text, { color: "gray", children: ["> ", options[selectedIndex].label] }) })] }));
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: undefined, children: message }) }), _jsx(Box, { children: _jsxs(Text, { color: Colors.Text.Inactive, children: ["> ", options[selectedIndex].label] }) })] }));
     }
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: message }) }), _jsxs(Box, { children: [_jsx(Text, { color: Colors.Action.Select, children: ">" }), _jsx(Text, { children: " " }), _jsx(Box, { children: options.map((option, index) => {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: isCurrent ? Colors.Text.Active : Colors.Text.Inactive, children: message }) }), _jsxs(Box, { children: [_jsx(Text, { color: Colors.Action.Select, children: ">" }), _jsx(Text, { children: " " }), _jsx(Box, { children: options.map((option, index) => {
                             const isSelected = index === selectedIndex;
                             return (_jsx(Box, { marginRight: 2, children: _jsx(Text, { color: isSelected ? option.color : undefined, dimColor: !isSelected, bold: isSelected, children: option.label }) }, option.value));
                         }) })] })] }));

package/dist/ui/Feedback.js

@@ -1,6 +1,6 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
-import { FeedbackColors } from '../types/colors.js';
+import { getFeedbackColor } from '../services/colors.js';
 import { FeedbackType } from '../types/types.js';
 function getSymbol(type) {
     return {
@@ -11,7 +11,7 @@ function getSymbol(type) {
     }[type];
 }
 export function Feedback({ type, message }) {
-    const color = FeedbackColors[type];
+    const color = getFeedbackColor(type, false);
     const symbol = getSymbol(type);
     return (_jsx(Box, { children: _jsxs(Text, { color: color, children: [symbol, " ", message] }) }));
 }

package/dist/ui/Introspect.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import { Box, Text, useInput } from 'ink';
+import { getTextColor } from '../services/colors.js';
 import { Spinner } from './Spinner.js';
 const MIN_PROCESSING_TIME = 1000;
 const BUILT_IN_CAPABILITIES = new Set([
@@ -32,6 +33,7 @@ function parseCapabilityFromTask(task) {
 }
 export function Introspect({ tasks, state, service, children, onError, onComplete, onAborted, }) {
     const done = state?.done ?? false;
+    const isCurrent = done === false;
     const [error, setError] = useState(null);
     const [isLoading, setIsLoading] = useState(state?.isLoading ?? !done);
     useInput((input, key) => {
@@ -94,5 +96,5 @@ export function Introspect({ tasks, state, service, children, onError, onComplet
     if (!isLoading && !error && !children) {
         return null;
     }
-    return (_jsxs(Box, { alignSelf: "flex-start", flexDirection: "column", children: [isLoading && (_jsxs(Box, { children: [_jsx(Text, { children: "Listing capabilities. " }), _jsx(Spinner, {})] })), error && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "red", children: ["Error: ", error] }) })), children] }));
+    return (_jsxs(Box, { alignSelf: "flex-start", flexDirection: "column", children: [isLoading && (_jsxs(Box, { children: [_jsx(Text, { color: getTextColor(isCurrent), children: "Listing capabilities. " }), _jsx(Spinner, {})] })), error && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "red", children: ["Error: ", error] }) })), children] }));
 }

package/dist/ui/Label.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
+import { getTaskColors } from '../services/colors.js';
 import { Separator } from './Separator.js';
-export function Label({ description, descriptionColor, type, typeColor, showType = false, }) {
-    return (_jsxs(Box, { children: [_jsx(Text, { color: descriptionColor, children: description }), showType && (_jsxs(_Fragment, { children: [_jsx(Separator, {}), _jsx(Text, { color: typeColor, children: type })] }))] }));
+export function Label({ description, taskType, showType = false, isCurrent = false, }) {
+    const colors = getTaskColors(taskType, isCurrent);
+    return (_jsxs(Box, { children: [_jsx(Text, { color: colors.description, children: description }), showType && (_jsxs(_Fragment, { children: [_jsx(Separator, {}), _jsx(Text, { color: colors.type, children: taskType })] }))] }));
 }

package/dist/ui/List.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
-import { Label } from './Label.js';
+import { Separator } from './Separator.js';
 export const List = ({ items, level = 0, highlightedIndex = null, highlightedParentIndex = null, showType = false, }) => {
     const marginLeft = level > 0 ? 4 : 0;
     return (_jsx(Box, { flexDirection: "column", marginLeft: marginLeft, children: items.map((item, index) => {
@@ -21,6 +21,6 @@ export const List = ({ items, level = 0, highlightedIndex = null, highlightedPar
                 (isHighlighted && item.type.highlightedColor
                     ? item.type.highlightedColor
                     : 'whiteBright');
-            return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: markerColor, children: marker }), _jsx(Label, { description: item.description.text, descriptionColor: descriptionColor, type: item.type.text, typeColor: typeColor, showType: showType })] }), item.children && item.children.length > 0 && (_jsx(List, { items: item.children, level: level + 1, highlightedIndex: shouldHighlightChildren ? highlightedIndex : null, showType: showType }))] }, index));
+            return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: markerColor, children: marker }), _jsx(Text, { color: descriptionColor, children: item.description.text }), showType && (_jsxs(_Fragment, { children: [_jsx(Separator, {}), _jsx(Text, { color: typeColor, children: item.type.text })] }))] }), item.children && item.children.length > 0 && (_jsx(List, { items: item.children, level: level + 1, highlightedIndex: shouldHighlightChildren ? highlightedIndex : null, showType: showType }))] }, index));
         }) }));
 };

package/dist/ui/Main.js

@@ -1,12 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { useInput } from 'ink';
-import { ComponentName, FeedbackType, TaskType, } from '../types/types.js';
+import { FeedbackType } from '../types/types.js';
 import { createAnthropicService, } from '../services/anthropic.js';
-import { getConfigurationRequiredMessage, hasValidAnthropicKey, loadConfig, loadDebugSetting, saveAnthropicConfig, saveDebugSetting, } from '../services/config.js';
-import { FeedbackMessages, getCancellationMessage, getRefiningMessage, } from '../services/messages.js';
-import { createCommandDefinition, createConfirmDefinition, createConfigDefinition, createFeedback, createIntrospectDefinition, createMessage, createPlanDefinition, createRefinement, createReportDefinition, createWelcomeDefinition, isStateless, markAsDone, } from '../services/components.js';
+import { getConfigurationRequiredMessage, hasValidAnthropicKey, loadConfig, loadDebugSetting, saveDebugSetting, } from '../services/configuration.js';
+import { getCancellationMessage } from '../services/messages.js';
+import { createCommandDefinition, createConfigDefinition, createFeedback, createMessage, createWelcomeDefinition, isStateless, markAsDone, } from '../services/components.js';
 import { exitApp } from '../services/process.js';
+import { createAnswerAbortedHandler, createAnswerCompleteHandler, createAnswerErrorHandler, } from '../handlers/answer.js';
+import { createCommandAbortedHandler, createCommandCompleteHandler, createCommandErrorHandler, } from '../handlers/command.js';
+import { createConfigAbortedHandler, createConfigFinishedHandler, } from '../handlers/config.js';
+import { createExecutionCancelledHandler, createExecutionConfirmedHandler, } from '../handlers/execution.js';
+import { createIntrospectAbortedHandler, createIntrospectCompleteHandler, createIntrospectErrorHandler, } from '../handlers/introspect.js';
+import { createPlanAbortedHandler, createPlanAbortHandlerFactory, createPlanSelectionConfirmedHandler, } from '../handlers/plan.js';
 import { Column } from './Column.js';
 export const Main = ({ app, command }) => {
     // Initialize service from existing config if available
@@ -52,18 +58,7 @@ export const Main = ({ app, command }) => {
             return currentQueue;
         });
     }, [addToTimeline]);
-    const handleCommandError = React.useCallback((error) => {
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            if (first.name === ComponentName.Command) {
-                addToTimeline(markAsDone(first), createFeedback(FeedbackType.Failed, FeedbackMessages.UnexpectedError, error));
-            }
-            exitApp(1);
-            return [];
-        });
-    }, [addToTimeline]);
+    const handleCommandError = React.useCallback((error) => setQueue(createCommandErrorHandler(addToTimeline)(error)), [addToTimeline]);
     const handleAborted = React.useCallback((operationName) => {
         setQueue((currentQueue) => {
             if (currentQueue.length === 0)
@@ -76,181 +71,31 @@ export const Main = ({ app, command }) => {
             return [];
         });
     }, [addToTimeline]);
-    const handleConfigAborted = React.useCallback(() => {
-        handleAborted('Configuration');
-    }, [handleAborted]);
-    const handlePlanAborted = React.useCallback(() => {
-        handleAborted('Task selection');
-    }, [handleAborted]);
-    const createPlanAbortHandler = React.useCallback((tasks) => {
-        const allIntrospect = tasks.every((task) => task.type === TaskType.Introspect);
-        if (allIntrospect) {
-            return () => handleAborted('Introspection');
-        }
-        return handlePlanAborted;
-    }, [handleAborted, handlePlanAborted]);
-    const handleCommandAborted = React.useCallback(() => {
-        handleAborted('Request');
-    }, [handleAborted]);
+    const handleConfigAborted = React.useCallback(createConfigAbortedHandler(handleAborted), [handleAborted]);
+    const handlePlanAborted = React.useCallback(createPlanAbortedHandler(handleAborted), [handleAborted]);
+    const createPlanAbortHandler = React.useCallback(createPlanAbortHandlerFactory(handleAborted, handlePlanAborted), [handleAborted, handlePlanAborted]);
+    const handleCommandAborted = React.useCallback(createCommandAbortedHandler(handleAborted), [handleAborted]);
     const handleRefinementAborted = React.useCallback(() => {
         handleAborted('Plan refinement');
     }, [handleAborted]);
-    const handleIntrospectAborted = React.useCallback(() => {
-        handleAborted('Introspection');
-    }, [handleAborted]);
-    const handleIntrospectError = React.useCallback((error) => {
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            if (first.name === ComponentName.Introspect) {
-                addToTimeline(markAsDone(first), createFeedback(FeedbackType.Failed, FeedbackMessages.UnexpectedError, error));
-            }
-            exitApp(1);
-            return [];
-        });
-    }, [addToTimeline]);
-    const handleIntrospectComplete = React.useCallback((message, capabilities) => {
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            if (first.name === ComponentName.Introspect) {
-                // Don't add the Introspect component to timeline (it renders null)
-                // Only add the Report component
-                addToTimeline(createReportDefinition(message, capabilities));
-            }
-            exitApp(0);
-            return [];
-        });
-    }, [addToTimeline]);
-    const handleExecutionConfirmed = React.useCallback(() => {
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            if (first.name === ComponentName.Confirm) {
-                // Find the most recent Plan in timeline to get tasks
-                const currentTimeline = timelineRef.current;
-                const lastPlanIndex = [...currentTimeline]
-                    .reverse()
-                    .findIndex((item) => item.name === ComponentName.Plan);
-                const lastPlan = lastPlanIndex >= 0
-                    ? currentTimeline[currentTimeline.length - 1 - lastPlanIndex]
-                    : null;
-                const tasks = lastPlan &&
-                    lastPlan.name === ComponentName.Plan &&
-                    'props' in lastPlan &&
-                    lastPlan.props &&
-                    'tasks' in lastPlan.props &&
-                    Array.isArray(lastPlan.props.tasks)
-                    ? lastPlan.props.tasks
-                    : [];
-                const allIntrospect = tasks.every((task) => task.type === TaskType.Introspect);
-                if (allIntrospect && tasks.length > 0) {
-                    // Execute introspection
-                    addToTimeline(markAsDone(first));
-                    return [
-                        createIntrospectDefinition(tasks, service, handleIntrospectError, handleIntrospectComplete, handleIntrospectAborted),
-                    ];
-                }
-                else {
-                    // Regular execution - just exit for now
-                    addToTimeline(markAsDone(first));
-                    exitApp(0);
-                    return [];
-                }
-            }
-            exitApp(0);
-            return [];
-        });
-    }, [
+    const handleIntrospectAborted = React.useCallback(createIntrospectAbortedHandler(handleAborted), [handleAborted]);
+    const handleIntrospectError = React.useCallback((error) => setQueue(createIntrospectErrorHandler(addToTimeline)(error)), [addToTimeline]);
+    const handleIntrospectComplete = React.useCallback((message, capabilities) => setQueue(createIntrospectCompleteHandler(addToTimeline)(message, capabilities)), [addToTimeline]);
+    const handleAnswerAborted = React.useCallback(createAnswerAbortedHandler(handleAborted), [handleAborted]);
+    const handleAnswerError = React.useCallback((error) => setQueue(createAnswerErrorHandler(addToTimeline)(error)), [addToTimeline]);
+    const handleAnswerComplete = React.useCallback((answer) => setQueue(createAnswerCompleteHandler(addToTimeline)(answer)), [addToTimeline]);
+    const handleExecutionConfirmed = React.useCallback(() => setQueue(createExecutionConfirmedHandler(timelineRef, addToTimeline, service, handleIntrospectError, handleIntrospectComplete, handleIntrospectAborted, handleAnswerError, handleAnswerComplete, handleAnswerAborted)()), [
         addToTimeline,
         service,
         handleIntrospectError,
         handleIntrospectComplete,
         handleIntrospectAborted,
+        handleAnswerError,
+        handleAnswerComplete,
+        handleAnswerAborted,
     ]);
-    const handleExecutionCancelled = React.useCallback(() => {
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            if (first.name === ComponentName.Confirm) {
-                // Find the most recent Plan in timeline to check task types
-                const currentTimeline = timelineRef.current;
-                const lastPlanIndex = [...currentTimeline]
-                    .reverse()
-                    .findIndex((item) => item.name === ComponentName.Plan);
-                const lastPlan = lastPlanIndex >= 0
-                    ? currentTimeline[currentTimeline.length - 1 - lastPlanIndex]
-                    : null;
-                const allIntrospect = lastPlan &&
-                    lastPlan.name === ComponentName.Plan &&
-                    'props' in lastPlan &&
-                    lastPlan.props &&
-                    'tasks' in lastPlan.props &&
-                    Array.isArray(lastPlan.props.tasks) &&
-                    lastPlan.props.tasks.every((task) => task.type === TaskType.Introspect);
-                const operation = allIntrospect ? 'introspection' : 'execution';
-                addToTimeline(markAsDone(first), createFeedback(FeedbackType.Aborted, getCancellationMessage(operation)));
-            }
-            exitApp(0);
-            return [];
-        });
-    }, [addToTimeline]);
-    const handlePlanSelectionConfirmed = React.useCallback(async (selectedTasks) => {
-        // Mark current plan as done and add refinement to queue
-        let refinementDef = null;
-        refinementDef = createRefinement(getRefiningMessage(), handleRefinementAborted);
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            if (first.name === ComponentName.Plan) {
-                addToTimeline(markAsDone(first));
-            }
-            // Add refinement to queue so it becomes the active component
-            return [refinementDef];
-        });
-        // Process refined command in background
-        try {
-            const refinedCommand = selectedTasks
-                .map((task) => {
-                const action = task.action.toLowerCase().replace(/,/g, ' -');
-                const type = task.type || 'execute';
-                return `${action} (type: ${type})`;
-            })
-                .join(', ');
-            const result = await service.processWithTool(refinedCommand, 'plan');
-            // Mark refinement as done and move to timeline
-            setQueue((currentQueue) => {
-                if (currentQueue.length > 0 &&
-                    currentQueue[0].id === refinementDef.id) {
-                    addToTimeline(markAsDone(currentQueue[0]));
-                }
-                return [];
-            });
-            // Show final execution plan with confirmation
-            const planDefinition = createPlanDefinition(result.message, result.tasks, createPlanAbortHandler(result.tasks), undefined);
-            const confirmDefinition = createConfirmDefinition(handleExecutionConfirmed, handleExecutionCancelled);
-            addToTimeline(planDefinition);
-            setQueue([confirmDefinition]);
-        }
-        catch (error) {
-            const errorMessage = error instanceof Error ? error.message : 'Unknown error occurred';
-            // Mark refinement as done and move to timeline before showing error
-            setQueue((currentQueue) => {
-                if (currentQueue.length > 0 &&
-                    currentQueue[0].id === refinementDef.id) {
-                    addToTimeline(markAsDone(currentQueue[0]));
-                }
-                return [];
-            });
-            addToTimeline(createFeedback(FeedbackType.Failed, FeedbackMessages.UnexpectedError, errorMessage));
-            exitApp(1);
-        }
-    }, [
+    const handleExecutionCancelled = React.useCallback(() => setQueue(createExecutionCancelledHandler(timelineRef, addToTimeline)()), [addToTimeline]);
+    const handlePlanSelectionConfirmed = React.useCallback(createPlanSelectionConfirmedHandler(addToTimeline, service, handleRefinementAborted, createPlanAbortHandler, handleExecutionConfirmed, handleExecutionCancelled, setQueue), [
         addToTimeline,
         service,
         handleRefinementAborted,
@@ -258,62 +103,20 @@ export const Main = ({ app, command }) => {
         handleExecutionConfirmed,
         handleExecutionCancelled,
     ]);
-    const handleCommandComplete = React.useCallback((message, tasks) => {
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first] = currentQueue;
-            // Check if tasks contain a Define task that requires user interaction
-            const hasDefineTask = tasks.some((task) => task.type === TaskType.Define);
-            if (first.name === ComponentName.Command) {
-                const planDefinition = createPlanDefinition(message, tasks, createPlanAbortHandler(tasks), hasDefineTask ? handlePlanSelectionConfirmed : undefined);
-                if (hasDefineTask) {
-                    // Don't exit - keep the plan in the queue for interaction
-                    addToTimeline(markAsDone(first));
-                    return [planDefinition];
-                }
-                else {
-                    // No define task - show plan and confirmation
-                    const confirmDefinition = createConfirmDefinition(handleExecutionConfirmed, handleExecutionCancelled);
-                    addToTimeline(markAsDone(first), planDefinition);
-                    return [confirmDefinition];
-                }
-            }
-            exitApp(0);
-            return [];
-        });
-    }, [
+    const handleCommandComplete = React.useCallback((message, tasks) => setQueue(createCommandCompleteHandler(addToTimeline, createPlanAbortHandler, handlePlanSelectionConfirmed, handleExecutionConfirmed, handleExecutionCancelled)(message, tasks)), [
         addToTimeline,
         createPlanAbortHandler,
         handlePlanSelectionConfirmed,
         handleExecutionConfirmed,
         handleExecutionCancelled,
     ]);
-    const handleConfigFinished = React.useCallback((config) => {
-        const anthropicConfig = config;
-        saveAnthropicConfig(anthropicConfig);
-        const newService = createAnthropicService(anthropicConfig);
-        setService(newService);
-        // Complete config component and add command if present
-        setQueue((currentQueue) => {
-            if (currentQueue.length === 0)
-                return currentQueue;
-            const [first, ...rest] = currentQueue;
-            if (first.name === ComponentName.Config) {
-                addToTimeline(markAsDone(first), createFeedback(FeedbackType.Succeeded, FeedbackMessages.ConfigurationComplete));
-            }
-            // Add command to queue if we have one
-            if (command) {
-                return [
-                    ...rest,
-                    createCommandDefinition(command, newService, handleCommandError, handleCommandComplete, handleCommandAborted),
-                ];
-            }
-            // No command - exit after showing completion message
-            exitApp(0);
-            return rest;
-        });
-    }, [addToTimeline, command, handleCommandError, handleCommandComplete]);
+    const handleConfigFinished = React.useCallback((config) => setQueue(createConfigFinishedHandler(addToTimeline, command, handleCommandError, handleCommandComplete, handleCommandAborted, setService)(config)), [
+        addToTimeline,
+        command,
+        handleCommandError,
+        handleCommandComplete,
+        handleCommandAborted,
+    ]);
     // Initialize queue on mount
     React.useEffect(() => {
         const hasConfig = !!service;