From f74b12adb8c62db0e31e09dafafa65ef56941ec6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9my=20M?= <jeremy.magrin@gmail.com>
Date: Thu, 16 Jan 2025 11:15:03 +0100
Subject: [PATCH] fix: group by disabled in dark mode wrong color (#9662)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

<img width="255" alt="Screenshot 2025-01-16 at 10 51 50 AM"
src="https://github.com/user-attachments/assets/c171401e-6c19-42f1-975b-fdb33b0a0789"
/>
---
 .../internals/components/StyledMenuItemBase.tsx          | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx b/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx
index 4517b3554..97f489f41 100644
--- a/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx
@@ -41,11 +41,7 @@ export const StyledMenuItemBase = styled.div<MenuItemBaseProps>`
     (disabled || isHoverBackgroundDisabled) ?? HOVER_BACKGROUND};
 
   ${({ theme, accent, disabled }) => {
-    if (!isUndefined(disabled) && disabled !== false) {
-      return css`
-        opacity: 0.4;
-      `;
-    }
+    const isDisabled = !isUndefined(disabled) && disabled !== false;
 
     switch (accent) {
       case 'danger': {
@@ -54,17 +50,20 @@ export const StyledMenuItemBase = styled.div<MenuItemBaseProps>`
           &:hover {
             background: ${theme.background.transparent.danger};
           }
+          ${isDisabled && `opacity: 0.4;`}
         `;
       }
       case 'placeholder': {
         return css`
           color: ${theme.font.color.tertiary};
+          ${isDisabled && `opacity: 0.4;`}
         `;
       }
       case 'default':
       default: {
         return css`
           color: ${theme.font.color.secondary};
+          ${isDisabled && `opacity: 0.4;`}
         `;
       }
     }