Feat(filters): show tags that are filtered on, deal with multi-answer tags to allow having this option with auto-filters

src/Models/ThemeConfig/Conversion/PrepareLayer.ts

@@ -33,6 +33,8 @@ import LineRenderingConfigJson from "../Json/LineRenderingConfigJson"
 import { ConversionContext } from "./ConversionContext"
 import { ExpandRewrite } from "./ExpandRewrite"
 import { TagUtils } from "../../../Logic/Tags/TagUtils"
+import { Tag } from "../../../Logic/Tags/Tag"
+import { RegexTag } from "../../../Logic/Tags/RegexTag"
 
 class AddFiltersFromTagRenderings extends DesugaringStep<LayerConfigJson> {
     constructor() {
@@ -138,16 +140,22 @@ class ExpandFilter extends DesugaringStep<LayerConfigJson> {
                 "Found a matching tagRendering to base a filter on, but this tagRendering does not contain any mappings"
             )
         }
-        const options = (<QuestionableTagRenderingConfigJson>tr).mappings.map((mapping) => {
+        const qtr = (<QuestionableTagRenderingConfigJson>tr)
+        const options = qtr.mappings.map((mapping) => {
             let icon: string = mapping.icon?.["path"] ?? mapping.icon
             let emoji: string = undefined
             if (Utils.isEmoji(icon)) {
                 emoji = icon
                 icon = undefined
             }
+            let osmTags = TagUtils.Tag( mapping.if)
+            if(qtr.multiAnswer && osmTags instanceof Tag){
+                osmTags = new RegexTag(osmTags.key, new RegExp("^(.+;)?"+osmTags.value+"(;.+)$","is"))
+            }
+
             return <FilterConfigOptionJson>{
                 question: mapping.then,
-                osmTags: mapping.if,
+                osmTags: osmTags.asJson(),
                 searchTerms: mapping.searchTerms,
                 icon,
                 emoji,

src/UI/BigComponents/Filterview.svelte

@@ -13,6 +13,7 @@
   import Tr from "../Base/Tr.svelte"
   import Translations from "../i18n/Translations"
   import type { SpecialVisualizationState } from "../SpecialVisualization"
+  import Constants from "../../Models/Constants"
 
   export let state: SpecialVisualizationState
   export let filteredLayer: FilteredLayer
@@ -22,6 +23,7 @@
   let isDisplayed: UIEventSource<boolean> = filteredLayer.isDisplayed
 
   let isDebugging = state?.featureSwitches?.featureSwitchIsDebugging ?? new ImmutableStore(false)
+  let showTags = state?.userRelatedState?.showTags?.map(s => (s === "yes" && state?.userRelatedState?.osmConnection?.userDetails?.data?.csCount >= Constants.userJourney.tagsVisibleAt) || s === "always" || s === "full")
 
   /**
    * Gets a UIEventSource as boolean for the given option, to be used with a checkbox
@@ -31,7 +33,7 @@
     return state.sync(
       (f) => f === 0,
       [],
-      (b) => (b ? 0 : undefined)
+      (b) => (b ? 0 : undefined),
     )
   }
 
@@ -67,6 +69,10 @@
             {#if filter.options.length === 1 && filter.options[0].fields.length === 0}
               <Checkbox selected={getBooleanStateFor(filter)}>
                 <Tr t={filter.options[0].question} />
+                <span class="subtle">
+                  {filter.options[0].osmTags.asHumanString()}
+                </span>
+
               </Checkbox>
             {/if}
 
@@ -82,6 +88,9 @@
                       {option.emoji}
                     {/if}
                     <Tr t={option.question} />
+                    {#if $showTags && option.osmTags !== undefined}
+                     &nbsp;({option.osmTags.asHumanString()})
+                    {/if}
                   </option>
                 {/each}
               </Dropdown>