Fix #1935

src/UI/Popup/TagRendering/Questionbox.svelte

@@ -79,7 +79,7 @@
     console.log("Applying questions to ask")
     const qta = questionsToAsk.data
     firstQuestion.setData(undefined)
-    allQuestionsToAsk.setData([])
+    //allQuestionsToAsk.setData([])
     await Utils.awaitAnimationFrame()
     firstQuestion.setData(qta[0])
     allQuestionsToAsk.setData(qta)

src/UI/Popup/TagRendering/TagRenderingQuestion.svelte

@@ -35,6 +35,7 @@
 
   export let config: TagRenderingConfig
   export let tags: UIEventSource<Record<string, string>>
+
   export let selectedElement: Feature
   export let state: SpecialVisualizationState
   export let layer: LayerConfig | undefined
@@ -69,7 +70,10 @@
   /**
    * Prepares and fills the checkedMappings
    */
+  console.log("Initing ", config.id)
+
   function initialize(tgs: Record<string, string>, confg: TagRenderingConfig): void {
+    console.trace("Initing question state for", confg.id, config.id)
     mappings = confg.mappings?.filter((m) => {
       if (typeof m.hideInAnswer === "boolean") {
         return !m.hideInAnswer
@@ -137,11 +141,35 @@
 
   }
 
-  $: {
-    // Even though 'config' is not declared as a store, Svelte uses it as one to update the component
-    // We want to (re)-initialize whenever the 'tags' or 'config' change - but not when 'checkedConfig' changes
-    initialize($tags, config)
+  let usedKeys: string[] = config.usedTags().flatMap(t => t.usedKeys())
+  /**
+   * The 'minimalTags' is a subset of the tags of the feature, only containing the values relevant for this object.
+   * The main goal is to be stable and only 'ping' when an actual change is relevant
+   */
+  let minimalTags = new UIEventSource<Record<string, string>>(undefined)
+  tags.addCallbackAndRunD(tags => {
+    const previousMinimal = minimalTags.data
+    const newMinimal: Record<string, string> = {}
+    let somethingChanged = previousMinimal === undefined
+    for (const key of usedKeys) {
+      const newValue = tags[key]
+      somethingChanged ||= previousMinimal?.[key] !== newValue
+      if (newValue !== undefined && newValue !== null) {
+        newMinimal[key] = newValue
       }
+
+    }
+    if (somethingChanged) {
+      console.log("Updating minimal tags to", newMinimal,"of",config.id)
+      minimalTags.setData(newMinimal)
+    }
+  })
+
+  minimalTags.addCallbackAndRunD(tgs => {
+    initialize(tgs, config)
+  })
+
+
   onDestroy(
     freeformInput.subscribe((freeformValue) => {
       if (!mappings || mappings?.length == 0 || config.freeform?.key === undefined) {
@@ -179,7 +207,12 @@
           tags.data
         )
         if (state.featureSwitches.featureSwitchIsDebugging.data) {
-          console.log("Constructing change spec from", {freeform: $freeformInput, selectedMapping, checkedMappings, currentTags: tags.data}, " --> ", selectedTags)
+          console.log("Constructing change spec from", {
+            freeform: $freeformInput,
+            selectedMapping,
+            checkedMappings,
+            currentTags: tags.data
+          }, " --> ", selectedTags)
         }
       } catch (e) {
         console.error("Could not calculate changeSpecification:", e)
@@ -194,7 +227,7 @@
     }
     if (layer === undefined || (layer?.source === null && layer.id !== "favourite")) {
       /**
-       * This is a special, priviliged layer.
+       * This is a special, privileged layer.
        * We simply apply the tags onto the records
        */
       const kv = selectedTags.asChange(tags.data)