add ticket creation handler

src/pages/Support/CreateTicket.tsx

@@ -1,14 +1,36 @@
 import { Box, Typography, FormControl, InputBase, useMediaQuery, useTheme } from "@mui/material";
 import { useState } from "react";
 import CustomButton from "../../components/CustomButton";
+import { apiRequestHandler } from "../../utils/api/apiRequestHandler";
+import { useSnackbar } from "notistack";
+import { useNavigate } from "react-router-dom";
+import { ApiError } from "../../utils/api/types";
 
 
 export default function CreateTicket() {
     const theme = useTheme();
     const upMd = useMediaQuery(theme.breakpoints.up("md"));
+    const { enqueueSnackbar } = useSnackbar();
+    const navigate = useNavigate();
     const [ticketName, setTicketName] = useState<string>("");
     const [ticketBody, setTicketBody] = useState<string>("");
 
+    async function handleCreateTicket() {
+        const result = await apiRequestHandler.createTicket({
+            Title: ticketName,
+            Message: ticketBody,
+        });
+        if (result instanceof ApiError) {
+            enqueueSnackbar(`Error: ${result.message}`);
+            return;
+        } else if (result instanceof Error) {
+            console.log(result);
+            enqueueSnackbar(`Unknown error`);
+            return;
+        }
+        navigate(`/support/${result.Ticket}`);
+    }
+
     return (
         <Box
             sx={{
@@ -104,6 +126,7 @@ export default function CreateTicket() {
             </Box>
             <Box sx={{ alignSelf: upMd ? "end" : "start" }}>
                 <CustomButton
+                    onClick={handleCreateTicket}
                     variant="contained"
                     sx={{
                         backgroundColor: theme.palette.brightPurple.main,