diff --git a/Client/src/Pages/StatusPage/Status/Components/Skeleton/index.jsx b/Client/src/Pages/StatusPage/Status/Components/Skeleton/index.jsx new file mode 100644 index 000000000..482c490fb --- /dev/null +++ b/Client/src/Pages/StatusPage/Status/Components/Skeleton/index.jsx @@ -0,0 +1,14 @@ +import { Stack, Skeleton } from "@mui/material"; + +const SkeletonLayout = () => { + return ( + + + + ); +}; + +export default SkeletonLayout; diff --git a/Client/src/Pages/StatusPage/PublicStatus/Hooks/useStatusPageDelete.jsx b/Client/src/Pages/StatusPage/Status/Hooks/useStatusPageDelete.jsx similarity index 100% rename from Client/src/Pages/StatusPage/PublicStatus/Hooks/useStatusPageDelete.jsx rename to Client/src/Pages/StatusPage/Status/Hooks/useStatusPageDelete.jsx diff --git a/Client/src/Pages/StatusPage/PublicStatus/Hooks/useStatusPageFetch.jsx b/Client/src/Pages/StatusPage/Status/Hooks/useStatusPageFetch.jsx similarity index 100% rename from Client/src/Pages/StatusPage/PublicStatus/Hooks/useStatusPageFetch.jsx rename to Client/src/Pages/StatusPage/Status/Hooks/useStatusPageFetch.jsx diff --git a/Client/src/Pages/StatusPage/PublicStatus/index.jsx b/Client/src/Pages/StatusPage/Status/index.jsx similarity index 86% rename from Client/src/Pages/StatusPage/PublicStatus/index.jsx rename to Client/src/Pages/StatusPage/Status/index.jsx index faf1688df..d3cdb6047 100644 --- a/Client/src/Pages/StatusPage/PublicStatus/index.jsx +++ b/Client/src/Pages/StatusPage/Status/index.jsx @@ -8,6 +8,8 @@ import Host from "../../Uptime/Monitors/Components/Host"; import { StatusLabel } from "../../../Components/Label"; import SettingsIcon from "../../../assets/icons/settings-bold.svg?react"; import Image from "../../../Components/Image"; +import SkeletonLayout from "./Components/Skeleton"; + // Utils import { useState, useEffect } from "react"; import { useStatusPageFetch } from "./Hooks/useStatusPageFetch"; @@ -17,6 +19,7 @@ import useUtils from "../../Uptime/Monitors/Hooks/useUtils"; import { useLocation } from "react-router-dom"; import { useNavigate } from "react-router-dom"; import { useStatusPageDelete } from "./Hooks/useStatusPageDelete"; + const PublicStatus = () => { // Local state const [status, setStatus] = useState(undefined); @@ -93,7 +96,9 @@ const PublicStatus = () => { setStatus(monitorsStatus); }, [monitors, theme]); - //Handlers + if (isLoading) { + return ; + } if (networkError === true) { return ( @@ -110,6 +115,23 @@ const PublicStatus = () => { ); } + if (!isLoading && typeof status === "undefined" && currentPath === "/status/public") { + return ( + + + + A public status page is not set up. + + Please contact to your administrator + + + ); + } + if (!isLoading && typeof statusPage === "undefined") { return ( { ); } + if (!isLoading && statusPage.isPublic === false) { + return ( + + + + This status page is not public. + + Please contact to your administrator + + + ); + } + return ( { variant="contained" color="error" onClick={deleteStatusPage} + loading={isDeleting} > Delete