Implemented test run editor's test case selection

backend/routes/runs/show.js

@@ -22,6 +22,7 @@ module.exports = function (sequelize) {
         include: [
           {
             model: Case,
+            through: { attributes: ["status"] },
           },
         ],
       });

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

@@ -82,26 +82,19 @@ export default function RunEditor({ projectId, runId }: Props) {
 
           // Check if each testCase has an association with testRun
           // and add "isIncluded" property
-          testCasesData.forEach((itr: CaseType) => {
+          testCasesData.forEach((caseItr: 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;
+            let runStatus: number = 0;
 
             testRun.Cases.forEach((runCaseItr: CaseType) => {
-              if (runCaseItr.id === itr.id) {
+              if (runCaseItr.id === caseItr.id) {
                 isIncluded = true;
-                // result = runCaseItr.result;
+                runStatus = runCaseItr.runCases.status;
               }
             });
 
-            itr.isIncluded = isIncluded;
+            caseItr.isIncluded = isIncluded;
-            // itr.result = result;
+            caseItr.runStatus = runStatus;
           });
 
           setTestCases(testCasesData);
@@ -160,7 +153,7 @@ export default function RunEditor({ projectId, runId }: Props) {
         </Button>
       </div>
 
-      <div className="container mx-auto max-w-3xl pt-6 px-6 flex-grow">
+      <div className="container mx-auto max-w-5xl pt-6 px-6 flex-grow">
         <h6>Basic</h6>
         <Input
           size="sm"

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

@@ -17,38 +17,21 @@ import {
   Link,
 } from "@nextui-org/react";
 import { MoreVertical } from "lucide-react";
-import { priorities, testResult } from "@/config/selection";
+import { priorities, testRunCaseStatus } from "@/config/selection";
+import { CaseType } from "@/types/case";
 
 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: "Status", uid: "runStatus", sortable: true },
   { name: "Actions", uid: "actions" },
 ];
 
-type Case = {
-  id: number;
-  title: string;
-  state: number;
-  priority: number;
-  type: number;
-  automationStatus: number;
-  description: string;
-  template: number;
-  preConditions: string;
-  expectedResults: string;
-  folderId: number;
-  isIncluded: boolean; // additional property
-  result: number; // additional property
-  createdAt: string;
-  updatedAt: string;
-};
-
 type Props = {
   projectId: string;
-  cases: Case[];
+  cases: CaseType[];
   selectedKeys: Selection;
   onSelectionChange: React.Dispatch<React.SetStateAction<Selection>>;
 };
@@ -65,17 +48,16 @@ export default function TestCaseSelector({
   });
 
   const sortedItems = useMemo(() => {
-    console.log(cases)
+    return [...cases].sort((a: CaseType, b: CaseType) => {
-    return [...cases].sort((a: Case, b: Case) => {
+      const first = a[sortDescriptor.column as keyof CaseType] as number;
-      const first = a[sortDescriptor.column as keyof Case] as number;
+      const second = b[sortDescriptor.column as keyof CaseType] as number;
-      const second = b[sortDescriptor.column as keyof Case] as number;
       const cmp = first < second ? -1 : first > second ? 1 : 0;
 
       return sortDescriptor.direction === "descending" ? -cmp : cmp;
     });
   }, [sortDescriptor, cases]);
-  const renderCell = useCallback((testCase: Case, columnKey: Key) => {
+  const renderCell = useCallback((testCase: CaseType, columnKey: Key) => {
-    const cellValue = testCase[columnKey as keyof Case];
+    const cellValue = testCase[columnKey as keyof CaseType];
     // console.log(columnKey, cellValue)
 
     switch (columnKey) {
@@ -105,15 +87,15 @@ export default function TestCaseSelector({
       case "isIncluded":
         const flag = cellValue ? "true" : "false"
         return <span>{flag}</span>;
-      case "result":
+      case "runStatus":
         return (
           <Chip
             className="border-none gap-1 text-default-600"
-            color={testResult[cellValue].color}
+            color={testRunCaseStatus[cellValue].color}
             size="sm"
             variant="dot"
           >
-            {testResult[cellValue].name}
+            {testRunCaseStatus[cellValue].name}
           </Chip>
         );
       case "actions":

frontend/config/selection.ts

@@ -42,11 +42,12 @@ const testRunStatus = [
   { name: "Closed", uid: "closed" },
 ]
 
-const testResult = [
+const testRunCaseStatus = [
+  { name: "Not included", uid: "notincluded", color: "primary" },
   { name: "Untested", uid: "untested", color: "primary" },
   { name: "Passed", uid: "passed", color: "success" },
   { name: "Failed", uid: "untested", color: "danger" },
   { name: "Skipped", uid: "medium", color: "primary" },
 ]
 
-export { priorities, testTypes, automationStatus, templates, testRunStatus, testResult };
+export { priorities, testTypes, automationStatus, templates, testRunStatus, testRunCaseStatus };

frontend/types/case.ts

@@ -10,8 +10,10 @@ type CaseType = {
   preConditions: string;
   expectedResults: string;
   folderId: number;
-  Steps: StepType[];
+  Steps: StepType[]; // additional property
-  Attachments: AttachmentType[];
+  Attachments: AttachmentType[]; // additional property
+  isIncluded: boolean; // additional property
+  runStatus: number; // additional property
 };
 
 type CaseStepType = {