Fix toasts and actually close on submit on inactivity notice modal

components/NewInactivityNotice.tsx

@@ -12,16 +12,18 @@ import {
   Text,
   Textarea,
   useToast,
-  VStack,
+  VStack
 } from "@chakra-ui/react";
 import { useState } from "react";
 
-export default function (props: {
+export default function(props: {
   departments: string[];
   isOpen: boolean;
   onClose: () => void;
 }) {
   const [departments, setDepartments] = useState([] as string[]);
+  const toast = useToast();
+
   function reset() {
     (document.getElementById("start") as HTMLInputElement).value = "";
     (document.getElementById("end") as HTMLInputElement).value = "";
@@ -43,30 +45,35 @@ export default function (props: {
       body: JSON.stringify({
         end,
         reason,
-        start,
+        start
       }),
       headers: {
-        "content-type": "application/json",
+        "content-type": "application/json"
       },
-      method: "POST",
+      method: "POST"
     });
 
-    if (!inactivityPost.ok)
+    if (!inactivityPost.ok) {
-      return useToast()({
+      toast({
         description: ((await inactivityPost.json()) as { error: string }).error,
         duration: 10000,
         isClosable: true,
         status: "error",
-        title: "Error",
+        title: "Error"
       });
 
-    useToast()({
+      return;
+    }
+
+    toast({
       description: "Your inactivity notice has been created",
       duration: 10000,
       isClosable: true,
       status: "success",
-      title: "Success",
+      title: "Success"
     });
+
+    props.onClose();
   }
 
   return (