preparing for adding positions to document

frontend/src/routes/document/TimeList.svelte

@@ -4,17 +4,33 @@
 
     let { company_id, onSelect = (time) => {} } = $props();
 
+    let projects = $state(null);
     let times = $state(null);
     let error = $state(null);
 
-    async function loadTimes(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/times/list`;
+    async function loadProjects(){
+        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/project/list`;
         let data = { company_id: company_id };
         const resp = await fetch(url,{
             credentials:'include',
             method: 'POST',
             body: JSON.stringify(data)
         });
+        if (resp.ok){
+            projects = await resp.json();
+        } else {
+            error = await resp.body();
+        }
+    }
+
+    async function loadTimes(projectId){
+        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/times/list`;
+        let data = { company_id: company_id, project_id: projectId };
+        const resp = await fetch(url,{
+            credentials:'include',
+            method: 'POST',
+            body: JSON.stringify(data)
+        });
         if (resp.ok){
             times = await resp.json();
         } else {
@@ -22,11 +38,24 @@
         }
     }
 
-    onMount(loadTimes);
+    onMount(loadProjects);
 </script>
 
 <div>
     <h1>Times</h1>
+    {#if projects}
+    {#each projects as project,idx1}
+    <button onclick={() => loadTimes(project.id)}>{project.name}</button>
+    {/each}
+    {/if}
     {#if times}
+    {#each times as time,idx2}
+    <div class="time" onclick={() => onSelect(time)}>
+        <span class="duration">{(time.duration).toFixed(3)} {t('hours')}</span>
+        <span class="subject">{time.subject}</span>
+        <span class="start_time">{time.start_time}</span>
+        <span class="description">{@html time.description.rendered}</span>
+    </div>
+    {/each}
     {/if}
 </div>