Merge pull request #12 from fullstacks-academy/add-unit-test

add unit test

Author: ASafaeirad

.github/workflows/verify.yaml

@@ -20,3 +20,4 @@ jobs:
       - run: pnpm format
       - run: pnpm lint
       - run: pnpm build
+      - run: pnpm test

.husky/pre-push

@@ -0,0 +1 @@
+pnpm run test

package.json

@@ -10,7 +10,8 @@
     "lint": "eslint .",
     "preview": "vite preview",
     "format": "prettier --check ./src",
-    "prepare": "husky"
+    "prepare": "husky",
+    "test": "vitest"
   },
   "dependencies": {
     "@dnd-kit/core": "6.3.1",
@@ -37,6 +38,7 @@
     "prettier": "3.6.2",
     "tailwindcss": "4.1.14",
     "typescript": "5.9.3",
-    "vite": "7.1.10"
+    "vite": "7.1.10",
+    "vitest": "3.2.4"
   }
 }

pnpm-lock.yaml

@@ -22,6 +22,7 @@ import {
   useReorderColumns,
   useReorderTasks,
 } from "../lib/useBoard";
+import { groupTasksByColumn } from "../utils/groupTaskByColumn";
 import { NewColumn } from "./NewColumn";
 import { SortableColumn } from "./SortableColumn";
 import { TaskCard } from "./TaskCard";
@@ -77,16 +78,7 @@ export function Board() {
 
   const { columns, tasks } = boardData;
 
-  const tasksByColumn = tasks.reduce(
-    (acc, task) => {
-      if (!acc[task.column_id]) {
-        acc[task.column_id] = [];
-      }
-      acc[task.column_id].push(task);
-      return acc;
-    },
-    {} as Record<string, Task[]>,
-  );
+  const tasksByColumn = groupTasksByColumn(tasks);
 
   const handleDragStart = (event: DragStartEvent) => {
     const { active } = event;

src/components/Board.tsx

@@ -0,0 +1,43 @@
+import { describe, expect, it } from "vitest";
+
+import type { Task } from "../lib/apiClient";
+
+import { groupTasksByColumn } from "./groupTaskByColumn";
+
+describe("groupTasksByColumn", () => {
+  it("should group tasks by column", () => {
+    const tasks: Task[] = [
+      {
+        id: "1",
+        column_id: "1",
+        title: "Task 1",
+        description: null,
+        order_index: 0,
+        created_at: new Date().toISOString(),
+      },
+      {
+        id: "2",
+        column_id: "1",
+        title: "Task 2",
+        description: null,
+        order_index: 0,
+        created_at: new Date().toISOString(),
+      },
+      {
+        id: "3",
+        column_id: "10",
+        title: "Task 3",
+        description: null,
+        order_index: 0,
+        created_at: new Date().toISOString(),
+      },
+    ];
+
+    const columns = groupTasksByColumn(tasks);
+
+    expect(columns).toEqual({
+      "1": [tasks[0], tasks[1]],
+      "10": [tasks[2]],
+    });
+  });
+});

src/utils/groupTaskByColumn.spec.ts

@@ -0,0 +1,4 @@
+import type { Task } from "../lib/apiClient";
+
+export const groupTasksByColumn = (tasks: Task[]) =>
+  Object.groupBy(tasks, (t) => t.column_id);

src/utils/groupTaskByColumn.ts

@@ -3,7 +3,7 @@
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
     "target": "ES2022",
     "useDefineForClassFields": true,
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "lib": ["ES2024", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,