From 2a6c697942a9d2bfeebd0fb0f03a9dedaf0434be Mon Sep 17 00:00:00 2001
From: Sipke Schoorstra <sipkeschoorstra@outlook.com>
Date: Thu, 22 Apr 2021 21:32:36 +0200
Subject: [PATCH] Sync selected activity upon record selection

---
 .../elsa-workflows-studio/src/components.d.ts      |  2 ++
 .../elsa-workflow-instance-journal.tsx             | 14 ++++++++++++--
 .../elsa-workflow-instance-viewer-screen.tsx       |  1 +
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/designer/elsa-workflows-studio/src/components.d.ts b/src/designer/elsa-workflows-studio/src/components.d.ts
index 6f3599f38..d16d85e97 100644
--- a/src/designer/elsa-workflows-studio/src/components.d.ts
+++ b/src/designer/elsa-workflows-studio/src/components.d.ts
@@ -182,6 +182,7 @@ export namespace Components {
         "show": () => Promise<void>;
         "workflowBlueprint": WorkflowBlueprint;
         "workflowInstanceId": string;
+        "workflowModel": WorkflowModel;
     }
     interface ElsaWorkflowInstanceViewerScreen {
         "getServerUrl": () => Promise<string>;
@@ -632,6 +633,7 @@ declare namespace LocalJSX {
         "serverUrl"?: string;
         "workflowBlueprint"?: WorkflowBlueprint;
         "workflowInstanceId"?: string;
+        "workflowModel"?: WorkflowModel;
     }
     interface ElsaWorkflowInstanceViewerScreen {
         "serverUrl"?: string;
diff --git a/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-journal.tsx b/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-journal.tsx
index c6c7ff9a1..d9703af40 100644
--- a/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-journal.tsx
+++ b/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-journal.tsx
@@ -5,7 +5,7 @@ import {enter, leave, toggle} from 'el-transition'
 import {registerClickOutside} from "stencil-click-outside";
 import {
   ActivityBlueprint,
-  ActivityDescriptor, PagedList, WorkflowBlueprint, WorkflowExecutionLogRecord,
+  ActivityDescriptor, PagedList, WorkflowBlueprint, WorkflowExecutionLogRecord, WorkflowModel,
 } from "../../../../models";
 import {activityIconProvider} from "../../../../services/activity-icon-provider";
 import {createElsaClient} from "../../../../services/elsa-client";
@@ -38,10 +38,12 @@ export class ElsaWorkflowInstanceJournal {
   @Prop() serverUrl: string;
   @Prop() activityDescriptors: Array<ActivityDescriptor> = [];
   @Prop() workflowBlueprint: WorkflowBlueprint;
+  @Prop() workflowModel: WorkflowModel;
   @Event() recordSelected: EventEmitter<WorkflowExecutionLogRecord>;
   @State() isVisible: boolean = true;
   @State() records: PagedList<WorkflowExecutionLogRecord> = {items: [], totalCount: 0};
   @State() selectedRecordId?: string;
+  @State() selectedActivityId?: string;
   @State() selectedTabId: string = 'journal';
 
   el: HTMLElement;
@@ -70,6 +72,7 @@ export class ElsaWorkflowInstanceJournal {
   async selectActivityRecord(activityId?: string) {
     const record = !!activityId ? this.records.items.find(x => x.activityId == activityId) : null;
     this.selectedRecordId = !!record ? record.id : null;
+    this.selectedActivityId = activityId;
     await this.show();
   }
 
@@ -113,6 +116,7 @@ export class ElsaWorkflowInstanceJournal {
 
   onRecordClick(record: WorkflowExecutionLogRecord) {
     this.selectedRecordId = record.id;
+    this.selectedActivityId = record.activityId;
     this.recordSelected.emit(record);
   }
 
@@ -329,9 +333,15 @@ export class ElsaWorkflowInstanceJournal {
   };
 
   renderActivityStateTab = () => {
+    
+    const activityModel = !!this.workflowModel && this.selectedActivityId ? this.workflowModel.activities.find(x => x.activityId === this.selectedActivityId) : null;
+    
+    if(!activityModel)
+      return <p>No activity selected</p>;
+    
     return (
       <div>
-        <pre>Code formatted activity state goes here...</pre>
+        <pre>{JSON.stringify(activityModel, null, 2)}</pre>
       </div>
     );
   };
diff --git a/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-viewer-screen.tsx b/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-viewer-screen.tsx
index 389fd7af8..480479d63 100644
--- a/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-viewer-screen.tsx
+++ b/src/designer/elsa-workflows-studio/src/components/screens/workflow-instance-viewer/elsa-workflow-instance-viewer-screen/elsa-workflow-instance-viewer-screen.tsx
@@ -185,6 +185,7 @@ export class ElsaWorkflowInstanceViewerScreen {
                                         serverUrl={this.serverUrl}
                                         activityDescriptors={descriptors}
                                         workflowBlueprint={this.workflowBlueprint}
+                                        workflowModel={this.workflowModel}
                                         onRecordSelected={e => this.onRecordSelected(e)}/>
       </Host>
     );