Merge pull request #107 from sartography/feature/metadata_on_instance_show

Feature/metadata on instance show

spiffworkflow-backend/src/spiffworkflow_backend/models/process_instance.py

@@ -75,6 +75,10 @@ class ProcessInstanceModel(SpiffworkflowBaseDBModel):
     )  # type: ignore
     message_instances = relationship("MessageInstanceModel", cascade="delete")  # type: ignore
     message_correlations = relationship("MessageCorrelationModel", cascade="delete")  # type: ignore
+    process_metadata = relationship(
+        "ProcessInstanceMetadataModel",
+        cascade="delete",
+    )  # type: ignore
 
     bpmn_json: str | None = deferred(db.Column(db.JSON))  # type: ignore
     start_in_seconds: int | None = db.Column(db.Integer)
@@ -111,6 +115,11 @@ class ProcessInstanceModel(SpiffworkflowBaseDBModel):
             "process_initiator_username": self.process_initiator.username,
         }
 
+    def serialized_with_metadata(self) -> dict[str, Any]:
+        process_instance_attributes = self.serialized
+        process_instance_attributes["process_metadata"] = self.process_metadata
+        return process_instance_attributes
+
     @property
     def serialized_flat(self) -> dict:
         """Return object in serializeable format with data merged together with top-level attributes.

spiffworkflow-backend/src/spiffworkflow_backend/routes/process_instances_controller.py

@@ -694,7 +694,8 @@ def _get_process_instance(
             )
         process_instance.bpmn_xml_file_contents = bpmn_xml_file_contents
 
-    return make_response(jsonify(process_instance), 200)
+    process_instance_as_dict = process_instance.serialized_with_metadata()
+    return make_response(jsonify(process_instance_as_dict), 200)
 
 
 def _find_process_instance_for_me_or_raise(

spiffworkflow-frontend/src/interfaces.ts

@@ -66,6 +66,12 @@ export interface ProcessFile {
   file_contents?: string;
 }
 
+export interface ProcessInstanceMetadata {
+  id: number;
+  key: string;
+  value: string;
+}
+
 export interface ProcessInstance {
   id: number;
   process_model_identifier: string;
@@ -80,6 +86,7 @@ export interface ProcessInstance {
   updated_at_in_seconds: number;
   bpmn_version_control_identifier: string;
   bpmn_version_control_type: string;
+  process_metadata?: ProcessInstanceMetadata[];
 }
 
 export interface MessageCorrelationProperties {

spiffworkflow-frontend/src/routes/ProcessInstanceShow.tsx

@@ -44,6 +44,7 @@ import {
   PermissionsToCheck,
   ProcessData,
   ProcessInstance,
+  ProcessInstanceMetadata,
   ProcessInstanceTask,
 } from '../interfaces';
 import { usePermissionFetcher } from '../hooks/PermissionService';
@@ -74,6 +75,8 @@ export default function ProcessInstanceShow({ variant }: OwnProps) {
   const [eventTextEditorEnabled, setEventTextEditorEnabled] =
     useState<boolean>(false);
   const [displayDetails, setDisplayDetails] = useState<boolean>(false);
+  const [showProcessInstanceMetadata, setShowProcessInstanceMetadata] =
+    useState<boolean>(false);
 
   const setErrorObject = (useContext as any)(ErrorContext)[1];
 
@@ -446,6 +449,19 @@ export default function ProcessInstanceShow({ variant }: OwnProps) {
                   Messages
                 </Button>
               </Can>
+              {processInstance.process_metadata &&
+              processInstance.process_metadata.length > 0 ? (
+                <Button
+                  size="sm"
+                  className="button-white-background"
+                  data-qa="process-instance-show-metadata"
+                  onClick={() => {
+                    setShowProcessInstanceMetadata(true);
+                  }}
+                >
+                  Metadata
+                </Button>
+              ) : null}
             </ButtonSet>
           </Column>
         </Grid>
@@ -903,6 +919,41 @@ export default function ProcessInstanceShow({ variant }: OwnProps) {
     );
   };
 
+  const processInstanceMetadataArea = () => {
+    if (
+      !processInstance ||
+      (processInstance.process_metadata &&
+        processInstance.process_metadata.length < 1)
+    ) {
+      return null;
+    }
+    const metadataComponents: any[] = [];
+    (processInstance.process_metadata || []).forEach(
+      (processInstanceMetadata: ProcessInstanceMetadata) => {
+        metadataComponents.push(
+          <Grid condensed fullWidth>
+            <Column sm={1} md={1} lg={2} className="grid-list-title">
+              {processInstanceMetadata.key}
+            </Column>
+            <Column sm={3} md={3} lg={3} className="grid-date">
+              {processInstanceMetadata.value}
+            </Column>
+          </Grid>
+        );
+      }
+    );
+    return (
+      <Modal
+        open={showProcessInstanceMetadata}
+        modalHeading="Metadata"
+        passiveModal
+        onRequestClose={() => setShowProcessInstanceMetadata(false)}
+      >
+        {metadataComponents}
+      </Modal>
+    );
+  };
+
   const taskUpdateDisplayArea = () => {
     const taskToUse: any = { ...taskToDisplay, data: taskDataToDisplay };
     const candidateEvents: any = getEvents(taskToUse);
@@ -1034,6 +1085,7 @@ export default function ProcessInstanceShow({ variant }: OwnProps) {
         <br />
         {taskUpdateDisplayArea()}
         {processDataDisplayArea()}
+        {processInstanceMetadataArea()}
         {stepsElement()}
         <br />
         <ReactDiagramEditor