Implemented test run editor's test case selection

frontend/app/projects/[projectId]/runs/[runId]/RunEditor.tsx

@@ -29,6 +29,7 @@ import {
 import TestCaseSelector from "./TestCaseSelector";
 import { testRunStatus } from "@/config/selection";
 import { RunType } from "@/types/run";
+import { CaseType } from "@/types/case";
 import { FolderType } from "@/types/folder";
 import { fetchRun, updateRun } from "../runsControl";
 import { fetchFolders } from "../../folders/foldersControl";
@@ -61,8 +62,8 @@ export default function RunEditor({ projectId, runId }: Props) {
   useEffect(() => {
     async function fetchDataEffect() {
       try {
-        const caseData = await fetchRun(runId);
-        setTestRun(caseData);
+        const runData = await fetchRun(runId);
+        setTestRun(runData);
         const foldersData = await fetchFolders(projectId);
         setFolders(foldersData);
       } catch (error) {
@@ -78,6 +79,31 @@ export default function RunEditor({ projectId, runId }: Props) {
       if (selectedFolder && selectedFolder.id) {
         try {
           const testCasesData = await fetchCases(selectedFolder.id);
+
+          // Check if each testCase has an association with testRun
+          // and add "isIncluded" property
+          testCasesData.forEach((itr: CaseType) => {
+            // let included: boolean = testRun.Cases.some(
+            //   (testRun: RunType) => testRun.id === itr.id
+            // );
+
+            // itr.isIncluded = included;
+            // itr.result = included ?
+
+            let isIncluded: boolean = false;
+            let result: number = 0;
+
+            testRun.Cases.forEach((runCaseItr: CaseType) => {
+              if (runCaseItr.id === itr.id) {
+                isIncluded = true;
+                // result = runCaseItr.result;
+              }
+            });
+
+            itr.isIncluded = isIncluded;
+            // itr.result = result;
+          });
+
           setTestCases(testCasesData);
         } catch (error) {
           console.error("Error fetching cases data:", error.message);
@@ -89,7 +115,7 @@ export default function RunEditor({ projectId, runId }: Props) {
   }, [selectedFolder]);
 
   const onIncludeExcludeClick = async (mode: string) => {
-    console.log(mode)
+    console.log(mode);
     if (selectedKeys === "all") {
       const allKeys = testcases.map((item) => item.id);
       console.log(allKeys);

frontend/app/projects/[projectId]/runs/[runId]/TestCaseSelector.tsx

@@ -16,17 +16,18 @@ import {
   SortDescriptor,
   Link,
 } from "@nextui-org/react";
-import { Plus, MoreVertical, Trash } from "lucide-react";
+import { MoreVertical } from "lucide-react";
+import { priorities, testResult } from "@/config/selection";
 
 const headerColumns = [
   { name: "ID", uid: "id", sortable: true },
   { name: "Title", uid: "title", sortable: true },
   { name: "Priority", uid: "priority", sortable: true },
+  { name: "isIncluded", uid: "isIncluded", sortable: true },
+  // { name: "Result", uid: "result", sortable: true },
   { name: "Actions", uid: "actions" },
 ];
 
-import { priorities } from "@/config/selection";
-
 type Case = {
   id: number;
   title: string;
@@ -39,6 +40,8 @@ type Case = {
   preConditions: string;
   expectedResults: string;
   folderId: number;
+  isIncluded: boolean; // additional property
+  result: number; // additional property
   createdAt: string;
   updatedAt: string;
 };
@@ -62,6 +65,7 @@ export default function TestCaseSelector({
   });
 
   const sortedItems = useMemo(() => {
+    console.log(cases)
     return [...cases].sort((a: Case, b: Case) => {
       const first = a[sortDescriptor.column as keyof Case] as number;
       const second = b[sortDescriptor.column as keyof Case] as number;
@@ -72,6 +76,7 @@ export default function TestCaseSelector({
   }, [sortDescriptor, cases]);
   const renderCell = useCallback((testCase: Case, columnKey: Key) => {
     const cellValue = testCase[columnKey as keyof Case];
+    // console.log(columnKey, cellValue)
 
     switch (columnKey) {
       case "id":
@@ -97,6 +102,20 @@ export default function TestCaseSelector({
             {priorities[cellValue].name}
           </Chip>
         );
+      case "isIncluded":
+        const flag = cellValue ? "true" : "false"
+        return <span>{flag}</span>;
+      case "result":
+        return (
+          <Chip
+            className="border-none gap-1 text-default-600"
+            color={testResult[cellValue].color}
+            size="sm"
+            variant="dot"
+          >
+            {testResult[cellValue].name}
+          </Chip>
+        );
       case "actions":
         return (
           <Dropdown>
@@ -137,8 +156,8 @@ export default function TestCaseSelector({
   );
 
   const handleSelectionChange = (keys: Selection) => {
-    onSelectionChange(keys)
-  }
+    onSelectionChange(keys);
+  };
 
   return (
     <>