UX: styling, fix import, hide brands immediately, sort brands by frequency, see #2071

src/Logic/Web/NameSuggestionIndex.ts

@@ -142,9 +142,15 @@ export default class NameSuggestionIndex {
         type: string,
         tags: Record<string, string>,
         country: string[],
-        location?: [number, number]
+        location?: [number, number],
+        options?:{
+            /**
+             * If set, sort by frequency instead of alphabetically
+             */
+            sortByFrequency: boolean
+        }
     ): Promise<Mapping[]> {
-        const mappings: Mapping[] = []
+        const mappings: (Mapping & {frequency: number})[] = []
         const frequencies = await NameSuggestionIndex.fetchFrequenciesFor(type, country)
         for (const key in tags) {
             if (key.startsWith("_")) {
@@ -180,7 +186,7 @@ export default class NameSuggestionIndex {
                     addExtraTags: Object.keys(tags)
                         .filter((k) => k !== type)
                         .map((k) => new Tag(k, tags[k])),
-                    then: new TypedTranslation<Record<string, never>>({ "*": nsiItem.displayName }),
+                    then: new TypedTranslation<Record<string, never>>({ "*": nsiItem.displayName +" "+(frequency) }),
                     hideInAnswer: false,
                     ifnot: undefined,
                     alsoShowIf: undefined,
@@ -190,9 +196,14 @@ export default class NameSuggestionIndex {
                     // As such, it should be "true" but this is not supported
                     priorityIf: frequency > 0 ? new RegexTag("id", /.*/) : undefined,
                     searchTerms: { "*": [nsiItem.displayName, nsiItem.id] },
+                    frequency: frequency ?? -1
                 })
             }
         }
+        if(options?.sortByFrequency){
+            mappings.sort((a, b) => b.frequency - a.frequency)
+        }
+
         return mappings
     }
 

src/Models/ThemeConfig/TagRenderingConfig.ts

@@ -1,11 +1,10 @@
 import { Translation, TypedTranslation } from "../../UI/i18n/Translation"
 import { TagsFilter } from "../../Logic/Tags/TagsFilter"
 import Translations from "../../UI/i18n/Translations"
-import { TagUtils, UploadableTag } from "../../Logic/Tags/TagUtils"
+import { TagUtils } from "../../Logic/Tags/TagUtils"
 import { And } from "../../Logic/Tags/And"
 import { Utils } from "../../Utils"
 import { Tag } from "../../Logic/Tags/Tag"
-import Link from "../../UI/Base/Link"
 import {
     MappingConfigJson,
     QuestionableTagRenderingConfigJson,
@@ -18,6 +17,7 @@ import NameSuggestionIndex from "../../Logic/Web/NameSuggestionIndex"
 import { GeoOperations } from "../../Logic/GeoOperations"
 import { Feature } from "geojson"
 import MarkdownUtils from "../../Utils/MarkdownUtils"
+import { UploadableTag } from "../../Logic/Tags/TagTypes"
 
 export interface Mapping {
     readonly if: UploadableTag
@@ -928,9 +928,7 @@ export default class TagRenderingConfig {
      * The keys that should be erased if one has to revert to 'unknown'.
      * Might give undefined
      */
-    public
+    public settableKeys(): string[] | undefined {
-
-    settableKeys(): string[] | undefined {
         const toDelete = new Set<string>()
         if (this.freeform) {
             toDelete.add(this.freeform.key)
@@ -966,7 +964,8 @@ export class TagRenderingConfigUtils {
                     config.freeform.key,
                     tags,
                     country.split(";"),
-                    center
+                    center,
+                    {sortByFrequency: true}
                 )
             )
         })

src/UI/Popup/TagRendering/TagRenderingQuestion.svelte

@@ -21,7 +21,6 @@
   import { Unit } from "../../../Models/Unit"
   import UserRelatedState from "../../../Logic/State/UserRelatedState"
   import { twJoin } from "tailwind-merge"
-  import type { UploadableTag } from "../../../Logic/Tags/TagUtils"
   import { TagUtils } from "../../../Logic/Tags/TagUtils"
 
   import Search from "../../../assets/svg/Search.svelte"
@@ -33,6 +32,7 @@
   import { get } from "svelte/store"
   import Markdown from "../../Base/Markdown.svelte"
   import { Utils } from "../../../Utils"
+  import type { UploadableTag } from "../../../Logic/Tags/TagTypes"
 
   export let config: TagRenderingConfig
   export let tags: UIEventSource<Record<string, string>>
@@ -303,8 +303,10 @@
   let numberOfCs = state?.osmConnection?.userDetails?.data?.csCount ?? 0
   let question = config.question
   let hideMappingsUnlessSearchedFor =
-    config.mappings.length > 8 && config.mappings.some((m) => m.priorityIf)
+    config.mappings.length > 8 && config.mappings.some((m) => m.priorityIf !== undefined)
   $: question = config.question
+  $: hideMappingsUnlessSearchedFor = config.mappings.length > 8 && config.mappings.some((m) => m.priorityIf !== undefined)
+
   if (state?.osmConnection) {
     onDestroy(
       state.osmConnection?.userDetails?.addCallbackAndRun((ud) => {
@@ -359,7 +361,7 @@
             />
           </div>
           {#if hideMappingsUnlessSearchedFor}
-            <div class="m-1 rounded border border-dashed border-black p-1 px-2">
+            <div class="m-1 rounded border border-dashed border-black p-1 px-2 flex items-center">
               <Tr t={Translations.t.general.mappingsAreHidden} />
             </div>
           {/if}