Task validation now returns it's state when navigating away from the tab.

src/modules/manager/workflowTemplates/WorkflowTemplateDetails.tsx

@@ -30,6 +30,10 @@ const WorkflowTemplateDetails: React.FC<{ editMode: boolean }> = ({
   const { userId } = useParams<{ userId: string }>();
   const [activeTab, setActiveTab] = React.useState("general");
 
+  const [taskValidation, setTaskValidation] = useState<Record<string, boolean>>(
+    {},
+  );
+
   // useForm promoted to the parent
   const form = useFormWithGuard({
     loaded: false,
@@ -124,11 +128,21 @@ const WorkflowTemplateDetails: React.FC<{ editMode: boolean }> = ({
     form.handleSubmit(e, doSubmit);
   };
 
-  const [tasksValid, setTasksValid] = useState(true);
+  //const [tasksValid, setTasksValid] = useState(true);
 
-  const handleTasksValidate = (isValid: boolean) => {
-    console.log("Test", isValid);
-    setTasksValid(isValid);
+  const handleTaskValidate = (taskId: string, isValid: boolean) => {
+    setTaskValidation((prev) => {
+      const updated = { ...prev, [taskId]: isValid };
+
+      // Compute overall validity
+      //const allValid = Object.values(updated).every((v) => v === true);
+
+      // Bubble up to parent
+      //setTasksValid(allValid);
+      //setTaskValidation(updated);
+
+      return updated;
+    });
   };
 
   const { loaded, redirect, errors: formErrors, data } = form.state;
@@ -136,10 +150,6 @@ const WorkflowTemplateDetails: React.FC<{ editMode: boolean }> = ({
 
   let errors = { ...formErrors };
 
-  if (!tasksValid) {
-    errors["tasks"] = t("TasksValidationError");
-  }
-
   const generalTabValid = !(
     errors["domainId"] ||
     errors["name"] ||
@@ -147,6 +157,12 @@ const WorkflowTemplateDetails: React.FC<{ editMode: boolean }> = ({
     errors["description"]
   );
 
+  const tasksValid = Object.values(taskValidation).every((v) => v === true);
+
+  if (!tasksValid) {
+    errors["tasks"] = t("TasksValidationError");
+  }
+
   // -----------------------------
   // Tabs
   // -----------------------------
@@ -172,7 +188,8 @@ const WorkflowTemplateDetails: React.FC<{ editMode: boolean }> = ({
         errors={errors}
         isEditMode={editMode}
         onTasksChange={form.handleTasksChange}
-        onValidate={handleTasksValidate}
+        onValidate={handleTaskValidate}
+        taskValidation={taskValidation}
       />
     </Tab>,
 

src/modules/manager/workflowTemplates/components/TasksEditor.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { TaskDefinition } from "../services/WorkflowTemplateService";
 import { TaskCoreEditor } from "./CapabilityEditors/TaskCoreEditor";
 

src/modules/manager/workflowTemplates/components/TasksTab.tsx

@@ -11,7 +11,8 @@ interface TasksTabProps {
   errors: Record<string, string>;
   isEditMode: boolean;
   onTasksChange: (name: string, value: TaskDefinition[]) => void;
-  onValidate: (isValid: boolean) => void;
+  onValidate: (taskId: string, isValid: boolean) => void;
+  taskValidation: Record<string, boolean>;
 }
 
 const TasksTab: React.FC<TasksTabProps> = ({
@@ -20,26 +21,10 @@ const TasksTab: React.FC<TasksTabProps> = ({
   isEditMode,
   onTasksChange,
   onValidate,
+  taskValidation,
 }) => {
   const tasks = data.tasks;
   const [selectedTask, setSelectedTask] = useState<TaskDefinition | null>(null);
-  const [taskValidation, setTaskValidation] = useState<Record<string, boolean>>(
-    {},
-  );
-
-  const handleTaskValidate = (taskId: string, isValid: boolean) => {
-    setTaskValidation((prev) => {
-      const updated = { ...prev, [taskId]: isValid };
-
-      // Compute overall validity
-      const allValid = Object.values(updated).every((v) => v === true);
-
-      // Bubble up to parent
-      onValidate(allValid);
-
-      return updated;
-    });
-  };
 
   useEffect(() => {
     if (tasks.length === 0) {
@@ -72,6 +57,29 @@ const TasksTab: React.FC<TasksTabProps> = ({
     }
   }, [tasks, selectedTask]);
 
+  useEffect(() => {
+    // Don't override user selection
+    if (selectedTask) return;
+
+    if (tasks.length === 0) {
+      setSelectedTask(null);
+      return;
+    }
+
+    // Find first invalid task
+    const firstInvalid = tasks.find(
+      (t) => taskValidation[t.config.guid as string] === false,
+    );
+
+    if (firstInvalid) {
+      setSelectedTask(firstInvalid);
+      return;
+    }
+
+    // Otherwise select first task
+    setSelectedTask(tasks[0]);
+  }, [tasks, taskValidation, selectedTask]);
+
   const handleTasksChange = (newTasks: TaskDefinition[]) => {
     // Update the parent form state
     onTasksChange("tasks", newTasks);
@@ -102,7 +110,7 @@ const TasksTab: React.FC<TasksTabProps> = ({
             handleTasksChange(newTasks);
             setSelectedTask(updatedTask);
           }}
-          onValidate={handleTaskValidate}
+          onValidate={onValidate}
         />
       )}
     </div>