From ea589d6be43dc9e31d03358f215064c27bf8be7d Mon Sep 17 00:00:00 2001
From: gorkem-bwl <gorkem.cetin@bluewavelabs.ca>
Date: Thu, 22 Jan 2026 12:27:18 -0500
Subject: [PATCH 1/3] fix: sidebar and body background not adapting to light
 mode

## Changes

### Sidebar
- Remove hardcoded `backgroundColor: "#000000"`
- Use `theme.palette.background.main` for dynamic theming
- Update border color to use `theme.palette.border.light`

### Body Background
- Remove hardcoded `background-color: #000000` from index.css
- Add GlobalStyles in App.jsx to apply theme background to body element

## Benefits
- Sidebar now properly displays in light mode
- Body background adapts correctly to theme changes
- Consistent theming across light and dark modes
---
 client/src/App.jsx                         | 11 ++++++++++-
 client/src/Components/v1/Sidebar/index.jsx |  4 ++--
 client/src/index.css                       |  1 -
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/client/src/App.jsx b/client/src/App.jsx
index d21850ebb..af2f6c11c 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -22,9 +22,18 @@ function App() {
 		};
 	}, []);
 
+	const theme = mode === "light" ? lightTheme : darkTheme;
+
 	return (
-		<ThemeProvider theme={mode === "light" ? lightTheme : darkTheme}>
+		<ThemeProvider theme={theme}>
 			<CssBaseline />
+			<GlobalStyles
+				styles={{
+					body: {
+						backgroundColor: theme.palette.background.main,
+					},
+				}}
+			/>
 			<AppLayout>
 				<Routes />
 			</AppLayout>
diff --git a/client/src/Components/v1/Sidebar/index.jsx b/client/src/Components/v1/Sidebar/index.jsx
index 06caede5a..a0959850d 100644
--- a/client/src/Components/v1/Sidebar/index.jsx
+++ b/client/src/Components/v1/Sidebar/index.jsx
@@ -84,8 +84,8 @@ const Sidebar = () => {
 			gap={theme.spacing(6)}
 			sx={{
 				transition,
-				backgroundColor: "#000000",
-				borderRight: "1px solid #344054",
+				backgroundColor: theme.palette.background.main,
+				borderRight: `1px solid ${theme.palette.border.light}`,
 				zIndex: 1000,
 			}}
 		>
diff --git a/client/src/index.css b/client/src/index.css
index b29c17960..8b2a1cfce 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -6,7 +6,6 @@
 
 html,
 body {
-	background-color: #000000;
 	overscroll-behavior: none;
 }
 

From 7441169a0ec64bfec3c5a105d735f06b31205be4 Mon Sep 17 00:00:00 2001
From: Br0wnHammer <kumararyaman26@gmail.com>
Date: Fri, 23 Jan 2026 00:47:57 +0530
Subject: [PATCH 2/3] Fix: Incident Detail UI Layout

---
 .../Components/IncidentDetailsModal/index.jsx | 35 +++++++++++--------
 1 file changed, 20 insertions(+), 15 deletions(-)

diff --git a/client/src/Pages/Incidents/Components/IncidentDetailsModal/index.jsx b/client/src/Pages/Incidents/Components/IncidentDetailsModal/index.jsx
index 05d296b4a..f198c5c18 100644
--- a/client/src/Pages/Incidents/Components/IncidentDetailsModal/index.jsx
+++ b/client/src/Pages/Incidents/Components/IncidentDetailsModal/index.jsx
@@ -318,21 +318,14 @@ const IncidentDetailsModal = ({ open, incidentId, onClose, onResolved }) => {
 													value={toCapitalLetter(incident?.resolutionType) || "-"}
 												/>
 												{incident?.resolutionType === "manual" && (
-													<>
-														<KeyValueRow
-															label={t("incidentsPage.resolvedBy")}
-															value={incident?.resolvedBy?.email || "Unknown"}
-														/>
-
-														<KeyValueRow
-															label={t("incidentsPage.comment")}
-															value={
-																incident?.comment?.trim()
-																	? incident.comment
-																	: t("incidentsPage.noCommentProvided")
-															}
-														/>
-													</>
+													<KeyValueRow
+														label={t("incidentsPage.comment")}
+														value={
+															incident?.comment?.trim()
+																? incident.comment
+																: t("incidentsPage.noCommentProvided")
+														}
+													/>
 												)}
 											</>
 										)}
@@ -359,6 +352,18 @@ const IncidentDetailsModal = ({ open, incidentId, onClose, onResolved }) => {
 				sx={{ maxHeight: "70vh", overflowY: "auto", pr: 1 }}
 			>
 				{renderContent()}
+				{!isActive &&
+					incident?.resolutionType === "manual" &&
+					incident?.resolvedBy?.email && (
+						<Typography
+							variant="body2"
+							sx={{
+								fontStyle: "italic",
+							}}
+						>
+							{t("incidentsPage.resolvedBy")}: {incident.resolvedBy.email}
+						</Typography>
+					)}
 				<Stack
 					direction="row"
 					justifyContent="flex-end"

From 0c04c06781f56e983549cbcda723a0b8d24adbe0 Mon Sep 17 00:00:00 2001
From: mannilakash <mannilakash@gmail.com>
Date: Thu, 22 Jan 2026 14:48:11 -0500
Subject: [PATCH 3/3] fix: sidebar border color changes based on theme
 (primary->lowContrast color)

---
 client/src/Components/v1/Sidebar/index.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/Components/v1/Sidebar/index.jsx b/client/src/Components/v1/Sidebar/index.jsx
index a0959850d..763a4123c 100644
--- a/client/src/Components/v1/Sidebar/index.jsx
+++ b/client/src/Components/v1/Sidebar/index.jsx
@@ -85,7 +85,7 @@ const Sidebar = () => {
 			sx={{
 				transition,
 				backgroundColor: theme.palette.background.main,
-				borderRight: `1px solid ${theme.palette.border.light}`,
+				borderRight: `1px solid ${theme.palette.primary.lowContrast}`,
 				zIndex: 1000,
 			}}
 		>