feat: add sort and tick to dashboard UI

components/Board.tsx

@@ -0,0 +1,36 @@
+"use client";
+import { useState } from "react";
+import Column from "./Column";
+
+export default function Board() {
+  const [tasks, setTasks] = useState([
+    { id: 1, title: "Task 1", description: "Do something", status: "Todo", dueDate: "2026-08-10", topic: "Lab" },
+    { id: 2, title: "Task 2", description: "Another thing", status: "In-Progress", dueDate: "2026-08-12", topic: "Project" },
+  ]);
+
+  const handleStatusChange = (taskId: number, newStatus: "Todo" | "In-Progress" | "Complete") => {
+    setTasks(prev =>
+      prev.map(t => (t.id === taskId ? { ...t, status: newStatus } : t))
+    );
+  };
+
+  return (
+    <div style={{ display: "flex", gap: "20px" }}>
+      <Column
+        title="Todo"
+        tasks={tasks.filter(t => t.status === "Todo")}
+        onStatusChange={handleStatusChange}
+      />
+      <Column
+        title="In-Progress"
+        tasks={tasks.filter(t => t.status === "In-Progress")}
+        onStatusChange={handleStatusChange}
+      />
+      <Column
+        title="Complete"
+        tasks={tasks.filter(t => t.status === "Complete")}
+        onStatusChange={handleStatusChange}
+      />
+    </div>
+  );
+}