diff --git a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx
index d7785e584..c4d2f8c43 100644
--- a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx
+++ b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx
@@ -147,9 +147,7 @@ export default function ProcessModelShow() {
Process Instance {processInstanceId} kicked off (
view
@@ -188,82 +186,98 @@ export default function ProcessModelShow() {
};
const processModelFileList = () => {
+ if (!processModel) {
+ return null;
+ }
let constructedTag;
- const tags = (processModel as any).files.map((processModelFile: any) => {
- const items: ProcessModelFileCarbonDropdownItem[] = [
- {
- label: 'Delete',
- action: 'delete',
- processModelFile,
- },
- {
- label: 'Mark as Primary',
- action: 'mark_as_primary',
- processModelFile,
- },
- ];
- const actionsTableCell = (
-
- {
- onProcessModelFileAction(e);
- }}
- items={items}
- itemToString={(item: ProcessModelFileCarbonDropdownItem) =>
- item ? item.label : ''
- }
- />
-
- );
- if (processModelFile.name.match(/\.(dmn|bpmn)$/)) {
- let primarySuffix = '';
- if (processModelFile.name === (processModel as any).primary_file_name) {
- primarySuffix = '- Primary File';
+ const tags = processModel.files.map(
+ (processModelFile: any, index: number) => {
+ const isPrimaryBpmnFile =
+ processModelFile.name === processModel.primary_file_name;
+ const items: ProcessModelFileCarbonDropdownItem[] = [
+ {
+ label: 'Delete',
+ action: 'delete',
+ processModelFile,
+ },
+ ];
+ if (processModelFile.name.match(/\.bpmn$/) && !isPrimaryBpmnFile) {
+ items.push({
+ label: 'Mark as Primary',
+ action: 'mark_as_primary',
+ processModelFile,
+ });
}
- constructedTag = (
-
-
-
+
+ let actionDropDirection = 'bottom';
+ if (index + 1 === processModel.files.length) {
+ actionDropDirection = 'top';
+ }
+
+ // The dropdown will get covered up if it extends passed the table container.
+ // Using bottom direction at least gives a scrollbar so use that and hopefully
+ // carbon will give access to z-index at some point.
+ // https://github.com/carbon-design-system/carbon-addons-iot-react/issues/1487
+ const actionsTableCell = (
+
+ {
+ onProcessModelFileAction(e);
+ }}
+ items={items}
+ itemToString={(item: ProcessModelFileCarbonDropdownItem) =>
+ item ? item.label : ''
+ }
+ />
+
+ );
+
+ if (processModelFile.name.match(/\.(dmn|bpmn)$/)) {
+ let primarySuffix = '';
+ if (isPrimaryBpmnFile) {
+ primarySuffix = '- Primary File';
+ }
+ constructedTag = (
+
+
+
+ {processModelFile.name}
+
+ {primarySuffix}
+
+ {actionsTableCell}
+
+ );
+ } else if (processModelFile.name.match(/\.(json|md)$/)) {
+ constructedTag = (
+
+
+
+ {processModelFile.name}
+
+
+ {actionsTableCell}
+
+ );
+ } else {
+ constructedTag = (
+
+
{processModelFile.name}
-
- {primarySuffix}
-
- {actionsTableCell}
-
- );
- } else if (processModelFile.name.match(/\.(json|md)$/)) {
- constructedTag = (
-
-
-
- {processModelFile.name}
-
-
- {actionsTableCell}
-
- );
- } else {
- constructedTag = (
-
-
- {processModelFile.name}
-
-
- );
+
+
+ );
+ }
+ return constructedTag;
}
- return constructedTag;
- });
+ );
// return
;
const headers = ['Name', 'Actions'];
@@ -284,13 +298,14 @@ export default function ProcessModelShow() {
};
const processInstancesUl = () => {
+ if (!processModel) {
+ return null;
+ }
return (
-
List
@@ -298,9 +313,7 @@ export default function ProcessModelShow() {
-
Reports
@@ -315,20 +328,20 @@ export default function ProcessModelShow() {
};
const handleFileUpload = (event: any) => {
- event.preventDefault();
- const url = `/process-models/${(processModel as any).process_group_id}/${
- (processModel as any).id
- }/files`;
- const formData = new FormData();
- formData.append('file', filesToUpload[0]);
- formData.append('fileName', filesToUpload[0].name);
- HttpService.makeCallToBackend({
- path: url,
- successCallback: onUploadedCallback,
- httpMethod: 'POST',
- postBody: formData,
- });
- setShowFileUploadModal(false);
+ if (processModel) {
+ event.preventDefault();
+ const url = `/process-models/${processModel.process_group_id}/${processModel.id}/files`;
+ const formData = new FormData();
+ formData.append('file', filesToUpload[0]);
+ formData.append('fileName', filesToUpload[0].name);
+ HttpService.makeCallToBackend({
+ path: url,
+ successCallback: onUploadedCallback,
+ httpMethod: 'POST',
+ postBody: formData,
+ });
+ setShowFileUploadModal(false);
+ }
};
const fileUploadModal = () => {
@@ -362,6 +375,9 @@ export default function ProcessModelShow() {
};
const processModelButtons = () => {
+ if (!processModel) {
+ return null;
+ }
return (