Made maxwidth to be default 100% and if the number is provided then we truncate.

src/Components/Inputs/Select/index.jsx

@@ -50,7 +50,7 @@ const Select = ({
 	sx,
 	name = "",
 	labelControlSpacing = 2,
-	maxWidthValue = 250,
+	maxWidth,
 }) => {
 	const theme = useTheme();
 	const itemStyles = {
@@ -60,6 +60,13 @@ const Select = ({
 		margin: theme.spacing(2),
 	};
 
+	const responsiveMaxWidth = {
+		xs: `${maxWidth * 0.5}px`,
+		sm: `${maxWidth * 0.75}px`,
+		md: `${maxWidth * 0.9}px`,
+		lg: `${maxWidth}px`,
+	};
+
 	return (
 		<Stack
 			gap={theme.spacing(labelControlSpacing)}
@@ -88,12 +95,7 @@ const Select = ({
 				sx={{
 					fontSize: 13,
 					minWidth: "125px",
-					maxWidth: {
-						xs: `${maxWidthValue * 0.5}px`,
-						sm: `${maxWidthValue * 0.75}px`,
-						md: `${maxWidthValue * 0.9}px`,
-						lg: `${maxWidthValue}`,
-					},
+					...(maxWidth && { maxWidth: responsiveMaxWidth }),
 					"& fieldset": {
 						borderRadius: theme.shape.borderRadius,
 						borderColor: theme.palette.primary.lowContrast,
@@ -169,7 +171,7 @@ Select.propTypes = {
 	onBlur: PropTypes.func,
 	sx: PropTypes.object,
 	labelControlSpacing: PropTypes.number,
-	maxWidthValue: PropTypes.number,
+	maxWidth: PropTypes.number,
 };
 
 export default Select;

src/Pages/Incidents/Components/OptionsHeader/index.jsx

@@ -52,6 +52,7 @@ const OptionsHeader = ({
 						backgroundColor: theme.palette.primary.main,
 						color: theme.palette.primary.contrastTextSecondary,
 					}}
+					maxWidth={250}
 				/>
 			</Stack>
 			<Stack {...stackStyles}>