From bcfab48a79c78e538406dc1710108bf844f2c37c Mon Sep 17 00:00:00 2001
From: kalytka <ykalytka@thingsboard.io>
Date: Fri, 31 Mar 2023 11:30:33 +0300
Subject: [PATCH] Added label parsing in select entity dialog

---
 .../select-entity-dialog.component.html       |  2 +-
 .../dialogs/select-entity-dialog.component.ts | 24 ++++++++++++++++++-
 .../components/widget/lib/maps/leaflet-map.ts | 22 ++++++++++++++++-
 3 files changed, 45 insertions(+), 3 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.html
index a2169cc129..fd0013236d 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.html
@@ -31,7 +31,7 @@
       <mat-label translate>entity.entity</mat-label>
       <mat-select formControlName="entity">
         <mat-option *ngFor="let entity of data.entities" [value]="entity">
-          {{ entity.entityName }}
+          {{ parseName(entity) }}
         </mat-option>
       </mat-select>
     </mat-form-field>
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.ts
index 9822f6dca9..f7e94dd390 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/dialogs/select-entity-dialog.component.ts
@@ -22,9 +22,18 @@ import { Router } from '@angular/router';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
 import { FormattedData } from '@shared/models/widget.models';
+import { GenericFunction } from '@home/components/widget/lib/maps/map-models';
+import { fillDataPattern, processDataPattern, safeExecute } from '@core/utils';
+import { parseWithTranslation } from '@home/components/widget/lib/maps/common-maps-utils';
 
 export interface SelectEntityDialogData {
   entities: FormattedData[];
+  labelSettings: {
+    showLabel: boolean;
+    useLabelFunction: boolean;
+    parsedLabelFunction: GenericFunction;
+    label: string;
+  };
 }
 
 @Component({
@@ -33,7 +42,6 @@ export interface SelectEntityDialogData {
   styleUrls: ['./select-entity-dialog.component.scss']
 })
 export class SelectEntityDialogComponent extends DialogComponent<SelectEntityDialogComponent, FormattedData> {
-
   selectEntityFormGroup: UntypedFormGroup;
 
   constructor(protected store: Store<AppState>,
@@ -50,6 +58,20 @@ export class SelectEntityDialogComponent extends DialogComponent<SelectEntityDia
     );
   }
 
+  public parseName(entity) {
+    let name;
+    if (this.data.labelSettings?.showLabel) {
+      const pattern = this.data.labelSettings.useLabelFunction ? safeExecute(this.data.labelSettings.parsedLabelFunction,
+        [entity, this.data.entities, entity.dsIndex]) : this.data.labelSettings.label;
+      const markerLabelText = parseWithTranslation.prepareProcessPattern(pattern, true);
+      const replaceInfoLabelMarker = processDataPattern(pattern, entity);
+      name = fillDataPattern(markerLabelText, replaceInfoLabelMarker, entity);
+    } else {
+      name = entity.entityName;
+    }
+    return name;
+  }
+
   save(): void {
     this.dialogRef.close(this.selectEntityFormGroup.value.entity);
   }
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
index a78dd27431..614e494e36 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
@@ -182,16 +182,35 @@ export default abstract class LeafletMap {
 
     private selectEntityWithoutLocationDialog(shapes: L.PM.SUPPORTED_SHAPES): Observable<FormattedData> {
       let entities;
+      let labelSettings;
       switch (shapes) {
         case 'Polygon':
         case 'Rectangle':
           entities = this.datasources.filter(pData => !this.isValidPolygonPosition(pData));
+          labelSettings = {
+            showLabel: this.options.showPolygonLabel,
+            useLabelFunction:  this.options.usePolygonLabelFunction,
+            parsedLabelFunction: this.options.parsedPolygonLabelFunction,
+            label: this.options.polygonLabel
+          };
           break;
         case 'Marker':
           entities = this.datasources.filter(mData => !this.extractPosition(mData));
+          labelSettings = {
+            showLabel: this.options.showLabel,
+            useLabelFunction:  this.options.useLabelFunction,
+            parsedLabelFunction: this.options.parsedLabelFunction,
+            label: this.options.label
+          };
           break;
         case 'Circle':
           entities = this.datasources.filter(mData => !this.isValidCircle(mData));
+          labelSettings = {
+            showLabel: this.options.showCircleLabel,
+            useLabelFunction:  this.options.useCircleLabelFunction,
+            parsedLabelFunction: this.options.parsedCircleLabelFunction,
+            label: this.options.circleLabel
+          };
           break;
         default:
           return of(null);
@@ -205,7 +224,8 @@ export default abstract class LeafletMap {
           disableClose: true,
           panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
           data: {
-            entities
+            entities,
+            labelSettings
           }
         }).afterClosed();
     }