diff --git a/src/Components/DashboardPage/TechnicianButtons.tsx b/src/Components/DashboardPage/TechnicianButtons.tsx index c388b58..a9aa1a4 100644 --- a/src/Components/DashboardPage/TechnicianButtons.tsx +++ b/src/Components/DashboardPage/TechnicianButtons.tsx @@ -1,6 +1,4 @@ -import { useQueries } from "@tanstack/react-query"; import styles from "../../styles"; -import { EquipmentsAPI, EquipmentInstancesAPI, UserAPI } from "../API/API"; import { useNavigate } from "react-router-dom"; import { Button } from "@mui/material"; import FormatListBulletedIcon from "@mui/icons-material/FormatListBulleted"; @@ -10,30 +8,14 @@ import NoteIcon from "@mui/icons-material/Note"; import { colors } from "../../styles"; import ScienceIcon from "@mui/icons-material/Science"; import ColorizeIcon from "@mui/icons-material/Colorize"; -import { Dispatch, SetStateAction } from "react"; - -type props = { - SetAddSKUModalOpen: Dispatch>; - SetAddItemModalOpen: Dispatch>; -}; -export default function TechnicianButtons(props: props) { +import Popup from "reactjs-popup"; +import AddItemModal from "../AddItemModal/AddItemModal"; +import AddSKUModal from "../AddSKUModal/AddSKUModal"; +import { useState } from "react"; +export default function TechnicianButtons() { + const [addSKUmodalOpen, SetAddSKUModalOpen] = useState(false); + const [additemmodalOpen, SetAddItemModalOpen] = useState(false); const navigate = useNavigate(); - const queries = useQueries({ - queries: [ - { - queryKey: ["equipments"], - queryFn: EquipmentsAPI, - }, - { - queryKey: ["equipment_instances"], - queryFn: EquipmentInstancesAPI, - }, - { - queryKey: ["user"], - queryFn: UserAPI, - }, - ], - }); return ( <>

{ @@ -99,7 +77,7 @@ export default function TechnicianButtons(props: props) { }, }} onClick={() => { - props.SetAddItemModalOpen(true); + SetAddItemModalOpen(true); }} > { - props.SetAddSKUModalOpen(true); + SetAddSKUModalOpen(true); }} > + SetAddSKUModalOpen(false)} + modal + position={"top center"} + contentStyle={{ + width: "32rem", + borderRadius: 16, + borderColor: "grey", + borderStyle: "solid", + borderWidth: 1, + padding: 16, + alignContent: "center", + justifyContent: "center", + textAlign: "center", + }} + > + + + SetAddItemModalOpen(false)} + modal + position={"top center"} + contentStyle={{ + width: "32rem", + borderRadius: 16, + borderColor: "grey", + borderStyle: "solid", + borderWidth: 1, + padding: 16, + alignContent: "center", + justifyContent: "center", + textAlign: "center", + }} + > + + ); } diff --git a/src/Components/DashboardPage/TechnicianWidgets.tsx b/src/Components/DashboardPage/TechnicianWidgets.tsx index ee9f39e..15b132c 100644 --- a/src/Components/DashboardPage/TechnicianWidgets.tsx +++ b/src/Components/DashboardPage/TechnicianWidgets.tsx @@ -1,6 +1,7 @@ import { useQueries } from "@tanstack/react-query"; import styles from "../../styles"; import { EquipmentsAPI, EquipmentInstancesAPI, UserAPI } from "../API/API"; +import CircularProgress from "@mui/material/CircularProgress"; export default function TechnicianWidgets() { const queries = useQueries({ @@ -19,6 +20,22 @@ export default function TechnicianWidgets() { }, ], }); + const isLoading = queries.some((result) => result.isLoading); + if (isLoading) { + return ( + <> + +

+ Loading +

+ + ); + } return (
+ +

+ Loading +

+ + ); + } if (props.allow_only === "Teacher") { if (user.data && user.data.is_teacher) { return <>{props.children}; @@ -16,6 +33,10 @@ export default function RestrictedComponent(props: props) { if (user.data && user.data.is_technician) { return <>{props.children}; } + } else if (props.allow_only === "Student") { + if (user.data && !user.data.is_technician && !user.data.is_teacher) { + return <>{props.children}; + } } return <>; } diff --git a/src/Components/RestrictedPage/RestrictedPage.tsx b/src/Components/RestrictedPage/RestrictedPage.tsx index f8cf63f..8e9f6a0 100644 --- a/src/Components/RestrictedPage/RestrictedPage.tsx +++ b/src/Components/RestrictedPage/RestrictedPage.tsx @@ -39,6 +39,20 @@ export default function RestrictedPage(props: props) { theme: "light", }); } + } else if (props.allow_only == "Student") { + if (user.data && (user.data.is_technician || user.data.is_teacher)) { + navigate("/"); + toast("You are not a student!", { + position: "bottom-center", + autoClose: 2000, + hideProgressBar: false, + closeOnClick: true, + pauseOnHover: true, + draggable: true, + progress: undefined, + theme: "light", + }); + } } }, [navigate, props.allow_only, user.data]); diff --git a/src/Pages/DashboardPage/DashboardPage.tsx b/src/Pages/DashboardPage/DashboardPage.tsx index 7fca741..67cb667 100644 --- a/src/Pages/DashboardPage/DashboardPage.tsx +++ b/src/Pages/DashboardPage/DashboardPage.tsx @@ -1,21 +1,11 @@ import Header from "../../Components/Header/Header"; import styles from "../../styles"; -import { useQueries } from "@tanstack/react-query"; -import { - EquipmentsAPI, - EquipmentInstancesAPI, - UserAPI, -} from "../../Components/API/API"; -import { useState } from "react"; -import AddSKUModal from "../../Components/AddSKUModal/AddSKUModal"; -import Popup from "reactjs-popup"; -import AddItemModal from "../../Components/AddItemModal/AddItemModal"; import RestrictedComponent from "../../Components/RestrictedComponent/RestrictedComponent"; import TechnicianWidgets from "../../Components/DashboardPage/TechnicianWidgets"; import TechnicianButtons from "../../Components/DashboardPage/TechnicianButtons"; import TechnicianLogs from "../../Components/DashboardPage/TechnicianLogs"; -import CircularProgress from "@mui/material/CircularProgress/CircularProgress"; export default function Dashboard() { +<<<<<<< HEAD const queries = useQueries({ queries: [ { @@ -65,6 +55,8 @@ export default function Dashboard() {
); } +======= +>>>>>>> be6e1ba229d5ab71d64626e470d43ab9169f1758 return (
@@ -72,52 +64,11 @@ export default function Dashboard() { - + - SetAddSKUModalOpen(false)} - modal - position={"top center"} - contentStyle={{ - width: "32rem", - borderRadius: 16, - borderColor: "grey", - borderStyle: "solid", - borderWidth: 1, - padding: 16, - alignContent: "center", - justifyContent: "center", - textAlign: "center", - }} - > - - - SetAddItemModalOpen(false)} - modal - position={"top center"} - contentStyle={{ - width: "32rem", - borderRadius: 16, - borderColor: "grey", - borderStyle: "solid", - borderWidth: 1, - padding: 16, - alignContent: "center", - justifyContent: "center", - textAlign: "center", - }} - > - -
); }