UX: fix #2089, improve background selection hotkeys and add emoji to indicate categories of background layers

src/UI/Map/RasterLayerPicker.svelte

@@ -23,7 +23,7 @@
   let rasterLayerId = rasterLayer.sync(
     (l) => l?.properties?.id,
     [],
-    (id) => availableLayers.find((l) => l.properties.id === id)
+    (id) => availableLayers.find((l) => l.properties.id === id),
   )
   rasterLayer.setData(availableLayers[0])
   $: rasterLayer.setData(availableLayers[0])
@@ -36,13 +36,13 @@
           return
         }
         rasterLayer.setData(fav)
-      })
+      }),
     )
 
     onDestroy(
       rasterLayer.addCallbackAndRunD((selected) => {
         favourite?.setData(selected.properties.id)
-      })
+      }),
     )
   }
 
@@ -56,7 +56,7 @@
         } else {
           rasterLayerOnMap.setData(undefined)
         }
-      })
+      }),
     )
   }
 
@@ -93,6 +93,15 @@
       {#each availableLayers as availableLayer}
         <option value={availableLayer.properties.id}>
           {availableLayer.properties.name}
+          {#if availableLayer.properties.category.startsWith("historic")}
+            ⏱️
+          {/if}
+          {#if availableLayer.properties.category.endsWith("elevation")}
+            ⛰
+          {/if}
+          {#if availableLayer.properties.best}
+            ⭐
+          {/if}
         </option>
       {/each}
     </select>