feat(webui): display KEYs in UpObject banner

webui/src/components/display/UpObject.svelte

@@ -58,6 +58,7 @@
   $: resolving = inferredIds.concat(labels || []).length == 0 && !$entity;
 
   $: fetchAddressLabels(address);
+
   async function fetchAddressLabels(address: string) {
     addressIds = [];
     await Promise.all(
@@ -91,6 +92,7 @@
   // Resolved backpath
   let resolvedBackpath: string[] = [];
   $: if (backpath) resolveBackpath();
+
   async function resolveBackpath() {
     resolvedBackpath = [];
     let levels = 0;
@@ -187,11 +189,16 @@
           <UpObjectLabel label={displayLabel} backpath={resolvedBackpath} />
         {/if}
       </div>
-      <div class="type">
-        {$entityInfo?.t}
-        {#if $entityInfo?.t === "Url" || $entityInfo?.t === "Attribute"}
-          &mdash; {$entityInfo.c}
+      <div class="secondary">
+        {#if $entity?.get("KEY")}
+          <div class="key">{$entity.get("KEY")}</div>
         {/if}
+        <div class="type">
+          {$entityInfo?.t}
+          {#if $entityInfo?.t === "Url" || $entityInfo?.t === "Attribute"}
+            &mdash; {$entityInfo.c}
+          {/if}
+        </div>
       </div>
     </div>
     {#if banner}
@@ -298,14 +305,22 @@
       gap: 0.1em;
     }
 
-    .type {
+    .secondary {
       font-size: 0.66em;
-      opacity: 0.7;
       display: none;
+      opacity: 0.7;
     }
 
-    &.show-type .type,
-    &.banner .type {
+    .key {
+      color: colors.$yellow;
+
+      &:before {
+        content: "#";
+      }
+    }
+
+    &.show-type .secondary,
+    &.banner .secondary {
       display: unset;
     }
   }