feat, style: attribute sections in inspect are headed by upobjects

webui/src/components/EntryView.svelte

@@ -18,13 +18,14 @@
   import IconButton from "./utils/IconButton.svelte";
   import { createEventDispatcher, type ComponentType } from "svelte";
   import UpLink from "./display/UpLink.svelte";
+  import UpObject from "./display/UpObject.svelte";
   const dispatch = createEventDispatcher();
 
   export let entries: UpEntry[];
   export let widgets: Widget[] | undefined = undefined;
   export let initialWidget: string | undefined = undefined;
   export let title: string | undefined = undefined;
-  export let link: string | undefined = undefined;
+  export let group: string | undefined = undefined;
   export let icon: string | undefined = undefined;
   export let highlighted = false;
   export let editable = false;
@@ -73,15 +74,13 @@
 <section class="entry-view labelborder" class:highlighted>
   <header>
     <h3>
-      {#if link}
-        <UpLink to={{ entity: link }}>
-          {#if icon}
-            <div class="icon">
-              <Icon name={icon} />
-            </div>
-          {/if}
-          {title || ""}
-        </UpLink>
+      {#if group}
+        {#if icon}
+          <div class="icon">
+            <Icon name={icon} />
+          </div>
+        {/if}
+        <UpObject link address={group} labels={title ? [title] : undefined} />
       {:else}
         {#if icon}
           <div class="icon">

webui/src/components/Inspect.svelte

@@ -79,17 +79,17 @@
     );
 
     typeAddresses.forEach((address) => {
-        let labels = labelsQuery.getObject(address).identify();
+      let labels = labelsQuery.getObject(address).identify();
 
-        let typeLabel: string | undefined;
-        if (typeLabel) {
-          labels.unshift(typeLabel);
-        }
+      let typeLabel: string | undefined;
+      if (typeLabel) {
+        labels.unshift(typeLabel);
+      }
 
-        allTypes[address] = {
-          labels,
-          attributes: [],
-        };
+      allTypes[address] = {
+        labels,
+        attributes: [],
+      };
     });
 
     const attributes = await api.query(
@@ -375,13 +375,13 @@
                 on:change={onChange}
                 highlighted={highlightedType == typeAddr}
                 title={$allTypes[typeAddr].labels.join(" | ")}
-                link={typeAddr}
+                group={typeAddr}
               />
             {/each}
 
             {#if currentUntypedAttributes.length > 0 || editable}
               <EntryView
-                title={$i18n.t("Attributes")}
+                title={$i18n.t("Other Attributes")}
                 {editable}
                 widgets={attributeWidgets}
                 entries={currentUntypedAttributes}