diff --git a/Client/src/Components/Inputs/Checkbox/index.jsx b/Client/src/Components/Inputs/Checkbox/index.jsx
index 3d10914c6..054f43b92 100644
--- a/Client/src/Components/Inputs/Checkbox/index.jsx
+++ b/Client/src/Components/Inputs/Checkbox/index.jsx
@@ -3,31 +3,47 @@ import { FormControlLabel, Checkbox as MuiCheckbox } from "@mui/material";
import { useTheme } from "@emotion/react";
import CheckboxOutline from "../../../assets/icons/checkbox-outline.svg?react";
import CheckboxFilled from "../../../assets/icons/checkbox-filled.svg?react";
-
import "./index.css";
/**
- * @param {Object} props
- * @param {string} props.id - The id attribute for the checkbox input.
- * @param {string} props.label - The label to display next to the checkbox.
- * @param {('small' | 'medium' | 'large')} - The size of the checkbox.
- * @param {boolean} props.isChecked - Whether the checkbox is checked or not.
- * @param {string} [props.value] - The value of the checkbox input.
- * @param {function} [props.onChange] - The function to call when the checkbox value changes.
- * @param {boolean} [props.isDisabled] - Whether the checkbox is disabled or not.
+ * Checkbox Component
*
- * @returns {JSX.Element}
+ * A customized checkbox component using Material-UI that supports custom sizing,
+ * disabled states, and custom icons.
+ *
+ * @component
+ * @param {Object} props - Component properties
+ * @param {string} props.id - Unique identifier for the checkbox input
+ * @param {string} [props.name] - Optional name attribute for the checkbox
+ * @param {(string|React.ReactNode)} props.label - Label text or node for the checkbox
+ * @param {('small'|'medium'|'large')} [props.size='medium'] - Size of the checkbox icon
+ * @param {boolean} props.isChecked - Current checked state of the checkbox
+ * @param {string} [props.value] - Optional value associated with the checkbox
+ * @param {Function} [props.onChange] - Callback function triggered when checkbox state changes
+ * @param {boolean} [props.isDisabled] - Determines if the checkbox is disabled
+ *
+ * @returns {React.ReactElement} Rendered Checkbox component
*
* @example
+ * // Basic usage
*
+ *
+ * @example
+ * // With custom size and disabled state
+ *
*/
-
const Checkbox = ({
id,
name,
diff --git a/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx b/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx
index e87d46de3..3220582a8 100644
--- a/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx
+++ b/Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx
@@ -13,15 +13,17 @@ import PropTypes from "prop-types";
* @component
* @param {Object} props - Component properties
* @param {string} [props.checkboxId] - Optional unique identifier for the checkbox
+ * @param {string} [props.checkboxName] - Optional name attribute for the checkbox
* @param {string} props.checkboxLabel - Label text for the checkbox
* @param {boolean} props.isChecked - Current checked state of the checkbox
* @param {Function} props.onCheckboxChange - Callback function when checkbox is toggled
* @param {string} props.fieldId - Unique identifier for the input field
+ * @param {string} [props.fieldName] - Optional name attribute for the input field
* @param {string} props.fieldValue - Current value of the input field
* @param {Function} props.onFieldChange - Callback function when input field value changes
* @param {Function} props.onFieldBlur - Callback function when input field loses focus
* @param {string} props.alertUnit - Unit label displayed next to the input field
- * @param {Object} props.errors - Object containing validation errors
+ * @param {Object} props.errors - Object containing validation errors for the field
* @param {Object} props.infrastructureMonitor - Infrastructure monitor configuration object
*
* @returns {React.ReactElement} Rendered CustomThreshold component
@@ -29,10 +31,12 @@ import PropTypes from "prop-types";
* @example
*