working on loading items for location

frontend/src/routes/stock/Index.svelte

@@ -10,6 +10,21 @@
 
 
     let top_level = $state(null);
+    let selected = $state(null);
+    let items = $derived(loadItems(selected));
+
+    async function loadItems(loc){
+        if (!loc) return null;
+        const url = api(`stock/items_at/${loc.id}`)
+        const res = await fetch(url,{credentials:'include'});
+        if (res.ok){
+            yikes();
+            return loc.name;
+        } else {
+            error(res);
+            return null;
+        }
+    }
 
     async function load(){
         const url = api('stock/locations/of_user')
@@ -32,12 +47,18 @@
                 {#each top_level as realm,idx}
                 <h3>{realm.name}</h3>
                 {#if realm.locations}
-                <Locations locations={realm.locations} />
+                <Locations locations={realm.locations} bind:selected />
                 {/if}
                 {/each}
                 {/if}
             </td>
             <td class="items">
+                {#if selected}
+                <h3>{selected.name}</h3>
+                {/if}
+                {#if items}
+                <pre>{JSON.stringify(items)}</pre>
+                {/if}
                 <ItemList />
             </td>
             <td class="properties">

frontend/src/routes/stock/Locations.svelte

@@ -3,11 +3,12 @@
     import { error, yikes } from '../../warn.svelte';
     import { t }   from '../../translations.svelte';
 
-    let { locations } = $props();
+    let { locations, selected = $bindable(null) } = $props();
 
     async function toggleChildren(ev, location){
         ev.preventDefault();
         ev.stopPropagation();
+        selected = location;
         if (location.locations) {
             delete location.locations;
         } else {
@@ -32,7 +33,7 @@
     <li onclick={e => toggleChildren(e, location)} class={location.locations?'expanded':'collapsed'}>
         {location.name}
         {#if location.locations}
-        <svelte:self locations={location.locations} />
+        <svelte:self locations={location.locations} bind:selected />
         {/if}
     </li>
     {/each}