diff --git a/client/src/Components/v1/ActionsMenu/index.jsx b/client/src/Components/v1/ActionsMenu/index.jsx index 8fcc77f5d..b469e6764 100644 --- a/client/src/Components/v1/ActionsMenu/index.jsx +++ b/client/src/Components/v1/ActionsMenu/index.jsx @@ -84,7 +84,10 @@ const ActionsMenu = ({ }, }} > - + , - error: , - warning: , + info: ( + + ), + error: ( + + ), + warning: ( + + ), }; /** @@ -94,7 +109,10 @@ const Alert = ({ variant, title, body, isToast, hasIcon = true, onClick }) => { }, }} > - + )} diff --git a/client/src/Components/v1/Check/Check.jsx b/client/src/Components/v1/Check/Check.jsx index 5e25569be..01a41879e 100644 --- a/client/src/Components/v1/Check/Check.jsx +++ b/client/src/Components/v1/Check/Check.jsx @@ -34,7 +34,10 @@ const Check = ({ text, noHighlightText, variant = "info", outlined = false }) => alignItems="center" > {outlined ? ( - + ) : ( "& svg > path": { fill: colors[variant] }, }} > - + )} { aria-label="Menu button" onClick={toggleDrawer(true)} > - + { }} > - + diff --git a/client/src/Components/v1/Inputs/ImageUpload/index.jsx b/client/src/Components/v1/Inputs/ImageUpload/index.jsx index 5b2be991a..d224418e0 100644 --- a/client/src/Components/v1/Inputs/ImageUpload/index.jsx +++ b/client/src/Components/v1/Inputs/ImageUpload/index.jsx @@ -175,7 +175,10 @@ const ImageUpload = ({ boxShadow: theme.shape.boxShadow, }} > - + {(localError || progress.isLoading || progress.value !== 0) && ( } + icon={ + + } label={file?.name || "Upload failed"} size={file?.size} progress={progress.value} diff --git a/client/src/Components/v1/Inputs/Radio/index.jsx b/client/src/Components/v1/Inputs/Radio/index.jsx index 79a9e64f3..b6bd4e69c 100644 --- a/client/src/Components/v1/Inputs/Radio/index.jsx +++ b/client/src/Components/v1/Inputs/Radio/index.jsx @@ -47,7 +47,12 @@ const Radio = ({ } + checkedIcon={ + + } sx={{ color: "transparent", width: 16, diff --git a/client/src/Components/v1/Inputs/Select/index.jsx b/client/src/Components/v1/Inputs/Select/index.jsx index b292d6896..0f96a2ff6 100644 --- a/client/src/Components/v1/Inputs/Select/index.jsx +++ b/client/src/Components/v1/Inputs/Select/index.jsx @@ -98,7 +98,13 @@ const Select = ({ error={error} name={name} inputProps={{ id: id }} - IconComponent={(props) => } + IconComponent={(props) => ( + + )} MenuProps={{ disableScrollLock: true }} sx={{ fontSize: 13, diff --git a/client/src/Components/v1/Inputs/TextInput/Adornments/index.jsx b/client/src/Components/v1/Inputs/TextInput/Adornments/index.jsx index 8df4ee3b1..078684405 100644 --- a/client/src/Components/v1/Inputs/TextInput/Adornments/index.jsx +++ b/client/src/Components/v1/Inputs/TextInput/Adornments/index.jsx @@ -54,9 +54,15 @@ export const PasswordEndAdornment = ({ fieldType, setFieldType }) => { }} > {fieldType === "password" ? ( - + ) : ( - + )} diff --git a/client/src/Components/v1/MonitorActions/index.jsx b/client/src/Components/v1/MonitorActions/index.jsx index d5bab53ba..f63fc23fe 100644 --- a/client/src/Components/v1/MonitorActions/index.jsx +++ b/client/src/Components/v1/MonitorActions/index.jsx @@ -70,7 +70,10 @@ const MonitorActions = ({ isLoading }) => { aria-haspopup="menu" onClick={handleToggle} > - + } + startIcon={ + + } disabled={isTestNotificationsDisabled} onClick={() => { testAllNotifications({ monitorId: monitor?.id }); @@ -100,7 +105,17 @@ const MonitorDetailsControlHeader = ({ color="secondary" loading={isPausing} startIcon={ - monitor?.isActive ? : + monitor?.isActive ? ( + + ) : ( + + ) } onClick={() => { pauseMonitor({ @@ -116,7 +131,12 @@ const MonitorDetailsControlHeader = ({ @@ -110,7 +115,10 @@ const ControlsHeader = ({ statusPage, isPublic, url, type = "uptime" }) => { }} > {t("publicLink")} - + )} diff --git a/client/src/Pages/StatusPage/Status/Components/StatusBar/index.jsx b/client/src/Pages/StatusPage/Status/Components/StatusBar/index.jsx index 44cfbaca3..7b9460068 100644 --- a/client/src/Pages/StatusPage/Status/Components/StatusBar/index.jsx +++ b/client/src/Pages/StatusPage/Status/Components/StatusBar/index.jsx @@ -9,14 +9,22 @@ import PropTypes from "prop-types"; const getMonitorStatus = (monitors, theme) => { const monitorsStatus = { icon: ( - + ), }; if (monitors.every((monitor) => monitor.status === true)) { monitorsStatus.msg = "All systems operational"; monitorsStatus.color = theme.palette.success.lowContrast; monitorsStatus.icon = ( - + ); } diff --git a/client/src/Pages/StatusPage/StatusPages/Components/StatusPagesTable/index.jsx b/client/src/Pages/StatusPage/StatusPages/Components/StatusPagesTable/index.jsx index 57f7235e6..9882239bd 100644 --- a/client/src/Pages/StatusPage/StatusPages/Components/StatusPagesTable/index.jsx +++ b/client/src/Pages/StatusPage/StatusPages/Components/StatusPagesTable/index.jsx @@ -48,7 +48,12 @@ const StatusPagesTable = ({ data }) => { }} > {content} - {row.isPublished && } + {row.isPublished && ( + + )} ); }, diff --git a/client/src/Pages/Uptime/Create/index.jsx b/client/src/Pages/Uptime/Create/index.jsx index 70be3bc00..b1460dba6 100644 --- a/client/src/Pages/Uptime/Create/index.jsx +++ b/client/src/Pages/Uptime/Create/index.jsx @@ -426,7 +426,17 @@ const UptimeCreate = ({ isClone = false }) => { color="secondary" loading={isBusy} startIcon={ - monitor?.isActive ? : + monitor?.isActive ? ( + + ) : ( + + ) } onClick={handlePause} > diff --git a/client/src/Pages/Uptime/Details/Components/ChartBoxes/index.jsx b/client/src/Pages/Uptime/Details/Components/ChartBoxes/index.jsx index 6449946f3..b8496f5ea 100644 --- a/client/src/Pages/Uptime/Details/Components/ChartBoxes/index.jsx +++ b/client/src/Pages/Uptime/Details/Components/ChartBoxes/index.jsx @@ -36,7 +36,12 @@ const ChartBoxes = ({ gap={theme.spacing(8)} > } + icon={ + + } header="Uptime" isEmpty={monitorData?.groupedUpChecks?.length === 0} > @@ -87,7 +92,12 @@ const ChartBoxes = ({ /> } + icon={ + + } header="Incidents" noDataMessage={noIncidentsMessage} isEmpty={monitorData?.groupedDownChecks?.length === 0} @@ -121,7 +131,12 @@ const ChartBoxes = ({ /> } + icon={ + + } header="Average Response Time" > diff --git a/client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx b/client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx index 365324b4d..7e7a940e0 100644 --- a/client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx +++ b/client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx @@ -11,7 +11,12 @@ const ResponseTImeChart = ({ isLoading = false, groupedChecks = [], dateRange }) return ( } + icon={ + + } header="Response Times" > } + icon={ + + } header="Response Times" height="100%" > diff --git a/client/src/Pages/Uptime/Monitors/Components/Filter/index.jsx b/client/src/Pages/Uptime/Monitors/Components/Filter/index.jsx index 003617046..62ba0be13 100644 --- a/client/src/Pages/Uptime/Monitors/Components/Filter/index.jsx +++ b/client/src/Pages/Uptime/Monitors/Components/Filter/index.jsx @@ -131,7 +131,12 @@ const Filter = ({ color={theme.palette.primary.contrastText} onClick={handleReset} variant="contained" - endIcon={} + endIcon={ + + } sx={{ visibility: isFilterActive ? "visible" : "hidden", }} diff --git a/client/src/Pages/Uptime/Monitors/Components/StatusBoxes/statusBox.jsx b/client/src/Pages/Uptime/Monitors/Components/StatusBoxes/statusBox.jsx index ee9a5d037..136c3575d 100644 --- a/client/src/Pages/Uptime/Monitors/Components/StatusBoxes/statusBox.jsx +++ b/client/src/Pages/Uptime/Monitors/Components/StatusBoxes/statusBox.jsx @@ -19,21 +19,30 @@ const StatusBox = ({ title, value, status }) => { color = theme.palette.success.lowContrast; icon = ( - + ); } else if (status === "down") { color = theme.palette.error.lowContrast; icon = ( - + ); } else if (status === "paused") { color = theme.palette.warning.lowContrast; icon = ( - + ); } diff --git a/client/src/Pages/Uptime/Monitors/Components/UptimeDataTable/index.jsx b/client/src/Pages/Uptime/Monitors/Components/UptimeDataTable/index.jsx index 43a467405..8c3239dd3 100644 --- a/client/src/Pages/Uptime/Monitors/Components/UptimeDataTable/index.jsx +++ b/client/src/Pages/Uptime/Monitors/Components/UptimeDataTable/index.jsx @@ -91,9 +91,15 @@ const UptimeDataTable = ({ }} > {sort?.order === "asc" ? ( - + ) : ( - + )} @@ -127,9 +133,15 @@ const UptimeDataTable = ({ }} > {sort?.order === "asc" ? ( - + ) : ( - + )}