From 039d471af7e25626a4624f34c78503907cc5a405 Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Sun, 2 Mar 2025 12:51:36 +0530
Subject: [PATCH 1/6] FIX-1847 implemented the logic.

---
 src/Components/Inputs/Select/index.jsx        | 15 +++++-
 .../Components/OptionsHeader/index.jsx        | 49 ++++++++++++-------
 src/Utils/Input/utils.jsx                     | 27 ++++++++++
 3 files changed, 72 insertions(+), 19 deletions(-)
 create mode 100644 src/Utils/Input/utils.jsx

diff --git a/src/Components/Inputs/Select/index.jsx b/src/Components/Inputs/Select/index.jsx
index f0a1d11c0..4be84b6e0 100644
--- a/src/Components/Inputs/Select/index.jsx
+++ b/src/Components/Inputs/Select/index.jsx
@@ -2,7 +2,7 @@ import PropTypes from "prop-types";
 import { useTheme } from "@emotion/react";
 import { MenuItem, Select as MuiSelect, Stack, Typography } from "@mui/material";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
-
+import { renderTruncatedValue } from "../../../Utils/Input/utils";
 import "./index.css";
 
 /**
@@ -50,8 +50,14 @@ const Select = ({
 	sx,
 	name = "",
 	labelControlSpacing = 2,
+	truncate = false,
+	maxTruncateLength = 15,
 }) => {
 	const theme = useTheme();
+
+	const selectedItem = items.find((item) => item._id === value);
+	const displayName = selectedItem ? selectedItem.name : "";
+
 	const itemStyles = {
 		fontSize: "var(--env-var-font-size-medium)",
 		color: theme.palette.primary.contrastTextTertiary,
@@ -59,6 +65,10 @@ const Select = ({
 		margin: theme.spacing(2),
 	};
 
+	const renderShortValue = () => {
+		return renderTruncatedValue(displayName, truncate, maxTruncateLength, placeholder);
+	};
+
 	return (
 		<Stack
 			gap={theme.spacing(labelControlSpacing)}
@@ -99,6 +109,7 @@ const Select = ({
 					},
 					...sx,
 				}}
+				renderValue={renderShortValue}
 			>
 				{placeholder && (
 					<MenuItem
@@ -146,6 +157,8 @@ Select.propTypes = {
 	onBlur: PropTypes.func,
 	sx: PropTypes.object,
 	labelControlSpacing: PropTypes.number,
+	truncate: PropTypes.bool, // New prop: enable/disable truncation
+	maxTruncateLength: PropTypes.number, // New prop: configurable length
 };
 
 export default Select;
diff --git a/src/Pages/Incidents/Components/OptionsHeader/index.jsx b/src/Pages/Incidents/Components/OptionsHeader/index.jsx
index 967acfed5..2e0db24c9 100644
--- a/src/Pages/Incidents/Components/OptionsHeader/index.jsx
+++ b/src/Pages/Incidents/Components/OptionsHeader/index.jsx
@@ -20,6 +20,14 @@ const OptionsHeader = ({
 	const theme = useTheme();
 	const monitorNames = typeof monitors !== "undefined" ? Object.values(monitors) : [];
 
+	// The stacks below which are three in number have the same style so
+	const stackStyles = {
+		direction: "row",
+		alignItems: "center",
+		gap: theme.spacing(6),
+		marginLeft: "5px",
+	};
+
 	if (!shouldRender) return <SkeletonLayout />;
 
 	return (
@@ -27,17 +35,13 @@ const OptionsHeader = ({
 			direction="row"
 			justifyContent="space-between"
 		>
-			<Stack
-				direction="row"
-				alignItems="center"
-				gap={theme.spacing(6)}
-			>
+			<Stack {...stackStyles}>
 				<Typography
 					display="inline-block"
 					component="h1"
 					color={theme.palette.primary.contrastTextSecondary}
 				>
-					Incidents for
+					Incidents for:
 				</Typography>
 				<Select
 					id="incidents-select-monitor"
@@ -49,13 +53,10 @@ const OptionsHeader = ({
 						backgroundColor: theme.palette.primary.main,
 						color: theme.palette.primary.contrastTextSecondary,
 					}}
+					truncate={true}
 				/>
 			</Stack>
-			<Stack
-				direction="row"
-				alignItems="center"
-				gap={theme.spacing(6)}
-			>
+			<Stack {...stackStyles}>
 				<Typography
 					display="inline-block"
 					component="h1"
@@ -66,7 +67,15 @@ const OptionsHeader = ({
 				<ButtonGroup
 					sx={{
 						ml: "auto",
-						"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
+						alignItems: "stretch",
+						"& .MuiButtonBase-root": {
+							whiteSpace: "nowrap",
+							height: "auto",
+							"&.MuiButton-group": {
+								borderColor: theme.palette.primary.lowContrast,
+							},
+						},
+						"& .MuiButtonBase-root:hover": {
 							borderColor: theme.palette.primary.lowContrast,
 						},
 					}}
@@ -94,11 +103,7 @@ const OptionsHeader = ({
 					</Button>
 				</ButtonGroup>
 			</Stack>
-			<Stack
-				direction="row"
-				alignItems="center"
-				gap={theme.spacing(6)}
-			>
+			<Stack {...stackStyles}>
 				<Typography
 					display="inline-block"
 					component="h1"
@@ -109,7 +114,15 @@ const OptionsHeader = ({
 				<ButtonGroup
 					sx={{
 						ml: "auto",
-						"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
+						alignItems: "stretch",
+						"& .MuiButtonBase-root": {
+							whiteSpace: "nowrap",
+							height: "auto",
+							"&.MuiButton-group": {
+								borderColor: theme.palette.primary.lowContrast,
+							},
+						},
+						"& .MuiButtonBase-root:hover": {
 							borderColor: theme.palette.primary.lowContrast,
 						},
 					}}
diff --git a/src/Utils/Input/utils.jsx b/src/Utils/Input/utils.jsx
new file mode 100644
index 000000000..3d567fe8d
--- /dev/null
+++ b/src/Utils/Input/utils.jsx
@@ -0,0 +1,27 @@
+/**
+ * Utility function to render a truncated value with an optional title.
+ * @param {string} value - The selected value (But this will always come as id).
+ * @param {array} items - The list of items to find the selected value from.
+ * @param {boolean} truncate - Whether to truncate the text or not.
+ * @param {number} maxLength - The maximum length of the text.
+ * @param {string} placeholder - Placeholder text if no value is selected.
+ * @returns {JSX.Element} - The JSX element for the rendered value.
+ */
+
+export const renderTruncatedValue = (displayName, truncate, maxLength, placeholder) => {
+	// If no value or the value is '0', return the placeholder
+	if (!displayName || displayName === "0") return placeholder;
+
+	// Function to truncate the text with a dotted end
+	const truncateTextWithDottedEnds = (text, maxLength) => {
+		if (!text || text.length <= maxLength) return text;
+		return `${text.substring(0, maxLength)}...`;
+	};
+
+	// If truncation is enabled, return the truncated text with a title for full value
+	return truncate ? (
+		<span title={displayName}>{truncateTextWithDottedEnds(displayName, maxLength)}</span>
+	) : (
+		displayName
+	);
+};

From 751e83f909c3f275c3778d97d13c1eccfba252a4 Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Tue, 4 Mar 2025 08:30:44 +0530
Subject: [PATCH 2/6] FIX-1847 incident page changes with respect to length and
 width.

---
 src/Components/Inputs/Select/index.jsx        |  2 +-
 .../Components/OptionsHeader/index.jsx        | 23 ++++-----------
 src/Utils/Input/utils.jsx                     | 28 +++++++++++++------
 3 files changed, 26 insertions(+), 27 deletions(-)

diff --git a/src/Components/Inputs/Select/index.jsx b/src/Components/Inputs/Select/index.jsx
index 4be84b6e0..49749f2ca 100644
--- a/src/Components/Inputs/Select/index.jsx
+++ b/src/Components/Inputs/Select/index.jsx
@@ -158,7 +158,7 @@ Select.propTypes = {
 	sx: PropTypes.object,
 	labelControlSpacing: PropTypes.number,
 	truncate: PropTypes.bool, // New prop: enable/disable truncation
-	maxTruncateLength: PropTypes.number, // New prop: configurable length
+	maxTruncateLength: PropTypes.number, // New prop: deafult is 15
 };
 
 export default Select;
diff --git a/src/Pages/Incidents/Components/OptionsHeader/index.jsx b/src/Pages/Incidents/Components/OptionsHeader/index.jsx
index 2e0db24c9..d61899d23 100644
--- a/src/Pages/Incidents/Components/OptionsHeader/index.jsx
+++ b/src/Pages/Incidents/Components/OptionsHeader/index.jsx
@@ -25,7 +25,6 @@ const OptionsHeader = ({
 		direction: "row",
 		alignItems: "center",
 		gap: theme.spacing(6),
-		marginLeft: "5px",
 	};
 
 	if (!shouldRender) return <SkeletonLayout />;
@@ -68,15 +67,10 @@ const OptionsHeader = ({
 					sx={{
 						ml: "auto",
 						alignItems: "stretch",
-						"& .MuiButtonBase-root": {
-							whiteSpace: "nowrap",
-							height: "auto",
-							"&.MuiButton-group": {
-								borderColor: theme.palette.primary.lowContrast,
-							},
-						},
-						"& .MuiButtonBase-root:hover": {
+						"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
 							borderColor: theme.palette.primary.lowContrast,
+							width: "auto",
+							whiteSpace: "nowrap",
 						},
 					}}
 				>
@@ -115,15 +109,10 @@ const OptionsHeader = ({
 					sx={{
 						ml: "auto",
 						alignItems: "stretch",
-						"& .MuiButtonBase-root": {
-							whiteSpace: "nowrap",
-							height: "auto",
-							"&.MuiButton-group": {
-								borderColor: theme.palette.primary.lowContrast,
-							},
-						},
-						"& .MuiButtonBase-root:hover": {
+						"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
 							borderColor: theme.palette.primary.lowContrast,
+							width: "auto",
+							whiteSpace: "nowrap",
 						},
 					}}
 				>
diff --git a/src/Utils/Input/utils.jsx b/src/Utils/Input/utils.jsx
index 3d567fe8d..f0cb75ac7 100644
--- a/src/Utils/Input/utils.jsx
+++ b/src/Utils/Input/utils.jsx
@@ -1,27 +1,37 @@
+import PropTypes from "prop-types";
+
 /**
  * Utility function to render a truncated value with an optional title.
- * @param {string} value - The selected value (But this will always come as id).
- * @param {array} items - The list of items to find the selected value from.
+ * @param {string} displayName - The name or text to display.
  * @param {boolean} truncate - Whether to truncate the text or not.
  * @param {number} maxLength - The maximum length of the text.
- * @param {string} placeholder - Placeholder text if no value is selected.
+ * @param {string} placeholder - Placeholder text if no value is provided.
  * @returns {JSX.Element} - The JSX element for the rendered value.
  */
 
-export const renderTruncatedValue = (displayName, truncate, maxLength, placeholder) => {
-	// If no value or the value is '0', return the placeholder
+export const renderTruncatedValue = function (
+	displayName,
+	truncate,
+	maxLength,
+	placeholder
+) {
 	if (!displayName || displayName === "0") return placeholder;
 
-	// Function to truncate the text with a dotted end
-	const truncateTextWithDottedEnds = (text, maxLength) => {
+	const truncateTextWithDottedEnds = function (text, maxLength) {
 		if (!text || text.length <= maxLength) return text;
 		return `${text.substring(0, maxLength)}...`;
 	};
 
-	// If truncation is enabled, return the truncated text with a title for full value
 	return truncate ? (
 		<span title={displayName}>{truncateTextWithDottedEnds(displayName, maxLength)}</span>
 	) : (
-		displayName
+		<span title={displayName}>{displayName}</span>
 	);
 };
+
+renderTruncatedValue.propTypes = {
+	displayName: PropTypes.string, // The name or text to display
+	truncate: PropTypes.bool, // Whether to truncate the text or not
+	maxLength: PropTypes.number, // The maximum length of the text
+	placeholder: PropTypes.string, // Placeholder text if no value is provided
+};

From 0eebd2929b17ec2438667e3ca93ba27d62c72eed Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Tue, 4 Mar 2025 09:00:37 +0530
Subject: [PATCH 3/6] FIX-1847 added methods in string utils in order to
 utilise in our code.

---
 src/Utils/Input/utils.jsx |  3 ++-
 src/Utils/stringUtils.js  | 47 +++++++++++++++++++++++++++------------
 2 files changed, 35 insertions(+), 15 deletions(-)

diff --git a/src/Utils/Input/utils.jsx b/src/Utils/Input/utils.jsx
index f0cb75ac7..f9a3b0137 100644
--- a/src/Utils/Input/utils.jsx
+++ b/src/Utils/Input/utils.jsx
@@ -1,4 +1,5 @@
 import PropTypes from "prop-types";
+import { isEmpty } from "../stringUtils";
 
 /**
  * Utility function to render a truncated value with an optional title.
@@ -15,7 +16,7 @@ export const renderTruncatedValue = function (
 	maxLength,
 	placeholder
 ) {
-	if (!displayName || displayName === "0") return placeholder;
+	if (isEmpty(displayName)) return placeholder;
 
 	const truncateTextWithDottedEnds = function (text, maxLength) {
 		if (!text || text.length <= maxLength) return text;
diff --git a/src/Utils/stringUtils.js b/src/Utils/stringUtils.js
index 0bf7aaf11..6693a420f 100644
--- a/src/Utils/stringUtils.js
+++ b/src/Utils/stringUtils.js
@@ -3,8 +3,8 @@
  * @param {string} str String whose first letter is to be capitalized
  * @returns A string with first letter capitalized
  */
-export const capitalizeFirstLetter = (str) => {	
-  if (str === null || str === undefined) {
+export const capitalizeFirstLetter = (str) => {
+	if (str === null || str === undefined) {
 		return "";
 	}
 	if (typeof str !== "string") {
@@ -12,7 +12,7 @@ export const capitalizeFirstLetter = (str) => {
 	}
 	if (str.length === 0) {
 		return "";
-	}  
+	}
 	return str.charAt(0).toUpperCase() + str.slice(1);
 };
 
@@ -22,15 +22,34 @@ export const capitalizeFirstLetter = (str) => {
  * @returns A string with first letter lower cased
  */
 
-export const toLowerCaseFirstLetter = (str) => {	
+export const toLowerCaseFirstLetter = (str) => {
 	if (str === null || str === undefined) {
-		  return "";
-	  }
-	  if (typeof str !== "string") {
-		  throw new TypeError("Input must be a string");
-	  }
-	  if (str.length === 0) {
-		  return "";
-	  }  
-	  return str.charAt(0).toLowerCase() + str.slice(1);
-  };
\ No newline at end of file
+		return "";
+	}
+	if (typeof str !== "string") {
+		throw new TypeError("Input must be a string");
+	}
+	if (str.length === 0) {
+		return "";
+	}
+	return str.charAt(0).toLowerCase() + str.slice(1);
+};
+
+/**
+ * Checks if a string is null, undefined, or empty (including strings with only whitespace).
+ * @param {string} str - The string to check.
+ * @returns {boolean} - Returns true if the string is null, undefined, or empty.
+ */
+export const isEmpty = (str) => {
+	// Check if string is null, undefined, or empty (including whitespace only)
+	return str === null || str === undefined || str.trim().length === 0;
+};
+
+/**
+ * Checks if a string is not null, undefined, and not empty (including strings with only whitespace).
+ * @param {string} str - The string to check.
+ * @returns {boolean} - Returns true if the string is not null, undefined, and not empty.
+ */
+export const isNotEmpty = (str) => {
+	return !isEmpty(str);
+};

From 4d437a889811488470d622c1ef857982ec85dfc6 Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Tue, 4 Mar 2025 13:36:42 +0530
Subject: [PATCH 4/6] FIX-1847 added all the changes and removed the truncate
 algo.

---
 src/Components/Inputs/Select/index.jsx        |  8 ----
 .../Components/OptionsHeader/index.jsx        | 24 +-----------
 src/Utils/Input/utils.jsx                     | 38 -------------------
 src/Utils/Theme/globalTheme.js                | 12 ++++++
 src/Utils/stringUtils.js                      | 11 +-----
 5 files changed, 15 insertions(+), 78 deletions(-)
 delete mode 100644 src/Utils/Input/utils.jsx

diff --git a/src/Components/Inputs/Select/index.jsx b/src/Components/Inputs/Select/index.jsx
index 49749f2ca..189ff360c 100644
--- a/src/Components/Inputs/Select/index.jsx
+++ b/src/Components/Inputs/Select/index.jsx
@@ -2,7 +2,6 @@ import PropTypes from "prop-types";
 import { useTheme } from "@emotion/react";
 import { MenuItem, Select as MuiSelect, Stack, Typography } from "@mui/material";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
-import { renderTruncatedValue } from "../../../Utils/Input/utils";
 import "./index.css";
 
 /**
@@ -50,8 +49,6 @@ const Select = ({
 	sx,
 	name = "",
 	labelControlSpacing = 2,
-	truncate = false,
-	maxTruncateLength = 15,
 }) => {
 	const theme = useTheme();
 
@@ -65,10 +62,6 @@ const Select = ({
 		margin: theme.spacing(2),
 	};
 
-	const renderShortValue = () => {
-		return renderTruncatedValue(displayName, truncate, maxTruncateLength, placeholder);
-	};
-
 	return (
 		<Stack
 			gap={theme.spacing(labelControlSpacing)}
@@ -109,7 +102,6 @@ const Select = ({
 					},
 					...sx,
 				}}
-				renderValue={renderShortValue}
 			>
 				{placeholder && (
 					<MenuItem
diff --git a/src/Pages/Incidents/Components/OptionsHeader/index.jsx b/src/Pages/Incidents/Components/OptionsHeader/index.jsx
index d61899d23..c3a15963d 100644
--- a/src/Pages/Incidents/Components/OptionsHeader/index.jsx
+++ b/src/Pages/Incidents/Components/OptionsHeader/index.jsx
@@ -63,17 +63,7 @@ const OptionsHeader = ({
 				>
 					Filter by:
 				</Typography>
-				<ButtonGroup
-					sx={{
-						ml: "auto",
-						alignItems: "stretch",
-						"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
-							borderColor: theme.palette.primary.lowContrast,
-							width: "auto",
-							whiteSpace: "nowrap",
-						},
-					}}
-				>
+				<ButtonGroup>
 					<Button
 						variant="group"
 						filled={(filter === "all").toString()}
@@ -105,17 +95,7 @@ const OptionsHeader = ({
 				>
 					Show:
 				</Typography>
-				<ButtonGroup
-					sx={{
-						ml: "auto",
-						alignItems: "stretch",
-						"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
-							borderColor: theme.palette.primary.lowContrast,
-							width: "auto",
-							whiteSpace: "nowrap",
-						},
-					}}
-				>
+				<ButtonGroup>
 					<Button
 						variant="group"
 						filled={(dateRange === "hour").toString()}
diff --git a/src/Utils/Input/utils.jsx b/src/Utils/Input/utils.jsx
deleted file mode 100644
index f9a3b0137..000000000
--- a/src/Utils/Input/utils.jsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import PropTypes from "prop-types";
-import { isEmpty } from "../stringUtils";
-
-/**
- * Utility function to render a truncated value with an optional title.
- * @param {string} displayName - The name or text to display.
- * @param {boolean} truncate - Whether to truncate the text or not.
- * @param {number} maxLength - The maximum length of the text.
- * @param {string} placeholder - Placeholder text if no value is provided.
- * @returns {JSX.Element} - The JSX element for the rendered value.
- */
-
-export const renderTruncatedValue = function (
-	displayName,
-	truncate,
-	maxLength,
-	placeholder
-) {
-	if (isEmpty(displayName)) return placeholder;
-
-	const truncateTextWithDottedEnds = function (text, maxLength) {
-		if (!text || text.length <= maxLength) return text;
-		return `${text.substring(0, maxLength)}...`;
-	};
-
-	return truncate ? (
-		<span title={displayName}>{truncateTextWithDottedEnds(displayName, maxLength)}</span>
-	) : (
-		<span title={displayName}>{displayName}</span>
-	);
-};
-
-renderTruncatedValue.propTypes = {
-	displayName: PropTypes.string, // The name or text to display
-	truncate: PropTypes.bool, // Whether to truncate the text or not
-	maxLength: PropTypes.number, // The maximum length of the text
-	placeholder: PropTypes.string, // Placeholder text if no value is provided
-};
diff --git a/src/Utils/Theme/globalTheme.js b/src/Utils/Theme/globalTheme.js
index 66631edec..3598af675 100644
--- a/src/Utils/Theme/globalTheme.js
+++ b/src/Utils/Theme/globalTheme.js
@@ -382,6 +382,18 @@ const baseTheme = (palette) => ({
 				}),
 			},
 		},
+		MuiButtonGroup: {
+			styleOverrides: {
+				root: ({ theme }) => ({
+					ml: "auto",
+					"& .MuiButtonBase-root, & .MuiButtonBase-root:hover": {
+						borderColor: theme.palette.primary.lowContrast,
+						width: "auto",
+						whiteSpace: "nowrap",
+					},
+				}),
+			},
+		},
 	},
 	shape: {
 		borderRadius: 2,
diff --git a/src/Utils/stringUtils.js b/src/Utils/stringUtils.js
index 6693a420f..bb62d0169 100644
--- a/src/Utils/stringUtils.js
+++ b/src/Utils/stringUtils.js
@@ -42,14 +42,5 @@ export const toLowerCaseFirstLetter = (str) => {
  */
 export const isEmpty = (str) => {
 	// Check if string is null, undefined, or empty (including whitespace only)
-	return str === null || str === undefined || str.trim().length === 0;
-};
-
-/**
- * Checks if a string is not null, undefined, and not empty (including strings with only whitespace).
- * @param {string} str - The string to check.
- * @returns {boolean} - Returns true if the string is not null, undefined, and not empty.
- */
-export const isNotEmpty = (str) => {
-	return !isEmpty(str);
+	return str === null || typeof str === "undefined" || str.trim().length === 0;
 };

From eafaa415eca2bafb77b5b938b0ea29a27de9612d Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Tue, 4 Mar 2025 13:38:52 +0530
Subject: [PATCH 5/6] Removed redundant code.

---
 src/Components/Inputs/Select/index.jsx | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/Components/Inputs/Select/index.jsx b/src/Components/Inputs/Select/index.jsx
index 189ff360c..9f128bd37 100644
--- a/src/Components/Inputs/Select/index.jsx
+++ b/src/Components/Inputs/Select/index.jsx
@@ -2,6 +2,7 @@ import PropTypes from "prop-types";
 import { useTheme } from "@emotion/react";
 import { MenuItem, Select as MuiSelect, Stack, Typography } from "@mui/material";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+
 import "./index.css";
 
 /**
@@ -52,9 +53,6 @@ const Select = ({
 }) => {
 	const theme = useTheme();
 
-	const selectedItem = items.find((item) => item._id === value);
-	const displayName = selectedItem ? selectedItem.name : "";
-
 	const itemStyles = {
 		fontSize: "var(--env-var-font-size-medium)",
 		color: theme.palette.primary.contrastTextTertiary,
@@ -149,8 +147,6 @@ Select.propTypes = {
 	onBlur: PropTypes.func,
 	sx: PropTypes.object,
 	labelControlSpacing: PropTypes.number,
-	truncate: PropTypes.bool, // New prop: enable/disable truncation
-	maxTruncateLength: PropTypes.number, // New prop: deafult is 15
 };
 
 export default Select;

From b49096cfe460e7034f0fa70877c780ad5f685816 Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Tue, 4 Mar 2025 13:39:48 +0530
Subject: [PATCH 6/6] Extra space removed.

---
 src/Components/Inputs/Select/index.jsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/Components/Inputs/Select/index.jsx b/src/Components/Inputs/Select/index.jsx
index 9f128bd37..f0a1d11c0 100644
--- a/src/Components/Inputs/Select/index.jsx
+++ b/src/Components/Inputs/Select/index.jsx
@@ -52,7 +52,6 @@ const Select = ({
 	labelControlSpacing = 2,
 }) => {
 	const theme = useTheme();
-
 	const itemStyles = {
 		fontSize: "var(--env-var-font-size-medium)",
 		color: theme.palette.primary.contrastTextTertiary,