From 373486e449480b65f85d735f3431e79801fc4ff6 Mon Sep 17 00:00:00 2001
From: logonoff <git@logonoff.co>
Date: Mon, 30 Jun 2025 20:05:03 -0400
Subject: [PATCH] fix(theme): add focused `MenuItem` background colour

Signed-off-by: logonoff <git@logonoff.co>
---
 .changeset/strong-emus-drive.md                 |  5 +++++
 packages/theme/src/v5/defaultComponentThemes.ts | 10 ++++++++++
 2 files changed, 15 insertions(+)
 create mode 100644 .changeset/strong-emus-drive.md

diff --git a/.changeset/strong-emus-drive.md b/.changeset/strong-emus-drive.md
new file mode 100644
index 0000000000..00a9786354
--- /dev/null
+++ b/.changeset/strong-emus-drive.md
@@ -0,0 +1,5 @@
+---
+'@backstage/theme': patch
+---
+
+Add a different background colour to focused `MenuItem`s to fix a bug in MUI 4 (which is fixed in MUI 5)
diff --git a/packages/theme/src/v5/defaultComponentThemes.ts b/packages/theme/src/v5/defaultComponentThemes.ts
index 1d07c318a0..d627ecdcb7 100644
--- a/packages/theme/src/v5/defaultComponentThemes.ts
+++ b/packages/theme/src/v5/defaultComponentThemes.ts
@@ -269,4 +269,14 @@ export const defaultComponentThemes: ThemeOptions['components'] = {
   MuiPaper: {
     styleOverrides: { root: { backgroundImage: 'unset' } },
   },
+  MuiMenuItem: {
+    styleOverrides: {
+      root: ({ theme }) => ({
+        // Fixes a bug with MUI 4 that's fixed in MUI 5
+        '&:focus': {
+          backgroundColor: theme.palette.action.focus,
+        },
+      }),
+    },
+  },
 };