working on file module

frontend/src/routes/files/Index.svelte

@@ -2,25 +2,32 @@
     import { onMount }       from 'svelte';
     import { useTinyRouter } from 'svelte-tiny-router';
     import { api }           from '../../urls.svelte';
-    import { error }         from '../../warn.svelte';
+    import { error, yikes }         from '../../warn.svelte';
     import { t }             from '../../translations.svelte';
     import { user }          from '../../user.svelte';
 
     const router = useTinyRouter();
     let children = $state({});
+    let path = $state(router.path)
 
-    async function loadChildren(path){
-        path = path.substring(6);
-        if (path == '') path = '/';
-        children = { dirs : {}};
-        if (path == '/'){
-            children.dirs[t('my_files')]  = `user/${user.id}`;
-            children.dirs[t('projects')]  = `projects`;
-            children.dirs[t('companies')] = `company`;
+    async function loadChildren(p){
+        p = p.substring(6);
+        if (p == '') p = '/';
+        children = { dirs : {}, files : {}, title : p};
+        console.log(p);
+        if (p == '/'){
+            children.dirs[`/user/${user.id}`]  = t('my_files');
+            children.dirs['/project']  = t('projects')
+            children.dirs['/company'] = t('companies');
         } else {
-            const url = api(`files${path}`);
+            const url = api(`files${p}`);
             const res = await fetch(url,{credentials:'include'});
             if (res.ok){
+                let json = await res.json();
+                if (json.dirs) children.dirs = json.dirs;
+                if (json.files) children.files = json.files;
+                if (json.title) children.title = json.title;
+                yikes();
             } else {
                 error(res);
             }
@@ -45,14 +52,24 @@
     onMount(() => loadChildren(window.location.pathname));
 </script>
 
-<h1>{t('files')} – {router.path}</h1>
+<h1>{t('files')} – {children?.title}</h1>
 
-{#if children?.dirs}
 <ul>
+{#if children?.dirs}
 {#each Object.entries(children.dirs) as [k,v]}
-    <li>
-        <a href={router.fullPath+'/'+v} {onclick}>{k}</a>
+    <li class="dir">
+        <span class="symbol"></span>
+        <a href={'/files'+k} {onclick}>{v}</a>
+    </li>
+{/each}
+ {/if}
+{#if children.files}
+{#each Object.entries(children.files) as [k,v]}
+    <li class="file">
+        <span class="symbol"></span>
+        <a href={'/files'+k} {onclick}>{v}</a>
     </li>
 {/each}
-</ul>
 {/if}
+</ul>
+