Icon alignment in NavigationDrawerItems (#9164)

Icons are not aligned to the labels
before:
<img width="387" alt="Screenshot 2024-12-20 at 4 09 01 PM"
src="https://github.com/user-attachments/assets/c115abcd-9779-4597-b40e-6ceceeaa13b9"
/>

after: 

<img width="387" alt="Screenshot 2024-12-20 at 4 08 36 PM"
src="https://github.com/user-attachments/assets/a0535030-a810-4023-b677-8380b833f712"
/>

packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerItem.tsx

@@ -183,6 +183,9 @@ const StyledSpacer = styled.span`
 const StyledIcon = styled.div`
   flex-shrink: 0;
   flex-grow: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   margin-right: ${({ theme }) => theme.spacing(2)};
 `;
 
@@ -208,7 +211,6 @@ const visibleStateStyles = css`
 
 const StyledRightOptionsVisbility = styled.div<{
   isMobile: boolean;
-  active: boolean;
 }>`
   display: block;
   opacity: 0;
@@ -221,7 +223,7 @@ const StyledRightOptionsVisbility = styled.div<{
   height: 1px;
   width: 1px;
 
-  ${({ isMobile, active }) => (isMobile || active) && visibleStateStyles}
+  ${({ isMobile }) => isMobile && visibleStateStyles}
 
   .navigation-drawer-item:hover & {
     ${visibleStateStyles}
@@ -343,10 +345,7 @@ export const NavigationDrawerItem = ({
                   e.preventDefault();
                 }}
               >
-                <StyledRightOptionsVisbility
+                <StyledRightOptionsVisbility isMobile={isMobile}>
-                  isMobile={isMobile}
-                  active={active || false}
-                >
                   {rightOptions}
                 </StyledRightOptionsVisbility>
               </StyledRightOptionsContainer>