From edb4782971ecbee1653dc537e125ef079e8b638b Mon Sep 17 00:00:00 2001
From: Sipke Schoorstra <sipkeschoorstra@outlook.com>
Date: Thu, 1 Dec 2022 22:24:17 +0100
Subject: [PATCH] Update model immediately to avoid race conditions between UI
 actions and delayed model updates

---
 .../workflow-definitions/components/editor.tsx       | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/editor.tsx b/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/editor.tsx
index 7b71081a1..d98b0daf8 100644
--- a/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/editor.tsx
+++ b/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/editor.tsx
@@ -32,8 +32,6 @@ export class WorkflowDefinitionEditor {
   private canvas: HTMLElsaCanvasElement;
   private container: HTMLDivElement;
   private toolbox: HTMLElsaWorkflowDefinitionEditorToolboxElement;
-  private readonly emitActivityChangedDebounced: (e: ActivityPropertyChangedEventArgs) => void;
-  private readonly updateModelDebounced: () => void;
   private readonly saveChangesDebounced: () => void;
   private readonly workflowDefinitionApi: WorkflowDefinitionsApi;
 
@@ -42,8 +40,6 @@ export class WorkflowDefinitionEditor {
     this.pluginRegistry = Container.get(PluginRegistry);
     this.activityNameFormatter = Container.get(ActivityNameFormatter);
     this.portProviderRegistry = Container.get(PortProviderRegistry);
-    this.emitActivityChangedDebounced = debounce(this.emitActivityChanged, 100);
-    this.updateModelDebounced = debounce(this.updateModel, 10);
     this.saveChangesDebounced = debounce(this.saveChanges, 1000);
     this.workflowDefinitionApi = Container.get(WorkflowDefinitionsApi);
   }
@@ -89,7 +85,7 @@ export class WorkflowDefinitionEditor {
 
   @Listen('graphUpdated')
   private async handleGraphUpdated(e: CustomEvent<GraphUpdatedArgs>) {
-    this.updateModelDebounced();
+    await this.updateModel();
     this.saveChangesDebounced();
   }
 
@@ -241,12 +237,12 @@ export class WorkflowDefinitionEditor {
     });
 
     await this.updateModel();
-    this.emitActivityChangedDebounced({...e.detail, workflowEditor: this.el});
+    await this.emitActivityChanged(e.detail.activity, e.detail.propertyName);
     this.saveChangesDebounced();
   }
 
-  private onWorkflowPropsUpdated = (e: CustomEvent<WorkflowDefinitionPropsUpdatedArgs>) => {
-    this.updateModelDebounced();
+  private onWorkflowPropsUpdated = async (e: CustomEvent<WorkflowDefinitionPropsUpdatedArgs>) => {
+    await this.updateModel();
     this.saveChangesDebounced();
   }