mirror of
https://github.com/lemeow125/Borrowing-TrackerFrontend.git
synced 2025-05-17 03:48:14 +08:00
Further simplified the dashboard page and moved functionality to separate components
This commit is contained in:
parent
d220078e69
commit
fce4725ff9
4 changed files with 34 additions and 74 deletions
|
@ -1,62 +1,10 @@
|
|||
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 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() {
|
||||
const queries = useQueries({
|
||||
queries: [
|
||||
{
|
||||
queryKey: ["equipments"],
|
||||
queryFn: EquipmentsAPI,
|
||||
},
|
||||
{
|
||||
queryKey: ["equipment_instances"],
|
||||
queryFn: EquipmentInstancesAPI,
|
||||
},
|
||||
{
|
||||
queryKey: ["user"],
|
||||
queryFn: UserAPI,
|
||||
},
|
||||
],
|
||||
});
|
||||
const isLoading = queries.some((result) => result.isLoading);
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div style={styles.background}>
|
||||
<Header label={"Dashboard"} />
|
||||
<div
|
||||
style={{
|
||||
...styles.flex_column,
|
||||
...{
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
paddingTop: "64px",
|
||||
},
|
||||
}}
|
||||
>
|
||||
<CircularProgress style={{ height: "128px", width: "128px" }} />
|
||||
<p
|
||||
style={{
|
||||
...styles.text_dark,
|
||||
...styles.text_L,
|
||||
}}
|
||||
>
|
||||
Loading
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div style={styles.background}>
|
||||
<Header label={"Dashboard"} />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue