Add link to ticket detail page.

src/routes/tasks/+page.svelte

@@ -17,10 +17,14 @@
 		<tbody>
 			{#each data.tasks.tasks as task (task.id)}
 				<tr>
-					<td
-						>{task.type?.prefix +
-							task.taskId}</td
+					<td>
+						<a
+							href={`/tasks/${task.type.prefix}${task.taskId}`}
 						>
+							{task.type?.prefix +
+								task.taskId}
+						</a>
+					</td>
 					<td>{task.description}</td>
 					<td>{task.status}</td>
 				</tr>

src/routes/tasks/[task_id]/+page.server.ts

@@ -0,0 +1,9 @@
+import TasksService from "$lib/server/services/tasks";
+import type { PageServerData } from "./$types";
+
+export const load: PageServerData = async ({ params }) => {
+  const tasks = new TasksService("internal");
+  return {
+    task: await tasks.getByTaskId([params.task_id]),
+  };
+};

src/routes/tasks/[task_id]/+page.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	import type { PageProps } from "./$types";
+
+	let { data }: PageProps = $props();
+	const task = data.task.tasks[0];
+</script>
+
+<h1>{`[[${task.type.prefix}${task.taskId}]] - ${task.description}`}</h1>
+<div class="container">
+	<p><strong>{task.status}</strong></p>
+	<p><strong>{task.priority}</strong></p>
+</div>
+<div>
+	<h2>Body</h2>
+	<p>{task.body}</p>
+</div>
+
+<style>
+	.container {
+		display: flex;
+		gap: 1rem;
+	}
+</style>