[ui] copy&paste new sorting to gallery

todo - DRY?

webui/src/components/widgets/Gallery.svelte

@@ -1,5 +1,8 @@
 <script lang="ts">
-  import type { UpEntry } from "upend";
+  import { readable, Readable } from "svelte/store";
+
+  import type { UpEntry, UpListing } from "upend";
+import { query } from "../../lib/entity";
   import Thumbnail from "./gallery/Thumbnail.svelte";
 
   export let entries: UpEntry[];
@@ -24,6 +27,25 @@
     if (resort && changed) sortAttributes();
   }
 
+  // Labelling
+  let labelListing: Readable<UpListing> = readable(undefined);
+  $: {
+    const addresses = [];
+    entries
+      .flatMap((e) =>
+        e.value.t === "Address" ? [e.entity, e.value.c] : [e.entity]
+      )
+      .forEach((addr) => {
+        if (!addresses.includes(addr)) {
+          addresses.push(addr);
+        }
+      });
+
+    const addressesString = addresses.map((addr) => `"${addr}"`).join(" ");
+
+    labelListing = query(`(matches (in ${addressesString}) "LBL" ? )`).result;
+  }
+
   function sortAttributes() {
     sortedAttributes = entries
       .concat()
@@ -85,6 +107,26 @@
       });
   }
 
+  $: {
+    if ($labelListing) {
+      entries.forEach((entry) => {
+        addSortKeys(
+          entry.entity,
+          $labelListing.getObject(entry.entity).identify()
+        );
+
+        if (entry.value.t === "Address") {
+          addSortKeys(
+            entry.value.c,
+            $labelListing.getObject(String(entry.value.c)).identify(),
+            false
+          );
+        }
+      });
+      sortAttributes();
+    }
+  }
+
   entries.forEach((entry) => {
     addSortKeys(entry.entity, entry.listing.getObject(entry.entity).identify());
     if (entry.value.t === "Address") {