diff --git a/backend/src/controllers/TicketController.js b/backend/src/controllers/TicketController.js
index cc14dea..eea53dd 100644
--- a/backend/src/controllers/TicketController.js
+++ b/backend/src/controllers/TicketController.js
@@ -48,8 +48,18 @@ exports.index = async (req, res) => {
};
exports.store = async (req, res) => {
+ const io = getIO();
const ticket = await Ticket.create(req.body);
+ const contact = await ticket.getContact();
+
+ const serializaedTicket = { ...ticket.dataValues, contact: contact };
+
+ io.to("notification").emit("ticket", {
+ action: "create",
+ ticket: serializaedTicket,
+ });
+
res.status(200).json(ticket);
};
diff --git a/frontend/src/components/NewTicketModal/index.js b/frontend/src/components/NewTicketModal/index.js
index eca5902..c4dbf36 100644
--- a/frontend/src/components/NewTicketModal/index.js
+++ b/frontend/src/components/NewTicketModal/index.js
@@ -7,11 +7,9 @@ import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
-import Typography from "@material-ui/core/Typography";
-import IconButton from "@material-ui/core/IconButton";
-import DeleteOutlineIcon from "@material-ui/icons/DeleteOutline";
import Autocomplete from "@material-ui/lab/Autocomplete";
import CircularProgress from "@material-ui/core/CircularProgress";
+import FormControl from "@material-ui/core/FormControl";
import { green } from "@material-ui/core/colors";
import { makeStyles } from "@material-ui/core/styles";
@@ -23,18 +21,6 @@ const useStyles = makeStyles(theme => ({
display: "flex",
flexWrap: "wrap",
},
- textField: {
- // marginLeft: theme.spacing(1),
- marginRight: theme.spacing(1),
- // width: "25ch",
- flex: 1,
- },
-
- extraAttr: {
- display: "flex",
- justifyContent: "center",
- alignItems: "center",
- },
btnWrapper: {
// margin: theme.spacing(1),
@@ -53,11 +39,14 @@ const useStyles = makeStyles(theme => ({
const NewTicketModal = ({ modalOpen, onClose, contactId }) => {
const classes = useStyles();
+ const userId = +localStorage.getItem("userId");
- const [options, setOptions] = React.useState([]);
- const [loading, setLoading] = React.useState(false);
+ const [options, setOptions] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [selectedContact, setSelectedContact] = useState(null);
useEffect(() => {
+ setLoading(true);
const fetchContacts = async () => {
try {
const res = await api.get("contacts");
@@ -68,21 +57,29 @@ const NewTicketModal = ({ modalOpen, onClose, contactId }) => {
};
fetchContacts();
+ setLoading(false);
}, []);
const handleClose = () => {
onClose();
- // setTicket(initialState);
+ setSelectedContact(null);
};
- const handleSaveTicket = async selected => {
- console.log(selected.id);
+ const handleSaveTicket = async e => {
+ e.preventDefault();
+ if (!selectedContact) return;
+ setLoading(true);
try {
- await api.post("/tickets", { contactId: selected.id });
+ await api.post("/tickets", {
+ contactId: selectedContact.id,
+ userId: userId,
+ status: "open",
+ });
} catch (err) {
alert(err);
}
- // handleClose();
+ setLoading(false);
+ handleClose();
};
return (
@@ -92,61 +89,67 @@ const NewTicketModal = ({ modalOpen, onClose, contactId }) => {
onClose={handleClose}
maxWidth="lg"
scroll="paper"
- className={classes.modal}
>
-