From 1a2b26cb5eb11dcf9142f173cfa82709d787a99f Mon Sep 17 00:00:00 2001
From: "Patrik J. Braun" <bra.patrik@gmail.com>
Date: Tue, 18 Jul 2023 22:17:38 +0200
Subject: [PATCH] Fixing map icon config UI #587 #667

---
 package-lock.json                                  | 14 +++++++-------
 package.json                                       |  2 +-
 src/common/config/public/ClientConfig.ts           |  2 +-
 .../settings-entry/settings-entry.component.html   |  9 +++++++++
 .../settings-entry/settings-entry.component.ts     |  5 +++--
 5 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 056f1fb9..a71cac10 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,7 +27,7 @@
         "sharp": "0.31.3",
         "ts-exif-parser": "0.2.2",
         "ts-node-iptc": "1.0.11",
-        "typeconfig": "2.0.39",
+        "typeconfig": "2.1.0",
         "typeorm": "0.3.12",
         "xml2js": "0.4.23"
       },
@@ -21670,9 +21670,9 @@
       }
     },
     "node_modules/typeconfig": {
-      "version": "2.0.39",
-      "resolved": "https://registry.npmjs.org/typeconfig/-/typeconfig-2.0.39.tgz",
-      "integrity": "sha512-Wys54XBKXeUSfaqrPajTCi6lY3c1b/M/PotGWVL5KT6393IO317wq45F/5otFBuFVREIh+4gRG6c/y+SvSZXYw==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/typeconfig/-/typeconfig-2.1.0.tgz",
+      "integrity": "sha512-2Sn2lB8nG9lOvy2jY/4U0HCkqJqc7Fpf8uF5hXaB/+YVnjexX05bfOxUpxIB0fh+Qob7TrVkHxt/2R3aacj8Cw==",
       "dependencies": {
         "minimist": "1.2.8"
       }
@@ -39736,9 +39736,9 @@
       }
     },
     "typeconfig": {
-      "version": "2.0.39",
-      "resolved": "https://registry.npmjs.org/typeconfig/-/typeconfig-2.0.39.tgz",
-      "integrity": "sha512-Wys54XBKXeUSfaqrPajTCi6lY3c1b/M/PotGWVL5KT6393IO317wq45F/5otFBuFVREIh+4gRG6c/y+SvSZXYw==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/typeconfig/-/typeconfig-2.1.0.tgz",
+      "integrity": "sha512-2Sn2lB8nG9lOvy2jY/4U0HCkqJqc7Fpf8uF5hXaB/+YVnjexX05bfOxUpxIB0fh+Qob7TrVkHxt/2R3aacj8Cw==",
       "requires": {
         "minimist": "1.2.8"
       }
diff --git a/package.json b/package.json
index aee296a9..798fc1e4 100644
--- a/package.json
+++ b/package.json
@@ -50,7 +50,7 @@
     "sharp": "0.31.3",
     "ts-exif-parser": "0.2.2",
     "ts-node-iptc": "1.0.11",
-    "typeconfig": "2.0.39",
+    "typeconfig": "2.1.0",
     "xml2js": "0.4.23",
     "typeorm": "0.3.12"
   },
diff --git a/src/common/config/public/ClientConfig.ts b/src/common/config/public/ClientConfig.ts
index 1d2a5c46..ff4ab6dc 100644
--- a/src/common/config/public/ClientConfig.ts
+++ b/src/common/config/public/ClientConfig.ts
@@ -515,7 +515,7 @@ export class ClientMapConfig {
     arrayType: MapPathGroupConfig,
     tags: {
       name: $localize`Path theme groups`,
-      priority: ConfigPriority.advanced
+      priority: ConfigPriority.underTheHood
     } as TAGS,
     description: $localize`Markers are grouped and themed by these settings`,
   })
diff --git a/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html b/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html
index e8388a2d..b8da1796 100644
--- a/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html
+++ b/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html
@@ -156,6 +156,7 @@
                   (click)="showIconModal(iconModalTmp)">
             <svg xmlns="http://www.w3.org/2000/svg"
                  width="1em"
+                 fill="var(--bs-btn-color)"
                  [attr.viewBox]="state.value.viewBox || '0 0 512 512'">
               <path [attr.d]="state.value.path"/>
             </svg>
@@ -174,6 +175,7 @@
                 <div class="col text-center">
                   <svg xmlns="http://www.w3.org/2000/svg"
                        width="2em"
+                       fill="var(--bs-body-color)"
                        [attr.viewBox]="state.value.viewBox || '0 0 512 512'">
                     <path [attr.d]="state.value.path"/>
                   </svg>
@@ -199,12 +201,14 @@
 
               <app-settings-entry
                 [ngModel]="state.value.__state.viewBox"
+                [noChangeDetection]="true"
                 [name]="'icon_w_'+idName"
                 [id]="'icon_w_'+idName"
                 (change)="onChange($event)"></app-settings-entry>
 
               <app-settings-entry
                 [ngModel]="state.value.__state.path"
+                [noChangeDetection]="true"
                 [name]="'icon_p_'+idName"
                 [id]="'icon_p_'+idName"
                 (change)="onChange($event)"></app-settings-entry>
@@ -271,6 +275,7 @@
                 <div class="col ps-0">
                   <app-settings-entry
                     [ngModel]="val.__state.matchers"
+                    [noChangeDetection]="true"
                     [name]="'val_m_'+idName+i"
                     [id]="'val_m_'+idName+i"
                     (change)="onChange($event)"></app-settings-entry>
@@ -286,6 +291,7 @@
               <div class="row  mt-1 mb-1 bg-body-tertiary">
                 <app-settings-entry
                   [ngModel]="val.theme.__state.color"
+                  [noChangeDetection]="true"
                   [name]="'color_m_'+idName+i"
                   [id]="'color_m_'+idName+i"
                   (change)="onChange($event)"></app-settings-entry>
@@ -294,6 +300,7 @@
 
                 <app-settings-entry
                   [ngModel]="val.theme.__state.dashArray"
+                  [noChangeDetection]="true"
                   [name]="'dashArray_n_'+idName+i"
                   [id]="'dashArray_n_'+idName+i"
                   (change)="onChange($event)"></app-settings-entry>
@@ -301,6 +308,7 @@
               <div class="row  mt-1 mb-1 bg-body-tertiary">
                 <app-settings-entry
                   [ngModel]="val.theme.__state.svgIcon"
+                  [noChangeDetection]="true"
                   [name]="'svgIcon_'+idName+i"
                   [id]="'svgIcon_'+idName+i"
                   (ngModelChange)="onChange($event)">
@@ -345,6 +353,7 @@
 
                 <div class="col">
                   <app-settings-entry
+                    [noChangeDetection]="true"
                     [ngModel]="arr.__state.matchers"
                     [name]="'arr_m_'+idName+i"
                     [id]="'arr_m_'+idName+i"
diff --git a/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.ts b/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.ts
index f767496e..1b084480 100644
--- a/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.ts
+++ b/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.ts
@@ -1,4 +1,4 @@
-import {Component, forwardRef, OnChanges, TemplateRef} from '@angular/core';
+import {Component, forwardRef, Input, OnChanges, TemplateRef} from '@angular/core';
 import {ControlValueAccessor, NG_VALIDATORS, NG_VALUE_ACCESSOR, ValidationErrors, Validator,} from '@angular/forms';
 import {Utils} from '../../../../../../common/Utils';
 import {propertyTypes} from 'typeconfig/common';
@@ -78,6 +78,7 @@ export class SettingsEntryComponent
   public uiType: string;
   newThemeModalRef: any;
   iconModal: { ref?: any, error?: string };
+  @Input() noChangeDetection = false;
 
 
   constructor(private searchQueryParserService: SearchQueryParserService,
@@ -87,7 +88,7 @@ export class SettingsEntryComponent
   }
 
   get changed(): boolean {
-    if (this.Disabled) {
+    if (this.Disabled || this.noChangeDetection) {
       return false;
     }