make js Task interface act more like ProcessInstanceTask w/ burnettk

spiffworkflow-backend/src/spiffworkflow_backend/models/task.py

@@ -84,6 +84,7 @@ class TaskModel(SpiffworkflowBaseDBModel):
     type: Optional[str] = None
     can_complete: Optional[bool] = None
     extensions: Optional[dict] = None
+    name_for_display: Optional[str] = None
 
     def get_data(self) -> dict:
         return {**self.python_env_data(), **self.json_data()}

spiffworkflow-backend/src/spiffworkflow_backend/routes/tasks_controller.py

@@ -312,6 +312,7 @@ def task_show(process_instance_id: int, task_guid: str = "next") -> flask.wrappe
     task_model.type = task_definition.typename
     task_model.can_complete = can_complete
     task_process_identifier = task_model.bpmn_process.bpmn_process_definition.bpmn_identifier
+    task_model.name_for_display = TaskService.get_name_for_display(task_definition)
 
     process_model_with_form = process_model
 

spiffworkflow-frontend/src/interfaces.ts

@@ -41,6 +41,7 @@ export interface EventDefinition {
 export interface Task {
   id: number;
   guid: string;
+  process_instance_id: number;
   bpmn_identifier: string;
   bpmn_name?: string;
   bpmn_process_direct_parent_guid: string;
@@ -52,6 +53,13 @@ export interface Task {
   task_definition_properties_json: TaskDefinitionPropertiesJson;
 
   event_definition?: EventDefinition;
+
+  process_model_display_name: string;
+  process_model_identifier: string;
+  name_for_display: string;
+  can_complete: boolean;
+  form_schema: any;
+  form_ui_schema: any;
 }
 
 export interface ProcessInstanceTask {

spiffworkflow-frontend/src/routes/TaskShow.tsx

@@ -18,7 +18,7 @@ import Form from '../themes/carbon';
 import HttpService from '../services/HttpService';
 import useAPIError from '../hooks/UseApiError';
 import { modifyProcessIdentifierForPathParam } from '../helpers';
-import { ProcessInstanceTask } from '../interfaces';
+import { Task } from '../interfaces';
 import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
 import InstructionsForEndUser from '../components/InstructionsForEndUser';
 
@@ -95,7 +95,7 @@ enum FormSubmitType {
 }
 
 export default function TaskShow() {
-  const [task, setTask] = useState<ProcessInstanceTask | null>(null);
+  const [task, setTask] = useState<Task | null>(null);
   const [userTasks] = useState(null);
   const params = useParams();
   const navigate = useNavigate();
@@ -105,7 +105,7 @@ export default function TaskShow() {
 
   const { addError, removeError } = useAPIError();
 
-  const navigateToInterstitial = (myTask: ProcessInstanceTask) => {
+  const navigateToInterstitial = (myTask: Task) => {
     navigate(
       `/process/${modifyProcessIdentifierForPathParam(
         myTask.process_model_identifier
@@ -114,7 +114,7 @@ export default function TaskShow() {
   };
 
   useEffect(() => {
-    const processResult = (result: ProcessInstanceTask) => {
+    const processResult = (result: Task) => {
       setTask(result);
       setDisabled(false);
       if (!result.can_complete) {
@@ -206,7 +206,7 @@ export default function TaskShow() {
         const taskUrl = `/tasks/${params.process_instance_id}/${userTask.id}`;
         if (userTask.id === params.task_id) {
           selectedTabIndex = index;
-          return <Tab selected>{userTask.title}</Tab>;
+          return <Tab selected>{userTask.name_for_display}</Tab>;
         }
         if (userTask.state === 'COMPLETED') {
           return (
@@ -214,12 +214,12 @@ export default function TaskShow() {
               onClick={() => navigate(taskUrl)}
               data-qa={`form-nav-${userTask.name}`}
             >
-              {userTask.title}
+              {userTask.name_for_display}
             </Tab>
           );
         }
         if (userTask.state === 'FUTURE') {
-          return <Tab disabled>{userTask.title}</Tab>;
+          return <Tab disabled>{userTask.name_for_display}</Tab>;
         }
         if (userTask.state === 'READY') {
           return (
@@ -227,7 +227,7 @@ export default function TaskShow() {
               onClick={() => navigate(taskUrl)}
               data-qa={`form-nav-${userTask.name}`}
             >
-              {userTask.title}
+              {userTask.name_for_display}
             </Tab>
           );
         }
@@ -297,7 +297,7 @@ export default function TaskShow() {
     let taskData = task.data;
     let jsonSchema = task.form_schema;
     let reactFragmentToHideSubmitButton = null;
-    if (task.type === 'ManualTask') {
+    if (task.typename === 'ManualTask') {
       taskData = {};
       jsonSchema = {
         type: 'object',
@@ -333,9 +333,9 @@ export default function TaskShow() {
     if (task.state === 'READY') {
       let submitButtonText = 'Submit';
       let saveAsDraftButton = null;
-      if (task.type === 'ManualTask') {
+      if (task.typename === 'ManualTask') {
         submitButtonText = 'Continue';
-      } else if (task.type === 'UserTask') {
+      } else if (task.typename === 'UserTask') {
         saveAsDraftButton = (
           <Button
             id="save-as-draft-button"
@@ -404,12 +404,13 @@ export default function TaskShow() {
                 task.process_model_identifier
               )}/${params.process_instance_id}`,
             ],
-            [`Task: ${task.title || task.id}`],
+            [`Task: ${task.name_for_display || task.id}`],
           ]}
         />
         <div>{buildTaskNavigation()}</div>
         <h3>
-          Task: {task.title} ({task.process_model_display_name}){statusString}
+          Task: {task.name_for_display} ({task.process_model_display_name})
+          {statusString}
         </h3>
         <InstructionsForEndUser task={task} />
         {formElement()}