keannu125/Borrowing-TrackerFrontend
1
0
Fork 0
mirror of https://github.com/lemeow125/Borrowing-TrackerFrontend.git synced 2024-11-17 06:19:27 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve technician widgets loading

Browse source
This commit is contained in:
Keannu Bernasol 2024-01-07 12:30:34 +08:00
parent e589588d8c
commit 8382f7a40e
1 changed files with 6 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
src/Components/DashboardPage/Technician/TechnicianWidgets.tsx
View file

@ -6,7 +6,6 @@ import {
UserAPI,
TransactionsAPI,
} from "../../API/API";
import CircularProgress from "@mui/material/CircularProgress";
import moment from "moment";
export default function TechnicianWidgets() {
@ -34,24 +33,6 @@ export default function TechnicianWidgets() {
},
],
});
const isLoading = queries.some((result) => result.isLoading);
if (isLoading) {
return (
<>
<CircularProgress
style={{ marginTop: "8px", height: "128px", width: "128px" }}
/>
<p
style={{
...styles.text_dark,
...styles.text_L,
}}
>
Loading widgets...
</p>
</>
);
}
return (
<div style={styles.flex_column}>
<div
@ -94,7 +75,7 @@ export default function TechnicianWidgets() {
>
{queries[1].data?.filter(
(equipment) => equipment.status == "Pending"
).length || 0}
).length || "Loading..."}
</p>
</div>
<div
@ -125,7 +106,7 @@ export default function TechnicianWidgets() {
...styles.text_L,
}}
>
{queries[1].data?.length || 0}
{queries[1].data?.length || "Loading..."}
</p>
</div>
</div>
@ -169,7 +150,7 @@ export default function TechnicianWidgets() {
>
{queries[1].data?.filter(
(equipment) => equipment.status == "Available"
).length || 0}
).length || "Loading..."}
</p>
</div>
<div
@ -202,7 +183,7 @@ export default function TechnicianWidgets() {
>
{queries[1].data?.filter(
(equipment) => equipment.status == "Broken"
).length || 0}
).length || "Loading..."}
</p>
</div>
</div>
@ -249,7 +230,7 @@ export default function TechnicianWidgets() {
todayStartOfDay,
todayEndOfDay
)
).length || 0}
).length || "Loading..."}
</p>
</div>
<div
@ -285,7 +266,7 @@ export default function TechnicianWidgets() {
thisMonthStart,
thisMonthEnd
)
).length || 0}
).length || "Loading..."}
</p>
</div>
</div>