From 12767d5dbc7a7e2722c13a06cf2ea266d263cee1 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 12:15:41 +0800 Subject: [PATCH 01/31] integrate TextField into create infrastructure page --- .../src/Components/Inputs/TextInput/index.jsx | 9 +++++++++ .../CreateMonitor/CustomThreshold/index.jsx | 11 ++++++----- .../Infrastructure/CreateMonitor/index.jsx | 18 ++++++++++-------- 3 files changed, 25 insertions(+), 13 deletions(-) diff --git a/Client/src/Components/Inputs/TextInput/index.jsx b/Client/src/Components/Inputs/TextInput/index.jsx index d97d1ebac..4d648803a 100644 --- a/Client/src/Components/Inputs/TextInput/index.jsx +++ b/Client/src/Components/Inputs/TextInput/index.jsx @@ -56,6 +56,7 @@ Optional.propTypes = { const TextInput = forwardRef( ( { + id, type, value, placeholder, @@ -63,12 +64,14 @@ const TextInput = forwardRef( isOptional, optionalLabel, onChange, + onBlur, error = false, helperText = null, startAdornment = null, endAdornment = null, label = null, maxWidth = "100%", + disabled = false, }, ref ) => { @@ -87,10 +90,12 @@ const TextInput = forwardRef( {isOptional && } ); @@ -113,18 +119,21 @@ TextInput.displayName = "TextInput"; TextInput.propTypes = { type: PropTypes.string, + id: PropTypes.string.isRequired, value: PropTypes.string, placeholder: PropTypes.string, isRequired: PropTypes.bool, isOptional: PropTypes.bool, optionalLabel: PropTypes.string, onChange: PropTypes.func, + onBlur: PropTypes.func, error: PropTypes.bool, helperText: PropTypes.string, startAdornment: PropTypes.node, endAdornment: PropTypes.node, label: PropTypes.string, maxWidth: PropTypes.string, + disabled: PropTypes.bool, }; export default TextInput; diff --git a/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx b/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx index 3b664eb5d..71f392d6b 100644 --- a/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx +++ b/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx @@ -1,5 +1,6 @@ import { Box, Stack, Typography } from "@mui/material"; import Field from "../../../../Components/Inputs/Field"; +import TextInput from "../../../../Components/Inputs/TextInput"; import Checkbox from "../../../../Components/Inputs/Checkbox"; import { useTheme } from "@emotion/react"; import PropTypes from "prop-types"; @@ -57,17 +58,17 @@ export const CustomThreshold = ({ justifyContent: "flex-end", }} > - + /> + { event.preventDefault(); const { value, id } = event.target; let name = appendedId ?? idMap[id] ?? id; - if (name.includes("notification-")) { name = name.replace("notification-", ""); let hasNotif = infrastructureMonitor.notifications.some( @@ -240,7 +239,7 @@ const CreateInfrastructureMonitor = () => { - { value={infrastructureMonitor.url} onBlur={handleBlur} onChange={handleChange} - error={errors["url"]} + error={errors["url"] ? true : false} + helperText={errors["url"]} /> - { onChange={handleChange} error={errors["name"]} /> - @@ -297,7 +298,8 @@ const CreateInfrastructureMonitor = () => { Customize alerts - Send a notification to user(s) when thresholds exceed a specified percentage. + Send a notification to user(s) when thresholds exceed a specified + percentage. From 48c3f05831eea25dcd217ea367e046e36efbece6 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 12:21:42 +0800 Subject: [PATCH 02/31] integrate TextInput --- Client/src/Pages/Monitors/CreateMonitor/index.jsx | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/Client/src/Pages/Monitors/CreateMonitor/index.jsx b/Client/src/Pages/Monitors/CreateMonitor/index.jsx index 84e599322..56dfc4db2 100644 --- a/Client/src/Pages/Monitors/CreateMonitor/index.jsx +++ b/Client/src/Pages/Monitors/CreateMonitor/index.jsx @@ -11,6 +11,8 @@ import { createToast } from "../../../Utils/toastUtils"; import { logger } from "../../../Utils/Logger"; import { ConfigBox } from "../styled"; import Radio from "../../../Components/Inputs/Radio"; +import TextInput from "../../../Components/Inputs/TextInput"; +import { HttpAdornment } from "../../../Components/Inputs/TextInput/Adornments"; import Field from "../../../Components/Inputs/Field"; import Select from "../../../Components/Inputs/Select"; import Checkbox from "../../../Components/Inputs/Checkbox"; @@ -249,17 +251,19 @@ const CreateMonitor = () => { - } label={monitorTypeMaps[monitor.type].label || "URL to monitor"} https={https} placeholder={monitorTypeMaps[monitor.type].placeholder || ""} value={monitor.url} onChange={handleChange} - error={errors["url"]} + error={errors["url"] ? true : false} + helperText={errors["url"]} /> - { placeholder={monitorTypeMaps[monitor.type].namePlaceholder || ""} value={monitor.name} onChange={handleChange} - error={errors["name"]} + error={errors["name"] ? true : false} + helperText={errors["name"]} /> From a9493db5de0349c7a0323d030b55ad9e990800c4 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 12:30:41 +0800 Subject: [PATCH 03/31] integrate TextInput into login page --- .../Inputs/TextInput/Adornments/index.jsx | 9 +++++++-- Client/src/Pages/Auth/Login.jsx | 13 +++++++++---- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/Client/src/Components/Inputs/TextInput/Adornments/index.jsx b/Client/src/Components/Inputs/TextInput/Adornments/index.jsx index 0709b5425..686db183b 100644 --- a/Client/src/Components/Inputs/TextInput/Adornments/index.jsx +++ b/Client/src/Components/Inputs/TextInput/Adornments/index.jsx @@ -29,6 +29,10 @@ export const HttpAdornment = ({ https }) => { ); }; +HttpAdornment.propTypes = { + https: PropTypes.bool.isRequired, +}; + export const PasswordEndAdornment = ({ fieldType, setFieldType }) => { const theme = useTheme(); return ( @@ -55,6 +59,7 @@ export const PasswordEndAdornment = ({ fieldType, setFieldType }) => { ); }; -HttpAdornment.propTypes = { - https: PropTypes.bool.isRequired, +PasswordEndAdornment.propTypes = { + fieldType: PropTypes.string, + setFieldType: PropTypes.func, }; diff --git a/Client/src/Pages/Auth/Login.jsx b/Client/src/Pages/Auth/Login.jsx index ece5de314..05bf6d0b9 100644 --- a/Client/src/Pages/Auth/Login.jsx +++ b/Client/src/Pages/Auth/Login.jsx @@ -7,6 +7,8 @@ import { login } from "../../Features/Auth/authSlice"; import { useDispatch, useSelector } from "react-redux"; import { createToast } from "../../Utils/toastUtils"; import { networkService } from "../../main"; +import TextInput from "../../Components/Inputs/TextInput"; +import { PasswordEndAdornment } from "../../Components/Inputs/TextInput/Adornments"; import Field from "../../Components/Inputs/Field"; import Background from "../../assets/Images/background-grid.svg?react"; import Logo from "../../assets/icons/bwu-icon.svg?react"; @@ -150,7 +152,7 @@ const StepOne = ({ form, errors, onSubmit, onChange, onBack }) => { display="grid" gap={{ xs: theme.spacing(12), sm: theme.spacing(16) }} > - { value={form.email} onInput={(e) => (e.target.value = e.target.value.toLowerCase())} onChange={onChange} - error={errors.email} + error={errors.email ? true : false} + helperText={errors.email} ref={inputRef} /> { gap: { xs: theme.spacing(12), sm: theme.spacing(16) }, }} > - { autoComplete="current-password" value={form.password} onChange={onChange} - error={errors.password} + error={errors.password ? true : false} + helperText={errors.password} ref={inputRef} + endAdornment={} /> Date: Tue, 26 Nov 2024 13:14:33 +0800 Subject: [PATCH 04/31] expose on TextInput --- Client/src/Components/Inputs/TextInput/index.jsx | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/Client/src/Components/Inputs/TextInput/index.jsx b/Client/src/Components/Inputs/TextInput/index.jsx index 4d648803a..b78ca5439 100644 --- a/Client/src/Components/Inputs/TextInput/index.jsx +++ b/Client/src/Components/Inputs/TextInput/index.jsx @@ -6,6 +6,11 @@ import PropTypes from "prop-types"; const getSx = (theme, type, maxWidth) => { const sx = { maxWidth: maxWidth, + "& .MuiFormHelperText-root": { + position: "absolute", + bottom: `-${theme.spacing(12)}`, + minHeight: theme.spacing(12), + }, }; if (type === "url") { @@ -57,6 +62,7 @@ const TextInput = forwardRef( ( { id, + name, type, value, placeholder, @@ -91,6 +97,7 @@ const TextInput = forwardRef( Date: Tue, 26 Nov 2024 13:14:46 +0800 Subject: [PATCH 05/31] integrate TextInput into register page --- Client/src/Components/Check/Check.jsx | 3 +-- Client/src/Pages/Auth/Register/StepOne/index.jsx | 13 ++++++++----- Client/src/Pages/Auth/Register/StepThree/index.jsx | 11 ++++++----- Client/src/Pages/Auth/Register/StepTwo/index.jsx | 6 ++++-- 4 files changed, 19 insertions(+), 14 deletions(-) diff --git a/Client/src/Components/Check/Check.jsx b/Client/src/Components/Check/Check.jsx index 3219fec29..799fda63c 100644 --- a/Client/src/Components/Check/Check.jsx +++ b/Client/src/Components/Check/Check.jsx @@ -24,10 +24,9 @@ const Check = ({ text, noHighlightText, variant = "info", outlined = false }) => const theme = useTheme(); const colors = { success: theme.palette.success.main, - error: theme.palette.error.contrastText, + error: theme.palette.error.main, info: theme.palette.info.border, }; - return ( - - - - - (e.target.value = e.target.value.toLowerCase())} onChange={onChange} - error={errors.email} + error={errors.email ? true : false} + helperText={errors.email} ref={inputRef} /> Date: Tue, 26 Nov 2024 13:37:10 +0800 Subject: [PATCH 06/31] Expose flex on TextInput --- Client/src/Components/Inputs/TextInput/index.jsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/Client/src/Components/Inputs/TextInput/index.jsx b/Client/src/Components/Inputs/TextInput/index.jsx index b78ca5439..744d036bd 100644 --- a/Client/src/Components/Inputs/TextInput/index.jsx +++ b/Client/src/Components/Inputs/TextInput/index.jsx @@ -77,6 +77,7 @@ const TextInput = forwardRef( endAdornment = null, label = null, maxWidth = "100%", + flex, disabled = false, }, ref @@ -84,7 +85,7 @@ const TextInput = forwardRef( const [fieldType, setFieldType] = useState(type); const theme = useTheme(); return ( - + Date: Tue, 26 Nov 2024 13:37:35 +0800 Subject: [PATCH 07/31] integrate TextInput into profile panel --- .../TabPanels/Account/ProfilePanel.jsx | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/Client/src/Components/TabPanels/Account/ProfilePanel.jsx b/Client/src/Components/TabPanels/Account/ProfilePanel.jsx index 0875891f5..9c00f6c02 100644 --- a/Client/src/Components/TabPanels/Account/ProfilePanel.jsx +++ b/Client/src/Components/TabPanels/Account/ProfilePanel.jsx @@ -3,7 +3,7 @@ import { useRef, useState } from "react"; import TabPanel from "@mui/lab/TabPanel"; import { Box, Button, Divider, Stack, Typography } from "@mui/material"; import Avatar from "../../Avatar"; -import Field from "../../Inputs/Field"; +import TextInput from "../../Inputs/TextInput"; import ImageField from "../../Inputs/Image"; import { credentials, imageValidation } from "../../../Validation/validation"; import { useDispatch, useSelector } from "react-redux"; @@ -229,26 +229,30 @@ const ProfilePanel = () => { First name - Last name - @@ -261,14 +265,14 @@ const ProfilePanel = () => { This is your current email address — it cannot be changed. - logger.warn("disabled")} - // error={errors[idToName["edit-email"]]} disabled={true} + flex={1} /> From 817bbb1804445f3dc524161183e1cd3a00c05d17 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 13:56:13 +0800 Subject: [PATCH 08/31] Adjust helper text spcing, expose hidden prop --- Client/src/Components/Inputs/TextInput/index.jsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/Client/src/Components/Inputs/TextInput/index.jsx b/Client/src/Components/Inputs/TextInput/index.jsx index 744d036bd..ec8203656 100644 --- a/Client/src/Components/Inputs/TextInput/index.jsx +++ b/Client/src/Components/Inputs/TextInput/index.jsx @@ -8,8 +8,8 @@ const getSx = (theme, type, maxWidth) => { maxWidth: maxWidth, "& .MuiFormHelperText-root": { position: "absolute", - bottom: `-${theme.spacing(12)}`, - minHeight: theme.spacing(12), + bottom: `-${theme.spacing(24)}`, + minHeight: theme.spacing(24), }, }; @@ -79,13 +79,17 @@ const TextInput = forwardRef( maxWidth = "100%", flex, disabled = false, + hidden = false, }, ref ) => { const [fieldType, setFieldType] = useState(type); const theme = useTheme(); return ( - + Date: Tue, 26 Nov 2024 13:56:36 +0800 Subject: [PATCH 09/31] integate TextInput into PasswordPanel --- .../TabPanels/Account/PasswordPanel.jsx | 26 +++++++++++++------ 1 file changed, 18 insertions(+), 8 deletions(-) diff --git a/Client/src/Components/TabPanels/Account/PasswordPanel.jsx b/Client/src/Components/TabPanels/Account/PasswordPanel.jsx index 0ea313d6c..ae322156c 100644 --- a/Client/src/Components/TabPanels/Account/PasswordPanel.jsx +++ b/Client/src/Components/TabPanels/Account/PasswordPanel.jsx @@ -3,7 +3,8 @@ import { useState } from "react"; import { useTheme } from "@emotion/react"; import { Box, Stack, Typography } from "@mui/material"; import LoadingButton from "@mui/lab/LoadingButton"; -import Field from "../../Inputs/Field"; +import { PasswordEndAdornment } from "../../Inputs/TextInput/Adornments"; +import TextInput from "../../Inputs/TextInput"; import { credentials } from "../../../Validation/validation"; import Alert from "../../Alert"; import { update } from "../../../Features/Auth/authSlice"; @@ -113,7 +114,7 @@ const PasswordPanel = () => { maxWidth={"80ch"} marginInline={"auto"} > - { > Current password - } + flex={1} /> { New password - } + flex={1} /> { Confirm new password - } + flex={1} /> {Object.keys(errors).length > 0 && ( From f81b5957e75ae564b763f4f89f39d2e689f8ca74 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 14:05:04 +0800 Subject: [PATCH 10/31] expose margin, integrate into TeamPanel --- Client/src/Components/Inputs/TextInput/index.jsx | 12 ++++++++++++ .../src/Components/TabPanels/Account/TeamPanel.jsx | 7 +++++-- 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/Client/src/Components/Inputs/TextInput/index.jsx b/Client/src/Components/Inputs/TextInput/index.jsx index ec8203656..26f051c06 100644 --- a/Client/src/Components/Inputs/TextInput/index.jsx +++ b/Client/src/Components/Inputs/TextInput/index.jsx @@ -78,6 +78,10 @@ const TextInput = forwardRef( label = null, maxWidth = "100%", flex, + marginTop, + marginRight, + marginBottom, + marginLeft, disabled = false, hidden = false, }, @@ -89,6 +93,10 @@ const TextInput = forwardRef( { onClose={closeInviteModal} theme={theme} > - { - { value={localSettings.systemEmailHost} onChange={handleChange} onBlur={handleBlur} - error={errors.systemEmailHost} + error={errors.systemEmailHost ? true : false} + helperText={errors.systemEmailHost} /> - { value={localSettings.systemEmailPort?.toString()} onChange={handleChange} onBlur={handleBlur} - error={errors.systemEmailPort} + error={errors.systemEmailPort ? true : false} + helperText={errors.systemEmailPort} /> - - { value={localSettings.systemEmailPassword} onChange={handleChange} onBlur={handleBlur} - error={errors.systemEmailPassword} + error={errors.systemEmailPassword ? true : false} + helperText={errors.systemEmailPassword} /> @@ -242,7 +249,7 @@ const AdvancedSettings = ({ isAdmin }) => { direction="row" gap={theme.spacing(10)} > - { value={localSettings.jwtTTLNum.toString()} onChange={handleChange} onBlur={handleBlur} - error={errors.jwtTTLNum} + error={errors.jwtTTLNum ? true : false} + helperText={errors.jwtTTLNum} /> { - { handleFormChange("name", event.target.value); }} - error={errors["name"]} + error={errors["name"] ? true : false} + helperText={errors["name"]} /> From 1334645567375e5c2a4f2ccb9d714a95fcfe8471 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 14:27:50 +0800 Subject: [PATCH 15/31] integrate into configure --- Client/src/Pages/Monitors/Configure/index.jsx | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/Client/src/Pages/Monitors/Configure/index.jsx b/Client/src/Pages/Monitors/Configure/index.jsx index 22cc8618e..ba23c5634 100644 --- a/Client/src/Pages/Monitors/Configure/index.jsx +++ b/Client/src/Pages/Monitors/Configure/index.jsx @@ -14,7 +14,8 @@ import { getUptimeMonitorsByTeamId, deleteUptimeMonitor, } from "../../../Features/UptimeMonitors/uptimeMonitorsSlice"; -import Field from "../../../Components/Inputs/Field"; +import TextInput from "../../../Components/Inputs/TextInput"; +import { HttpAdornment } from "../../../Components/Inputs/TextInput/Adornments"; import PauseIcon from "../../../assets/icons/pause-icon.svg?react"; import ResumeIcon from "../../../assets/icons/resume-icon.svg?react"; import Select from "../../../Components/Inputs/Select"; @@ -343,17 +344,17 @@ const Configure = () => { - } id="monitor-url" label="URL to monitor" placeholder="google.com" value={parsedUrl?.host || monitor?.url || ""} disabled={true} - error={errors["url"]} /> - { placeholder="Google" value={monitor?.name || ""} onChange={handleChange} - error={errors["name"]} + error={errors["name"] ? true : false} + helperText={errors["name"]} /> @@ -405,7 +407,7 @@ const Configure = () => { (notification) => notification.type === "emails" ) ? ( - Date: Tue, 26 Nov 2024 14:28:38 +0800 Subject: [PATCH 16/31] finish create monitor integration --- Client/src/Pages/Monitors/CreateMonitor/index.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/Client/src/Pages/Monitors/CreateMonitor/index.jsx b/Client/src/Pages/Monitors/CreateMonitor/index.jsx index 56dfc4db2..ebb812658 100644 --- a/Client/src/Pages/Monitors/CreateMonitor/index.jsx +++ b/Client/src/Pages/Monitors/CreateMonitor/index.jsx @@ -13,7 +13,6 @@ import { ConfigBox } from "../styled"; import Radio from "../../../Components/Inputs/Radio"; import TextInput from "../../../Components/Inputs/TextInput"; import { HttpAdornment } from "../../../Components/Inputs/TextInput/Adornments"; -import Field from "../../../Components/Inputs/Field"; import Select from "../../../Components/Inputs/Select"; import Checkbox from "../../../Components/Inputs/Checkbox"; import Breadcrumbs from "../../../Components/Breadcrumbs"; @@ -386,7 +385,7 @@ const CreateMonitor = () => { (notification) => notification.type === "emails" ) ? ( - Date: Tue, 26 Nov 2024 14:30:58 +0800 Subject: [PATCH 17/31] Integrate into pagespeed configure --- Client/src/Pages/PageSpeed/Configure/index.jsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/Client/src/Pages/PageSpeed/Configure/index.jsx b/Client/src/Pages/PageSpeed/Configure/index.jsx index 222fa733f..757804c97 100644 --- a/Client/src/Pages/PageSpeed/Configure/index.jsx +++ b/Client/src/Pages/PageSpeed/Configure/index.jsx @@ -14,7 +14,7 @@ import { monitorValidation } from "../../../Validation/validation"; import { createToast } from "../../../Utils/toastUtils"; import { logger } from "../../../Utils/Logger"; import { ConfigBox } from "../../Monitors/styled"; -import Field from "../../../Components/Inputs/Field"; +import TextInput from "../../../Components/Inputs/TextInput"; import Select from "../../../Components/Inputs/Select"; import Checkbox from "../../../Components/Inputs/Checkbox"; import PauseCircleOutlineIcon from "@mui/icons-material/PauseCircleOutline"; @@ -321,17 +321,18 @@ const PageSpeedConfigure = () => { }, }} > - - { isOptional={true} value={monitor?.name || ""} onChange={handleChange} - error={errors.name} + error={errors.name ? true : false} + helperText={errors.name} /> @@ -383,7 +385,7 @@ const PageSpeedConfigure = () => { (notification) => notification.type === "emails" ) ? ( - Date: Tue, 26 Nov 2024 14:32:22 +0800 Subject: [PATCH 18/31] integrate in to create pagespeed --- .../Pages/PageSpeed/CreatePageSpeed/index.jsx | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx b/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx index f771c3988..e6c2e2a62 100644 --- a/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx +++ b/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx @@ -13,6 +13,8 @@ import { createToast } from "../../../Utils/toastUtils"; import { logger } from "../../../Utils/Logger"; import { ConfigBox } from "../../Monitors/styled"; import Radio from "../../../Components/Inputs/Radio"; +import TextInput from "../../../Components/Inputs/TextInput"; +import { HttpAdornment } from "../../../Components/Inputs/TextInput/Adornments"; import Field from "../../../Components/Inputs/Field"; import Select from "../../../Components/Inputs/Select"; import Checkbox from "../../../Components/Inputs/Checkbox"; @@ -205,17 +207,18 @@ const CreatePageSpeed = () => { - } placeholder="google.com" value={monitor.url} onChange={handleChange} - error={errors["url"]} + error={errors["url"] ? true : false} + helperText={errors["url"]} /> - { placeholder="Google" value={monitor.name} onChange={handleChange} - error={errors["name"]} + error={errors["name"] ? true : false} + helperText={errors["name"]} /> @@ -315,7 +319,7 @@ const CreatePageSpeed = () => { (notification) => notification.type === "emails" ) ? ( - Date: Tue, 26 Nov 2024 14:33:45 +0800 Subject: [PATCH 19/31] integrate in to settings --- Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx | 1 - Client/src/Pages/Settings/index.jsx | 7 ++++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx b/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx index e6c2e2a62..e70576ebd 100644 --- a/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx +++ b/Client/src/Pages/PageSpeed/CreatePageSpeed/index.jsx @@ -15,7 +15,6 @@ import { ConfigBox } from "../../Monitors/styled"; import Radio from "../../../Components/Inputs/Radio"; import TextInput from "../../../Components/Inputs/TextInput"; import { HttpAdornment } from "../../../Components/Inputs/TextInput/Adornments"; -import Field from "../../../Components/Inputs/Field"; import Select from "../../../Components/Inputs/Select"; import Checkbox from "../../../Components/Inputs/Checkbox"; import Breadcrumbs from "../../../Components/Breadcrumbs"; diff --git a/Client/src/Pages/Settings/index.jsx b/Client/src/Pages/Settings/index.jsx index 357014b3a..8a5e73bc3 100644 --- a/Client/src/Pages/Settings/index.jsx +++ b/Client/src/Pages/Settings/index.jsx @@ -1,6 +1,6 @@ import { useTheme } from "@emotion/react"; import { Box, Stack, Typography, Button } from "@mui/material"; -import Field from "../../Components/Inputs/Field"; +import TextInput from "../../Components/Inputs/TextInput"; import Link from "../../Components/Link"; import Select from "../../Components/Inputs/Select"; import { logger } from "../../Utils/Logger"; @@ -240,13 +240,14 @@ const Settings = ({ isAdmin }) => { - Clear all stats. This is irreversible. From 16069b47b9f62b73db02a394e2f74afdbdae2846 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 14:34:24 +0800 Subject: [PATCH 20/31] remove test route and page --- Client/src/App.jsx | 6 -- Client/src/Pages/test.jsx | 192 -------------------------------------- 2 files changed, 198 deletions(-) delete mode 100644 Client/src/Pages/test.jsx diff --git a/Client/src/App.jsx b/Client/src/App.jsx index 62b6bd9ff..82c8203a8 100644 --- a/Client/src/App.jsx +++ b/Client/src/App.jsx @@ -41,7 +41,6 @@ import { logger } from "./Utils/Logger"; // Import the logger import { networkService } from "./main"; import { Infrastructure } from "./Pages/Infrastructure"; import InfrastructureDetails from "./Pages/Infrastructure/Details"; -import Test from "./Pages/test"; function App() { const AdminCheckedRegister = withAdminCheck(Register); const MonitorsWithAdminProp = withAdminProp(Monitors); @@ -90,11 +89,6 @@ function App() { path="/" element={} > - } - /> - { - const [originalValue, setOriginalValue] = useState(""); - const [originalError, setOriginalError] = useState(""); - - const [newValue, setNewValue] = useState(""); - const [newError, setNewError] = useState(""); - - const [thresholdValue, setThresholdValue] = useState(20); - const [thresholdError, setThresholdError] = useState(""); - - const [thresholdValue2, setThresholdValue2] = useState(20); - const [thresholdError2, setThresholdError2] = useState(""); - - const inputRef = useRef(null); - - useEffect(() => { - if (inputRef.current) { - inputRef.current.focus(); - } - }, []); - - const checkError = (value) => { - if (value !== "clear") { - return "This is an error"; - } - return ""; - }; - - const checkThresholdError = (value) => { - if (value !== 99) { - return "This is a threshold error"; - } - return ""; - }; - const checkThresholdError2 = (value) => { - if (value !== 99) { - return "This is a threshold error 2"; - } - return ""; - }; - - const handleOriginalValue = (e) => { - setOriginalError(checkError(e.target.value)); - setOriginalValue(e.target.value); - }; - - const handleNewValue = (e) => { - setNewError(checkError(e.target.value)); - setNewValue(e.target.value); - }; - - const handleThresholdValue = (e) => { - const parsedVal = parseInt(e.target.value); - setThresholdError(checkThresholdError(parsedVal)); - setThresholdValue(parsedVal); - }; - - const handleThresholdValue2 = (e) => { - const parsedVal = parseInt(e.target.value); - setThresholdError2(checkThresholdError2(parsedVal)); - setThresholdValue2(parsedVal); - }; - - return ( - - - This is a test page for the TextInput component. It is a rationalized Input - component. - - Type anything for an error. - Typing "clear" will clear the error for text based input - Typing "99" will clear the error for threshold based input - - - - - } - onChange={handleNewValue} - error={newError !== ""} - helperText={newError} - /> - - - } - onChange={handleNewValue} - error={newError !== ""} - helperText={newError} - ref={inputRef} - /> - - - - - - Short field for threshold. Easily show/hide error text - - - - {thresholdError} {thresholdError2} - - - ); -}; - -export default Test; From 061b450e81e64ed22a20c1d4d38a6a3ccc35e0ec Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 26 Nov 2024 14:34:50 +0800 Subject: [PATCH 21/31] remove Field component --- Client/src/Components/Inputs/Field/index.css | 50 ---- Client/src/Components/Inputs/Field/index.jsx | 241 ------------------- 2 files changed, 291 deletions(-) delete mode 100644 Client/src/Components/Inputs/Field/index.css delete mode 100644 Client/src/Components/Inputs/Field/index.jsx diff --git a/Client/src/Components/Inputs/Field/index.css b/Client/src/Components/Inputs/Field/index.css deleted file mode 100644 index 4b54a565d..000000000 --- a/Client/src/Components/Inputs/Field/index.css +++ /dev/null @@ -1,50 +0,0 @@ -.field { - min-width: var(--env-var-width-3); -} - -.field-infrastructure-alert{ - max-width: var(--env-var-width-4); -} - -.field-infrastructure-alert .MuiInputBase-root:has(input) { - /* height: var(--env-var-height-2); */ - min-width: unset; -} - -.field h3.MuiTypography-root, -.field h5.MuiTypography-root, -.field input, -.field textarea, -.field .input-error { - font-size: var(--env-var-font-size-medium); -} -.field h5.MuiTypography-root { - position: relative; - opacity: 0.8; - padding-right: var(--env-var-spacing-1-minus); -} -.field .MuiInputBase-root:has(input) { - /* height: var(--env-var-height-2); */ -} -.field .MuiInputBase-root:has(.MuiInputAdornment-root) { - padding-right: var(--env-var-spacing-1-minus); -} - -.field input { - height: 100%; - padding: 0 var(--env-var-spacing-1-minus); -} -.field .MuiInputBase-root:has(textarea) { - padding: var(--env-var-spacing-1-minus); -} - -.register-page .field .MuiOutlinedInput-root fieldset, -.register-page .field input, -.login-page .field .MuiOutlinedInput-root fieldset, -.login-page .field input, -.forgot-password-page .field .MuiOutlinedInput-root fieldset, -.forgot-password-page .field input, -.set-new-password-page .field .MuiOutlinedInput-root fieldset, -.set-new-password-page .field input { - border-radius: var(--env-var-radius-2); -} diff --git a/Client/src/Components/Inputs/Field/index.jsx b/Client/src/Components/Inputs/Field/index.jsx deleted file mode 100644 index bbc28eac7..000000000 --- a/Client/src/Components/Inputs/Field/index.jsx +++ /dev/null @@ -1,241 +0,0 @@ -import PropTypes from "prop-types"; -import { forwardRef, useState } from "react"; -import { useTheme } from "@emotion/react"; -import { IconButton, InputAdornment, Stack, TextField, Typography } from "@mui/material"; -import VisibilityOff from "@mui/icons-material/VisibilityOff"; -import Visibility from "@mui/icons-material/Visibility"; -import "./index.css"; - -/** - * Field component for rendering various types of input fields with customizable properties - * - * @param {Object} props - * @param {string} [props.type='text'] - Type of input field (text, password, url, email, description, number). - * @param {string} props.id - Unique identifier for the input field. - * @param {string} props.name - Name attribute for the input field. - * @param {string} [props.label] - Label text displayed above the input field. - * @param {boolean} [props.https=true] - For URL type, determines whether to show https:// or http://. - * @param {boolean} [props.isRequired=false] - Displays a red asterisk if the field is required. - * @param {boolean} [props.isOptional=false] - Displays an optional label next to the field. - * @param {string} [props.optionalLabel='(optional)'] - Custom text for optional label. - * @param {string} [props.autoComplete] - Autocomplete attribute for the input. - * @param {string} [props.placeholder] - Placeholder text for the input field. - * @param {string} props.value - Current value of the input field. - * @param {function} props.onChange - Callback function triggered on input value change. - * @param {function} [props.onBlur] - Callback function triggered when input loses focus. - * @param {function} [props.onInput] - Callback function triggered on input event. - * @param {string} [props.error] - Error message to display below the input field. - * @param {boolean} [props.disabled=false] - Disables the input field if true. - * @param {boolean} [props.hidden=false] - Hides the entire input field if true. - * @param {string} [props.className] - Additional CSS class names for the input container. - * @param {boolean} [props.hideErrorText=false] - Hides the error message if true. - * @param {React.Ref} [ref] - Ref forwarded to the underlying TextField component. - * - * @returns {React.ReactElement} Rendered input field component - */ - -const Field = forwardRef( - ( - { - type = "text", - id, - name, - label, - https, - isRequired, - isOptional, - optionalLabel, - autoComplete, - placeholder, - value, - onChange, - onBlur, - onInput, - error, - disabled, - hidden, - className, - hideErrorText = false, - }, - ref - ) => { - const theme = useTheme(); - - const [isVisible, setVisible] = useState(false); - - return ( - - ), - endAdornment: type === "password" && ( - - setVisible((show) => !show)} - sx={{ - color: theme.palette.border.dark, - padding: theme.spacing(1), - "&:focus-visible": { - outline: `2px solid ${theme.palette.primary.main}`, - outlineOffset: `2px`, - }, - "& .MuiTouchRipple-root": { - pointerEvents: "none", - display: "none", - }, - }} - > - {!isVisible ? : } - - - ), - }} - /> - {error && ( - - )} - - ); - } -); - -Field.displayName = "Field"; - -Field.propTypes = { - type: PropTypes.oneOf(["text", "password", "url", "email", "description", "number"]), - id: PropTypes.string.isRequired, - name: PropTypes.string, - label: PropTypes.string, - https: PropTypes.bool, - isRequired: PropTypes.bool, - isOptional: PropTypes.bool, - optionalLabel: PropTypes.string, - autoComplete: PropTypes.string, - placeholder: PropTypes.string, - value: PropTypes.string.isRequired, - onChange: PropTypes.func, - onBlur: PropTypes.func, - onInput: PropTypes.func, - error: PropTypes.string, - disabled: PropTypes.bool, - hidden: PropTypes.bool, - className: PropTypes.string, - hideErrorText: PropTypes.bool, -}; - -export default Field; From 82a514f637c9bbfb54151c075e7e1e52f5c34bef Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Wed, 27 Nov 2024 10:37:11 +0800 Subject: [PATCH 22/31] add 0 data for temps for consistent empty data handling --- .../Pages/Infrastructure/Details/index.jsx | 43 ++++++++++--------- 1 file changed, 23 insertions(+), 20 deletions(-) diff --git a/Client/src/Pages/Infrastructure/Details/index.jsx b/Client/src/Pages/Infrastructure/Details/index.jsx index 6e8f95d7c..06fb1296a 100644 --- a/Client/src/Pages/Infrastructure/Details/index.jsx +++ b/Client/src/Pages/Infrastructure/Details/index.jsx @@ -312,7 +312,7 @@ const InfrastructureDetails = () => { }; const buildTemps = (checks) => { - let numCores = 0; + let numCores = 1; if (checks === null) return { temps: [], tempKeys: [] }; for (const check of checks) { @@ -321,19 +321,16 @@ const InfrastructureDetails = () => { break; } } - if (numCores === 0) return { temps: [], tempKeys: [] }; - const temps = checks.map((check) => { - if (check.cpu.temperature.length > numCores) { - numCores = check.cpu.temperature.length; - } - // If there's no data, set the temperature to 0 - if (check.cpu.temperature.length === 0) { + if ( + check?.cpu?.temperature?.length === 0 || + check?.cpu?.temperature === undefined || + check?.cpu?.temperature === null + ) { check.cpu.temperature = Array(numCores).fill(0); } - - return check.cpu.temperature.reduce( + const res = check?.cpu?.temperature?.reduce( (acc, cur, idx) => { acc[`core${idx + 1}`] = cur; return acc; @@ -342,9 +339,16 @@ const InfrastructureDetails = () => { createdAt: check.createdAt, } ); + return res; }); - // Slice to remove `createdAt` key - return { tempKeys: Object.keys(temps[0]).slice(1), temps }; + if (temps.length === 0 || !temps[0]) { + return { temps: [], tempKeys: [] }; + } + + return { + tempKeys: Object.keys(temps[0] || {}).filter((key) => key !== "createdAt"), + temps, + }; }; const buildAreaChartConfigs = (checks) => { @@ -401,10 +405,13 @@ const InfrastructureDetails = () => { yLabel: "Temperature", xTick: , yDomain: [ - Math.min(...tempData.temps.flatMap((t) => tempData.tempKeys.map((k) => t[k]))) * - 0.9, - Math.max(...tempData.temps.flatMap((t) => tempData.tempKeys.map((k) => t[k]))) * - 1.1, + 0, + Math.max( + Math.max( + ...tempData.temps.flatMap((t) => tempData.tempKeys.map((k) => t[k])) + ) * 1.1, + 200 + ), ], toolTip: ( { }} > {areaChartConfigs.map((config) => { - if (config?.data?.length === 0) { - return; - } - return ( Date: Wed, 27 Nov 2024 14:50:05 +0800 Subject: [PATCH 23/31] adjusted theme settings for color fixes --- Client/src/Components/Charts/BarChart/index.jsx | 4 +--- Client/src/Components/Label/index.jsx | 4 ++-- Client/src/Utils/Theme/constants.js | 3 +++ Client/src/Utils/Theme/darkTheme.js | 3 +++ Client/src/Utils/Theme/globalTheme.js | 3 ++- Client/src/Utils/Theme/lightTheme.js | 3 +++ 6 files changed, 14 insertions(+), 6 deletions(-) diff --git a/Client/src/Components/Charts/BarChart/index.jsx b/Client/src/Components/Charts/BarChart/index.jsx index 70fd66390..b1c46a9d6 100644 --- a/Client/src/Components/Charts/BarChart/index.jsx +++ b/Client/src/Components/Charts/BarChart/index.jsx @@ -158,9 +158,7 @@ const BarChart = ({ checks = [] }) => { width="100%" height={`${animate ? check.responseTime : 0}%`} backgroundColor={ - check.status - ? theme.palette.success.main - : theme.palette.error.contrastText + check.status ? theme.palette.success.main : theme.palette.error.main } sx={{ borderRadius: theme.spacing(1.5), diff --git a/Client/src/Components/Label/index.jsx b/Client/src/Components/Label/index.jsx index eb6499a31..664cfd4af 100644 --- a/Client/src/Components/Label/index.jsx +++ b/Client/src/Components/Label/index.jsx @@ -127,11 +127,11 @@ const StatusLabel = ({ status, text, customStyles }) => { const colors = { up: { dotColor: theme.palette.success.main, - bgColor: theme.palette.success./* dark */ contrastText, + bgColor: theme.palette.success.contrastText /* dark */, borderColor: theme.palette.success.main /* light */, }, down: { - dotColor: theme.palette.error.contrastText, + dotColor: theme.palette.error.main, bgColor: theme.palette.error.dark, borderColor: theme.palette.error.light, }, diff --git a/Client/src/Utils/Theme/constants.js b/Client/src/Utils/Theme/constants.js index 0626edbaa..ed3719278 100644 --- a/Client/src/Utils/Theme/constants.js +++ b/Client/src/Utils/Theme/constants.js @@ -22,6 +22,7 @@ const paletteColors = { gray80: "#FDFCFD", gray90: "#FCFCFD", gray100: "#F4F4F4", + gray150: "#EFEFEF", gray200: "#E3E3E3", gray300: "#A2A3A3", gray500: "#838C99", @@ -205,10 +206,12 @@ const semanticColors = { light: { light: paletteColors.gray200, dark: paletteColors.gray800, + disabled: paletteColors.gray150, }, dark: { light: paletteColors.gray200, dark: paletteColors.gray750, + disabled: paletteColors.gray800, }, }, unresolved: { diff --git a/Client/src/Utils/Theme/darkTheme.js b/Client/src/Utils/Theme/darkTheme.js index 0f4a391de..26f4ba340 100644 --- a/Client/src/Utils/Theme/darkTheme.js +++ b/Client/src/Utils/Theme/darkTheme.js @@ -23,6 +23,9 @@ const { } = colors; const palette = { + action: { + disabled: border.dark.disabled, + }, primary: { main: primary.main.dark }, secondary: { main: secondary.main.dark, diff --git a/Client/src/Utils/Theme/globalTheme.js b/Client/src/Utils/Theme/globalTheme.js index 0839cd0e8..e5c60485a 100644 --- a/Client/src/Utils/Theme/globalTheme.js +++ b/Client/src/Utils/Theme/globalTheme.js @@ -220,7 +220,7 @@ const baseTheme = (palette) => ({ height: "var(--env-var-height-2)", fontSize: "var(--env-var-font-size-medium)", fontWeight: 400, - color: palette.text.secondary, // or any color from your palette + color: "palette.text.secondary", }, "& .MuiInputBase-input.MuiOutlinedInput-input": { padding: "0 var(--env-var-spacing-1-minus) !important", @@ -231,6 +231,7 @@ const baseTheme = (palette) => ({ "& .MuiOutlinedInput-notchedOutline": { borderRadius: 4, }, + "& .MuiFormHelperText-root": { color: palette.error.main, opacity: 0.8, diff --git a/Client/src/Utils/Theme/lightTheme.js b/Client/src/Utils/Theme/lightTheme.js index 8bc6434c6..88e47282d 100644 --- a/Client/src/Utils/Theme/lightTheme.js +++ b/Client/src/Utils/Theme/lightTheme.js @@ -28,6 +28,9 @@ const { } = colors; const palette = { + action: { + disabled: border.light.disabled, + }, primary: { main: primary.main.light }, secondary: { main: secondary.main.light, From 10b78441fc48b270ec99b785bb3505cd5f2a5412 Mon Sep 17 00:00:00 2001 From: Mend Renovate Date: Wed, 27 Nov 2024 16:53:56 +0000 Subject: [PATCH 24/31] Update material-ui monorepo --- Client/package-lock.json | 94 ++++++++++++++++++++-------------------- Client/package.json | 6 +-- 2 files changed, 50 insertions(+), 50 deletions(-) diff --git a/Client/package-lock.json b/Client/package-lock.json index 55e849eb2..80aa209c1 100644 --- a/Client/package-lock.json +++ b/Client/package-lock.json @@ -11,9 +11,9 @@ "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@fontsource/roboto": "^5.0.13", - "@mui/icons-material": "6.1.8", - "@mui/lab": "6.0.0-beta.16", - "@mui/material": "6.1.8", + "@mui/icons-material": "6.1.9", + "@mui/lab": "6.0.0-beta.17", + "@mui/material": "6.1.9", "@mui/x-charts": "^7.5.1", "@mui/x-data-grid": "7.22.3", "@mui/x-date-pickers": "7.22.3", @@ -1078,15 +1078,15 @@ "license": "MIT" }, "node_modules/@mui/base": { - "version": "5.0.0-beta.62", - "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-beta.62.tgz", - "integrity": "sha512-TzJLCNlrMkSU4bTCdTT+TVUiGx4sjZLhH673UV6YN+rNNP8wJpkWfRSvjDB5HcbH2T0lUamnz643ZnV+8IiMjw==", + "version": "5.0.0-beta.63", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-beta.63.tgz", + "integrity": "sha512-W6aIqKP9X8VUX0KhSnYWo2+5C7MnKV1IhYVd517L/apvfkVq5KaTdlnxSBVwnaWt46whayVgQ/9KXwUVCXp6+w==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", "@floating-ui/react-dom": "^2.1.1", "@mui/types": "^7.2.19", - "@mui/utils": "^6.1.8", + "@mui/utils": "^6.1.9", "@popperjs/core": "^2.11.8", "clsx": "^2.1.1", "prop-types": "^15.8.1" @@ -1110,9 +1110,9 @@ } }, "node_modules/@mui/core-downloads-tracker": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.1.8.tgz", - "integrity": "sha512-TGAvzwUg9hybDacwfIGFjI2bXYXrIqky+vMfaeay8rvT56/PNAlvIDUJ54kpT5KRc9AWAihOvtDI7/LJOThOmQ==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.1.9.tgz", + "integrity": "sha512-TWqj7b1w5cmSz4H/uf+y2AHxAH4ldPR7D2bz0XVyn60GCAo/zRbRPx7cF8gTs/i7CiYeHzV6dtat0VpMwOtolw==", "license": "MIT", "funding": { "type": "opencollective", @@ -1120,9 +1120,9 @@ } }, "node_modules/@mui/icons-material": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-6.1.8.tgz", - "integrity": "sha512-6frsXcf1TcJKWevWwRup6V4L8lzI33cbHcAjT83YLgKw0vYRZKY0kjMI9fhrJZdRWXgFFgKKvEv3GjoxbqFF7A==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-6.1.9.tgz", + "integrity": "sha512-AzlhIT51rdjkZ/EcUV2dbhNkNSUHIqCnNoUxodpiTw8buyAUBd+qnxg5OBSuPpun/ZEdSSB8Q7Uyh6zqjiMsEQ==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0" @@ -1135,7 +1135,7 @@ "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@mui/material": "^6.1.8", + "@mui/material": "^6.1.9", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0" }, @@ -1146,16 +1146,16 @@ } }, "node_modules/@mui/lab": { - "version": "6.0.0-beta.16", - "resolved": "https://registry.npmjs.org/@mui/lab/-/lab-6.0.0-beta.16.tgz", - "integrity": "sha512-YFeKREMMCiUhp4dGXd6Y/7N3BLepys9bM6xi4aF0WTZOvfl1ksDXPzuXPGiiiIuMgQFJeyN5iUnS1iPu3wH+kQ==", + "version": "6.0.0-beta.17", + "resolved": "https://registry.npmjs.org/@mui/lab/-/lab-6.0.0-beta.17.tgz", + "integrity": "sha512-Ls1pIuYi5D9wq9mUwncky6CWokd6CCqQDCxXbm0TP0e7ksU5DcCPUZXBmTWQgbkldLu14aUXbJHyts63L0rycQ==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", - "@mui/base": "5.0.0-beta.62", - "@mui/system": "^6.1.8", + "@mui/base": "5.0.0-beta.63", + "@mui/system": "^6.1.9", "@mui/types": "^7.2.19", - "@mui/utils": "^6.1.8", + "@mui/utils": "^6.1.9", "clsx": "^2.1.1", "prop-types": "^15.8.1" }, @@ -1169,8 +1169,8 @@ "peerDependencies": { "@emotion/react": "^11.5.0", "@emotion/styled": "^11.3.0", - "@mui/material": "^6.1.8", - "@mui/material-pigment-css": "^6.1.8", + "@mui/material": "^6.1.9", + "@mui/material-pigment-css": "^6.1.9", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" @@ -1191,16 +1191,16 @@ } }, "node_modules/@mui/material": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/material/-/material-6.1.8.tgz", - "integrity": "sha512-QZdQFnXct+7NXIzHgT3qt+sQiO7HYGZU2vymP9Xl9tUMXEOA/S1mZMMb7+WGZrk5TzNlU/kP/85K0da5V1jXoQ==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-6.1.9.tgz", + "integrity": "sha512-NwqIN0bdsgzSbZd5JFcC+2ez0XW/XNs8uiV2PDHrqQ4qf/FEasFJG1z6g8JbCN0YlTrHZekVb17X0Fv0qcYJfQ==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", - "@mui/core-downloads-tracker": "^6.1.8", - "@mui/system": "^6.1.8", + "@mui/core-downloads-tracker": "^6.1.9", + "@mui/system": "^6.1.9", "@mui/types": "^7.2.19", - "@mui/utils": "^6.1.8", + "@mui/utils": "^6.1.9", "@popperjs/core": "^2.11.8", "@types/react-transition-group": "^4.4.11", "clsx": "^2.1.1", @@ -1219,7 +1219,7 @@ "peerDependencies": { "@emotion/react": "^11.5.0", "@emotion/styled": "^11.3.0", - "@mui/material-pigment-css": "^6.1.8", + "@mui/material-pigment-css": "^6.1.9", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" @@ -1240,13 +1240,13 @@ } }, "node_modules/@mui/private-theming": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-6.1.8.tgz", - "integrity": "sha512-TuKl7msynCNCVvhX3c0ef1sF0Qb3VHcPs8XOGB/8bdOGBr/ynmIG1yTMjZeiFQXk8yN9fzK/FDEKMFxILNn3wg==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-6.1.9.tgz", + "integrity": "sha512-7aum/O1RquBYhfwL/7egDyl9GqJgPM6hoJDFFBbhF6Sgv9yI9v4w3ArKUkuVvR0CtVj4NXRVMKEioh1bjUzvuA==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", - "@mui/utils": "^6.1.8", + "@mui/utils": "^6.1.9", "prop-types": "^15.8.1" }, "engines": { @@ -1267,14 +1267,14 @@ } }, "node_modules/@mui/styled-engine": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-6.1.8.tgz", - "integrity": "sha512-ZvEoT0U2nPLSLI+B4by4cVjaZnPT2f20f4JUPkyHdwLv65ZzuoHiTlwyhqX1Ch63p8bcJzKTHQVGisEoMK6PGA==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-6.1.9.tgz", + "integrity": "sha512-xynSLlJRxHLzSfQaiDjkaTx8LiFb9ByVa7aOdwFnTxGWFMY1F+mkXwAUY4jDDE+MAxkWxlzzQE0wOohnsxhdQg==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", - "@emotion/cache": "^11.13.1", - "@emotion/serialize": "^1.3.2", + "@emotion/cache": "^11.13.5", + "@emotion/serialize": "^1.3.3", "@emotion/sheet": "^1.4.0", "csstype": "^3.1.3", "prop-types": "^15.8.1" @@ -1301,16 +1301,16 @@ } }, "node_modules/@mui/system": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/system/-/system-6.1.8.tgz", - "integrity": "sha512-i1kLfQoWxzFpXTBQIuPoA3xKnAnP3en4I2T8xIolovSolGQX5k8vGjw1JaydQS40td++cFsgCdEU458HDNTGUA==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-6.1.9.tgz", + "integrity": "sha512-8x+RucnNp21gfFYsklCaZf0COXbv3+v0lrVuXONxvPEkESi2rwLlOi8UPJfcz6LxZOAX3v3oQ7qw18vnpgueRg==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", - "@mui/private-theming": "^6.1.8", - "@mui/styled-engine": "^6.1.8", + "@mui/private-theming": "^6.1.9", + "@mui/styled-engine": "^6.1.9", "@mui/types": "^7.2.19", - "@mui/utils": "^6.1.8", + "@mui/utils": "^6.1.9", "clsx": "^2.1.1", "csstype": "^3.1.3", "prop-types": "^15.8.1" @@ -1355,9 +1355,9 @@ } }, "node_modules/@mui/utils": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.1.8.tgz", - "integrity": "sha512-O2DWb1kz8hiANVcR7Z4gOB3SvPPsSQGUmStpyBDzde6dJIfBzgV9PbEQOBZd3EBsd1pB+Uv1z5LAJAbymmawrA==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.1.9.tgz", + "integrity": "sha512-N7uzBp7p2or+xanXn3aH2OTINC6F/Ru/U8h6amhRZEev8bJhKN86rIDIoxZZ902tj+09LXtH83iLxFMjMHyqNA==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.0", diff --git a/Client/package.json b/Client/package.json index c2ea33996..795dd8d87 100644 --- a/Client/package.json +++ b/Client/package.json @@ -14,9 +14,9 @@ "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@fontsource/roboto": "^5.0.13", - "@mui/icons-material": "6.1.8", - "@mui/lab": "6.0.0-beta.16", - "@mui/material": "6.1.8", + "@mui/icons-material": "6.1.9", + "@mui/lab": "6.0.0-beta.17", + "@mui/material": "6.1.9", "@mui/x-charts": "^7.5.1", "@mui/x-data-grid": "7.22.3", "@mui/x-date-pickers": "7.22.3", From 43a5b6658e076b30d101dcedf435ce5cf8463d98 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Thu, 28 Nov 2024 10:02:00 +0800 Subject: [PATCH 25/31] undo accidental stringification --- Client/src/Utils/Theme/globalTheme.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Client/src/Utils/Theme/globalTheme.js b/Client/src/Utils/Theme/globalTheme.js index e5c60485a..641e22582 100644 --- a/Client/src/Utils/Theme/globalTheme.js +++ b/Client/src/Utils/Theme/globalTheme.js @@ -220,7 +220,7 @@ const baseTheme = (palette) => ({ height: "var(--env-var-height-2)", fontSize: "var(--env-var-font-size-medium)", fontWeight: 400, - color: "palette.text.secondary", + color: palette.text.secondary, }, "& .MuiInputBase-input.MuiOutlinedInput-input": { padding: "0 var(--env-var-spacing-1-minus) !important", From 2e54e867d75b705b4d9bc1a44efaa67f7d028af8 Mon Sep 17 00:00:00 2001 From: Mend Renovate Date: Thu, 28 Nov 2024 21:58:42 +0000 Subject: [PATCH 26/31] Update dependency @reduxjs/toolkit to v2.4.0 --- Client/package-lock.json | 8 ++++---- Client/package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/Client/package-lock.json b/Client/package-lock.json index 80aa209c1..cd5556f8d 100644 --- a/Client/package-lock.json +++ b/Client/package-lock.json @@ -17,7 +17,7 @@ "@mui/x-charts": "^7.5.1", "@mui/x-data-grid": "7.22.3", "@mui/x-date-pickers": "7.22.3", - "@reduxjs/toolkit": "2.3.0", + "@reduxjs/toolkit": "2.4.0", "axios": "^1.7.4", "chart.js": "^4.4.3", "dayjs": "1.11.13", @@ -1686,9 +1686,9 @@ } }, "node_modules/@reduxjs/toolkit": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.3.0.tgz", - "integrity": "sha512-WC7Yd6cNGfHx8zf+iu+Q1UPTfEcXhQ+ATi7CV1hlrSAaQBdlPzg7Ww/wJHNQem7qG9rxmWoFCDCPubSvFObGzA==", + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.4.0.tgz", + "integrity": "sha512-wJZEuSKj14tvNfxiIiJws0tQN77/rDqucBq528ApebMIRHyWpCanJVQRxQ8WWZC19iCDKxDsGlbAir3F1layxA==", "license": "MIT", "dependencies": { "immer": "^10.0.3", diff --git a/Client/package.json b/Client/package.json index 795dd8d87..2a9da6f19 100644 --- a/Client/package.json +++ b/Client/package.json @@ -20,7 +20,7 @@ "@mui/x-charts": "^7.5.1", "@mui/x-data-grid": "7.22.3", "@mui/x-date-pickers": "7.22.3", - "@reduxjs/toolkit": "2.3.0", + "@reduxjs/toolkit": "2.4.0", "axios": "^1.7.4", "chart.js": "^4.4.3", "dayjs": "1.11.13", From 5be818f2380e5c4dae625d34cdd9aec0b532d9b8 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Fri, 29 Nov 2024 11:03:02 +0800 Subject: [PATCH 27/31] Remove Dashboard menu item, move Monitors, Pagespeed, and Infrastructure to top level of menu --- Client/src/Components/Sidebar/index.jsx | 12 +++--------- 1 file changed, 3 insertions(+), 9 deletions(-) diff --git a/Client/src/Components/Sidebar/index.jsx b/Client/src/Components/Sidebar/index.jsx index be056e011..4c274409b 100644 --- a/Client/src/Components/Sidebar/index.jsx +++ b/Client/src/Components/Sidebar/index.jsx @@ -47,15 +47,9 @@ import Folder from "../../assets/icons/folder.svg?react"; import "./index.css"; const menu = [ - { - name: "Dashboard", - icon: , - nested: [ - { name: "Monitors", path: "monitors", icon: }, - { name: "Pagespeed", path: "pagespeed", icon: }, - { name: "Infrastructure", path: "infrastructure", icon: }, - ], - }, + { name: "Monitors", path: "monitors", icon: }, + { name: "Pagespeed", path: "pagespeed", icon: }, + { name: "Infrastructure", path: "infrastructure", icon: }, { name: "Incidents", path: "incidents", icon: }, // { name: "Status pages", path: "status", icon: }, { name: "Maintenance", path: "maintenance", icon: }, From 98ab556c61629f5f0482e5cea5309ca059ed8625 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Fri, 29 Nov 2024 11:03:15 +0800 Subject: [PATCH 28/31] Remove greeting from PageSpeed page --- Client/src/Pages/PageSpeed/index.jsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/Client/src/Pages/PageSpeed/index.jsx b/Client/src/Pages/PageSpeed/index.jsx index 30e11b2d7..8e0f111bb 100644 --- a/Client/src/Pages/PageSpeed/index.jsx +++ b/Client/src/Pages/PageSpeed/index.jsx @@ -8,7 +8,6 @@ import "./index.css"; import { useNavigate } from "react-router"; import PropTypes from "prop-types"; import Breadcrumbs from "../../Components/Breadcrumbs"; -import Greeting from "../../Utils/greeting"; import SkeletonLayout from "./skeleton"; import Card from "./card"; import { networkService } from "../../main"; @@ -82,11 +81,10 @@ const PageSpeed = ({ isAdmin }) => { - {isAdmin && (