From 3023c52a2b4a8ca27b6ec32d91097efd20688599 Mon Sep 17 00:00:00 2001
From: burnettk <burnettk@users.noreply.github.com>
Date: Fri, 25 Nov 2022 10:23:00 -0500
Subject: [PATCH] display name instead of id, margin under table sections,
 Download xml to Download

---
 .../services/process_instance_report_service.py          | 4 ++--
 .../src/components/PaginationForTable.tsx                | 3 +++
 .../src/components/ProcessInstanceListTable.tsx          | 9 ++++++++-
 .../src/components/ReactDiagramEditor.tsx                | 2 +-
 .../src/components/TasksForMyOpenProcesses.tsx           | 3 ++-
 .../src/components/TasksWaitingForMe.tsx                 | 3 ++-
 spiffworkflow-frontend/src/index.css                     | 4 ++++
 spiffworkflow-frontend/src/routes/CompletedInstances.tsx | 6 ++++--
 spiffworkflow-frontend/src/routes/GroupedTasks.tsx       | 3 +--
 9 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/spiffworkflow-backend/src/spiffworkflow_backend/services/process_instance_report_service.py b/spiffworkflow-backend/src/spiffworkflow_backend/services/process_instance_report_service.py
index e29ab46cc..f49fc9f78 100644
--- a/spiffworkflow-backend/src/spiffworkflow_backend/services/process_instance_report_service.py
+++ b/spiffworkflow-backend/src/spiffworkflow_backend/services/process_instance_report_service.py
@@ -76,8 +76,8 @@ class ProcessInstanceReportService:
                 "columns": [
                     {"Header": "id", "accessor": "id"},
                     {
-                        "Header": "process_model_identifier",
-                        "accessor": "process_model_identifier",
+                        "Header": "process_model_display_name",
+                        "accessor": "process_model_display_name",
                     },
                     {"Header": "start_in_seconds", "accessor": "start_in_seconds"},
                     {"Header": "end_in_seconds", "accessor": "end_in_seconds"},
diff --git a/spiffworkflow-frontend/src/components/PaginationForTable.tsx b/spiffworkflow-frontend/src/components/PaginationForTable.tsx
index 70da531d9..002c8b8e8 100644
--- a/spiffworkflow-frontend/src/components/PaginationForTable.tsx
+++ b/spiffworkflow-frontend/src/components/PaginationForTable.tsx
@@ -14,6 +14,7 @@ type OwnProps = {
   pagination: PaginationObject | null;
   tableToDisplay: any;
   paginationQueryParamPrefix?: string;
+  paginationClassName?: string;
 };
 
 export default function PaginationForTable({
@@ -23,6 +24,7 @@ export default function PaginationForTable({
   pagination,
   tableToDisplay,
   paginationQueryParamPrefix,
+  paginationClassName,
 }: OwnProps) {
   const PER_PAGE_OPTIONS = [2, 10, 50, 100];
   const [searchParams, setSearchParams] = useSearchParams();
@@ -44,6 +46,7 @@ export default function PaginationForTable({
       <>
         {tableToDisplay}
         <Pagination
+          className={paginationClassName}
           data-qa="pagination-options"
           backwardText="Previous page"
           forwardText="Next page"
diff --git a/spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx b/spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx
index 5266c89b0..e881451df 100644
--- a/spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx
+++ b/spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx
@@ -60,6 +60,7 @@ type OwnProps = {
   showReports?: boolean;
   reportIdentifier?: string;
   textToShowIfEmpty?: string;
+  paginationClassName?: string;
 };
 
 interface dateParameters {
@@ -74,6 +75,7 @@ export default function ProcessInstanceListTable({
   showReports = true,
   reportIdentifier,
   textToShowIfEmpty,
+  paginationClassName,
 }: OwnProps) {
   const params = useParams();
   const [searchParams] = useSearchParams();
@@ -799,12 +801,17 @@ export default function ProcessInstanceListTable({
           tableToDisplay={buildTable()}
           paginationQueryParamPrefix={paginationQueryParamPrefix}
           perPageOptions={perPageOptions}
+          paginationClassName={paginationClassName}
         />
       </>
     );
   }
   if (textToShowIfEmpty) {
-    return <p className="no-results-message">{textToShowIfEmpty}</p>;
+    return (
+      <p className="no-results-message with-large-bottom-margin">
+        {textToShowIfEmpty}
+      </p>
+    );
   }
 
   return null;
diff --git a/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx b/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx
index 30716b2c2..11839e9cf 100644
--- a/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx
+++ b/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx
@@ -569,7 +569,7 @@ export default function ReactDiagramEditor({
             a={targetUris.processModelFileShowPath}
             ability={ability}
           >
-            <Button onClick={downloadXmlFile}>Download xml</Button>
+            <Button onClick={downloadXmlFile}>Download</Button>
           </Can>
         </>
       );
diff --git a/spiffworkflow-frontend/src/components/TasksForMyOpenProcesses.tsx b/spiffworkflow-frontend/src/components/TasksForMyOpenProcesses.tsx
index 6e6e84d55..4cc6a6247 100644
--- a/spiffworkflow-frontend/src/components/TasksForMyOpenProcesses.tsx
+++ b/spiffworkflow-frontend/src/components/TasksForMyOpenProcesses.tsx
@@ -111,7 +111,7 @@ export default function MyOpenProcesses() {
   const tasksComponent = () => {
     if (pagination && pagination.total < 1) {
       return (
-        <p className="no-results-message">
+        <p className="no-results-message with-large-bottom-margin">
           There are no tasks for processes you started at this time.
         </p>
       );
@@ -130,6 +130,7 @@ export default function MyOpenProcesses() {
         pagination={pagination}
         tableToDisplay={buildTable()}
         paginationQueryParamPrefix={paginationQueryParamPrefix}
+        paginationClassName="with-large-bottom-margin"
       />
     );
   };
diff --git a/spiffworkflow-frontend/src/components/TasksWaitingForMe.tsx b/spiffworkflow-frontend/src/components/TasksWaitingForMe.tsx
index ccf0ea108..924202248 100644
--- a/spiffworkflow-frontend/src/components/TasksWaitingForMe.tsx
+++ b/spiffworkflow-frontend/src/components/TasksWaitingForMe.tsx
@@ -112,7 +112,7 @@ export default function TasksWaitingForMe() {
   const tasksComponent = () => {
     if (pagination && pagination.total < 1) {
       return (
-        <p className="no-results-message">
+        <p className="no-results-message with-large-bottom-margin">
           You have no task assignments at this time.
         </p>
       );
@@ -131,6 +131,7 @@ export default function TasksWaitingForMe() {
         pagination={pagination}
         tableToDisplay={buildTable()}
         paginationQueryParamPrefix="tasks_waiting_for_me"
+        paginationClassName="with-large-bottom-margin"
       />
     );
   };
diff --git a/spiffworkflow-frontend/src/index.css b/spiffworkflow-frontend/src/index.css
index 9fff222d5..9564d3007 100644
--- a/spiffworkflow-frontend/src/index.css
+++ b/spiffworkflow-frontend/src/index.css
@@ -147,6 +147,10 @@ h1.with-icons {
   margin-bottom: 1em;
 }
 
+.with-large-bottom-margin {
+  margin-bottom: 3em;
+}
+
 .diagram-viewer-canvas {
   border:1px solid #000000;
   height:70vh;
diff --git a/spiffworkflow-frontend/src/routes/CompletedInstances.tsx b/spiffworkflow-frontend/src/routes/CompletedInstances.tsx
index 47dcba126..cc85cdfac 100644
--- a/spiffworkflow-frontend/src/routes/CompletedInstances.tsx
+++ b/spiffworkflow-frontend/src/routes/CompletedInstances.tsx
@@ -14,8 +14,9 @@ export default function CompletedInstances() {
         reportIdentifier="system_report_instances_initiated_by_me"
         showReports={false}
         textToShowIfEmpty="You have no completed instances at this time."
+        paginationClassName="with-large-bottom-margin"
       />
-      <h2 style={{ marginTop: '1em' }}>Tasks completed by me</h2>
+      <h2>Tasks completed by me</h2>
       <p className="data-table-description">
         This is a list of instances where you have completed tasks.
       </p>
@@ -26,8 +27,9 @@ export default function CompletedInstances() {
         reportIdentifier="system_report_instances_with_tasks_completed_by_me"
         showReports={false}
         textToShowIfEmpty="You have no completed tasks at this time."
+        paginationClassName="with-large-bottom-margin"
       />
-      <h2 style={{ marginTop: '1em' }}>Tasks completed by my groups</h2>
+      <h2>Tasks completed by my groups</h2>
       <p className="data-table-description">
         This is a list of instances with tasks that were completed by groups you
         belong to.
diff --git a/spiffworkflow-frontend/src/routes/GroupedTasks.tsx b/spiffworkflow-frontend/src/routes/GroupedTasks.tsx
index dc26abfbe..b72ccfb93 100644
--- a/spiffworkflow-frontend/src/routes/GroupedTasks.tsx
+++ b/spiffworkflow-frontend/src/routes/GroupedTasks.tsx
@@ -5,10 +5,9 @@ import TasksWaitingForMyGroups from '../components/TasksWaitingForMyGroups';
 export default function GroupedTasks() {
   return (
     <>
+      {/* be careful moving these around since the first two have with-large-bottom-margin in order to get some space between the three table sections */}
       <TasksForMyOpenProcesses />
-      <br />
       <TasksWaitingForMe />
-      <br />
       <TasksWaitingForMyGroups />
     </>
   );