From 020851245b7411cac796cd4ca01fc0ee9cca29e8 Mon Sep 17 00:00:00 2001
From: jasquat <jasquat@users.noreply.github.com>
Date: Mon, 27 Jun 2022 14:26:38 -0400
Subject: [PATCH] rename react_diagram_editor and added no groups to display
 text w/ burnettk

---
 .../ReactDiagramEditor.js}                    |  5 ++--
 src/routes/ProcessGroups.js                   | 28 +++++++++++++------
 src/routes/ProcessModelEditDiagram.js         |  2 +-
 3 files changed, 23 insertions(+), 12 deletions(-)
 rename src/{react_diagram_editor.js => components/ReactDiagramEditor.js} (98%)

diff --git a/src/react_diagram_editor.js b/src/components/ReactDiagramEditor.js
similarity index 98%
rename from src/react_diagram_editor.js
rename to src/components/ReactDiagramEditor.js
index 872f90f..06215d0 100644
--- a/src/react_diagram_editor.js
+++ b/src/components/ReactDiagramEditor.js
@@ -16,12 +16,12 @@ import spiffworkflowPanel from 'bpmn-js-spiffworkflow/app/spiffworkflow/Properti
 
 import Button from 'react-bootstrap/Button';
 import PropTypes from 'prop-types';
-import { HOT_AUTH_TOKEN, BACKEND_BASE_URL } from './config';
+import { HOT_AUTH_TOKEN, BACKEND_BASE_URL } from '../config';
 
 import 'bpmn-js/dist/assets/diagram-js.css';
 import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
 import 'bpmn-js-properties-panel/dist/assets/properties-panel.css';
-import './bpmn-js-properties-panel.css';
+import '../bpmn-js-properties-panel.css';
 import 'bpmn-js/dist/assets/bpmn-js.css';
 
 import 'dmn-js/dist/assets/diagram-js.css';
@@ -41,7 +41,6 @@ export default function ReactDiagramEditor({
   processGroupId,
   saveDiagram,
   diagramType,
-
   diagramXML,
   fileName,
   onLaunchScriptEditor,
diff --git a/src/routes/ProcessGroups.js b/src/routes/ProcessGroups.js
index dde494e..c304075 100644
--- a/src/routes/ProcessGroups.js
+++ b/src/routes/ProcessGroups.js
@@ -66,19 +66,15 @@ export default function ProcessGroups() {
     );
   };
 
-  if (processGroups?.length > 0) {
+  const processGroupsDisplayArea = () => {
     const perPage = parseInt(
       searchParams.get('per_page') || DEFAULT_PER_PAGE,
       10
     );
     const page = parseInt(searchParams.get('page') || DEFAULT_PAGE, 10);
-    return (
-      <main style={{ padding: '1rem 0' }}>
-        <ProcessBreadcrumb />
-        <h2>Process Groups</h2>
-        <Button href="/process-groups/new">Add a process group</Button>
-        <br />
-        <br />
+    let displayText = '';
+    if (processGroups?.length > 0) {
+      displayText = (
         <PaginationForTable
           page={page}
           perPage={perPage}
@@ -86,6 +82,22 @@ export default function ProcessGroups() {
           tableToDisplay={buildTable()}
           path="/process-groups"
         />
+      );
+    } else {
+      displayText = <p>No Groups To Display</p>;
+    }
+    return displayText;
+  };
+
+  if (pagination) {
+    return (
+      <main style={{ padding: '1rem 0' }}>
+        <ProcessBreadcrumb />
+        <h2>Process Groups</h2>
+        <Button href="/process-groups/new">Add a process group</Button>
+        <br />
+        <br />
+        {processGroupsDisplayArea()}
       </main>
     );
   }
diff --git a/src/routes/ProcessModelEditDiagram.js b/src/routes/ProcessModelEditDiagram.js
index 0e1b4a7..7fc4488 100644
--- a/src/routes/ProcessModelEditDiagram.js
+++ b/src/routes/ProcessModelEditDiagram.js
@@ -4,7 +4,7 @@ import { Button, Modal } from 'react-bootstrap';
 import Editor from '@monaco-editor/react';
 import { BACKEND_BASE_URL, HOT_AUTH_TOKEN } from '../config';
 
-import ReactDiagramEditor from '../react_diagram_editor';
+import ReactDiagramEditor from '../components/ReactDiagramEditor';
 import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
 
 export default function ProcessModelEditDiagram() {