do not iterate over callers if undefined w/ burnettk

spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx

@@ -64,7 +64,7 @@ import {
   modifyProcessIdentifierForPathParam,
 } from '../helpers';
 import { useUriListForPermissions } from '../hooks/UriListForPermissions';
-import { PermissionsToCheck, Task } from '../interfaces';
+import { PermissionsToCheck, ProcessModelCaller, Task } from '../interfaces';
 import { usePermissionFetcher } from '../hooks/PermissionService';
 
 type OwnProps = {
@@ -89,7 +89,7 @@ type OwnProps = {
   onSearchProcessModels?: (..._args: any[]) => any;
   onElementsChanged?: (..._args: any[]) => any;
   url?: string;
-  callers?: any;
+  callers?: ProcessModelCaller[];
 };
 
 // https://codesandbox.io/s/quizzical-lake-szfyo?file=/src/App.js was a handy reference
@@ -575,6 +575,9 @@ export default function ReactDiagramEditor({
   const canViewXml = fileName !== undefined;
 
   const showReferences = () => {
+    if (!callers) {
+      return null;
+    }
     return (
       <Modal
         open={showingReferences}
@@ -583,7 +586,7 @@ export default function ReactDiagramEditor({
         passiveModal
       >
         <UnorderedList>
-          {callers.map((ref: any) => (
+          {callers.map((ref: ProcessModelCaller) => (
             <li>
               <Link
                 size="lg"
@@ -602,7 +605,7 @@ export default function ReactDiagramEditor({
   };
 
   const getReferencesButton = () => {
-    if (callers.length > 0) {
+    if (callers && callers.length > 0) {
       let buttonText = `View ${callers.length} Reference`;
       if (callers.length > 1) buttonText += 's';
       return (

spiffworkflow-frontend/src/interfaces.ts

@@ -330,3 +330,8 @@ export interface ProcessInstanceLogEntry {
   user_id?: number;
   username?: string;
 }
+
+export interface ProcessModelCaller {
+  display_name: string;
+  process_model_id: string;
+}

spiffworkflow-frontend/src/routes/ProcessModelEditDiagram.tsx

@@ -34,6 +34,7 @@ import {
   CarbonComboBoxProcessSelection,
   ProcessFile,
   ProcessModel,
+  ProcessModelCaller,
   ProcessReference,
 } from '../interfaces';
 import ProcessSearch from '../components/ProcessSearch';
@@ -119,7 +120,7 @@ export default function ProcessModelEditDiagram() {
 
   const processModelPath = `process-models/${modifiedProcessModelId}`;
 
-  const [callers, setCallers] = useState<Array<string>>([]);
+  const [callers, setCallers] = useState<ProcessModelCaller[]>([]);
 
   usePrompt('Changes you made may not be saved.', diagramHasChanges);