Merge pull request #12856 from maxunbearable/improvement/tbel-utils-autcompletes

Implemented tbel utils autocompletes and highlights

ui-ngx/src/app/shared/components/js-func.component.scss

@@ -79,4 +79,10 @@
       background: #f3f3f3;
     }
   }
+
+  .ace_tb {
+    &.ace_tbel-utils-func {
+      color: rgb(49, 132, 149);
+    }
+  }
 }

ui-ngx/src/app/shared/components/js-func.component.ts

@@ -50,6 +50,7 @@ import { JsFuncModulesComponent } from '@shared/components/js-func-modules.compo
 import { HttpClient } from '@angular/common/http';
 import { map, Observable, of } from 'rxjs';
 import { catchError } from 'rxjs/operators';
+import { tbelUtilsAutocompletes, tbelUtilsFuncHighlightRules } from '@shared/models/ace/tbel-utils.models';
 
 @Component({
   selector: 'tb-js-func',
@@ -560,6 +561,9 @@ export class JsFuncComponent implements OnInit, OnChanges, OnDestroy, ControlVal
         break;
       case 'scriptLanguage':
         this.updatedScriptLanguage();
+        this.updateHighlightRules();
+        this.updateCompleters();
+        this.updateJsWorkerGlobals();
         break;
       case 'disableUndefinedCheck':
       case 'globalVariables':
@@ -576,19 +580,24 @@ export class JsFuncComponent implements OnInit, OnChanges, OnDestroy, ControlVal
 
   private updateHighlightRules(): void {
     // @ts-ignore
-    if (!!this.highlightRules && !!this.jsEditor.session.$mode) {
+    if (!!this.jsEditor.session.$mode) {
       // @ts-ignore
       const newMode = new this.jsEditor.session.$mode.constructor();
       newMode.$highlightRules = new newMode.HighlightRules();
-      for(const group in this.highlightRules) {
-        if(!!newMode.$highlightRules.$rules[group]) {
-          newMode.$highlightRules.$rules[group].unshift(...this.highlightRules[group]);
-        } else {
-          newMode.$highlightRules.$rules[group] = this.highlightRules[group];
+      if (!!this.highlightRules) {
+        for(const group in this.highlightRules) {
+          if(!!newMode.$highlightRules.$rules[group]) {
+            newMode.$highlightRules.$rules[group].unshift(...this.highlightRules[group]);
+          } else {
+            newMode.$highlightRules.$rules[group] = this.highlightRules[group];
+          }
         }
       }
+      if (this.scriptLanguage === ScriptLanguage.TBEL) {
+        newMode.$highlightRules.$rules.start = [...tbelUtilsFuncHighlightRules, ...newMode.$highlightRules.$rules.start];
+      }
       const identifierRule = newMode.$highlightRules.$rules.no_regex.find(rule => rule.token?.includes('identifier'));
-      if (identifierRule) {
+      if (identifierRule && identifierRule.next === 'no_regex') {
         identifierRule.next = 'start';
       }
       // @ts-ignore
@@ -641,6 +650,9 @@ export class JsFuncComponent implements OnInit, OnChanges, OnDestroy, ControlVal
       if (modulesCompleter) {
         completers.push(modulesCompleter);
       }
+      if (this.scriptLanguage === ScriptLanguage.TBEL) {
+        completers.push(tbelUtilsAutocompletes);
+      }
       completers.push(...this.initialCompleters);
       this.jsEditor.completers = completers;
     });