From 424df24bf39833c8f741789e6286009d4e3212fc Mon Sep 17 00:00:00 2001 From: vineet-channe Date: Thu, 7 Aug 2025 20:35:24 +0530 Subject: [PATCH 1/3] feat: Add yellow warning range (50-80%) for infrastructure monitors Fixes #2615 --- client/src/Components/Charts/CustomGauge/index.jsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/client/src/Components/Charts/CustomGauge/index.jsx b/client/src/Components/Charts/CustomGauge/index.jsx index d9718d72c..132cb4237 100644 --- a/client/src/Components/Charts/CustomGauge/index.jsx +++ b/client/src/Components/Charts/CustomGauge/index.jsx @@ -64,10 +64,14 @@ const CustomGauge = ({ const progressWithinRange = Math.max(MINIMUM_VALUE, Math.min(progress, MAXIMUM_VALUE)); - const fillColor = - progressWithinRange > threshold - ? theme.palette.error.lowContrast - : theme.palette.accent.main; + let fillColor; + if (progressWithinRange < 50) { + fillColor = theme.palette.success.main; + } else if (progressWithinRange < 80) { + fillColor = theme.palette.warning.lowContrast; + } else { + fillColor = theme.palette.error.lowContrast; + } if (isLoading) { return ( From dc8b0aed9f7c5424d34449a53f02fdd5b6d08d3f Mon Sep 17 00:00:00 2001 From: vineet-channe Date: Thu, 7 Aug 2025 20:46:15 +0530 Subject: [PATCH 2/3] chore: format CustomGauge with Prettier --- client/src/Components/Charts/CustomGauge/index.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/src/Components/Charts/CustomGauge/index.jsx b/client/src/Components/Charts/CustomGauge/index.jsx index 132cb4237..a79cba093 100644 --- a/client/src/Components/Charts/CustomGauge/index.jsx +++ b/client/src/Components/Charts/CustomGauge/index.jsx @@ -66,11 +66,11 @@ const CustomGauge = ({ let fillColor; if (progressWithinRange < 50) { - fillColor = theme.palette.success.main; + fillColor = theme.palette.success.main; } else if (progressWithinRange < 80) { - fillColor = theme.palette.warning.lowContrast; + fillColor = theme.palette.warning.lowContrast; } else { - fillColor = theme.palette.error.lowContrast; + fillColor = theme.palette.error.lowContrast; } if (isLoading) { From 10ad3397a3ce12277fa47eb3e4a7cb53e9514179 Mon Sep 17 00:00:00 2001 From: vineet-channe Date: Fri, 8 Aug 2025 03:03:23 +0530 Subject: [PATCH 3/3] docs(CustomGauge): remove threshold prop from documentation and usage example - Removed all references to the unused prop from the JSDoc and usage example in the CustomGauge component. - Ensured PropTypes and documentation accurately --- client/src/Components/Charts/CustomGauge/index.jsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/client/src/Components/Charts/CustomGauge/index.jsx b/client/src/Components/Charts/CustomGauge/index.jsx index a79cba093..614b3774c 100644 --- a/client/src/Components/Charts/CustomGauge/index.jsx +++ b/client/src/Components/Charts/CustomGauge/index.jsx @@ -17,7 +17,6 @@ const MAXIMUM_VALUE = 100; * @param {number} [props.progress=0] - Progress percentage (0-100) * @param {number} [props.radius=60] - Radius of the gauge circle * @param {number} [props.strokeWidth=15] - Width of the gauge stroke - * @param {number} [props.threshold=50] - Threshold for color change * @param {number} [props.precision=1] - Precision of the progress percentage * @param {string} [props.unit="%"] - Unit of progress * @@ -26,7 +25,6 @@ const MAXIMUM_VALUE = 100; * progress={75} * radius={50} * strokeWidth={10} - * threshold={50} * /> * * @returns {React.ReactElement} Rendered CustomGauge component @@ -36,7 +34,6 @@ const CustomGauge = ({ progress = 0, radius = 70, strokeWidth = 15, - threshold = 50, precision = 1, unit = "%", }) => { @@ -146,7 +143,6 @@ CustomGauge.propTypes = { progress: PropTypes.number, radius: PropTypes.number, strokeWidth: PropTypes.number, - threshold: PropTypes.number, precision: PropTypes.number, unit: PropTypes.string, };