working on form to add subtask

frontend/src/routes/task/View.svelte

@@ -55,6 +55,16 @@
         }
     }
 
+    async function loadParent(){
+        const url = api(`task/${task.parent_task_id}`);
+        const resp = await fetch(url,{credentials:'include'});
+        if (resp.ok){
+            task.parent = await resp.json();
+        } else {
+            error = await resp.text();
+        }
+    }
+
     async function loadTask(){
         const url = api(`task/${id}`);
         const resp = await fetch(url,{credentials:'include'});
@@ -65,6 +75,7 @@
             children = null;
             loadChildren();
             if (task.project_id) loadProject();
+            if (task.parent_task_id) loadParent();
         } else {
             error = await resp.text();
         }
@@ -74,6 +85,11 @@
         if (!project) return;
         router.navigate(`/project/${project.id}/view`)
     }
+
+    function gotoParent(){
+        if (!task.parent_task_id) return;
+        router.navigate(`/task/${task.parent_task_id}/view`)
+    }
 </script>
 
 {#if error}
@@ -88,9 +104,15 @@
             <td class="project name" onclick={gotoProject}>{project.name}</td>
         </tr>
         {/if}
+        {#if task.parent}
+        <tr>
+            <th>{t('parent_task')}</th>
+            <td class="parent task" onclick={gotoParent}>{task.parent.name}</td>
+        </tr>
+        {/if}
         <tr>
             <th>{t('task')}</th>
-            <td class="task name">{task.name}</td>
+            <td class="task name" >{task.name}</td>
         </tr>
         {#if task.description.rendered}
         <tr>
@@ -127,15 +149,15 @@
                 </ul>
             </td>
         </tr>
-        {#if children}
         <tr>
             <th>{t('subtasks')}</th>
             <td class="task children">
                 <button onclick={addChild} >{t('add_subtask')}</button>
+                {#if children}
                 <TaskList tasks={children} {estimated_time} />
+                {/if}
             </td>
         </tr>
-        {/if}
     </tbody>
 </table>
 {/if}