better quick search UX (preserves expanded state()

packages/web/src/appobj/AppObjectGroup.svelte

@@ -52,8 +52,9 @@
     </div>
   {/if}
 
-  {#each filtered as item}
+  {#each items as item}
     <AppObjectListItem
+      isHidden={!item.isMatched}
       {...$$restProps}
       {module}
       data={item.data}

packages/web/src/appobj/AppObjectList.svelte

@@ -69,8 +69,9 @@
     />
   {/each}
 {:else}
-  {#each filtered as data}
+  {#each list as data}
     <AppObjectListItem
+      isHidden={!filtered.includes(data)}
       {module}
       {subItemsComponent}
       {expandOnClick}

packages/web/src/appobj/AppObjectListItem.svelte

@@ -10,6 +10,7 @@
   import { tick } from 'svelte';
   import { plusExpandIcon } from '../icons/expandIcons';
 
+  export let isHidden;
   export let filter;
   export let module;
   export let data;
@@ -38,21 +39,23 @@
   $: if (!expandable && isExpanded) isExpanded = false;
 </script>
 
-<svelte:component
-  this={module.default}
-  {data}
-  on:click={handleExpand}
-  on:expand={handleExpandButton}
-  expandIcon={getExpandIcon(expandable, subItemsComponent, isExpanded, expandIconFunc)}
-  {checkedObjectsStore}
-  {module}
-  {disableContextMenu}
-/>
+{#if !isHidden}
+  <svelte:component
+    this={module.default}
+    {data}
+    on:click={handleExpand}
+    on:expand={handleExpandButton}
+    expandIcon={getExpandIcon(expandable, subItemsComponent, isExpanded, expandIconFunc)}
+    {checkedObjectsStore}
+    {module}
+    {disableContextMenu}
+  />
 
-{#if isExpanded && subItemsComponent}
-  <div class="subitems">
-    <svelte:component this={subItemsComponent} {data} {filter} />
-  </div>
+  {#if isExpanded && subItemsComponent}
+    <div class="subitems">
+      <svelte:component this={subItemsComponent} {data} {filter} />
+    </div>
+  {/if}
 {/if}
 
 <style>