feat: recurse up to 3 levels resolving group previews

webui/src/components/display/BlobPreview.svelte

@@ -10,7 +10,7 @@
   import AddModal from "../AddModal.svelte";
 
   export let address: string;
-  export let recurse = true;
+  export let recurse = 3;
 
   $: ({ entity, entityInfo } = useEntity(address));
 
@@ -42,7 +42,7 @@
     model ||
     web ||
     fragment ||
-    (group && recurse);
+    (group && recurse > 0);
 
   let imageLoaded = null;
 </script>
@@ -53,7 +53,7 @@
       <ul class="group">
         {#each $entity.attr["HAS"].slice(0, 4) as child}
           <li>
-            <svelte:self address={child.value.c} recurse={false} />
+            <svelte:self address={child.value.c} recurse={recurse - 1} />
           </li>
         {/each}
       </ul>
@@ -132,6 +132,7 @@
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     min-height: 0;
+    margin: 2px;
     border: 1px solid var(--foreground);
     border-radius: 4px;