From a48155e75f62cf0095d2ad2a7e9826975cdbb719 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C5=BEe=20Fortun?= <joze.fortun@gmail.com>
Date: Tue, 8 Oct 2024 13:56:07 +0200
Subject: [PATCH] Fix workflow expression editor popup not showing

---
 .../src/components/Configurator/Delay.vue     | 18 +++-------------
 .../src/components/Configurator/Error.vue     | 17 ++++-----------
 .../components/Configurator/Expressions.vue   | 13 +++---------
 .../src/components/Configurator/Function.vue  | 21 +++++--------------
 .../src/components/Configurator/Gateway.vue   | 17 +++------------
 .../src/components/ExpressionTable.vue        | 17 +++------------
 6 files changed, 21 insertions(+), 82 deletions(-)

diff --git a/client/web/workflow/src/components/Configurator/Delay.vue b/client/web/workflow/src/components/Configurator/Delay.vue
index 3f0c3e9781..32e0e07069 100644
--- a/client/web/workflow/src/components/Configurator/Delay.vue
+++ b/client/web/workflow/src/components/Configurator/Delay.vue
@@ -21,14 +21,11 @@
           label-class="text-primary"
           class="mb-0"
         >
-          <c-ace-editor
+          <expression-editor
             v-model="item.config.arguments[0].expr"
             lang="javascript"
             font-size="18px"
             show-line-numbers
-            auto-complete
-            :show-popout="false"
-            :auto-complete-suggestions="expressionAutoCompleteValues"
             @input="valueChanged"
           />
         </b-form-group>
@@ -39,24 +36,15 @@
 
 <script>
 import base from './base'
-import { components } from '@cortezaproject/corteza-vue'
-import { EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES } from '../../lib/editor-auto-complete.js'
-
-const { CAceEditor } = components
+import ExpressionEditor from '../ExpressionEditor'
 
 export default {
   components: {
-    CAceEditor,
+    ExpressionEditor,
   },
 
   extends: base,
 
-  data () {
-    return {
-      expressionAutoCompleteValues: EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES,
-    }
-  },
-
   watch: {
     'item.config.stepID': {
       immediate: true,
diff --git a/client/web/workflow/src/components/Configurator/Error.vue b/client/web/workflow/src/components/Configurator/Error.vue
index 1e251b312c..5ce3b37e38 100644
--- a/client/web/workflow/src/components/Configurator/Error.vue
+++ b/client/web/workflow/src/components/Configurator/Error.vue
@@ -20,14 +20,11 @@
         label-class="text-primary"
         class="mb-0"
       >
-        <c-ace-editor
+        <expression-editor
           v-model="item.config.arguments[0].expr"
           lang="javascript"
           font-size="18px"
           show-line-numbers
-          auto-complete
-          :show-popout="false"
-          :auto-complete-suggestions="expressionAutoCompleteValues"
           @open="openInEditor"
           @input="valueChanged"
         />
@@ -47,16 +44,14 @@
       @ok="saveExpression"
       @hidden="resetExpression"
     >
-      <c-ace-editor
+      <expression-editor
         v-model="expressionEditor.currentExpression"
         lang="javascript"
         height="500"
         font-size="18px"
-        auto-complete
         show-line-numbers
         :border="false"
         :show-popout="false"
-        :auto-complete-suggestions="expressionAutoCompleteValues"
       />
     </b-modal>
   </b-card>
@@ -64,14 +59,11 @@
 
 <script>
 import base from './base'
-import { components } from '@cortezaproject/corteza-vue'
-import { EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES } from '../../lib/editor-auto-complete.js'
-
-const { CAceEditor } = components
+import ExpressionEditor from '../ExpressionEditor.vue'
 
 export default {
   components: {
-    CAceEditor,
+    ExpressionEditor,
   },
 
   extends: base,
@@ -81,7 +73,6 @@ export default {
       expressionEditor: {
         currentExpression: undefined,
       },
-      expressionAutoCompleteValues: EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES,
     }
   },
 
diff --git a/client/web/workflow/src/components/Configurator/Expressions.vue b/client/web/workflow/src/components/Configurator/Expressions.vue
index 5c9f560627..82f8c0abe5 100644
--- a/client/web/workflow/src/components/Configurator/Expressions.vue
+++ b/client/web/workflow/src/components/Configurator/Expressions.vue
@@ -62,16 +62,14 @@
       @ok="saveExpression"
       @hidden="resetExpression"
     >
-      <c-ace-editor
+      <expression-editor
         v-model="currentExpressionValue"
         height="500"
         lang="javascript"
         font-size="18px"
         show-line-numbers
-        auto-complete
         :border="false"
         :show-popout="false"
-        :auto-complete-suggestions="expressionAutoCompleteValues"
       />
     </b-modal>
   </div>
@@ -80,14 +78,11 @@
 <script>
 import base from './base'
 import ExpressionTable from '../ExpressionTable.vue'
-import { components } from '@cortezaproject/corteza-vue'
-import { EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES } from '../../lib/editor-auto-complete.js'
-
-const { CAceEditor } = components
+import ExpressionEditor from '../ExpressionEditor.vue'
 
 export default {
   components: {
-    CAceEditor,
+    ExpressionEditor,
     ExpressionTable,
   },
 
@@ -101,8 +96,6 @@ export default {
         currentIndex: undefined,
         currentExpression: undefined,
       },
-
-      expressionAutoCompleteValues: EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES,
     }
   },
 
diff --git a/client/web/workflow/src/components/Configurator/Function.vue b/client/web/workflow/src/components/Configurator/Function.vue
index 31bf5b0102..c2ace43dbb 100644
--- a/client/web/workflow/src/components/Configurator/Function.vue
+++ b/client/web/workflow/src/components/Configurator/Function.vue
@@ -157,23 +157,19 @@
                     {{ a.target }}
                   </b-form-checkbox>
 
-                  <c-ace-editor
+                  <expression-editor
                     v-else
                     v-model="a.value"
-                    auto-complete
-                    :auto-complete-suggestions="expressionAutoCompleteValues"
                     @open="openInEditor(index)"
                     @input="$root.$emit('change-detected')"
                   />
                 </div>
 
-                <c-ace-editor
+                <expression-editor
                   v-else-if="a.valueType === 'expr'"
                   v-model="a.expr"
                   lang="javascript"
                   show-line-numbers
-                  auto-complete
-                  :auto-complete-suggestions="expressionAutoCompleteValues"
                   @open="openInEditor(index)"
                   @input="$root.$emit('change-detected')"
                 />
@@ -309,16 +305,14 @@
       @ok="saveExpression"
       @hidden="resetExpression"
     >
-      <c-ace-editor
+      <expression-editor
         v-model="currentExpressionValue"
         :lang="expressionEditor.lang"
         height="500"
         font-size="18px"
         show-line-numbers
-        auto-complete
         :border="false"
         :show-popout="false"
-        :auto-complete-suggestions="expressionAutoCompleteValues"
       />
     </b-modal>
   </div>
@@ -327,15 +321,12 @@
 <script>
 import base from './base'
 import ExpressionTable from '../ExpressionTable.vue'
+import ExpressionEditor from '../ExpressionEditor.vue'
 import { objectSearchMaker, stringSearchMaker } from '../../lib/filter'
-import { components } from '@cortezaproject/corteza-vue'
-import { EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES } from '../../lib/editor-auto-complete.js'
-
-const { CAceEditor } = components
 
 export default {
   components: {
-    CAceEditor,
+    ExpressionEditor,
     ExpressionTable,
   },
 
@@ -363,8 +354,6 @@ export default {
         currentExpression: undefined,
         lang: 'javascript',
       },
-
-      expressionAutoCompleteValues: EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES,
     }
   },
 
diff --git a/client/web/workflow/src/components/Configurator/Gateway.vue b/client/web/workflow/src/components/Configurator/Gateway.vue
index 725554f7f8..251a3caced 100644
--- a/client/web/workflow/src/components/Configurator/Gateway.vue
+++ b/client/web/workflow/src/components/Configurator/Gateway.vue
@@ -33,14 +33,12 @@
             :label="edge.value"
             label-class="text-primary"
           >
-            <c-ace-editor
+            <expression-editor
               v-model="edge.expr"
               lang="javascript"
               height="100"
               show-line-numbers
-              auto-complete
               :show-popout="false"
-              :auto-complete-suggestions="expressionAutoCompleteValues"
               @input="updateEdge(edge.id, $event)"
             />
           </b-form-group>
@@ -52,24 +50,15 @@
 
 <script>
 import base from './base'
-import { components } from '@cortezaproject/corteza-vue'
-import { EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES } from '../../lib/editor-auto-complete.js'
-
-const { CAceEditor } = components
+import ExpressionEditor from '../ExpressionEditor.vue'
 
 export default {
   components: {
-    CAceEditor,
+    ExpressionEditor,
   },
 
   extends: base,
 
-  data () {
-    return {
-      expressionAutoCompleteValues: EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES,
-    }
-  },
-
   computed: {
     gatewayKind () {
       return this.item.config.ref
diff --git a/client/web/workflow/src/components/ExpressionTable.vue b/client/web/workflow/src/components/ExpressionTable.vue
index 034d7807d0..5d75d83f5a 100644
--- a/client/web/workflow/src/components/ExpressionTable.vue
+++ b/client/web/workflow/src/components/ExpressionTable.vue
@@ -97,12 +97,10 @@
               <b-form-group
                 class="mb-0"
               >
-                <c-ace-editor
+                <expression-editor
                   v-model="item[valueField]"
                   lang="javascript"
                   show-line-numbers
-                  auto-complete
-                  :auto-complete-suggestions="expressionAutoCompleteValues"
                   @open="$emit('open-editor', index)"
                   @input="$root.$emit('change-detected')"
                 />
@@ -116,16 +114,13 @@
 </template>
 
 <script>
-import { EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES } from '../lib/editor-auto-complete.js'
-import { components } from '@cortezaproject/corteza-vue'
+import ExpressionEditor from './ExpressionEditor.vue'
 import { objectSearchMaker } from '../lib/filter'
 import draggable from 'vuedraggable'
 
-const { CAceEditor } = components
-
 export default {
   components: {
-    CAceEditor,
+    ExpressionEditor,
     draggable,
   },
 
@@ -151,12 +146,6 @@ export default {
     },
   },
 
-  data () {
-    return {
-      expressionAutoCompleteValues: EXPRESSION_EDITOR_AUTO_COMPLETE_VALUES,
-    }
-  },
-
   methods: {
     varFilter: objectSearchMaker('text'),