working on location tree

frontend/src/routes/stock/Index.svelte

@@ -1,47 +1,26 @@
 <script>
+    import { onMount }      from 'svelte';
+    import { api }          from '../../urls.svelte';
+    import { error, yikes } from '../../warn.svelte';
+    import { t }            from '../../translations.svelte';
+
     import Locations from './Locations.svelte';
     import ItemList         from './ItemList.svelte';
     import ItemProps        from './ItemProps.svelte';
 
-    import { t }            from '../../translations.svelte';
-    let companies = [
-        {
-            id: 1,
-            name: 'SRSoftware',
-            locations:{
-                Langenorla:{
-                    Hauptgebäude:{
-                        Obergeschoss:{
-                        },
-                        Untergeschoss:{
-                            Einliegerwohnung:{
-                                Bad:{
-                                },
-                                Küche:{
-                                },
-                                Wohnzimmer:{
-                                }
-                            },
-                            Flur:{
-                            },
-                            Küche:{
-                            },
-                            Studio:{
-                            }
-                        },
-                        Werkstatt:{
-                        }
-                    },
-                    Nebengebäude:{
-                    },
-                    Grundstück:{
-                    }
-                }
-            }
-        },
 
-        { id: 2, name: 'Alrauna', locations: {} }
-    ]
+    let top_level = $state(null);
+
+    async function load(){
+        const url = api('stock/locations/of_user')
+        const res = await fetch(url,{credentials:'include'});
+        if (res.ok){
+            top_level = await res.json();
+            yikes();
+        } else error(res);
+    }
+
+    onMount(load);
 </script>
 
 <h2>{t('Stock')}</h2>
@@ -49,11 +28,14 @@
     <tbody>
         <tr>
             <td class="locations">
-                {#each companies as company}
-                <h3>{company.name}</h3>
-
-                <Locations locations={company.locations} />
+                {#if top_level}
+                {#each top_level as realm,idx}
+                <h3>{realm.name}</h3>
+                {#if realm.locations}
+                <Locations locations={realm.locations} />
+                {/if}
                 {/each}
+                {/if}
             </td>
             <td class="items">
                 <ItemList />

frontend/src/routes/stock/Locations.svelte

@@ -2,6 +2,8 @@
     import { t } from '../../translations.svelte';
 
     let { locations } = $props();
+
+    console.log(locations);
 </script>
 
 <ul>
@@ -10,10 +12,12 @@
             <span class="symbol"></span> {t('add_object',{object:'location'})}
         </a>
     </li>
-    {#each Object.entries(locations) as [k,v]}
+    {#each locations as location}
     <li>
-        {k}
-        <svelte:self locations={v}  />
+        {location.name}
+        {#if location.locations}
+        <svelte:self locations={location.locations} />
+        {/if}
     </li>
     {/each}
 </ul>