From 5e5daef49ad3dc44bc7291f0dd375d513a7920e0 Mon Sep 17 00:00:00 2001
From: gorkem-bwl <gorkem.cetin@bluewavelabs.ca>
Date: Fri, 15 Aug 2025 03:38:22 -0400
Subject: [PATCH] Move vertical alignment styling from component to theme level

- Move MuiSelect vertical alignment from FilterHeader component to globalTheme.js
- Ensures consistent vertical alignment for all Select components application-wide
- Removes component-specific styling in favor of theme-level consistency
- Addresses reviewer feedback to make this a theme-level change

Components already with custom Select styling will continue to work as local styles override theme styles.
---
 client/src/Components/FilterHeader/index.jsx | 6 ------
 client/src/Utils/Theme/globalTheme.js        | 4 ++++
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/client/src/Components/FilterHeader/index.jsx b/client/src/Components/FilterHeader/index.jsx
index 5327dcd02..36dd04081 100644
--- a/client/src/Components/FilterHeader/index.jsx
+++ b/client/src/Components/FilterHeader/index.jsx
@@ -37,12 +37,6 @@ const FilterHeader = ({ header, options, value, onChange, multiple = true }) =>
 				displayEmpty
 				value={controlledValue}
 				onChange={onChange}
-				sx={{
-					"& .MuiSelect-select": {
-						display: "flex",
-						alignItems: "center",
-					},
-				}}
 				renderValue={(selected) => {
 					if (!selected?.length) {
 						return header;
diff --git a/client/src/Utils/Theme/globalTheme.js b/client/src/Utils/Theme/globalTheme.js
index ce58153ec..bda415c90 100644
--- a/client/src/Utils/Theme/globalTheme.js
+++ b/client/src/Utils/Theme/globalTheme.js
@@ -564,6 +564,10 @@ const baseTheme = (palette) => ({
 					"& .MuiSelect-icon": {
 						color: theme.palette.primary.contrastTextSecondary, // Dropdown + color
 					},
+					"& .MuiSelect-select": {
+						display: "flex",
+						alignItems: "center",
+					},
 					"&:hover": {
 						backgroundColor: theme.palette.primary.main, // Background on hover
 					},