update test case

backend/index.js

@@ -1,5 +1,5 @@
-const express = require('express');
-const { Sequelize } = require('sequelize');
+const express = require("express");
+const { Sequelize } = require("sequelize");
 const app = express();
 
 // enable frontend access
@@ -24,36 +24,38 @@ const indexRoute = require("./routes/index");
 app.use("/", indexRoute);
 
 // "/projects"
-const projectsIndexRoute = require('./routes/projects/index')(sequelize);
-const projectsNewRoute = require('./routes/projects/new')(sequelize);
-const projectsEditRoute = require('./routes/projects/edit')(sequelize);
-const projectsDeleteRoute = require('./routes/projects/delete')(sequelize);
-app.use('/projects', projectsIndexRoute);
-app.use('/projects', projectsNewRoute);
-app.use('/projects', projectsEditRoute);
-app.use('/projects', projectsDeleteRoute);
+const projectsIndexRoute = require("./routes/projects/index")(sequelize);
+const projectsNewRoute = require("./routes/projects/new")(sequelize);
+const projectsEditRoute = require("./routes/projects/edit")(sequelize);
+const projectsDeleteRoute = require("./routes/projects/delete")(sequelize);
+app.use("/projects", projectsIndexRoute);
+app.use("/projects", projectsNewRoute);
+app.use("/projects", projectsEditRoute);
+app.use("/projects", projectsDeleteRoute);
 
 // "/folders"
-const foldersIndexRoute = require('./routes/folders/index')(sequelize);
-const foldersNewRoute = require('./routes/folders/new')(sequelize);
-const foldersEditRoute = require('./routes/folders/edit')(sequelize);
-const foldersDeleteRoute = require('./routes/folders/delete')(sequelize);
-app.use('/folders', foldersIndexRoute);
-app.use('/folders', foldersNewRoute);
-app.use('/folders', foldersEditRoute);
-app.use('/folders', foldersDeleteRoute);
-
-// "/runs"
-const runsIndexRoute = require('./routes/runs/index')(sequelize);
-const runsNewRoute = require('./routes/runs/new')(sequelize);
-app.use('/runs', runsIndexRoute);
-app.use('/runs', runsNewRoute);
+const foldersIndexRoute = require("./routes/folders/index")(sequelize);
+const foldersNewRoute = require("./routes/folders/new")(sequelize);
+const foldersEditRoute = require("./routes/folders/edit")(sequelize);
+const foldersDeleteRoute = require("./routes/folders/delete")(sequelize);
+app.use("/folders", foldersIndexRoute);
+app.use("/folders", foldersNewRoute);
+app.use("/folders", foldersEditRoute);
+app.use("/folders", foldersDeleteRoute);
 
 // "/cases"
-const casesIndexRoute = require('./routes/cases/index')(sequelize);
-const casesNewRoute = require('./routes/cases/new')(sequelize);
-app.use('/cases', casesIndexRoute);
-app.use('/cases', casesNewRoute);
+const casesIndexRoute = require("./routes/cases/index")(sequelize);
+const casesNewRoute = require("./routes/cases/new")(sequelize);
+const casesEditRoute = require("./routes/cases/edit")(sequelize);
+app.use("/cases", casesIndexRoute);
+app.use("/cases", casesNewRoute);
+app.use("/cases", casesEditRoute);
+
+// "/runs"
+const runsIndexRoute = require("./routes/runs/index")(sequelize);
+const runsNewRoute = require("./routes/runs/new")(sequelize);
+app.use("/runs", runsIndexRoute);
+app.use("/runs", runsNewRoute);
 
 const PORT = process.env.PORT || 3001;
 app.listen(PORT, () => {

backend/routes/cases/edit.js

@@ -0,0 +1,26 @@
+const express = require("express");
+const router = express.Router();
+const defineCase = require("../../models/cases");
+const { DataTypes } = require("sequelize");
+
+module.exports = function (sequelize) {
+  const Case = defineCase(sequelize, DataTypes);
+
+  router.put("/:caseId", async (req, res) => {
+    const caseId = req.params.caseId;
+    const updateCase = req.body;
+    try {
+      const testcase = await Case.findByPk(caseId);
+      if (!testcase) {
+        return res.status(404).send("Case not found");
+      }
+      await testcase.update(updateCase);
+      res.json(testcase);
+    } catch (error) {
+      console.error(error);
+      res.status(500).send("Internal Server Error");
+    }
+  });
+
+  return router;
+};

frontend/app/projects/[projectId]/folders/[folderId]/cases/[caseId]/page.tsx

@@ -1,7 +1,14 @@
 "use client";
 import { useEffect, useState } from "react";
-import { Select, SelectItem } from "@nextui-org/react";
-import priorities from "../priorities";
+import {
+  Input,
+  Textarea,
+  Select,
+  SelectItem,
+  Chip,
+  Button,
+} from "@nextui-org/react";
+import { priorities, testTypes } from "@/config/selection";
 import Config from "@/config/config";
 const apiServer = Config.apiServer;
 
@@ -56,12 +63,40 @@ async function fetchCase(url: string) {
   }
 }
 
+/**
+ * Update folder
+ */
+async function updateCase(updateCaseData) {
+  const fetchOptions = {
+    method: "PUT",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    body: JSON.stringify(updateCaseData),
+  };
+
+  const url = `${apiServer}/cases/${updateCaseData.id}`;
+
+  try {
+    const response = await fetch(url, fetchOptions);
+    if (!response.ok) {
+      throw new Error(`HTTP error! Status: ${response.status}`);
+    }
+    const data = await response.json();
+    return data;
+  } catch (error) {
+    console.error("Error updating project:", error);
+    throw error;
+  }
+}
+
 export default function Page({
   params,
 }: {
   params: { projectId: string; folderId: string; caseId: string };
 }) {
   const [testCase, setTestCase] = useState<CaseType>(defaultTestCase);
+  const [isTitleInvalid, setIsTitleInvalid] = useState<boolean>(false);
 
   const url = `${apiServer}/cases?caseId=${params.caseId}`;
   useEffect(() => {
@@ -79,32 +114,113 @@ export default function Page({
 
   return (
     <div className="p-5">
-      <h4 className="font-bold">{testCase.title}</h4>
-      <Select
-        selectedKeys={[priorities[testCase.priority].uid]}
-        onSelectionChange={(e) => {
-          const selectedUid = e.anchorKey;
-          const index = priorities.findIndex(
-            (priority) => priority.uid === selectedUid
-          );
-          setTestCase({ ...testCase, priority: index });
+      <Input
+        size="sm"
+        type="text"
+        variant="bordered"
+        label="Title"
+        value={testCase.title}
+        isInvalid={isTitleInvalid}
+        errorMessage={isTitleInvalid ? "please enter title" : ""}
+        onChange={(e) => {
+          setTestCase({ ...testCase, title: e.target.value });
         }}
-        label="Priority"
-        className="mt-3 max-w-xs"
-      >
-        {priorities.map((priority, index) => (
-          <SelectItem key={priority.uid} value={index}>
-            {priority.name}
-          </SelectItem>
-        ))}
-      </Select>
+      />
 
-      <div>type: {testCase.type}</div>
-      <div>automationStatus: {testCase.automationStatus}</div>
-      <div>description: {testCase.description}</div>
-      <div>template: {testCase.template}</div>
-      <div>preConditions: {testCase.preConditions}</div>
-      <div>expectedResults: {testCase.expectedResults}</div>
+      <Textarea
+        size="sm"
+        variant="bordered"
+        label="Description"
+        placeholder="Test case description"
+        value={testCase.description}
+        onValueChange={(changeValue) => {
+          setTestCase({ ...testCase, description: changeValue });
+        }}
+        className="mt-3"
+      />
+
+      <div>
+        <Select
+          size="sm"
+          variant="bordered"
+          selectedKeys={[priorities[testCase.priority].uid]}
+          onSelectionChange={(e) => {
+            const selectedUid = e.anchorKey;
+            const index = priorities.findIndex(
+              (priority) => priority.uid === selectedUid
+            );
+            setTestCase({ ...testCase, priority: index });
+          }}
+          startContent={
+            <Chip
+              className="border-none gap-1 text-default-600"
+              color={priorities[testCase.priority].color}
+              size="sm"
+              variant="dot"
+            ></Chip>
+          }
+          label="Priority"
+          className="mt-3 max-w-xs"
+        >
+          {priorities.map((priority, index) => (
+            <SelectItem key={priority.uid} value={index}>
+              {priority.name}
+            </SelectItem>
+          ))}
+        </Select>
+      </div>
+
+      <div>
+        <Select
+          size="sm"
+          variant="bordered"
+          selectedKeys={[testTypes[testCase.type].uid]}
+          onSelectionChange={(e) => {
+            const selectedUid = e.anchorKey;
+            const index = testTypes.findIndex(
+              (type) => type.uid === selectedUid
+            );
+            setTestCase({ ...testCase, type: index });
+          }}
+          label="type"
+          className="mt-3 max-w-xs"
+        >
+          {testTypes.map((type, index) => (
+            <SelectItem key={type.uid} value={index}>
+              {type.name}
+            </SelectItem>
+          ))}
+        </Select>
+      </div>
+
+      <Textarea
+        size="sm"
+        variant="bordered"
+        label="PreConditions"
+        placeholder="PreConditions"
+        value={testCase.preConditions}
+        onValueChange={(changeValue) => {
+          setTestCase({ ...testCase, preConditions: changeValue });
+        }}
+        className="mt-3"
+      />
+
+      <Textarea
+        variant="bordered"
+        label="ExpectedResults"
+        placeholder="ExpectedResults"
+        value={testCase.expectedResults}
+        onValueChange={(changeValue) => {
+          setTestCase({ ...testCase, expectedResults: changeValue });
+        }}
+        className="mt-3"
+      />
+
+      <div className="mt-3">
+        <Button color="primary" onPress={() => updateCase(testCase)}>
+          Update
+        </Button>
+      </div>
     </div>
   );
 }

frontend/app/projects/[projectId]/folders/[folderId]/cases/priorities.ts

@@ -1,8 +0,0 @@
-const priorities = [
-  { name: "Critical", uid: "critical", color: "danger" },
-  { name: "High", uid: "high", color: "warning" },
-  { name: "Medium", uid: "medium", color: "primary" },
-  { name: "Low", uid: "low", color: "success" },
-];
-
-export default priorities

frontend/app/projects/[projectId]/folders/[folderId]/cases/test-case-table.tsx

@@ -25,7 +25,7 @@ const headerColumns = [
   { name: "Actions", uid: "actions" },
 ];
 
-import priorities from "./priorities";
+import { priorities } from "@/config/selection"
 
 type Case = {
   id: number;

frontend/config/selection.ts

@@ -0,0 +1,36 @@
+const priorities = [
+  { name: "Critical", uid: "critical", color: "danger" },
+  { name: "High", uid: "high", color: "warning" },
+  { name: "Medium", uid: "medium", color: "primary" },
+  { name: "Low", uid: "low", color: "success" },
+];
+
+const testTypes = [
+  { name: "Other", uid: "other" },
+  { name: "Security", uid: "security" },
+  { name: "Performance", uid: "performance" },
+  { name: "Accessibility", uid: "accessibility" },
+  { name: "Functional", uid: "functional" },
+  { name: "Acceptance", uid: "acceptance" },
+  { name: "Usability", uid: "usability" },
+  { name: "Smoke&Sanity", uid: "smoke-sanity" },
+  { name: "Compatibility", uid: "compatibility" },
+  { name: "Destructive", uid: "destructive" },
+  { name: "Regression", uid: "regression" },
+  { name: "Automated", uid: "automated" },
+  { name: "Manual", uid: "manual" },
+];
+
+const automationStatus = [
+  { name: "Automated", uid: "automated" },
+  { name: "Automation Not Required", uid: "automation-not-required" },
+  { name: "Cannot Be Automated", uid: "cannot-be-automated" },
+  { name: "Obsolete", uid: "obsolete" },
+];
+
+const templates = [
+  { name: "Text", uid: "text-template" },
+  { name: "Step", uid: "step-template" },
+];
+
+export { priorities, testTypes, automationStatus, templates };