Merge pull request #2936 from bluewave-labs/develop

develop -> master

.coderabbit.yml

@@ -0,0 +1 @@
+release_notes: false

.github/scripts/download-translations.js

@@ -7,7 +7,7 @@ import { URLSearchParams } from "url";
 const API_TOKEN = process.env.POEDITOR_API;
 const PROJECT_ID = process.env.POEDITOR_PROJECT_ID;
 const LANGUAGES = (
-  process.env.LANGUAGES || "ar,zh-tw,cs,en,fi,fr,de,pt-br,ru,es,tr,ja"
+  process.env.LANGUAGES || "ar,zh-tw,cs,en,fi,fr,de,pt-br,ru,es,tr,ja,zh-cn"
 ).split(",");
 const EXPORT_FORMAT = process.env.EXPORT_FORMAT || "key_value_json";
 

.github/workflows/check-format.yml

@@ -16,7 +16,7 @@ jobs:
 
       - name: Install client dependencies
         working-directory: client
-        run: npm ci
+        run: npm install
 
       - name: Check client formatting
         working-directory: client
@@ -34,7 +34,7 @@ jobs:
 
       - name: Install server dependencies
         working-directory: server
-        run: npm ci
+        run: npm install
 
       - name: Check server formatting
         working-directory: server

.github/workflows/poeditor-sync.yml

@@ -7,7 +7,7 @@ on:
       languages:
         description: "Languages to synchronize (comma separated, e.g.: tr,en,es)"
         required: false
-        default: "ar,zh-tw,cs,en,fi,fr,de,pt-br,ru,es,tr,ja"
+        default: "ar,zh-tw,cs,en,fi,fr,de,pt-br,ru,es,tr,ja,zh-cn"
       format:
         description: "Export format (key_value_json or json)"
         required: false

client/package-lock.json

@@ -21,7 +21,7 @@
 				"dayjs": "1.11.13",
 				"flag-icons": "7.3.2",
 				"html2canvas": "^1.4.1",
-				"i18next": "^24.2.2",
+				"i18next": "25.4.2",
 				"joi": "17.13.3",
 				"mui-color-input": "^6.0.0",
 				"react": "18.3.1",
@@ -46,9 +46,6 @@
 				"eslint-plugin-react-refresh": "^0.4.6",
 				"prettier": "^3.3.3",
 				"vite": "6.3.5"
-			},
-			"optionalDependencies": {
-				"@rollup/rollup-linux-arm64-musl": "4.41.0"
 			}
 		},
 		"node_modules/@ampproject/remapping": {
@@ -283,9 +280,9 @@
 			}
 		},
 		"node_modules/@babel/runtime": {
-			"version": "7.27.1",
-			"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.1.tgz",
-			"integrity": "sha512-1x3D2xEk2fRo3PAhwQwu5UubzgiVWSXTBfWpVd2Mx2AzRqJuDJCsgaDVZ7HB5iGzDW1Hl1sWN2mFyKjmR9uAog==",
+			"version": "7.28.3",
+			"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.3.tgz",
+			"integrity": "sha512-9uIQ10o0WGdpP6GDhXcdOJPJuDgFtIDtN/9+ArJQ2NAfAmiuhTQdzkaTGR33v43GYS2UrSA0eX2pPPHoFVvpxA==",
 			"license": "MIT",
 			"engines": {
 				"node": ">=6.9.0"
@@ -4072,9 +4069,9 @@
 			}
 		},
 		"node_modules/i18next": {
-			"version": "24.2.3",
-			"resolved": "https://registry.npmjs.org/i18next/-/i18next-24.2.3.tgz",
-			"integrity": "sha512-lfbf80OzkocvX7nmZtu7nSTNbrTYR52sLWxPtlXX1zAhVw8WEnFk4puUkCR4B1dNQwbSpEHHHemcZu//7EcB7A==",
+			"version": "25.4.2",
+			"resolved": "https://registry.npmjs.org/i18next/-/i18next-25.4.2.tgz",
+			"integrity": "sha512-gD4T25a6ovNXsfXY1TwHXXXLnD/K2t99jyYMCSimSCBnBRJVQr5j+VAaU83RJCPzrTGhVQ6dqIga66xO2rtd5g==",
 			"funding": [
 				{
 					"type": "individual",
@@ -4091,7 +4088,7 @@
 			],
 			"license": "MIT",
 			"dependencies": {
-				"@babel/runtime": "^7.26.10"
+				"@babel/runtime": "^7.27.6"
 			},
 			"peerDependencies": {
 				"typescript": "^5"

client/package.json

@@ -26,7 +26,7 @@
 		"dayjs": "1.11.13",
 		"flag-icons": "7.3.2",
 		"html2canvas": "^1.4.1",
-		"i18next": "^24.2.2",
+		"i18next": "25.4.2",
 		"joi": "17.13.3",
 		"mui-color-input": "^6.0.0",
 		"react": "18.3.1",
@@ -59,8 +59,5 @@
 		"eslint-plugin-react-refresh": "^0.4.6",
 		"prettier": "^3.3.3",
 		"vite": "6.3.5"
-	},
-	"optionalDependencies": {
-		"@rollup/rollup-linux-arm64-musl": "4.41.0"
 	}
 }

client/src/Components/Charts/StatusPageBarChart/index.jsx

@@ -1,7 +1,7 @@
 import { useTheme } from "@emotion/react";
 import { Box, Stack, Tooltip, Typography } from "@mui/material";
 import { formatDateWithTz } from "../../../Utils/timeUtils";
-import { useEffect, useState } from "react";
+import { useEffect, useState, forwardRef } from "react";
 import { useSelector } from "react-redux";
 import PropTypes from "prop-types";
 
@@ -17,26 +17,32 @@ import PropTypes from "prop-types";
  * @returns {JSX.Element} The Bar component.
  */
 
-const Bar = ({ width, height, backgroundColor, borderRadius, children }) => {
-	const theme = useTheme();
+const Bar = forwardRef(
+	({ width, height, backgroundColor, borderRadius, children, ...otherProps }, ref) => {
+		const theme = useTheme();
 
-	return (
-		<Box
-			position="relative"
-			width={width}
-			height={height}
-			backgroundColor={backgroundColor}
-			sx={{
-				borderRadius: borderRadius || theme.spacing(1.5),
-			}}
-		>
-			{children}
-		</Box>
-	);
-};
+		return (
+			<Box
+				ref={ref}
+				position="relative"
+				width={width}
+				height={height}
+				backgroundColor={backgroundColor}
+				sx={{
+					borderRadius: borderRadius || theme.spacing(1.5),
+				}}
+				{...otherProps}
+			>
+				{children}
+			</Box>
+		);
+	}
+);
+
+Bar.displayName = "Bar";
 
 Bar.propTypes = {
-	width: PropTypes.string.isRequired,
+	width: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,
 	height: PropTypes.string.isRequired,
 	backgroundColor: PropTypes.string.isRequired,
 	borderRadius: PropTypes.string,

client/src/Components/Check/Check.jsx

@@ -65,7 +65,7 @@ const Check = ({ text, noHighlightText, variant = "info", outlined = false }) =>
 };
 
 Check.propTypes = {
-	text: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
+	text: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
 	noHighlightText: PropTypes.string,
 	variant: PropTypes.oneOf(["info", "error", "success"]),
 	outlined: PropTypes.bool,

client/src/Components/Dialog/genericDialog.jsx

@@ -2,7 +2,7 @@ import { useId } from "react";
 import PropTypes from "prop-types";
 import { Modal, Stack, Typography } from "@mui/material";
 
-const GenericDialog = ({ title, description, open, onClose, theme, children }) => {
+const GenericDialog = ({ title, description, open, onClose, theme, children, width }) => {
 	const titleId = useId();
 	const descriptionId = useId();
 	const ariaDescribedBy = description?.length > 0 ? descriptionId : "";
@@ -16,6 +16,7 @@ const GenericDialog = ({ title, description, open, onClose, theme, children }) =
 		>
 			<Stack
 				gap={theme.spacing(2)}
+				width={width}
 				sx={{
 					position: "absolute",
 					top: "50%",
@@ -39,6 +40,7 @@ const GenericDialog = ({ title, description, open, onClose, theme, children }) =
 					fontSize={16}
 					color={theme.palette.primary.contrastText}
 					fontWeight={600}
+					marginBottom={theme.spacing(4)}
 				>
 					{title}
 				</Typography>
@@ -46,6 +48,7 @@ const GenericDialog = ({ title, description, open, onClose, theme, children }) =
 					<Typography
 						id={descriptionId}
 						color={theme.palette.primary.contrastTextTertiary}
+						marginBottom={theme.spacing(4)}
 					>
 						{description}
 					</Typography>
@@ -64,6 +67,7 @@ GenericDialog.propTypes = {
 	theme: PropTypes.object.isRequired,
 	children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node])
 		.isRequired,
+	width: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object]),
 };
 
 export { GenericDialog };

client/src/Components/PageStateWrapper/index.jsx

@@ -0,0 +1,66 @@
+import GenericFallback from "../GenericFallback";
+import Fallback from "../Fallback";
+import { Typography } from "@mui/material";
+import { useTheme } from "@emotion/react";
+import { useTranslation } from "react-i18next";
+import { useIsAdmin } from "../../Hooks/useIsAdmin";
+import PropTypes from "prop-types";
+const PageStateWrapper = ({
+	networkError,
+	isLoading,
+	items,
+	type,
+	fallbackLink,
+	fallbackChildren,
+	children,
+}) => {
+	const theme = useTheme();
+	const { t } = useTranslation();
+	const isAdmin = useIsAdmin();
+	const isEmpty = items === null || (Array.isArray(items) && items.length === 0);
+	const hasInitialized = items !== undefined && !(isLoading && isEmpty);
+	const showEmpty = !isLoading && isEmpty;
+	if (networkError) {
+		return (
+			<GenericFallback>
+				<Typography
+					variant="h1"
+					marginY={theme.spacing(4)}
+					color={theme.palette.primary.contrastTextTertiary}
+				>
+					{t("common.toasts.networkError")}
+				</Typography>
+				<Typography>{t("common.toasts.checkConnection")}</Typography>
+			</GenericFallback>
+		);
+	}
+	if (!hasInitialized) {
+		return null;
+	}
+	if (showEmpty) {
+		return (
+			<Fallback
+				type={type}
+				title={t(`${type}.fallback.title`)}
+				checks={t(`${type}.fallback.checks`, { returnObjects: true })}
+				link={fallbackLink}
+				isAdmin={isAdmin}
+			>
+				{fallbackChildren}
+			</Fallback>
+		);
+	}
+	return <>{children}</>;
+};
+
+PageStateWrapper.propTypes = {
+	networkError: PropTypes.any,
+	isLoading: PropTypes.bool,
+	items: PropTypes.oneOfType([PropTypes.array, PropTypes.oneOf([null])]),
+	type: PropTypes.string,
+	fallbackLink: PropTypes.string,
+	fallbackChildren: PropTypes.node,
+	children: PropTypes.node,
+};
+
+export default PageStateWrapper;

client/src/Hooks/inviteHooks.js

@@ -14,25 +14,25 @@ const useGetInviteToken = () => {
 	const clearToken = () => {
 		setToken(undefined);
 	};
-
+	const fetchToken = async (email, role) => {
+		const response = await networkService.requestInvitationToken({ email, role });
+		const token = response?.data?.data?.token;
+		if (typeof token === "undefined") {
+			throw new Error(t("inviteNoTokenFound"));
+		}
+		return token;
+	};
 	const getInviteToken = async ({ email, role }) => {
 		try {
-			const response = await networkService.requestInvitationToken({
-				email,
-				role,
-			});
-			const token = response?.data?.data?.token;
-			if (typeof token === "undefined") {
-				throw new Error(t("inviteNoTokenFound"));
-			}
-
+			setIsLoading(true);
+			const token = await fetchToken(email, role);
 			let inviteLink = token;
 
 			if (typeof CLIENT_HOST !== "undefined") {
 				inviteLink = `${CLIENT_HOST}/register/${token}`;
 			}
-
 			setToken(inviteLink);
+			return token;
 		} catch (error) {
 			setError(error);
 		} finally {
@@ -40,7 +40,26 @@ const useGetInviteToken = () => {
 		}
 	};
 
-	return [getInviteToken, clearToken, isLoading, error, token];
+	const addTeamMember = async (formData, role) => {
+		try {
+			setIsLoading(true);
+			const token = await fetchToken(formData.email, role);
+			const toSubmit = {
+				...formData,
+				inviteToken: token,
+			};
+			delete toSubmit.confirm;
+			const responseRegister = await networkService.registerUser(toSubmit);
+			return responseRegister;
+		} catch (error) {
+			setError(error);
+			throw error;
+		} finally {
+			setIsLoading(false);
+		}
+	};
+
+	return [getInviteToken, clearToken, isLoading, error, token, addTeamMember];
 };
 
 export { useGetInviteToken };

client/src/Hooks/useNotifications.js

@@ -34,7 +34,7 @@ const useCreateNotification = () => {
 
 const useGetNotificationsByTeamId = (updateTrigger) => {
 	const [notifications, setNotifications] = useState([]);
-	const [isLoading, setIsLoading] = useState(false);
+	const [isLoading, setIsLoading] = useState(true);
 	const [error, setError] = useState(null);
 	const { t } = useTranslation();
 

client/src/Pages/Account/components/AddMemberMenu/index.jsx

@@ -0,0 +1,68 @@
+import { useState } from "react";
+import Button from "@mui/material/Button";
+import Menu from "@mui/material/Menu";
+import MenuItem from "@mui/material/MenuItem";
+import { useTheme } from "@emotion/react";
+import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
+import { useTranslation } from "react-i18next";
+import Proptypes from "prop-types";
+
+const AddMemberMenu = ({ handleInviteOpen, handleIsRegisterOpen }) => {
+	const [anchorEl, setAnchorEl] = useState(null);
+	const open = Boolean(anchorEl);
+	const { t } = useTranslation();
+	const theme = useTheme();
+	const handleClick = (event) => {
+		setAnchorEl(event.currentTarget);
+	};
+	const handleClose = () => {
+		setAnchorEl(null);
+	};
+
+	return (
+		<>
+			<Button
+				variant="contained"
+				color="accent"
+				endIcon={<ArrowDropDownIcon sx={{ color: theme.palette.secondary.light }} />}
+				onClick={handleClick}
+			>
+				{t("teamPanel.addTeamMember.addMemberMenu")}
+			</Button>
+			<Menu
+				anchorEl={anchorEl}
+				open={open}
+				onClose={handleClose}
+				sx={{
+					"& .MuiPaper-root": {
+						minWidth: anchorEl?.offsetWidth || "auto",
+					},
+				}}
+			>
+				<MenuItem
+					onClick={() => {
+						handleClose();
+						handleInviteOpen();
+					}}
+				>
+					{t("teamPanel.inviteTeamMember")}
+				</MenuItem>
+				<MenuItem
+					onClick={() => {
+						handleClose();
+						handleIsRegisterOpen(true);
+					}}
+				>
+					{t("teamPanel.register")}
+				</MenuItem>
+			</Menu>
+		</>
+	);
+};
+
+AddMemberMenu.propTypes = {
+	handleInviteOpen: Proptypes.func.isRequired,
+	handleIsRegisterOpen: Proptypes.func.isRequired,
+};
+
+export default AddMemberMenu;

client/src/Pages/Account/components/AddTeamMember/hooks/useAddTeamMember.jsx

@@ -0,0 +1,48 @@
+import { useState } from "react";
+import { newOrChangedCredentials } from "../../../../../Validation/validation";
+import { useTranslation } from "react-i18next";
+const useAddTeamMember = () => {
+	const { t } = useTranslation();
+	const [errors, setErrors] = useState({});
+
+	const clearErrors = () => setErrors({});
+
+	const validateFields = (name, value, formData) => {
+		const { error } = newOrChangedCredentials.validate(
+			{ [name]: value },
+			{ abortEarly: false, context: { password: formData.password } }
+		);
+
+		setErrors((prev) => ({
+			...prev,
+			[name]: error?.details?.[0]?.message || "",
+		}));
+	};
+
+	const validateForm = (formData, role) => {
+		const { error } = newOrChangedCredentials.validate(formData, {
+			abortEarly: false,
+			context: { password: formData.password },
+		});
+		const formErrors = {};
+		if (error) {
+			for (const err of error.details) {
+				formErrors[err.path[0]] = err.message;
+			}
+		}
+		if (!role[0] || role.length === 0) {
+			formErrors.role = t(
+				"teamPanel.registerTeamMember.auth.common.inputs.role.errors.empty"
+			);
+		}
+		if (Object.keys(formErrors).length > 0) {
+			setErrors(formErrors);
+			return false;
+		}
+		setErrors({});
+		return true;
+	};
+
+	return { errors, setErrors, clearErrors, validateFields, validateForm };
+};
+export default useAddTeamMember;

client/src/Pages/Account/components/AddTeamMember/index.jsx

@@ -0,0 +1,213 @@
+import { Button, Stack } from "@mui/material";
+import { GenericDialog } from "../../../../Components/Dialog/genericDialog";
+import TextInput from "../../../../Components/Inputs/TextInput";
+import Select from "../../../../Components/Inputs/Select";
+import { useGetInviteToken } from "../../../../Hooks/inviteHooks";
+import { useTheme } from "@emotion/react";
+import { useTranslation } from "react-i18next";
+import { createToast } from "../../../../Utils/toastUtils";
+import { useState } from "react";
+import PasswordTooltip from "../../../Auth/components/PasswordTooltip";
+import useAddTeamMember from "./hooks/useAddTeamMember";
+import usePasswordFeedback from "../../../Auth/hooks/usePasswordFeedback";
+import { PasswordEndAdornment } from "../../../../Components/Inputs/TextInput/Adornments";
+import PropTypes from "prop-types";
+
+const INITIAL_FORM_STATE = {
+	firstName: "",
+	lastName: "",
+	email: "",
+	password: "",
+	confirm: "",
+	teamId: "",
+};
+
+const INITIAL_ROLE_STATE = ["user"];
+const AddTeamMember = ({ handleIsRegisterOpen, isRegisterOpen, onMemberAdded }) => {
+	const theme = useTheme();
+	const { t } = useTranslation();
+	const { errors, setErrors, clearErrors, validateFields, validateForm } =
+		useAddTeamMember();
+	const { feedback, handlePasswordFeedback } = usePasswordFeedback();
+	const [getInviteToken, clearToken, isLoading, error, token, addTeamMember] =
+		useGetInviteToken();
+	const [form, setForm] = useState(INITIAL_FORM_STATE);
+	const [role, setRole] = useState(INITIAL_ROLE_STATE);
+	const [isLoadingSubmit, setIsLoadingSubmit] = useState(false);
+	const closeAddMemberModal = () => {
+		handleIsRegisterOpen(false);
+		setForm(INITIAL_FORM_STATE);
+		setRole(INITIAL_ROLE_STATE);
+		clearErrors();
+		clearToken();
+	};
+
+	const onChange = (e) => {
+		let { name, value } = e.target;
+		if (name === "email") value = value.toLowerCase();
+		const updatedForm = { ...form, [name]: value };
+		validateFields(name, value, updatedForm);
+		setForm(updatedForm);
+
+		if (name === "password" || name === "confirm") {
+			handlePasswordFeedback(updatedForm, name, value, form, errors, setErrors);
+		}
+	};
+
+	const onsubmitAddMember = async (event) => {
+		event.preventDefault();
+		if (!validateForm(form, role)) return;
+		try {
+			setIsLoadingSubmit(true);
+			await addTeamMember(form, role);
+			createToast({
+				body: t("teamPanel.registerToast.success"),
+			});
+			onMemberAdded();
+			closeAddMemberModal();
+		} catch (error) {
+			const errorMsg = error.response?.data?.msg || error.message || "unknownError";
+			createToast({
+				type: "error",
+				body: t(errorMsg),
+			});
+		} finally {
+			setIsLoadingSubmit(false);
+		}
+	};
+	const tErr = (key) => (key ? t([`teamPanel.registerTeamMember.${key}`, key]) : "");
+	return (
+		<>
+			<GenericDialog
+				title={t("teamPanel.addTeamMember.title")}
+				description={t("teamPanel.addTeamMember.description")}
+				open={isRegisterOpen}
+				onClose={closeAddMemberModal}
+				theme={theme}
+				width={{ sm: "55%", md: "50%", lg: "40%", xl: "30%" }}
+			>
+				<TextInput
+					name="firstName"
+					label={t("auth.common.inputs.firstName.label")}
+					isRequired={true}
+					gap={theme.spacing(4)}
+					placeholder={t("auth.common.inputs.firstName.placeholder")}
+					value={form.firstName}
+					onChange={onChange}
+					error={errors.firstName ? true : false}
+					helperText={errors.firstName ? tErr(errors.firstName) : null}
+					sx={{ mb: errors.firstName ? theme.spacing(15) : theme.spacing(5) }}
+				/>
+
+				<TextInput
+					name="lastName"
+					label={t("auth.common.inputs.lastName.label")}
+					isRequired={true}
+					gap={theme.spacing(4)}
+					placeholder={t("auth.common.inputs.lastName.placeholder")}
+					value={form.lastName}
+					onChange={onChange}
+					error={errors.lastName ? true : false}
+					helperText={errors.lastName ? tErr(errors.lastName) : null}
+					sx={{ mb: errors.lastName ? theme.spacing(15) : theme.spacing(5) }}
+				/>
+
+				<TextInput
+					type="email"
+					label={t("auth.common.inputs.email.label")}
+					name="email"
+					gap={theme.spacing(4)}
+					isRequired={true}
+					id="input-team-member"
+					placeholder={t("teamPanel.email")}
+					value={form.email}
+					onChange={onChange}
+					error={errors.email ? true : false}
+					helperText={errors.email ? tErr(errors.email) : null}
+					sx={{ mb: errors.email ? theme.spacing(15) : theme.spacing(5) }}
+				/>
+
+				<Select
+					label={t("teamPanel.role")}
+					id="team-member-role"
+					name="role"
+					required={true}
+					placeholder={t("teamPanel.selectRole")}
+					isHidden={true}
+					value={role[0] || ""}
+					sx={{ mb: theme.spacing(5) }}
+					onChange={(event) => setRole([event.target.value])}
+					items={[
+						{ _id: "admin", name: t("roles.admin") },
+						{ _id: "user", name: t("roles.teamMember") },
+					]}
+				/>
+
+				<PasswordTooltip
+					feedback={feedback}
+					form={form}
+				>
+					<TextInput
+						type="password"
+						id="register-password-input"
+						name="password"
+						label={t("auth.common.inputs.password.label")}
+						isRequired={true}
+						placeholder="••••••••••"
+						value={form.password}
+						onChange={onChange}
+						error={errors.password && errors.password[0] ? true : false}
+						endAdornment={<PasswordEndAdornment />}
+						sx={{ mb: theme.spacing(5) }}
+					/>
+				</PasswordTooltip>
+				<TextInput
+					type="password"
+					id="register-confirm-input"
+					name="confirm"
+					label={t("auth.common.inputs.passwordConfirm.label")}
+					gap={theme.spacing(4)}
+					isRequired={true}
+					placeholder={t("auth.common.inputs.passwordConfirm.placeholder")}
+					autoComplete="current-password"
+					value={form.confirm}
+					onChange={onChange}
+					error={errors.confirm && errors.confirm[0] ? true : false}
+					endAdornment={<PasswordEndAdornment />}
+					sx={{ mb: theme.spacing(5) }}
+				/>
+
+				<Stack
+					direction="row"
+					spacing={theme.spacing(10)}
+					mt={theme.spacing(8)}
+					justifyContent="flex-end"
+				>
+					<Button
+						variant="contained"
+						color="error"
+						onClick={closeAddMemberModal}
+						disabled={isLoadingSubmit}
+					>
+						{t("teamPanel.cancel")}
+					</Button>
+					<Button
+						variant="contained"
+						color="accent"
+						onClick={onsubmitAddMember}
+						disabled={isLoadingSubmit}
+					>
+						{t("teamPanel.addTeamMember.addButton")}
+					</Button>
+				</Stack>
+			</GenericDialog>
+		</>
+	);
+};
+AddTeamMember.propTypes = {
+	handleIsRegisterOpen: PropTypes.func.isRequired,
+	isRegisterOpen: PropTypes.bool.isRequired,
+	onMemberAdded: PropTypes.func.isRequired,
+};
+
+export default AddTeamMember;

client/src/Pages/Account/components/TeamPanel.jsx

@@ -9,10 +9,12 @@ import { networkService } from "../../../main";
 import { createToast } from "../../../Utils/toastUtils";
 import Select from "../../../Components/Inputs/Select";
 import { GenericDialog } from "../../../Components/Dialog/genericDialog";
+import AddTeamMember from "../components/AddTeamMember";
 import DataTable from "../../../Components/Table";
 import { useGetInviteToken } from "../../../Hooks/inviteHooks";
 import { useNavigate } from "react-router-dom";
 import { useIsSuperAdmin } from "../../../Hooks/useIsAdmin";
+import AddMemberMenu from "./AddMemberMenu";
 /**
  * TeamPanel component manages the organization and team members,
  * providing functionalities like renaming the organization, managing team members,
@@ -65,7 +67,10 @@ const TeamPanel = () => {
 			render: (row) => row.role,
 		},
 	];
-
+	const [refreshTrigger, setRefreshTrigger] = useState(false);
+	const refreshTeamList = () => {
+		setRefreshTrigger((prev) => !prev);
+	};
 	useEffect(() => {
 		const fetchTeam = async () => {
 			try {
@@ -79,7 +84,7 @@ const TeamPanel = () => {
 		};
 
 		fetchTeam();
-	}, []);
+	}, [refreshTrigger]);
 
 	useEffect(() => {
 		const ROLE_MAP = {
@@ -109,6 +114,10 @@ const TeamPanel = () => {
 		setIsDisabled(Object.keys(errors).length !== 0 || toInvite.email === "");
 	}, [errors, toInvite.email]);
 	const [isOpen, setIsOpen] = useState(false);
+	const [isRegisterOpen, setIsRegisterOpen] = useState(false);
+	const handleIsRegisterOpen = (open) => {
+		setIsRegisterOpen(open);
+	};
 
 	const handleChange = (event) => {
 		const { value } = event.target;
@@ -138,7 +147,6 @@ const TeamPanel = () => {
 	const handleGetToken = async () => {
 		await getInviteToken({ email: toInvite.email, role: toInvite.role });
 	};
-
 	const handleInviteMember = async () => {
 		if (!toInvite.email) {
 			setErrors((prev) => ({ ...prev, email: "Email is required." }));
@@ -239,13 +247,16 @@ const TeamPanel = () => {
 							</Button>
 						</ButtonGroup>
 					</Stack>
-					<Button
-						variant="contained"
-						color="accent"
-						onClick={() => setIsOpen(true)}
-					>
-						{t("teamPanel.inviteTeamMember")}
-					</Button>
+
+					<AddTeamMember
+						handleIsRegisterOpen={handleIsRegisterOpen}
+						isRegisterOpen={isRegisterOpen}
+						onMemberAdded={refreshTeamList}
+					/>
+					<AddMemberMenu
+						handleInviteOpen={() => setIsOpen(true)}
+						handleIsRegisterOpen={handleIsRegisterOpen}
+					/>
 				</Stack>
 
 				<DataTable
@@ -264,7 +275,6 @@ const TeamPanel = () => {
 					}}
 				/>
 			</Stack>
-
 			<GenericDialog
 				title={t("teamPanel.inviteNewTeamMember")}
 				description={t("teamPanel.inviteDescription")}

client/src/Pages/Auth/components/PasswordTooltip.jsx

@@ -93,14 +93,14 @@ const PasswordTooltip = ({ feedback, form, children }) => {
 				},
 			}}
 		>
-			{children}
+			<span style={{ display: "inline-block", width: "100%" }}>{children}</span>
 		</Tooltip>
 	);
 };
 
 PasswordTooltip.propTypes = {
 	feedback: PropTypes.shape({
-		length: PropTypes.string.isRequired,
+		length: PropTypes.string,
 		special: PropTypes.string,
 		number: PropTypes.string,
 		uppercase: PropTypes.string,

client/src/Pages/Auth/hooks/usePasswordFeedback.jsx

@@ -0,0 +1,71 @@
+import { useState } from "react";
+import { newOrChangedCredentials } from "../../../Validation/validation";
+
+const usePasswordFeedback = () => {
+	const [feedback, setFeedback] = useState({});
+	const getFeedbackStatus = (form, errors, field, criteria) => {
+		const fieldErrors = errors?.[field];
+		const isFieldEmpty = form?.[field]?.length === 0;
+		const hasError = fieldErrors?.includes(criteria) || fieldErrors?.includes("empty");
+		const isCorrect = !isFieldEmpty && !hasError;
+
+		if (isCorrect) {
+			return "success";
+		} else if (hasError) {
+			return "error";
+		} else {
+			return "info";
+		}
+	};
+
+	const handlePasswordFeedback = (updatedForm, name, value, form, errors, setErrors) => {
+		const validateValue = { [name]: value };
+		const validateOptions = { abortEarly: false, context: { password: form.password } };
+		if (name === "password" && form.confirm.length > 0) {
+			validateValue.confirm = form.confirm;
+			validateOptions.context = { password: value };
+		} else if (name === "confirm") {
+			validateValue.password = form.password;
+		}
+		const { error } = newOrChangedCredentials.validate(validateValue, validateOptions);
+
+		const pwdErrors = error?.details.map((error) => ({
+			path: error.path[0],
+			type: error.type,
+		}));
+
+		const errorsByPath =
+			pwdErrors &&
+			pwdErrors.reduce((acc, { path, type }) => {
+				if (!acc[path]) {
+					acc[path] = [];
+				}
+				acc[path].push(type);
+				return acc;
+			}, {});
+
+		const oldErrors = { ...errors };
+		if (name === "password") {
+			oldErrors.password = undefined;
+		} else if (name === "confirm") {
+			oldErrors.confirm = undefined;
+		}
+		const newErrors = { ...oldErrors, ...errorsByPath };
+
+		setErrors(newErrors);
+
+		const newFeedback = {
+			length: getFeedbackStatus(updatedForm, errorsByPath, "password", "string.min"),
+			special: getFeedbackStatus(updatedForm, errorsByPath, "password", "special"),
+			number: getFeedbackStatus(updatedForm, errorsByPath, "password", "number"),
+			uppercase: getFeedbackStatus(updatedForm, errorsByPath, "password", "uppercase"),
+			lowercase: getFeedbackStatus(updatedForm, errorsByPath, "password", "lowercase"),
+			confirm: getFeedbackStatus(updatedForm, errorsByPath, "confirm", "different"),
+		};
+
+		setFeedback(newFeedback);
+	};
+	return { feedback, handlePasswordFeedback, getFeedbackStatus };
+};
+
+export default usePasswordFeedback;

client/src/Pages/Infrastructure/Monitors/index.jsx

@@ -1,12 +1,11 @@
 // Components
-import { Stack, Typography } from "@mui/material";
+import { Stack } from "@mui/material";
 import Breadcrumbs from "../../../Components/Breadcrumbs";
 import MonitorCountHeader from "../../../Components/MonitorCountHeader";
 import MonitorCreateHeader from "../../../Components/MonitorCreateHeader";
 import MonitorsTable from "./Components/MonitorsTable";
 import Pagination from "../../..//Components/Table/TablePagination";
-import GenericFallback from "../../../Components/GenericFallback";
-import Fallback from "../../../Components/Fallback";
+import PageStateWrapper from "../../../Components/PageStateWrapper";
 import Filter from "./Components/Filters";
 import SearchComponent from "../../Uptime/Monitors/Components/SearchComponent";
 // Utils
@@ -81,75 +80,58 @@ const InfrastructureMonitors = () => {
 		updateTrigger,
 	});
 
-	if (networkError === true) {
-		return (
-			<GenericFallback>
-				<Typography
-					variant="h1"
-					marginY={theme.spacing(4)}
-					color={theme.palette.primary.contrastTextTertiary}
-				>
-					{t("common.toasts.networkError")}
-				</Typography>
-				<Typography>{t("common.toasts.checkConnection")}</Typography>
-			</GenericFallback>
-		);
-	}
-
-	if (!isLoading && typeof summary?.totalMonitors === "undefined") {
-		return (
-			<Fallback
-				type="infrastructureMonitor"
-				title={t("infrastructureMonitor.fallback.title")}
-				checks={t("infrastructureMonitor.fallback.checks", { returnObjects: true })}
-				link="/infrastructure/create"
-				isAdmin={isAdmin}
-			/>
-		);
-	}
-
 	return (
-		<Stack gap={theme.spacing(10)}>
-			<Breadcrumbs list={BREADCRUMBS} />
-			<MonitorCreateHeader
-				isAdmin={isAdmin}
+		<>
+			<PageStateWrapper
+				networkError={networkError}
 				isLoading={isLoading}
-				path="/infrastructure/create"
-			/>
-			<Stack direction={"row"}>
-				<MonitorCountHeader
-					isLoading={isLoading}
-					monitorCount={summary?.totalMonitors ?? 0}
-				/>
-				<Filter
-					selectedStatus={selectedStatus}
-					setSelectedStatus={setSelectedStatus}
-					setToFilterStatus={setToFilterStatus}
-					handleReset={handleReset}
-				/>
-				<SearchComponent
-					monitors={monitors}
-					onSearchChange={setSearch}
-					setIsSearching={setIsSearching}
-				/>
-			</Stack>
+				items={monitors}
+				type="infrastructureMonitor"
+				fallbackLink="/infrastructure/create"
+			>
+				<Stack gap={theme.spacing(10)}>
+					<Breadcrumbs list={BREADCRUMBS} />
+					<MonitorCreateHeader
+						isAdmin={isAdmin}
+						isLoading={isLoading}
+						path="/infrastructure/create"
+					/>
+					<Stack direction={"row"}>
+						<MonitorCountHeader
+							isLoading={isLoading}
+							monitorCount={summary?.totalMonitors ?? 0}
+						/>
+						<Filter
+							selectedStatus={selectedStatus}
+							setSelectedStatus={setSelectedStatus}
+							setToFilterStatus={setToFilterStatus}
+							handleReset={handleReset}
+						/>
+						<SearchComponent
+							monitors={monitors}
+							onSearchChange={setSearch}
+							setIsSearching={setIsSearching}
+						/>
+					</Stack>
 
-			<MonitorsTable
-				isLoading={isLoading}
-				monitors={monitors}
-				isAdmin={isAdmin}
-				handleActionMenuDelete={handleActionMenuDelete}
-				isSearching={isSearching}
-			/>
-			<Pagination
-				itemCount={summary?.totalMonitors}
-				paginationLabel={t("monitors")}
-				page={page}
-				rowsPerPage={rowsPerPage}
-				handleChangePage={handleChangePage}
-				handleChangeRowsPerPage={handleChangeRowsPerPage}
-			/>
-		</Stack>
+					<MonitorsTable
+						isLoading={isLoading}
+						monitors={monitors}
+						isAdmin={isAdmin}
+						handleActionMenuDelete={handleActionMenuDelete}
+						isSearching={isSearching}
+					/>
+					<Pagination
+						itemCount={summary?.totalMonitors}
+						paginationLabel={t("monitors")}
+						page={page}
+						rowsPerPage={rowsPerPage}
+						handleChangePage={handleChangePage}
+						handleChangeRowsPerPage={handleChangeRowsPerPage}
+					/>
+				</Stack>
+			</PageStateWrapper>
+		</>
 	);
 };
 

client/src/Pages/Maintenance/index.jsx

@@ -1,6 +1,5 @@
 import { Stack, Button } from "@mui/material";
 import { useTheme } from "@emotion/react";
-import Fallback from "../../Components/Fallback";
 import { useState, useEffect } from "react";
 import "./index.css";
 import MaintenanceTable from "./MaintenanceTable";
@@ -8,24 +7,21 @@ import { useSelector } from "react-redux";
 import { networkService } from "../../main";
 import Breadcrumbs from "../../Components/Breadcrumbs";
 import { useNavigate } from "react-router-dom";
-import { useIsAdmin } from "../../Hooks/useIsAdmin";
 import { useTranslation } from "react-i18next";
-import { Typography } from "@mui/material";
-import GenericFallback from "../../Components/GenericFallback";
+import PageStateWrapper from "../../Components/PageStateWrapper";
 
 const Maintenance = () => {
 	const theme = useTheme();
 	const { t } = useTranslation();
 	const navigate = useNavigate();
 	const rowsPerPage = useSelector((state) => state?.ui?.maintenance?.rowsPerPage ?? 5);
-	const isAdmin = useIsAdmin();
-	const [maintenanceWindows, setMaintenanceWindows] = useState([]);
+	const [maintenanceWindows, setMaintenanceWindows] = useState(undefined);
 	const [maintenanceWindowCount, setMaintenanceWindowCount] = useState(0);
 	const [page, setPage] = useState(0);
 	const [sort, setSort] = useState({});
 	const [updateTrigger, setUpdateTrigger] = useState(false);
 	const [networkError, setNetworkError] = useState(false);
-	const [isDataFetched, setIsDataFetched] = useState(false);
+	const [isLoading, setIsLoading] = useState(true);
 
 	const handleActionMenuDelete = () => {
 		setUpdateTrigger((prev) => !prev);
@@ -34,80 +30,65 @@ const Maintenance = () => {
 	useEffect(() => {
 		const fetchMaintenanceWindows = async () => {
 			try {
+				setNetworkError(false);
+				setIsLoading(true);
 				const response = await networkService.getMaintenanceWindowsByTeamId({
 					page: page,
 					rowsPerPage: rowsPerPage,
 				});
 				const { maintenanceWindows, maintenanceWindowCount } = response.data.data;
-				setMaintenanceWindows(maintenanceWindows);
-				setMaintenanceWindowCount(maintenanceWindowCount);
+				setMaintenanceWindows(maintenanceWindows ?? []);
+				setMaintenanceWindowCount(maintenanceWindowCount ?? 0);
 			} catch (error) {
 				setNetworkError(true);
 			} finally {
-				setIsDataFetched(true);
+				setIsLoading(false);
 			}
 		};
 		fetchMaintenanceWindows();
 	}, [page, rowsPerPage, updateTrigger]);
 
-	if (networkError) {
-		return (
-			<GenericFallback>
-				<Typography
-					variant="h1"
-					marginY={theme.spacing(4)}
-					color={theme.palette.primary.contrastTextTertiary}
-				>
-					{t("common.toasts.networkError")}
-				</Typography>
-				<Typography>{t("common.toasts.checkConnection")}</Typography>
-			</GenericFallback>
-		);
-	}
-	// Only show the fallback if we've fetched data and there are no maintenance windows
-	if (isDataFetched && maintenanceWindows.length === 0) {
-		return (
-			<Fallback
-				type="maintenanceWindow"
-				title={t("maintenanceWindow.fallback.title")}
-				checks={t("maintenanceWindow.fallback.checks", { returnObjects: true })}
-				link="/maintenance/create"
-				isAdmin={isAdmin}
-			/>
-		);
-	}
-
 	return (
-		<Stack gap={theme.spacing(10)}>
-			<Stack
-				direction="row"
-				justifyContent="space-between"
-				alignItems="center"
-				mt={theme.spacing(5)}
+		<>
+			<PageStateWrapper
+				networkError={networkError}
+				isLoading={isLoading}
+				items={maintenanceWindows}
+				type="maintenanceWindow"
+				fallbackLink="/maintenance/create"
 			>
-				<Breadcrumbs list={[{ name: "maintenance", path: "/maintenance" }]} />
-				<Button
-					variant="contained"
-					color="accent"
-					onClick={() => {
-						navigate("/maintenance/create");
-					}}
-					sx={{ fontWeight: 500 }}
-				>
-					{t("createMaintenanceWindow")}
-				</Button>
-			</Stack>
-			<MaintenanceTable
-				page={page}
-				setPage={setPage}
-				rowsPerPage={rowsPerPage}
-				sort={sort}
-				setSort={setSort}
-				maintenanceWindows={maintenanceWindows}
-				maintenanceWindowCount={maintenanceWindowCount}
-				updateCallback={handleActionMenuDelete}
-			/>
-		</Stack>
+				<Stack gap={theme.spacing(10)}>
+					<Stack
+						direction="row"
+						justifyContent="space-between"
+						alignItems="center"
+						mt={theme.spacing(5)}
+					>
+						<Breadcrumbs list={[{ name: "maintenance", path: "/maintenance" }]} />
+						<Button
+							variant="contained"
+							color="accent"
+							onClick={() => {
+								navigate("/maintenance/create");
+							}}
+							sx={{ fontWeight: 500 }}
+						>
+							{t("createMaintenanceWindow")}
+						</Button>
+					</Stack>
+					<MaintenanceTable
+						page={page}
+						setPage={setPage}
+						rowsPerPage={rowsPerPage}
+						sort={sort}
+						setSort={setSort}
+						maintenanceWindows={maintenanceWindows}
+						maintenanceWindowCount={maintenanceWindowCount}
+						updateCallback={handleActionMenuDelete}
+					/>
+				</Stack>
+			</PageStateWrapper>
+		</>
 	);
 };
 

client/src/Pages/Notifications/index.jsx

@@ -4,11 +4,10 @@ import Typography from "@mui/material/Typography";
 import Breadcrumbs from "../../Components/Breadcrumbs";
 import Button from "@mui/material/Button";
 import DataTable from "../../Components/Table";
-import Fallback from "../../Components/Fallback";
 import ActionMenu from "./components/ActionMenu";
+import PageStateWrapper from "../../Components/PageStateWrapper";
 
 // Utils
-import { useIsAdmin } from "../../Hooks/useIsAdmin";
 import { useState } from "react";
 import { useTheme } from "@emotion/react";
 import { useNavigate } from "react-router-dom";
@@ -23,7 +22,6 @@ const Notifications = () => {
 	const theme = useTheme();
 	const BREADCRUMBS = [{ name: "notifications", path: "/notifications" }];
 	const [updateTrigger, setUpdateTrigger] = useState(false);
-	const isAdmin = useIsAdmin();
 	const [notifications, isLoading, error] = useGetNotificationsByTeamId(updateTrigger);
 	const [deleteNotification, isDeleting, deleteError] = useDeleteNotification();
 	const { t } = useTranslation();
@@ -76,49 +74,47 @@ const Notifications = () => {
 		},
 	];
 
-	if (notifications?.length === 0) {
-		return (
-			<Fallback
-				type="notifications"
-				title={t("notifications.fallback.title")}
-				checks={t("notifications.fallback.checks", { returnObjects: true })}
-				link="/notifications/create"
-				isAdmin={isAdmin}
-			/>
-		);
-	}
-
 	return (
-		<Stack gap={theme.spacing(10)}>
-			<Breadcrumbs list={BREADCRUMBS} />
-			<Stack
-				direction="row"
-				justifyContent="flex-end"
+		<>
+			<PageStateWrapper
+				networkError={error}
+				isLoading={isLoading}
+				items={notifications}
+				type="notifications"
+				fallbackLink="/notifications/create"
 			>
-				<Button
-					variant="contained"
-					color="accent"
-					onClick={() => navigate("/notifications/create")}
-				>
-					{t("notifications.createButton")}
-				</Button>
-			</Stack>
-			<Typography variant="h1">{t("notifications.createTitle")}</Typography>
-			<DataTable
-				config={{
-					onRowClick: (row) => navigate(`/notifications/${row._id}`),
-					rowSX: {
-						cursor: "pointer",
-						"&:hover td": {
-							backgroundColor: theme.palette.tertiary.main,
-							transition: "background-color .3s ease",
-						},
-					},
-				}}
-				headers={headers}
-				data={notifications}
-			/>
-		</Stack>
+				<Stack gap={theme.spacing(10)}>
+					<Breadcrumbs list={BREADCRUMBS} />
+					<Stack
+						direction="row"
+						justifyContent="flex-end"
+					>
+						<Button
+							variant="contained"
+							color="accent"
+							onClick={() => navigate("/notifications/create")}
+						>
+							{t("notifications.createButton")}
+						</Button>
+					</Stack>
+					<Typography variant="h1">{t("notifications.createTitle")}</Typography>
+					<DataTable
+						config={{
+							onRowClick: (row) => navigate(`/notifications/${row._id}`),
+							rowSX: {
+								cursor: "pointer",
+								"&:hover td": {
+									backgroundColor: theme.palette.tertiary.main,
+									transition: "background-color .3s ease",
+								},
+							},
+						}}
+						headers={headers}
+						data={notifications}
+					/>
+				</Stack>
+			</PageStateWrapper>
+		</>
 	);
 };
 

client/src/Pages/PageSpeed/Monitors/index.jsx

@@ -1,18 +1,16 @@
 // Components
 import { useState } from "react";
 import Breadcrumbs from "../../../Components/Breadcrumbs";
-import { Stack, Typography } from "@mui/material";
+import { Stack } from "@mui/material";
 import CreateMonitorHeader from "../../../Components/MonitorCreateHeader";
 import MonitorCountHeader from "../../../Components/MonitorCountHeader";
 import MonitorGrid from "./Components/MonitorGrid";
-import Fallback from "../../../Components/Fallback";
-import GenericFallback from "../../../Components/GenericFallback";
+import PageStateWrapper from "../../../Components/PageStateWrapper";
 import FallbackPageSpeedWarning from "../../../Components/Fallback/FallbackPageSpeedWarning";
 
 // Utils
 import { useTheme } from "@emotion/react";
 import { useIsAdmin } from "../../../Hooks/useIsAdmin";
-import { useTranslation } from "react-i18next";
 import { useFetchMonitorsByTeamId } from "../../../Hooks/monitorHooks";
 import { useFetchSettings } from "../../../Hooks/settingsHooks";
 // Constants
@@ -20,7 +18,6 @@ const BREADCRUMBS = [{ name: `pagespeed`, path: "/pagespeed" }];
 const TYPES = ["pagespeed"];
 const PageSpeed = () => {
 	const theme = useTheme();
-	const { t } = useTranslation();
 	const isAdmin = useIsAdmin();
 
 	const [monitors, monitorsSummary, isLoading, networkError] = useFetchMonitorsByTeamId({
@@ -40,56 +37,42 @@ const PageSpeed = () => {
 		setIsEmailPasswordSet: () => {},
 	});
 
-	if (networkError === true) {
-		return (
-			<GenericFallback>
-				<Typography
-					variant="h1"
-					marginY={theme.spacing(4)}
-					color={theme.palette.primary.contrastTextTertiary}
-				>
-					{t("common.toasts.networkError")}
-				</Typography>
-				<Typography>{t("common.toasts.checkConnection")}</Typography>
-			</GenericFallback>
-		);
-	}
-
-	if (!isLoading && monitors?.length === 0) {
-		return (
-			<Fallback
-				type="pageSpeed"
-				title={t("pageSpeed.fallback.title")}
-				checks={t("pageSpeed.fallback.checks", { returnObjects: true })}
-				link="/pagespeed/create"
-				isAdmin={isAdmin}
-			>
-				{isAdmin && settingsData && !settingsData.pagespeedApiKey && (
-					<FallbackPageSpeedWarning settingsData={settingsData} />
-				)}
-			</Fallback>
-		);
-	}
-
 	return (
-		<Stack gap={theme.spacing(10)}>
-			<Breadcrumbs list={BREADCRUMBS} />
-			<CreateMonitorHeader
-				isAdmin={isAdmin}
+		<>
+			<PageStateWrapper
+				networkError={networkError}
 				isLoading={isLoading}
-				path="/pagespeed/create"
-			/>
-			<MonitorCountHeader
-				isLoading={isLoading}
-				monitorCount={monitorsSummary?.totalMonitors}
-				sx={{ mb: theme.spacing(8) }}
-			/>
-			<MonitorGrid
-				size={6}
-				shouldRender={!isLoading}
-				monitors={monitors}
-			/>
-		</Stack>
+				items={monitors}
+				type="pageSpeed"
+				fallbackLink="/pagespeed/create"
+				fallbackChildren={
+					isAdmin &&
+					settingsData &&
+					!settingsData.pagespeedApiKey && (
+						<FallbackPageSpeedWarning settingsData={settingsData} />
+					)
+				}
+			>
+				<Stack gap={theme.spacing(10)}>
+					<Breadcrumbs list={BREADCRUMBS} />
+					<CreateMonitorHeader
+						isAdmin={isAdmin}
+						isLoading={isLoading}
+						path="/pagespeed/create"
+					/>
+					<MonitorCountHeader
+						isLoading={isLoading}
+						monitorCount={monitorsSummary?.totalMonitors}
+						sx={{ mb: theme.spacing(8) }}
+					/>
+					<MonitorGrid
+						size={6}
+						shouldRender={!isLoading}
+						monitors={monitors}
+					/>
+				</Stack>
+			</PageStateWrapper>
+		</>
 	);
 };
 

client/src/Pages/StatusPage/Status/Components/MonitorsList/index.jsx

@@ -11,7 +11,12 @@ import PropTypes from "prop-types";
 
 import { useSelector } from "react-redux";
 
-const MonitorsList = ({ isLoading = false, shouldRender = true, monitors = [] }) => {
+const MonitorsList = ({
+	isLoading = false,
+	shouldRender = true,
+	monitors = [],
+	statusPage = {},
+}) => {
 	const theme = useTheme();
 	const { determineState } = useMonitorUtils();
 
@@ -40,10 +45,12 @@ const MonitorsList = ({ isLoading = false, shouldRender = true, monitors = [] })
 							alignItems="center"
 							gap={theme.spacing(20)}
 						>
-							<Box flex={9}>
-								<StatusPageBarChart checks={monitor?.checks?.slice().reverse()} />
-							</Box>
-							<Box flex={1}>
+							{statusPage.showCharts !== false && (
+								<Box flex={9}>
+									<StatusPageBarChart checks={monitor?.checks?.slice().reverse()} />
+								</Box>
+							)}
+							<Box flex={statusPage.showCharts !== false ? 1 : 10}>
 								<StatusLabel
 									status={status}
 									text={status}
@@ -60,6 +67,7 @@ const MonitorsList = ({ isLoading = false, shouldRender = true, monitors = [] })
 
 MonitorsList.propTypes = {
 	monitors: PropTypes.array.isRequired,
+	statusPage: PropTypes.object,
 };
 
 export default MonitorsList;

client/src/Pages/StatusPage/Status/index.jsx

@@ -154,7 +154,10 @@ const PublicStatus = () => {
 			/>
 			<Typography variant="h2">{t("statusPageStatusServiceStatus")}</Typography>
 			<StatusBar monitors={monitors} />
-			<MonitorsList monitors={monitors} />
+			<MonitorsList
+				monitors={monitors}
+				statusPage={statusPage}
+			/>
 			{link}
 		</Stack>
 	);

client/src/Pages/StatusPage/StatusPages/index.jsx

@@ -1,14 +1,11 @@
 // Components
-import { Stack, Typography } from "@mui/material";
+import { Stack } from "@mui/material";
 import Breadcrumbs from "../../../Components/Breadcrumbs";
-import Fallback from "../../../Components/Fallback";
 import MonitorCreateHeader from "../../../Components/MonitorCreateHeader";
-import GenericFallback from "../../../Components/GenericFallback";
 import StatusPagesTable from "./Components/StatusPagesTable";
-import SkeletonLayout from "../../../Components/Skeletons/FullPage";
+import PageStateWrapper from "../../../Components/PageStateWrapper";
 // Utils
 import { useTheme } from "@emotion/react";
-import { useTranslation } from "react-i18next";
 import { useStatusPagesFetch } from "./Hooks/useStatusPagesFetch";
 import { useIsAdmin } from "../../../Hooks/useIsAdmin";
 const BREADCRUMBS = [{ name: `Status Pages`, path: "" }];
@@ -16,52 +13,30 @@ const BREADCRUMBS = [{ name: `Status Pages`, path: "" }];
 const StatusPages = () => {
 	// Utils
 	const theme = useTheme();
-	const { t } = useTranslation();
 	const isAdmin = useIsAdmin();
 	const [isLoading, networkError, statusPages] = useStatusPagesFetch();
 
-	if (isLoading) {
-		return <SkeletonLayout />;
-	}
-
-	if (networkError === true) {
-		return (
-			<GenericFallback>
-				<Typography
-					variant="h1"
-					marginY={theme.spacing(4)}
-					color={theme.palette.primary.contrastTextTertiary}
-				>
-					{t("common.toasts.networkError")}
-				</Typography>
-				<Typography>{t("common.toasts.checkConnection")}</Typography>
-			</GenericFallback>
-		);
-	}
-
-	if (!isLoading && typeof statusPages !== "undefined" && statusPages.length === 0) {
-		return (
-			<Fallback
-				title={t("statusPage.fallback.title")}
-				checks={t("statusPage.fallback.checks", { returnObjects: true })}
-				type="statusPage"
-				link="/status/uptime/create"
-				isAdmin={isAdmin}
-			/>
-		);
-	}
-
 	return (
-		<Stack gap={theme.spacing(10)}>
-			<Breadcrumbs list={BREADCRUMBS} />
-			<MonitorCreateHeader
-				label="Create status page"
-				isAdmin={isAdmin}
-				path="/status/uptime/create"
+		<>
+			<PageStateWrapper
+				networkError={networkError}
 				isLoading={isLoading}
-			/>
-			<StatusPagesTable data={statusPages} />
-		</Stack>
+				items={statusPages}
+				type="statusPage"
+				fallbackLink="/status/uptime/create"
+			>
+				<Stack gap={theme.spacing(10)}>
+					<Breadcrumbs list={BREADCRUMBS} />
+					<MonitorCreateHeader
+						label="Create status page"
+						isAdmin={isAdmin}
+						path="/status/uptime/create"
+						isLoading={isLoading}
+					/>
+					<StatusPagesTable data={statusPages} />
+				</Stack>
+			</PageStateWrapper>
+		</>
 	);
 };
 

client/src/Pages/Uptime/Monitors/index.jsx

@@ -10,16 +10,14 @@ import StatusBoxes from "./Components/StatusBoxes";
 import UptimeDataTable from "./Components/UptimeDataTable";
 import Pagination from "../../../Components/Table/TablePagination";
 import CreateMonitorHeader from "../../../Components/MonitorCreateHeader";
-import Fallback from "../../../Components/Fallback";
-import GenericFallback from "../../../Components/GenericFallback";
 import SearchComponent from "./Components/SearchComponent";
 import Filter from "./Components/Filter";
+import PageStateWrapper from "../../../Components/PageStateWrapper";
 
 import MonitorCountHeader from "../../../Components/MonitorCountHeader";
 
 // MUI Components
-import { Stack, Box, Button, Typography } from "@mui/material";
-
+import { Stack, Box, Button } from "@mui/material";
 // Utils
 import { useState, useCallback, useEffect } from "react";
 import { useIsAdmin } from "../../../Hooks/useIsAdmin";
@@ -153,93 +151,75 @@ const UptimeMonitors = () => {
 	}, [isSearching]);
 
 	const isLoading = monitorsWithSummaryIsLoading || monitorsWithChecksIsLoading;
-	if (networkError) {
-		return (
-			<GenericFallback>
-				<Typography
-					variant="h1"
-					marginY={theme.spacing(4)}
-					color={theme.palette.primary.contrastTextTertiary}
-				>
-					{t("common.toasts.networkError")}
-				</Typography>
-				<Typography>{t("common.toasts.checkConnection")}</Typography>
-			</GenericFallback>
-		);
-	}
-	if (
-		!isLoading &&
-		(monitorsSummary?.totalMonitors === 0 ||
-			typeof monitorsSummary?.totalMonitors === "undefined")
-	) {
-		return (
-			<Fallback
-				type="uptimeMonitor"
-				title={t("uptimeMonitor.fallback.title")}
-				checks={t("uptimeMonitor.fallback.checks", { returnObjects: true })}
-				link="/uptime/create"
-				isAdmin={isAdmin}
-			/>
-		);
-	}
-	return (
-		<Stack
-			className="monitors"
-			gap={theme.spacing(10)}
-		>
-			<Breadcrumbs list={BREADCRUMBS} />
-			<CreateMonitorHeader
-				isAdmin={isAdmin}
-				isLoading={isLoading}
-				path="/uptime/create"
-				bulkPath="/uptime/bulk-import"
-			/>
-			<Greeting type="uptime" />
-			<StatusBoxes
-				monitorsSummary={monitorsSummary}
-				shouldRender={!monitorsWithSummaryIsLoading}
-			/>
 
-			<Stack direction={"row"}>
-				<MonitorCountHeader
-					isLoading={monitorsWithSummaryIsLoading}
-					monitorCount={monitorsSummary?.totalMonitors}
-				/>
-				<Filter
-					selectedTypes={selectedTypes}
-					setSelectedTypes={setSelectedTypes}
-					selectedStatus={selectedStatus}
-					setSelectedStatus={setSelectedStatus}
-					selectedState={selectedState}
-					setSelectedState={setSelectedState}
-					setToFilterStatus={setToFilterStatus}
-					setToFilterActive={setToFilterActive}
-					handleReset={handleReset}
-				/>
-				<SearchComponent
-					monitors={monitors}
-					onSearchChange={setSearch}
-					setIsSearching={setIsSearching}
-				/>
-			</Stack>
-			<UptimeDataTable
-				isAdmin={isAdmin}
-				isSearching={isSearching}
-				filteredMonitors={monitorsWithChecks}
-				sort={sort}
-				setSort={setSort}
-				monitorsAreLoading={monitorsWithChecksIsLoading}
-				triggerUpdate={triggerUpdate}
-			/>
-			<Pagination
-				itemCount={monitorsWithChecksCount}
-				paginationLabel="monitors"
-				page={page}
-				rowsPerPage={rowsPerPage}
-				handleChangePage={handleChangePage}
-				handleChangeRowsPerPage={handleChangeRowsPerPage}
-			/>
-		</Stack>
+	return (
+		<>
+			<PageStateWrapper
+				networkError={networkError}
+				isLoading={isLoading}
+				items={monitors}
+				type="uptimeMonitor"
+				fallbackLink="/uptime/create"
+			>
+				<Stack
+					className="monitors"
+					gap={theme.spacing(10)}
+				>
+					<Breadcrumbs list={BREADCRUMBS} />
+					<CreateMonitorHeader
+						isAdmin={isAdmin}
+						isLoading={isLoading}
+						path="/uptime/create"
+						bulkPath="/uptime/bulk-import"
+					/>
+					<Greeting type="uptime" />
+					<StatusBoxes
+						monitorsSummary={monitorsSummary}
+						shouldRender={!monitorsWithSummaryIsLoading}
+					/>
+
+					<Stack direction={"row"}>
+						<MonitorCountHeader
+							isLoading={monitorsWithSummaryIsLoading}
+							monitorCount={monitorsSummary?.totalMonitors}
+						/>
+						<Filter
+							selectedTypes={selectedTypes}
+							setSelectedTypes={setSelectedTypes}
+							selectedStatus={selectedStatus}
+							setSelectedStatus={setSelectedStatus}
+							selectedState={selectedState}
+							setSelectedState={setSelectedState}
+							setToFilterStatus={setToFilterStatus}
+							setToFilterActive={setToFilterActive}
+							handleReset={handleReset}
+						/>
+						<SearchComponent
+							monitors={monitors}
+							onSearchChange={setSearch}
+							setIsSearching={setIsSearching}
+						/>
+					</Stack>
+					<UptimeDataTable
+						isAdmin={isAdmin}
+						isSearching={isSearching}
+						filteredMonitors={monitorsWithChecks}
+						sort={sort}
+						setSort={setSort}
+						monitorsAreLoading={monitorsWithChecksIsLoading}
+						triggerUpdate={triggerUpdate}
+					/>
+					<Pagination
+						itemCount={monitorsWithChecksCount}
+						paginationLabel="monitors"
+						page={page}
+						rowsPerPage={rowsPerPage}
+						handleChangePage={handleChangePage}
+						handleChangeRowsPerPage={handleChangeRowsPerPage}
+					/>
+				</Stack>
+			</PageStateWrapper>
+		</>
 	);
 };
 

client/src/Routes/index.jsx

@@ -223,7 +223,7 @@ const Routes = () => {
 			<Route
 				exact
 				path="/register/:token"
-				element={<AuthRegister />}
+				element={<AuthRegister superAdminExists={true} />}
 			/>
 
 			<Route

client/src/locales/en.json

@@ -360,6 +360,12 @@
 		"demoUser": "Demo user"
 	},
 	"teamPanel": {
+		"addTeamMember": {
+			"addMemberMenu": "Add Team Member",
+			"title": "Register new team member",
+			"description": "Create a new user and share the credentials with them. This method gives the member immediate access to all monitors.",
+			"addButton": "Add Member"
+		},
 		"teamMembers": "Team members",
 		"filter": {
 			"all": "All",
@@ -375,6 +381,45 @@
 		"noMembers": "There are no team members with this role",
 		"getToken": "Get token",
 		"emailToken": "E-mail token",
+		"register": "Register a team member",
+		"registerToast": {
+			"success": "User created, share credentials with the member securely.",
+			"dbUserExists": "User already exists.",
+			"unknownError": "Unknown error occurred."
+		},
+		"registerTeamMember": {
+			"title": "Register team member",
+			"auth": {
+				"common": {
+					"inputs": {
+						"firstName": {
+							"errors": {
+								"empty": "Please enter a name",
+								"pattern": "Name must contain only letters, spaces, apostrophes, or hyphens"
+							}
+						},
+						"lastName": {
+							"errors": {
+								"empty": "Please enter a surname",
+								"pattern": "Surname must contain only letters, spaces, apostrophes, or hyphens"
+							}
+						},
+						"email": {
+							"errors": {
+								"empty": "To continue, please enter an email address",
+								"invalid": "Please recheck validity of entered email address"
+							}
+						},
+						"role": {
+							"errors": {
+								"empty": "Role is required"
+							}
+						}
+					}
+				}
+			}
+		},
+		"role": "Role",
 		"table": {
 			"name": "Name",
 			"email": "Email",

client/vite.config.js

@@ -5,7 +5,7 @@ import { execSync } from "child_process";
 
 export default defineConfig(({ mode }) => {
 	const env = loadEnv(mode, process.cwd(), "");
-	let version = "3.1.4";
+	let version = "3.1.8";
 
 	return {
 		base: "/",

docker/coolify/client.Dockerfile

@@ -1,18 +1,9 @@
-FROM node:20-alpine AS build
+FROM node:20-slim AS build
 
 ENV NODE_OPTIONS="--max-old-space-size=4096"
 
 WORKDIR /app
 
-RUN apk add --no-cache \
-    python3 \
-    make g++  \
-    gcc \
-    libc-dev \
-    linux-headers \
-    libusb-dev \
-    eudev-dev
-
 COPY ./client/package*.json ./
 
 RUN npm install

docker/coolify/server.Dockerfile

@@ -1,4 +1,9 @@
-FROM node:20-alpine
+FROM node:20-slim
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app
 

docker/dev/client.Dockerfile

@@ -1,19 +1,9 @@
-FROM node:20-alpine AS build
+FROM node:20-slim AS build
 
 ENV NODE_OPTIONS="--max-old-space-size=4096"
 
 WORKDIR /app
 
-RUN apk add --no-cache \
-    python3 \
-    make g++  \
-    gcc \
-    libc-dev \
-    linux-headers \
-    libusb-dev \
-    eudev-dev
-
-
 COPY ./client/package*.json ./
 
 RUN npm install

docker/dev/server.Dockerfile

@@ -1,4 +1,9 @@
-FROM node:20-alpine
+FROM node:20-slim
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app
 

docker/dist-arm/docker-compose.yaml

@@ -2,6 +2,7 @@ services:
   server:
     image: ghcr.io/bluewave-labs/checkmate-backend-mono-multiarch:latest
     restart: always
+    pull_policy: always
     ports:
       - "52345:52345"
     environment:
@@ -16,7 +17,7 @@ services:
   mongodb:
     image: mongo:4.4.18
     restart: always
-    command: ["mongod", "--quiet", --bind_ip_all"]
+    command: ["mongod", "--quiet", "--bind_ip_all"]
     ports:
       - "27017:27017"
     volumes:

docker/dist-arm/server.Dockerfile

@@ -1,25 +1,44 @@
-FROM node:20-alpine AS frontend-build
+# ---------------------
+# Frontend build stage
+# ---------------------
+FROM node:24-slim AS frontend-build
+
+
 
 WORKDIR /app/client
 
-COPY client/package*.json ./
-RUN npm ci
+COPY client/package.json ./
+
+RUN npm install
+
+RUN npm install esbuild@0.25.5 --build-from-source
 
 COPY client ./
+
 RUN npm run build
 
-FROM node:20-alpine AS backend
+# ---------------------
+# Backend stage
+# ---------------------
+FROM node:24-slim AS backend
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app/server
 
+COPY server/package.json ./
+
+RUN npm install
+
 COPY server ./
 
 COPY --from=frontend-build /app/client/dist ./public
 
-RUN npm ci
-
 RUN chmod +x ./scripts/inject-vars.sh
 
 EXPOSE 52345
 
-CMD ./scripts/inject-vars.sh && node ./src/index.js
+CMD ["sh", "-c", "./scripts/inject-vars.sh && node ./src/index.js"]

docker/dist-mono/docker-compose.yaml

@@ -1,6 +1,7 @@
 services:
   server:
     image: ghcr.io/bluewave-labs/checkmate-backend-mono:latest
+    pull_policy: always
     restart: always
     ports:
       - "52345:52345"

docker/dist-mono/server.Dockerfile

@@ -1,4 +1,4 @@
-FROM node:20-alpine AS frontend-build
+FROM node:20-slim AS frontend-build
 
 WORKDIR /app/client
 
@@ -8,7 +8,12 @@ RUN npm install
 COPY client ./
 RUN npm run build
 
-FROM node:20-alpine AS app
+FROM node:20-slim AS app
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app/server
 

docker/dist/client.Dockerfile

@@ -1,18 +1,9 @@
-FROM node:20-alpine AS build
+FROM node:20-slim AS build
 
 ENV NODE_OPTIONS="--max-old-space-size=4096"
 
 WORKDIR /app
 
-RUN apk add --no-cache \
-    python3 \
-    make g++  \
-    gcc \
-    libc-dev \
-    linux-headers \
-    libusb-dev \
-    eudev-dev
-
 COPY ./client/package*.json ./
 
 RUN npm install

docker/dist/server.Dockerfile

@@ -1,4 +1,9 @@
-FROM node:20-alpine
+FROM node:20-slim
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app
 

docker/prod/client.Dockerfile

@@ -1,18 +1,9 @@
-FROM node:20-alpine AS build
+FROM node:20-slim AS build
 
 ENV NODE_OPTIONS="--max-old-space-size=4096"
 
 WORKDIR /app
 
-RUN apk add --no-cache \
-    python3 \
-    make g++  \
-    gcc \
-    libc-dev \
-    linux-headers \
-    libusb-dev \
-    eudev-dev
-
 COPY ./client/package*.json ./
 
 RUN npm install

docker/prod/server.Dockerfile

@@ -1,4 +1,9 @@
-FROM node:20-alpine
+FROM node:20-slim
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 ENV NODE_OPTIONS="--max-old-space-size=2048"
 

docker/staging/client.Dockerfile

@@ -1,19 +1,9 @@
-FROM node:20-alpine AS build
+FROM node:20-slim AS build
 
 ENV NODE_OPTIONS="--max-old-space-size=4096"
 
 WORKDIR /app
 
-RUN apk add --no-cache \
-    python3 \
-    make g++  \
-    gcc \
-    libc-dev \
-    linux-headers \
-    libusb-dev \
-    eudev-dev
-
-
 COPY ./client/package*.json ./
 
 RUN npm install

docker/staging/server.Dockerfile

@@ -1,4 +1,9 @@
-FROM node:20-alpine
+FROM node:20-slim
+
+# Install ping
+RUN apt-get update \
+    && apt-get install -y iputils-ping \
+    && rm -rf /var/lib/apt/lists/*
 
 ENV NODE_OPTIONS="--max-old-space-size=2048"
 

server/package-lock.json

@@ -39,7 +39,7 @@
 				"ping": "0.4.4",
 				"sharp": "0.33.5",
 				"ssl-checker": "2.0.10",
-				"super-simple-scheduler": "1.4.0",
+				"super-simple-scheduler": "1.4.1",
 				"swagger-ui-express": "5.0.1",
 				"winston": "^3.13.0"
 			},
@@ -248,10 +248,20 @@
 				"kuler": "^2.0.0"
 			}
 		},
+		"node_modules/@emnapi/runtime": {
+			"version": "1.5.0",
+			"resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.5.0.tgz",
+			"integrity": "sha512-97/BJ3iXHww3djw6hYIfErCZFee7qCtrneuLa20UXFCOTCfBM2cvQHjWJ2EG0s0MtdNwInarqCTz35i4wWXHsQ==",
+			"license": "MIT",
+			"optional": true,
+			"dependencies": {
+				"tslib": "^2.4.0"
+			}
+		},
 		"node_modules/@eslint-community/eslint-utils": {
-			"version": "4.7.0",
-			"resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.7.0.tgz",
-			"integrity": "sha512-dyybb3AcajC7uha6CvhdVRJqaKyn7w2YKqKyAN37NKYgZT36w+iRb0Dymmc5qEJ549c/S31cMMSFd75bteCpCw==",
+			"version": "4.8.0",
+			"resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.8.0.tgz",
+			"integrity": "sha512-MJQFqrZgcW0UNYLGOuQpey/oTN59vyWwplvCGZztn1cKz9agZPPYpJB7h2OMmuu7VLqkvEjN8feFZJmxNF9D+Q==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -459,33 +469,19 @@
 			}
 		},
 		"node_modules/@humanfs/node": {
-			"version": "0.16.6",
-			"resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.6.tgz",
-			"integrity": "sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw==",
+			"version": "0.16.7",
+			"resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.7.tgz",
+			"integrity": "sha512-/zUx+yOsIrG4Y43Eh2peDeKCxlRt/gET6aHfaKpuq267qXdYDFViVHfMaLyygZOnl0kGWxFIgsBy8QFuTLUXEQ==",
 			"dev": true,
 			"license": "Apache-2.0",
 			"dependencies": {
 				"@humanfs/core": "^0.19.1",
-				"@humanwhocodes/retry": "^0.3.0"
+				"@humanwhocodes/retry": "^0.4.0"
 			},
 			"engines": {
 				"node": ">=18.18.0"
 			}
 		},
-		"node_modules/@humanfs/node/node_modules/@humanwhocodes/retry": {
-			"version": "0.3.1",
-			"resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.3.1.tgz",
-			"integrity": "sha512-JBxkERygn7Bv/GbN5Rv8Ul6LVknS+5Bp6RgDC/O8gEBU/yeH5Ui5C/OlWrTb6qct7LjjfT6Re2NxB0ln0yYybA==",
-			"dev": true,
-			"license": "Apache-2.0",
-			"engines": {
-				"node": ">=18.18"
-			},
-			"funding": {
-				"type": "github",
-				"url": "https://github.com/sponsors/nzakas"
-			}
-		},
 		"node_modules/@humanwhocodes/module-importer": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
@@ -514,6 +510,130 @@
 				"url": "https://github.com/sponsors/nzakas"
 			}
 		},
+		"node_modules/@img/sharp-darwin-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.5.tgz",
+			"integrity": "sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-darwin-arm64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-darwin-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.5.tgz",
+			"integrity": "sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==",
+			"cpu": [
+				"x64"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-darwin-x64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-libvips-darwin-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.4.tgz",
+			"integrity": "sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-darwin-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.4.tgz",
+			"integrity": "sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==",
+			"cpu": [
+				"x64"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-arm": {
+			"version": "1.0.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.5.tgz",
+			"integrity": "sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==",
+			"cpu": [
+				"arm"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.4.tgz",
+			"integrity": "sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-s390x": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.4.tgz",
+			"integrity": "sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==",
+			"cpu": [
+				"s390x"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
 		"node_modules/@img/sharp-libvips-linux-x64": {
 			"version": "1.0.4",
 			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.4.tgz",
@@ -530,6 +650,104 @@
 				"url": "https://opencollective.com/libvips"
 			}
 		},
+		"node_modules/@img/sharp-libvips-linuxmusl-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.4.tgz",
+			"integrity": "sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linuxmusl-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.4.tgz",
+			"integrity": "sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==",
+			"cpu": [
+				"x64"
+			],
+			"license": "LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-linux-arm": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.5.tgz",
+			"integrity": "sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==",
+			"cpu": [
+				"arm"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-arm": "1.0.5"
+			}
+		},
+		"node_modules/@img/sharp-linux-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.5.tgz",
+			"integrity": "sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-arm64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-linux-s390x": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.5.tgz",
+			"integrity": "sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==",
+			"cpu": [
+				"s390x"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-s390x": "1.0.4"
+			}
+		},
 		"node_modules/@img/sharp-linux-x64": {
 			"version": "0.33.5",
 			"resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.5.tgz",
@@ -552,6 +770,107 @@
 				"@img/sharp-libvips-linux-x64": "1.0.4"
 			}
 		},
+		"node_modules/@img/sharp-linuxmusl-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.5.tgz",
+			"integrity": "sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linuxmusl-arm64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-linuxmusl-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.5.tgz",
+			"integrity": "sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==",
+			"cpu": [
+				"x64"
+			],
+			"license": "Apache-2.0",
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linuxmusl-x64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-wasm32": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.33.5.tgz",
+			"integrity": "sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==",
+			"cpu": [
+				"wasm32"
+			],
+			"license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
+			"optional": true,
+			"dependencies": {
+				"@emnapi/runtime": "^1.2.0"
+			},
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-win32-ia32": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.5.tgz",
+			"integrity": "sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==",
+			"cpu": [
+				"ia32"
+			],
+			"license": "Apache-2.0 AND LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"win32"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-win32-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.5.tgz",
+			"integrity": "sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==",
+			"cpu": [
+				"x64"
+			],
+			"license": "Apache-2.0 AND LGPL-3.0-or-later",
+			"optional": true,
+			"os": [
+				"win32"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
 		"node_modules/@ioredis/commands": {
 			"version": "1.3.1",
 			"resolved": "https://registry.npmjs.org/@ioredis/commands/-/commands-1.3.1.tgz",
@@ -632,6 +951,58 @@
 				"sparse-bitfield": "^3.0.3"
 			}
 		},
+		"node_modules/@msgpackr-extract/msgpackr-extract-darwin-arm64": {
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-arm64/-/msgpackr-extract-darwin-arm64-3.0.3.tgz",
+			"integrity": "sha512-QZHtlVgbAdy2zAqNA9Gu1UpIuI8Xvsd1v8ic6B2pZmeFnFcMWiPLfWXh7TVw4eGEZ/C9TH281KwhVoeQUKbyjw==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "MIT",
+			"optional": true,
+			"os": [
+				"darwin"
+			]
+		},
+		"node_modules/@msgpackr-extract/msgpackr-extract-darwin-x64": {
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-x64/-/msgpackr-extract-darwin-x64-3.0.3.tgz",
+			"integrity": "sha512-mdzd3AVzYKuUmiWOQ8GNhl64/IoFGol569zNRdkLReh6LRLHOXxU4U8eq0JwaD8iFHdVGqSy4IjFL4reoWCDFw==",
+			"cpu": [
+				"x64"
+			],
+			"license": "MIT",
+			"optional": true,
+			"os": [
+				"darwin"
+			]
+		},
+		"node_modules/@msgpackr-extract/msgpackr-extract-linux-arm": {
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-arm/-/msgpackr-extract-linux-arm-3.0.3.tgz",
+			"integrity": "sha512-fg0uy/dG/nZEXfYilKoRe7yALaNmHoYeIoJuJ7KJ+YyU2bvY8vPv27f7UKhGRpY6euFYqEVhxCFZgAUNQBM3nw==",
+			"cpu": [
+				"arm"
+			],
+			"license": "MIT",
+			"optional": true,
+			"os": [
+				"linux"
+			]
+		},
+		"node_modules/@msgpackr-extract/msgpackr-extract-linux-arm64": {
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-arm64/-/msgpackr-extract-linux-arm64-3.0.3.tgz",
+			"integrity": "sha512-YxQL+ax0XqBJDZiKimS2XQaf+2wDGVa1enVRGzEvLLVFeqa5kx2bWbtcSXgsxjQB7nRqqIGFIcLteF/sHeVtQg==",
+			"cpu": [
+				"arm64"
+			],
+			"license": "MIT",
+			"optional": true,
+			"os": [
+				"linux"
+			]
+		},
 		"node_modules/@msgpackr-extract/msgpackr-extract-linux-x64": {
 			"version": "3.0.3",
 			"resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-x64/-/msgpackr-extract-linux-x64-3.0.3.tgz",
@@ -645,6 +1016,19 @@
 				"linux"
 			]
 		},
+		"node_modules/@msgpackr-extract/msgpackr-extract-win32-x64": {
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-win32-x64/-/msgpackr-extract-win32-x64-3.0.3.tgz",
+			"integrity": "sha512-x0fWaQtYp4E6sktbsdAqnehxDgEc/VwM7uLsRCYWaiGu0ykYdZPiS8zCWdnjHwyiumousxfBm4SO31eXqwEZhQ==",
+			"cpu": [
+				"x64"
+			],
+			"license": "MIT",
+			"optional": true,
+			"os": [
+				"win32"
+			]
+		},
 		"node_modules/@pkgjs/parseargs": {
 			"version": "0.11.0",
 			"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
@@ -886,6 +1270,12 @@
 				"undici-types": "~7.10.0"
 			}
 		},
+		"node_modules/@types/relateurl": {
+			"version": "0.2.33",
+			"resolved": "https://registry.npmjs.org/@types/relateurl/-/relateurl-0.2.33.tgz",
+			"integrity": "sha512-bTQCKsVbIdzLqZhLkF5fcJQreE4y1ro4DIyVrlDNSCJRRwHhB8Z+4zXXa8jN6eDvc2HbRsEYgbvrnGvi54EpSw==",
+			"license": "MIT"
+		},
 		"node_modules/@types/triple-beam": {
 			"version": "1.3.5",
 			"resolved": "https://registry.npmjs.org/@types/triple-beam/-/triple-beam-1.3.5.tgz",
@@ -1515,9 +1905,9 @@
 			}
 		},
 		"node_modules/caniuse-lite": {
-			"version": "1.0.30001737",
-			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001737.tgz",
-			"integrity": "sha512-BiloLiXtQNrY5UyF0+1nSJLXUENuhka2pzy2Fx5pGxqavdrxSCW4U6Pn/PoG3Efspi2frRbHpBV2XsrPE6EDlw==",
+			"version": "1.0.30001739",
+			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001739.tgz",
+			"integrity": "sha512-y+j60d6ulelrNSwpPyrHdl+9mJnQzHBr08xm48Qno0nSk4h3Qojh+ziv2qE6rXf4k3tadF4o1J/1tAbVm1NtnA==",
 			"funding": [
 				{
 					"type": "opencollective",
@@ -2630,9 +3020,9 @@
 			"license": "MIT"
 		},
 		"node_modules/electron-to-chromium": {
-			"version": "1.5.211",
-			"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.211.tgz",
-			"integrity": "sha512-IGBvimJkotaLzFnwIVgW9/UD/AOJ2tByUmeOrtqBfACSbAw5b1G0XpvdaieKyc7ULmbwXVx+4e4Be8pOPBrYkw==",
+			"version": "1.5.213",
+			"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.213.tgz",
+			"integrity": "sha512-xr9eRzSLNa4neDO0xVFrkXu3vyIzG4Ay08dApecw42Z1NbmCt+keEpXdvlYGVe0wtvY5dhW0Ay0lY0IOfsCg0Q==",
 			"license": "ISC"
 		},
 		"node_modules/emitter-component": {
@@ -3441,6 +3831,20 @@
 			"integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==",
 			"license": "MIT"
 		},
+		"node_modules/fsevents": {
+			"version": "2.3.3",
+			"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+			"integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+			"hasInstallScript": true,
+			"license": "MIT",
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"engines": {
+				"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+			}
+		},
 		"node_modules/function-bind": {
 			"version": "1.1.2",
 			"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -3891,11 +4295,12 @@
 			"license": "MIT"
 		},
 		"node_modules/htmlnano": {
-			"version": "2.1.2",
-			"resolved": "https://registry.npmjs.org/htmlnano/-/htmlnano-2.1.2.tgz",
-			"integrity": "sha512-8Fst+0bhAfU362S6oHVb4wtJj/UYEFr0qiCLAEi8zioqmp1JYBQx5crZAADlFVX0Ly/6s/IQz6G7PL9/hgoJaQ==",
+			"version": "2.1.3",
+			"resolved": "https://registry.npmjs.org/htmlnano/-/htmlnano-2.1.3.tgz",
+			"integrity": "sha512-mzTUHhxdfDw80X36rv5qFvjvor7r0uCwXI5mzo8CW61tImbe5Jpvl3JzPAetVh54wUYVuoa8x3qw8LFn8B3gHQ==",
 			"license": "MIT",
 			"dependencies": {
+				"@types/relateurl": "^0.2.33",
 				"cosmiconfig": "^9.0.0",
 				"posthtml": "^0.16.5"
 			},
@@ -5801,13 +6206,14 @@
 			}
 		},
 		"node_modules/nise/node_modules/path-to-regexp": {
-			"version": "8.2.0",
-			"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.2.0.tgz",
-			"integrity": "sha512-TdrF7fW9Rphjq4RjrW0Kp2AW0Ahwu9sRGTkS6bvDi0SCwZlEZYmcfDbEsTz8RVk0EHIS/Vd1bv3JhG+1xZuAyQ==",
+			"version": "8.3.0",
+			"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.3.0.tgz",
+			"integrity": "sha512-7jdwVIRtsP8MYpdXSwOS0YdD0Du+qOoF/AEPIt88PcCFrZCzx41oxku1jD88hZBwbNUIEfpqvuhjFaMAqMTWnA==",
 			"dev": true,
 			"license": "MIT",
-			"engines": {
-				"node": ">=16"
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/express"
 			}
 		},
 		"node_modules/node-abort-controller": {
@@ -7865,9 +8271,9 @@
 			}
 		},
 		"node_modules/super-simple-scheduler": {
-			"version": "1.4.0",
-			"resolved": "https://registry.npmjs.org/super-simple-scheduler/-/super-simple-scheduler-1.4.0.tgz",
-			"integrity": "sha512-DO8HTrrx+23Cz2RPCuniPZ9IhHx2lgtF8ZJiBV4JfUhqDqxuJ2leQ+l3gZ+vniy4DfpMki7s6bZwM3u8norQEA==",
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/super-simple-scheduler/-/super-simple-scheduler-1.4.1.tgz",
+			"integrity": "sha512-jKVwxdRBXOHrUstA2pvO4jBZIA3CUinKiQ6k5C2Wn5tscoV3srppPxW0zG3VNKTCaGxo3yPn6Zaf3IDVBcAwRA==",
 			"license": "MIT",
 			"dependencies": {
 				"uuid": "11.1.0",
@@ -7939,9 +8345,9 @@
 			}
 		},
 		"node_modules/swagger-ui-dist": {
-			"version": "5.28.0",
-			"resolved": "https://registry.npmjs.org/swagger-ui-dist/-/swagger-ui-dist-5.28.0.tgz",
-			"integrity": "sha512-I9ibQtr77BPzT28WFWMVktzQOtWzoSS2J99L0Att8gDar1atl1YTRI7NUFSr4kj8VvWICgylanYHIoHjITc7iA==",
+			"version": "5.28.1",
+			"resolved": "https://registry.npmjs.org/swagger-ui-dist/-/swagger-ui-dist-5.28.1.tgz",
+			"integrity": "sha512-IvPrtNi8MvjiuDgoSmPYgg27Lvu38fnLD1OSd8Y103xXsPAqezVNnNeHnVCZ/d+CMXJblflGaIyHxAYIF3O71w==",
 			"license": "Apache-2.0",
 			"dependencies": {
 				"@scarf/scarf": "=1.4.0"

server/package.json

@@ -46,7 +46,7 @@
 		"ping": "0.4.4",
 		"sharp": "0.33.5",
 		"ssl-checker": "2.0.10",
-		"super-simple-scheduler": "1.4.0",
+		"super-simple-scheduler": "1.4.1",
 		"swagger-ui-express": "5.0.1",
 		"winston": "^3.13.0"
 	},

server/src/db/mongo/modules/statusPageModule.js

@@ -162,6 +162,14 @@ class StatusPageModule {
 						as: "monitors.checks",
 					},
 				},
+				{
+					$lookup: {
+						from: "monitorstats",
+						localField: "monitors._id",
+						foreignField: "monitorId",
+						as: "monitors.stats",
+					},
+				},
 				{
 					$addFields: {
 						"monitors.orderIndex": {
@@ -181,6 +189,9 @@ class StatusPageModule {
 								},
 							},
 						},
+						"monitors.uptimePercentage": {
+							$arrayElemAt: ["$monitors.stats.uptimePercentage", 0],
+						},
 					},
 				},
 				{ $match: { "monitors.orderIndex": { $ne: -1 } } },

server/src/service/infrastructure/networkService.js

@@ -75,6 +75,9 @@ class NetworkService {
 			const { response, responseTime, error } = await this.timeRequest(() => this.ping.promise.probe(monitor.url));
 
 			if (!response) {
+				if (error) {
+					throw error;
+				}
 				throw new Error("Ping failed - no result returned");
 			}