From 50afa105ceb7e2ae36de9cd45ae92f84b7f179fd Mon Sep 17 00:00:00 2001 From: Connor Yoh Date: Wed, 20 Aug 2025 18:47:34 +0100 Subject: [PATCH] Restructure automate --- .../{ToolSequence.tsx => AutomationRun.tsx} | 55 ++++++++----------- frontend/src/tools/Automate.tsx | 40 +++++++++----- 2 files changed, 48 insertions(+), 47 deletions(-) rename frontend/src/components/tools/automate/{ToolSequence.tsx => AutomationRun.tsx} (86%) diff --git a/frontend/src/components/tools/automate/ToolSequence.tsx b/frontend/src/components/tools/automate/AutomationRun.tsx similarity index 86% rename from frontend/src/components/tools/automate/ToolSequence.tsx rename to frontend/src/components/tools/automate/AutomationRun.tsx index e16985163..8bab5425b 100644 --- a/frontend/src/components/tools/automate/ToolSequence.tsx +++ b/frontend/src/components/tools/automate/AutomationRun.tsx @@ -1,11 +1,11 @@ import React, { useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { - Button, - Text, - Title, - Stack, - Group, +import { + Button, + Text, + Title, + Stack, + Group, ActionIcon, Progress, Card, @@ -17,7 +17,7 @@ import CheckIcon from '@mui/icons-material/Check'; import ErrorIcon from '@mui/icons-material/Error'; import { useFileContext } from '../../../contexts/FileContext'; -interface ToolSequenceProps { +interface AutomationRunProps { automation: any; onBack: () => void; onComplete: () => void; @@ -31,7 +31,7 @@ interface ExecutionStep { error?: string; } -export default function ToolSequence({ automation, onBack, onComplete }: ToolSequenceProps) { +export default function AutomationRun({ automation, onBack, onComplete }: AutomationRunProps) { const { t } = useTranslation(); const { activeFiles } = useFileContext(); const [isExecuting, setIsExecuting] = useState(false); @@ -63,28 +63,28 @@ export default function ToolSequence({ automation, onBack, onComplete }: ToolSeq try { for (let i = 0; i < executionSteps.length; i++) { setCurrentStepIndex(i); - + // Update step status to running - setExecutionSteps(prev => prev.map((step, idx) => + setExecutionSteps(prev => prev.map((step, idx) => idx === i ? { ...step, status: 'running' } : step )); // Simulate step execution (replace with actual tool execution) await new Promise(resolve => setTimeout(resolve, 2000)); - + // Update step status to completed - setExecutionSteps(prev => prev.map((step, idx) => + setExecutionSteps(prev => prev.map((step, idx) => idx === i ? { ...step, status: 'completed' } : step )); } setCurrentStepIndex(-1); setIsExecuting(false); - + // All steps completed - show success } catch (error) { // Handle error - setExecutionSteps(prev => prev.map((step, idx) => + setExecutionSteps(prev => prev.map((step, idx) => idx === currentStepIndex ? { ...step, status: 'error', error: error?.toString() } : step )); setIsExecuting(false); @@ -114,15 +114,6 @@ export default function ToolSequence({ automation, onBack, onComplete }: ToolSeq return (
- - - {t('automate.sequence.title', 'Tool Sequence')} - - - - - - {/* Automation Info */} @@ -145,9 +136,9 @@ export default function ToolSequence({ automation, onBack, onComplete }: ToolSeq {isExecuting && (
- {t('automate.sequence.progress', 'Progress: {{current}}/{{total}}', { - current: currentStepIndex + 1, - total: executionSteps.length + {t('automate.sequence.progress', 'Progress: {{current}}/{{total}}', { + current: currentStepIndex + 1, + total: executionSteps.length })} @@ -161,11 +152,11 @@ export default function ToolSequence({ automation, onBack, onComplete }: ToolSeq {index + 1} - + {getStepIcon(step)} - +
- @@ -189,8 +180,8 @@ export default function ToolSequence({ automation, onBack, onComplete }: ToolSeq disabled={isExecuting || !activeFiles || activeFiles.length === 0} loading={isExecuting} > - {isExecuting - ? t('automate.sequence.running', 'Running Automation...') + {isExecuting + ? t('automate.sequence.running', 'Running Automation...') : t('automate.sequence.run', 'Run Automation') } @@ -216,4 +207,4 @@ export default function ToolSequence({ automation, onBack, onComplete }: ToolSeq
); -} \ No newline at end of file +} diff --git a/frontend/src/tools/Automate.tsx b/frontend/src/tools/Automate.tsx index 49feb09c1..3919eaa20 100644 --- a/frontend/src/tools/Automate.tsx +++ b/frontend/src/tools/Automate.tsx @@ -6,7 +6,7 @@ import { useToolFileSelection } from "../contexts/FileSelectionContext"; import { createToolFlow } from "../components/tools/shared/createToolFlow"; import AutomationSelection from "../components/tools/automate/AutomationSelection"; import AutomationCreation, { AutomationMode } from "../components/tools/automate/AutomationCreation"; -import ToolSequence from "../components/tools/automate/ToolSequence"; +import AutomationRun from "../components/tools/automate/AutomationRun"; import { useAutomateOperation } from "../hooks/tools/automate/useAutomateOperation"; import { BaseToolProps } from "../types/tool"; @@ -18,11 +18,12 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => { const { setCurrentMode } = useFileContext(); const { selectedFiles } = useToolFileSelection(); - const [currentStep, setCurrentStep] = useState<'selection' | 'creation' | 'sequence'>('selection'); + const [currentStep, setCurrentStep] = useState<'selection' | 'creation' | 'run'>('selection'); const [stepData, setStepData] = useState({}); const automateOperation = useAutomateOperation(); const toolRegistry = useFlatToolRegistry(); + const hasResults = automateOperation.files.length > 0 || automateOperation.downloadUrl !== null; const { savedAutomations, deleteAutomation } = useSavedAutomations(); const handleStepChange = (data: any) => { @@ -44,7 +45,7 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => { handleStepChange({ step: 'creation', mode: AutomationMode.CREATE })} - onRun={(automation: any) => handleStepChange({ step: 'sequence', automation })} + onRun={(automation: any) => handleStepChange({ step: 'run', automation })} onEdit={(automation: any) => handleStepChange({ step: 'creation', mode: AutomationMode.EDIT, automation })} onDelete={async (automation: any) => { try { @@ -63,16 +64,16 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => { mode={stepData.mode} existingAutomation={stepData.automation} onBack={() => handleStepChange({ step: 'selection' })} - onComplete={(automation: any) => handleStepChange({ step: 'sequence', automation })} + onComplete={() => handleStepChange({ step: 'selection' })} toolRegistry={toolRegistry} /> ); - case 'sequence': + case 'run': return ( - handleStepChange({ step: 'creation', mode: stepData.mode, automation: stepData.automation })} + onBack={() => handleStepChange({ step: 'selection'})} onComplete={handleComplete} /> ); @@ -85,24 +86,33 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => { return createToolFlow({ files: { selectedFiles: [], - isCollapsed: true, // Hide files step for automate tool - placeholder: t('automate.filesHidden', 'Files will be selected during automation execution') + isCollapsed: hasResults, // Hide files step for automate tool }, steps: [ { - title: t('automate.stepTitle', 'Automations'), + title: t('automate.selection.title', 'Automation Selection'), isVisible: true, - onCollapsedClick: ()=> setCurrentStep('selection'), + isCollapsed: currentStep !== 'selection', + onCollapsedClick: () => setCurrentStep('selection'), content: currentStep === 'selection' ? renderCurrentStep() : null }, { - title: t('automate.sequenceTitle', 'Tool Sequence'), - isVisible: currentStep === 'creation' || currentStep === 'sequence', - content: currentStep === 'creation' || currentStep === 'sequence' ? renderCurrentStep() : null + title: stepData.mode === AutomationMode.EDIT + ? t('automate.creation.editTitle', 'Edit Automation') + : t('automate.creation.createTitle', 'Create Automation'), + isVisible: currentStep === 'creation', + isCollapsed: false, + content: currentStep === 'creation' ? renderCurrentStep() : null + }, + { + title: t('automate.run.title', 'Run Automation'), + isVisible: currentStep === 'run', + isCollapsed: false, + content: currentStep === 'run' ? renderCurrentStep() : null } ], review: { - isVisible: false, // Hide review step for automate tool + isVisible: hasResults, // Hide review step for automate tool operation: automateOperation, title: t('automate.reviewTitle', 'Automation Results') }