updated text on home page w/ burnettk

spiffworkflow-backend/src/spiffworkflow_backend/services/process_instance_report_service.py

@@ -422,7 +422,7 @@ class ProcessInstanceReportService:
         for process_instance_dict in process_instance_dicts:
             assigned_user = aliased(UserModel)
             human_task_query = (
-                HumanTaskModel.query.filter_by(process_instance_id=process_instance_dict['id'])
+                HumanTaskModel.query.filter_by(process_instance_id=process_instance_dict['id'], completed=False)
                 .group_by(HumanTaskModel.id)
                 .outerjoin(
                     HumanTaskUserModel,

spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx

@@ -1303,26 +1303,25 @@ export default function ProcessInstanceListTable({
     );
   };
 
-  const buildTable = () => {
+  const getWaitingForTableCellComponent = (processInstanceTask: any) => {
-    const headerLabels: Record<string, string> = {
+    let fullUsernameString = '';
-      id: 'Id',
+    let shortUsernameString = '';
-      process_model_identifier: 'Process',
+    if (processInstanceTask.potential_owner_usernames) {
-      process_model_display_name: 'Process',
+      fullUsernameString = processInstanceTask.potential_owner_usernames;
-      start_in_seconds: 'Start Time',
+      const usernames =
-      end_in_seconds: 'End Time',
+        processInstanceTask.potential_owner_usernames.split(',');
-      status: 'Status',
+      const firstTwoUsernames = usernames.slice(0, 2);
-      process_initiator_username: 'Started By',
+      if (usernames.length > 2) {
-    };
+        firstTwoUsernames.push('...');
-    const getHeaderLabel = (header: string) => {
-      return headerLabels[header] ?? header;
-    };
-    const headers = reportColumns().map((column: any) => {
-      return getHeaderLabel((column as any).Header);
-    });
-    if (showActionsColumn) {
-      headers.push('Actions');
       }
-
+      shortUsernameString = firstTwoUsernames.join(',');
+    }
+    if (processInstanceTask.assigned_user_group_identifier) {
+      fullUsernameString = processInstanceTask.assigned_user_group_identifier;
+      shortUsernameString = processInstanceTask.assigned_user_group_identifier;
+    }
+    return <span title={fullUsernameString}>{shortUsernameString}</span>;
+  };
   const formatProcessInstanceId = (row: ProcessInstance, id: number) => {
     return <span data-qa="paginated-entity-id">{id}</span>;
   };
@@ -1340,27 +1339,7 @@ export default function ProcessInstanceListTable({
     return value;
   };
 
-    const getWaitingForTableCellComponent = (processInstanceTask: any) => {
+  const formattedColumn = (row: any, column: any) => {
-      let fullUsernameString = '';
-      let shortUsernameString = '';
-      if (processInstanceTask.potential_owner_usernames) {
-        fullUsernameString = processInstanceTask.potential_owner_usernames;
-        const usernames =
-          processInstanceTask.potential_owner_usernames.split(',');
-        const firstTwoUsernames = usernames.slice(0, 2);
-        if (usernames.length > 2) {
-          firstTwoUsernames.push('...');
-        }
-        shortUsernameString = firstTwoUsernames.join(',');
-      }
-      if (processInstanceTask.assigned_user_group_identifier) {
-        fullUsernameString = processInstanceTask.assigned_user_group_identifier;
-        shortUsernameString =
-          processInstanceTask.assigned_user_group_identifier;
-      }
-      return <span title={fullUsernameString}>{shortUsernameString}</span>;
-    };
-
     const reportColumnFormatters: Record<string, any> = {
       id: formatProcessInstanceId,
       process_model_identifier: formatProcessModelIdentifier,
@@ -1369,7 +1348,6 @@ export default function ProcessInstanceListTable({
       end_in_seconds: formatSecondsForDisplay,
       updated_at_in_seconds: formatSecondsForDisplay,
     };
-    const formattedColumn = (row: any, column: any) => {
     const formatter =
       reportColumnFormatters[column.accessor] ?? defaultFormatter;
     const value = row[column.accessor];
@@ -1377,9 +1355,7 @@ export default function ProcessInstanceListTable({
       row.process_model_identifier
     );
     const navigateToProcessInstance = () => {
-        navigate(
+      navigate(`${processInstanceShowPathPrefix}/${modifiedModelId}/${row.id}`);
-          `${processInstanceShowPathPrefix}/${modifiedModelId}/${row.id}`
-        );
     };
     const navigateToProcessModel = () => {
       navigate(`/admin/process-models/${modifiedModelId}`);
@@ -1432,6 +1408,26 @@ export default function ProcessInstanceListTable({
     );
   };
 
+  const buildTable = () => {
+    const headerLabels: Record<string, string> = {
+      id: 'Id',
+      process_model_identifier: 'Process',
+      process_model_display_name: 'Process',
+      start_in_seconds: 'Start Time',
+      end_in_seconds: 'End Time',
+      status: 'Status',
+      process_initiator_username: 'Started By',
+    };
+    const getHeaderLabel = (header: string) => {
+      return headerLabels[header] ?? header;
+    };
+    const headers = reportColumns().map((column: any) => {
+      return getHeaderLabel((column as any).Header);
+    });
+    if (showActionsColumn) {
+      headers.push('Actions');
+    }
+
     const rows = processInstances.map((row: any) => {
       const currentRow = reportColumns().map((column: any) => {
         return formattedColumn(row, column);

spiffworkflow-frontend/src/index.css

@@ -332,10 +332,13 @@ td.actions-cell {
   width: 1em;
 }
 
+.process-instance-table-header {
+  margin-bottom: 1em;
+}
+
 .no-results-message {
   font-style: italic;
   margin-left: 2em;
-  margin-top: 1em;
   font-size: 14px;
 }
 

spiffworkflow-frontend/src/routes/CompletedInstances.tsx

@@ -18,13 +18,12 @@ export default function CompletedInstances() {
     }
 
     return userGroups.map((userGroup: string) => {
+      const titleText = `This is a list of instances with tasks that were completed by the ${userGroup} group.`;
       return (
         <>
-          <h2>With tasks completed by group: {userGroup}</h2>
+          <h2 title={titleText} className="process-instance-table-header">
-          <p className="data-table-description">
+            With tasks completed by <strong>{userGroup}</strong>
-            This is a list of instances with tasks that were completed by the{' '}
+          </h2>
-            {userGroup} group.
-          </p>
           <ProcessInstanceListTable
             filtersEnabled={false}
             paginationQueryParamPrefix="group_completed_instances"
@@ -40,12 +39,19 @@ export default function CompletedInstances() {
     });
   };
 
+  const startedByMeTitleText =
+    'This is a list of instances you started that are now complete.';
+  const withTasksCompletedByMeTitleText =
+    'This is a list of instances where you have completed tasks.';
+
   return (
     <>
-      <h2>My completed instances</h2>
+      <h2
-      <p className="data-table-description">
+        title={startedByMeTitleText}
-        This is a list of instances you started that are now complete.
+        className="process-instance-table-header"
-      </p>
+      >
+        Started by me
+      </h2>
       <ProcessInstanceListTable
         filtersEnabled={false}
         paginationQueryParamPrefix="my_completed_instances"
@@ -56,10 +62,12 @@ export default function CompletedInstances() {
         paginationClassName="with-large-bottom-margin"
         autoReload
       />
-      <h2>With tasks completed by me</h2>
+      <h2
-      <p className="data-table-description">
+        title={withTasksCompletedByMeTitleText}
-        This is a list of instances where you have completed tasks.
+        className="process-instance-table-header"
-      </p>
+      >
+        With tasks completed by me
+      </h2>
       <ProcessInstanceListTable
         filtersEnabled={false}
         paginationQueryParamPrefix="my_completed_tasks"

spiffworkflow-frontend/src/routes/HomePageRoutes.tsx

@@ -4,7 +4,6 @@ import { Route, Routes, useLocation, useNavigate } from 'react-router-dom';
 import { Tabs, TabList, Tab } from '@carbon/react';
 import TaskShow from './TaskShow';
 import MyTasks from './MyTasks';
-import GroupedTasks from './GroupedTasks';
 import CompletedInstances from './CompletedInstances';
 import CreateNewInstance from './CreateNewInstance';
 import InProgressInstances from './InProgressInstances';

spiffworkflow-frontend/src/routes/InProgressInstances.tsx

@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
 import ProcessInstanceListTable from '../components/ProcessInstanceListTable';
+import { slugifyString } from '../helpers';
 import HttpService from '../services/HttpService';
 
 export default function InProgressInstances() {
@@ -18,21 +19,22 @@ export default function InProgressInstances() {
     }
 
     return userGroups.map((userGroup: string) => {
+      const titleText = `This is a list of instances with tasks that are waiting for the ${userGroup} group.`;
       return (
         <>
-          <h2>With tasks completed by group: {userGroup}</h2>
+          <h2 title={titleText} className="process-instance-table-header">
-          <p className="data-table-description">
+            Waiting for <strong>{userGroup}</strong>
-            This is a list of instances with tasks that were completed by the{' '}
+          </h2>
-            {userGroup} group.
-          </p>
           <ProcessInstanceListTable
             filtersEnabled={false}
-            paginationQueryParamPrefix="group_completed_instances"
+            paginationQueryParamPrefix={`waiting_for_${slugifyString(
+              userGroup
+            ).replace('-', '_')}`}
             paginationClassName="with-large-bottom-margin"
             perPageOptions={[2, 5, 25]}
             reportIdentifier="system_report_in_progress_instances_with_tasks_for_my_group"
             showReports={false}
-            textToShowIfEmpty="This group has no completed instances at this time."
+            textToShowIfEmpty="This group has no instances waiting on it at this time."
             additionalParams={`user_group_identifier=${userGroup}`}
             canCompleteAllTasks
             showActionsColumn
@@ -43,15 +45,21 @@ export default function InProgressInstances() {
     });
   };
 
+  const startedByMeTitleText =
+    'This is a list of open instances that you started.';
+  const waitingForMeTitleText =
+    'This is a list of instances that have tasks that you can complete.';
   return (
     <>
-      <h2>My open instances</h2>
+      <h2
-      <p className="data-table-description">
+        title={startedByMeTitleText}
-        This is a list of instances you started that are now complete.
+        className="process-instance-table-header"
-      </p>
+      >
+        Started by me
+      </h2>
       <ProcessInstanceListTable
         filtersEnabled={false}
-        paginationQueryParamPrefix="my_completed_instances"
+        paginationQueryParamPrefix="open_instances_started_by_me"
         perPageOptions={[2, 5, 25]}
         reportIdentifier="system_report_in_progress_instances_initiated_by_me"
         showReports={false}
@@ -60,17 +68,19 @@ export default function InProgressInstances() {
         showActionsColumn
         autoReload={false}
       />
-      <h2>With tasks I can complete</h2>
+      <h2
-      <p className="data-table-description">
+        title={waitingForMeTitleText}
-        This is a list of instances that have tasks that you can complete.
+        className="process-instance-table-header"
-      </p>
+      >
+        Waiting for me
+      </h2>
       <ProcessInstanceListTable
         filtersEnabled={false}
-        paginationQueryParamPrefix="my_completed_tasks"
+        paginationQueryParamPrefix="waiting_for_me"
         perPageOptions={[2, 5, 25]}
         reportIdentifier="system_report_in_progress_instances_with_tasks_for_me"
         showReports={false}
-        textToShowIfEmpty="You have no completed instances at this time."
+        textToShowIfEmpty="There are no instances waiting on you at this time."
         paginationClassName="with-large-bottom-margin"
         canCompleteAllTasks
         showActionsColumn

spiffworkflow-frontend/src/routes/TaskShow.tsx

@@ -19,10 +19,7 @@ import MDEditor from '@uiw/react-md-editor';
 import Form from '../themes/carbon';
 import HttpService from '../services/HttpService';
 import useAPIError from '../hooks/UseApiError';
-import {
+import { modifyProcessIdentifierForPathParam } from '../helpers';
-  dateStringToYMDFormat,
-  modifyProcessIdentifierForPathParam,
-} from '../helpers';
 import { ProcessInstanceTask } from '../interfaces';
 import ProcessBreadcrumb from '../components/ProcessBreadcrumb';