feat: group actions by type

This commit is contained in:
amhsirak
2025-10-27 17:58:28 +05:30
parent 7e0ea38635
commit 158347bf90

View File

@@ -536,48 +536,87 @@ export const RobotEditPage = ({ handleStart }: RobotSettingsProps) => {
}; };
const renderActionNameFields = () => { const renderActionNameFields = () => {
if (!robot || !robot.recording || !robot.recording.workflow) return null; if (!robot || !robot.recording || !robot.recording.workflow) return null;
const editableActions = new Set(['screenshot', 'scrapeList', 'scrapeSchema']); const editableActions = new Set(['screenshot', 'scrapeList', 'scrapeSchema']);
const inputs: JSX.Element[] = []; const textInputs: JSX.Element[] = [];
const screenshotInputs: JSX.Element[] = [];
const listInputs: JSX.Element[] = [];
robot.recording.workflow.forEach((pair, pairIndex) => { robot.recording.workflow.forEach((pair, pairIndex) => {
if (!pair.what) return; if (!pair.what) return;
pair.what.forEach((action, actionIndex) => { pair.what.forEach((action, actionIndex) => {
// Only show editable name inputs for meaningful action types if (!editableActions.has(String(action.action))) return;
if (!editableActions.has(String(action.action))) return;
// derive current name from possible fields const currentName =
const currentName = action.name ||
action.name || (action.args && action.args[0] && typeof action.args[0] === 'object' && action.args[0].__name) ||
(action.args && action.args[0] && typeof action.args[0] === 'object' && action.args[0].__name) || '';
'';
inputs.push( const textField = (
<TextField <TextField
key={`action-name-${pairIndex}-${actionIndex}`} key={`action-name-${pairIndex}-${actionIndex}`}
type="text" type="text"
value={currentName} value={currentName}
onChange={(e) => handleActionNameChange(pairIndex, actionIndex, e.target.value)} onChange={(e) => handleActionNameChange(pairIndex, actionIndex, e.target.value)}
style={{ marginBottom: '12px' }} style={{ marginBottom: '12px' }}
fullWidth fullWidth
/> />
); );
});
switch (action.action) {
case 'scrapeSchema':
textInputs.push(textField);
break;
case 'screenshot':
screenshotInputs.push(textField);
break;
case 'scrapeList':
listInputs.push(textField);
break;
}
}); });
});
if (inputs.length === 0) return null; const hasAnyInputs = textInputs.length > 0 || screenshotInputs.length > 0 || listInputs.length > 0;
if (!hasAnyInputs) return null;
return ( return (
<> <>
<Typography variant="body1" style={{ marginBottom: '10px', marginTop: '20px' }}> <Typography variant="body1" style={{ marginBottom: '10px', marginTop: '20px' }}>
{t('Actions')} {t('Actions')}
</Typography> </Typography>
{inputs}
</> {textInputs.length > 0 && (
); <>
}; <Typography variant="subtitle1" style={{ marginBottom: '8px' }}>
Texts
</Typography>
{textInputs}
</>
)}
{screenshotInputs.length > 0 && (
<>
<Typography variant="subtitle1" style={{ marginBottom: '8px', marginTop: textInputs.length > 0 ? '16px' : '0' }}>
Screenshots
</Typography>
{screenshotInputs}
</>
)}
{listInputs.length > 0 && (
<>
<Typography variant="subtitle1" style={{ marginBottom: '8px', marginTop: (textInputs.length > 0 || screenshotInputs.length > 0) ? '16px' : '0' }}>
Lists
</Typography>
{listInputs}
</>
)}
</>
);
};
const renderCredentialFields = ( const renderCredentialFields = (
selectors: string[], selectors: string[],