devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

on workflow builder, only render steps if name and entity are set. reset workflow on entity reset.

Browse Source
This commit is contained in:
Joao Correia
2025-01-23 22:56:45 +00:00
parent c921d54d50
commit dcd25465fd
2 changed files with 74 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
src/components/ApprovalWorkflows/WorkflowForm.tsx
View File

@@ -44,7 +44,7 @@ export default function WorkflowForm({ workflow, onWorkflowChange, entityTeacher
setStepCounter((count) => count + 1); setStepCounter((count) => count + 1);
const updatedSteps = [ const updatedSteps = [
...workflow.steps.slice(0, -1), ...workflow.steps.slice(0, -1),
newStep, newStep,
lastStep lastStep
]; ];
@@ -95,66 +95,69 @@ export default function WorkflowForm({ workflow, onWorkflowChange, entityTeacher
onWorkflowChange({ ...workflow, steps: renumberSteps(newOrder) }); onWorkflowChange({ ...workflow, steps: renumberSteps(newOrder) });
}; };
return ( return (
<div className="flex flex-col gap-6"> <>
<Button {workflow.entityId && workflow.name &&
color="purple" <div className="flex flex-col gap-6">
variant="solid" <Button
onClick={addStep} color="purple"
type="button" variant="solid"
className="max-w-fit text-lg font-medium flex items-center gap-2 text-left mb-9" onClick={addStep}
> type="button"
<IoIosAddCircleOutline className="size-6" /> className="max-w-fit text-lg font-medium flex items-center gap-2 text-left mb-9"
Add Step >
</Button> <IoIosAddCircleOutline className="size-6" />
Add Step
</Button>
<Reorder.Group <Reorder.Group
axis="y" axis="y"
values={workflow.steps} values={workflow.steps}
onReorder={handleReorder} onReorder={handleReorder}
className="flex flex-col gap-0" className="flex flex-col gap-0"
> >
<AnimatePresence>
<AnimatePresence> {workflow.steps.map((step, index) => (
{workflow.steps.map((step, index) => ( <Reorder.Item
<Reorder.Item key={step.key}
key={step.key} value={step}
value={step} variants={itemVariants}
variants={itemVariants} initial="initial"
initial="initial" animate="animate"
animate="animate" exit="exit"
exit="exit" transition={{ duration: 0.3 }}
transition={{ duration: 0.3 }} layout
layout drag={!(step.firstStep || step.finalStep)}
drag={!(step.firstStep || step.finalStep)}
>
<WorkflowEditableStepComponent
stepNumber={index + 1}
assignees={step.assignees}
finalStep={step.finalStep}
onDelete={() => handleDelete(step.key)}
onSelectChange={(numberOfSelects, idx, option) => handleSelectChange(step.key, numberOfSelects, idx, option)}
entityTeachers={entityTeachers}
entityCorporates={entityCorporates}
/>
{step.finalStep &&
<Button
type="submit"
color="purple"
variant="solid"
className="max-w-fit text-lg font-medium flex items-center gap-2 text-left mt-7"
> >
<FaRegCheckCircle className="size-5" />
Confirm Exam Workflow Pipeline
</Button>
}
</Reorder.Item>
))}
</AnimatePresence>
</Reorder.Group>
</div>
<WorkflowEditableStepComponent
stepNumber={index + 1}
assignees={step.assignees}
finalStep={step.finalStep}
onDelete={() => handleDelete(step.key)}
onSelectChange={(numberOfSelects, idx, option) => handleSelectChange(step.key, numberOfSelects, idx, option)}
entityTeachers={entityTeachers}
entityCorporates={entityCorporates}
/>
{step.finalStep &&
<Button
type="submit"
color="purple"
variant="solid"
className="max-w-fit text-lg font-medium flex items-center gap-2 text-left mt-7"
>
<FaRegCheckCircle className="size-5" />
Confirm Exam Workflow Pipeline
</Button>
}
</Reorder.Item>
))}
</AnimatePresence>
</Reorder.Group>
</div>
}
</>
); );
}; };

15
src/pages/approval-workflows/create.tsx
View File

@@ -51,7 +51,7 @@ interface Props {
export default function Home({ user, userEntitiesWithLabel, userEntitiesTeachers, userEntitiesCorporates }: Props) { export default function Home({ user, userEntitiesWithLabel, userEntitiesTeachers, userEntitiesCorporates }: Props) {
const [workflows, setWorkflows] = useState<ApprovalWorkflow[]>([]); const [workflows, setWorkflows] = useState<ApprovalWorkflow[]>([]);
const [selectedWorkflowId, setSelectedWorkflowId] = useState<string | undefined>(undefined); const [selectedWorkflowId, setSelectedWorkflowId] = useState<string | undefined>(undefined);
const [entityId, setEntityId] = useState<string | undefined>(undefined); const [entityId, setEntityId] = useState<string | null | undefined>(null);
const [entityTeachers, setEntityTeachers] = useState<TeacherUser[]>([]); const [entityTeachers, setEntityTeachers] = useState<TeacherUser[]>([]);
const [entityCorporates, setEntityCorporates] = useState<CorporateUser[]>([]); const [entityCorporates, setEntityCorporates] = useState<CorporateUser[]>([]);
@@ -122,6 +122,11 @@ export default function Home({ user, userEntitiesWithLabel, userEntitiesTeachers
} }
}; };
const handleResetWorkflow = (id: string) => {
setWorkflows(prev => prev.filter(wf => wf.id !== id));
handleAddNewWorkflow();
}
return ( return (
<> <>
<Head> <Head>
@@ -201,6 +206,11 @@ export default function Home({ user, userEntitiesWithLabel, userEntitiesTeachers
/> />
<Select <Select
options={ENTITY_OPTIONS} options={ENTITY_OPTIONS}
value={
currentWorkflow.entityId === ""
? null
: ENTITY_OPTIONS.find(option => option.value === currentWorkflow.entityId)
}
onChange={(selectedEntity) => { onChange={(selectedEntity) => {
if (selectedEntity?.value) { if (selectedEntity?.value) {
setEntityId(selectedEntity.value); setEntityId(selectedEntity.value);
@@ -209,6 +219,9 @@ export default function Home({ user, userEntitiesWithLabel, userEntitiesTeachers
entityId: selectedEntity.value, entityId: selectedEntity.value,
}; };
onWorkflowChange(updatedWorkflow); onWorkflowChange(updatedWorkflow);
} else if (selectedEntity === null) {
if (!confirm("Clearing entity will reset this workflow. Are you sure you want to proceed?")) return;
handleResetWorkflow(currentWorkflow.id);
} }
}} }}
isClearable isClearable