improved task list

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>

frontend/src/routes/project/List.svelte

@@ -94,8 +94,7 @@
                     {/if}
                 </td>
                 <td class="state" onclick={() => show(project.id)} >
-
-                    {t("state_"+project.allowed_states[project.status].toLowerCase())}
+                    {t("state_"+project.allowed_states[project.status]?.toLowerCase())}
                 </td>
                 <td class="members" onclick={() => show(project.id)} >
                     {#each Object.entries(project.members) as [uid,member]}

frontend/src/routes/task/Index.svelte

@@ -9,6 +9,10 @@
     let projects = $state({});
     let router = useTinyRouter();
     let tasks = $state(null);
+    let bounds = $state({offset:0,limit:256});
+    let loading = $state(true);
+    let map = $state({});
+    let hidden = $state({});
 
     async function changeState(tid,state){
         const task = tasks[tid];
@@ -43,24 +47,37 @@
         router.navigate(`/${module}/${id}/view`);
     }
 
-    async function load(){
-        let url  = api('task');
-        let resp = await fetch(url,{credentials:'include'});
-        let project_ids = {};
+    async function loadProject(pid){
+        const url  = api(`project/${pid}`);
+        const resp = await fetch(url,{credentials:'include'});
         if (resp.ok){
-            tasks = await resp.json();
-            for (let task of (Object.values(tasks))) project_ids[task.project_id] = true;
+            projects[pid] = await resp.json();
         } else {
             error = await resp.text();
         }
-        for (let pid of Object.keys(project_ids)){
-            url  = api(`project/${pid}`);
-            resp = await fetch(url,{credentials:'include'});
-            if (resp.ok){
-                projects[pid] = await resp.json();
-            } else {
-                error = await resp.text();
+    }
+
+    async function load(){
+        const url  = api(`task?offset=${bounds.offset}&limit=${bounds.limit}`);
+        const resp = await fetch(url,{credentials:'include'});
+        if (resp.ok){
+            let newTasks = await resp.json();
+            if (bounds.offset == 0) {
+                tasks = newTasks;
+            } else tasks = tasks.concat(newTasks);
+            loading = newTasks.length;
+            if (loading){
+                for (let task of newTasks) {
+                    map[task.id] = task;
+                    if (task.parent_task_id) hidden[task.parent_task_id] = true;
+                    let pid = task.project_id;
+                    if (pid && !projects[pid]) await loadProject(pid);
+                }
+                bounds.offset += bounds.limit;
+                load();
             }
+        } else {
+            error = await resp.text();
         }
     }
 
@@ -80,7 +97,7 @@
 </script>
 
 <fieldset>
-    <legend>{t('task_list')}</legend>
+    <legend>{loading ? t('loading_object',{object:t('task_list')}) : t('task_list')}</legend>
     {#if error}
     <soan class="error">{error}</soan>
     {/if}
@@ -97,14 +114,14 @@
             </tr>
         </thead>
         <tbody>
-            {#each Object.entries(tasks) as [tid,task]}
-            {#if task.status < 60}
+            {#each tasks as task (task.id)}
+            {#if task.status > 10 && task.status < 60 && !task.no_index && projects[task.project_id]?.status < 60 && !hidden[task.id]}
             <tr>
-                <td onclick={() => go('task',tid)}>{task.name}</td>
+                <td onclick={() => go('task',task.id)}>{task.name}</td>
                 <td>
                     <a href="#" onclick={() => go('project',task.project_id)}> {projects[task.project_id]?.name}</a>
                     {#if task.parent_task_id}
-                    : <a href="#" onclick={() => go('task',task.parent_task_id)}>{tasks[task.parent_task_id]?.name}</a>
+                    : <a href="#" onclick={() => go('task',task.parent_task_id)}>{map[task.parent_task_id]?.name}</a>
                     {/if}
                 </td>
                 <td>