fix(design-system): fix menu item selection & focus state (#13807) (#13948)

Closes #13807

Demo Video: 


https://github.com/user-attachments/assets/27c94028-fe1b-4a65-800d-56eaad9599d6

---------

Co-authored-by: Weiko <corentin@twenty.com>

packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx

@@ -24,7 +24,7 @@ export const StyledMenuItemSelect = styled(StyledMenuItemBase)<{
       `;
     } else if (focused === true) {
       return css`
-        background: ${theme.background.transparent.light};
+        background: transparent;
       `;
     }
   }}

packages/twenty-ui/src/navigation/menu-item/components/__stories__/MenuItemSelect.stories.tsx

@@ -50,17 +50,17 @@ export const Catalog: CatalogStory<Story, typeof MenuItemSelect> = {
         },
         {
           name: 'states',
-          values: ['default', 'hover', 'selected', 'hover+selected'],
+          values: ['default', 'hover', 'focused', 'hover+focused'],
           props: (state: string) => {
             switch (state) {
               case 'default':
                 return {};
               case 'hover':
                 return { className: 'hover' };
-              case 'selected':
-                return { selected: true };
-              case 'hover+selected':
-                return { className: 'hover', selected: true };
+              case 'focused':
+                return { focused: true };
+              case 'hover+focused':
+                return { className: 'hover', focused: true };
               default:
                 return {};
             }