Created enums for category, impact and diff. Updated new Ticket post DTO

client/src/components/Modals/NewTicketModal.tsx

@@ -1,11 +1,21 @@
 import React, { FC, useState, FormEvent } from "react";
 import { useRouteMatch } from "react-router-dom";
-import { TextField, MenuItem } from "@material-ui/core";
+import {
+  TextField,
+  MenuItem,
+  Grid,
+  makeStyles,
+  Theme,
+  createStyles,
+} from "@material-ui/core";
 import { Modal } from "./Modal";
 import { Ticket } from "../../types/Ticket";
 import { Project } from "../../types/Project";
 import { post } from "../../utils/http";
 import { Constants } from "../../utils/Constants";
+import Category from "../../types/enums/category";
+import Impact from "../../types/enums/impact";
+import Difficulty from "../../types/enums/difficulty";
 
 interface IProps {
   show: boolean;
@@ -13,6 +23,12 @@ interface IProps {
   allProjects: Project[];
 }
 
+const useStyles = makeStyles((theme: Theme) => ({
+  select: {
+    width: 120,
+  },
+}));
+
 export const NewTicketModal: FC<IProps> = ({
   show,
   handleClose,
@@ -25,6 +41,9 @@ export const NewTicketModal: FC<IProps> = ({
   const { url } = useRouteMatch();
   const id = url.split("/")[2];
   const [projectId, setProjectId] = useState(id);
+  const [categoryID, setCategoryID] = useState(0);
+  const [impactID, setImpactID] = useState(0);
+  const [difficultyID, setDifficultyID] = useState(0);
 
   const handleSubmit = async (e: FormEvent) => {
     e.preventDefault();
@@ -32,8 +51,11 @@ export const NewTicketModal: FC<IProps> = ({
       title: title,
       description: description,
       endingDate: new Date(endingDate).toISOString(),
-      creatorId: "20bf4b2a-7209-4826-96cd-29c2bc937a94",
+      creatorId: "20bf4b2a-7209-4826-96cd-29c2bc937a94", // get current User id
       projectId: parseInt(projectId),
+      impact: impactID,
+      difficulty: difficultyID,
+      category: categoryID,
     };
 
     // const response: HttpResponse<Ticket> =
@@ -41,6 +63,7 @@ export const NewTicketModal: FC<IProps> = ({
     handleClose();
   };
 
+  const classes = useStyles();
   return (
     <Modal
       name="New Ticket"
@@ -49,7 +72,6 @@ export const NewTicketModal: FC<IProps> = ({
       action="New Ticket"
       handleAction={handleSubmit}
     >
-      <div className="row">
       <TextField
         variant="outlined"
         margin="normal"
@@ -122,7 +144,71 @@ export const NewTicketModal: FC<IProps> = ({
           setEndingDate(e.target.value)
         }
       />
-      </div>
+
+      <Grid container justify="space-between">
+        <TextField
+          id="category"
+          name="category"
+          select
+          label="Category"
+          value={categoryID}
+          onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+            e.preventDefault();
+            setCategoryID(parseInt(e.target.value));
+          }}
+          variant="outlined"
+          margin="normal"
+          className={classes.select}
+        >
+          {Category.map((c: string, i: number) => (
+            <MenuItem key={i} value={i}>
+              {c}
+            </MenuItem>
+          ))}
+        </TextField>
+
+        <TextField
+          className={classes.select}
+          id="impact"
+          name="impact"
+          select
+          label="Impact"
+          value={impactID}
+          onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+            e.preventDefault();
+            setImpactID(parseInt(e.target.value));
+          }}
+          variant="outlined"
+          margin="normal"
+        >
+          {Impact.map((c: string, i: number) => (
+            <MenuItem key={i} value={i}>
+              {c}
+            </MenuItem>
+          ))}
+        </TextField>
+
+        <TextField
+          className={classes.select}
+          id="difficulty"
+          name="difficulty"
+          select
+          label="Difficulty"
+          value={difficultyID}
+          onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+            e.preventDefault();
+            setDifficultyID(parseInt(e.target.value));
+          }}
+          variant="outlined"
+          margin="normal"
+        >
+          {Difficulty.map((c: string, i: number) => (
+            <MenuItem key={i} value={i}>
+              {c}
+            </MenuItem>
+          ))}
+        </TextField>
+      </Grid>
     </Modal>
   );
 };

client/src/types/enums/category.ts

@@ -0,0 +1,3 @@
+const Category: string[] = ["Product", "Tech", "Design", "Marketing", "Test"];
+
+export default Category;

client/src/types/enums/difficulty.ts

@@ -0,0 +1,3 @@
+const Difficulty: string[] = ["Easy", "Medium", "Hard"];
+
+export default Difficulty;

client/src/types/enums/impact.ts

@@ -0,0 +1,3 @@
+const Impact: string[] = ["High", "Medium", "Low"];
+
+export default Impact;