From 548597bfd0ccf3b994fa2baceed893744ff5e15f Mon Sep 17 00:00:00 2001
From: Antoine Moreaux <moreaux.antoine@gmail.com>
Date: Thu, 20 Mar 2025 12:38:10 +0100
Subject: [PATCH] refactor(ui): simplify workspace dropdown component structure
 (#11040)

Reorganized the workspace dropdown rendering logic for improved
readability and maintainability. Ensured consistent handling of
separators and dropdown items, while preserving the existing
functionality.

Fix #11034
---
 ...ultiWorkspaceDropdownDefaultComponents.tsx | 72 ++++++++++---------
 1 file changed, 40 insertions(+), 32 deletions(-)

diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx
index 37c820e67..ba6163518 100644
--- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx
@@ -127,41 +127,49 @@ export const MultiWorkspaceDropdownDefaultComponents = () => {
       >
         {currentWorkspace?.displayName}
       </DropdownMenuHeader>
-      <StyledDropdownMenuItemsContainer>
-        {workspaces
-          .filter(({ id }) => id !== currentWorkspace?.id)
-          .slice(0, 3)
-          .map((workspace) => (
-            <UndecoratedLink
-              key={workspace.id}
-              to={buildWorkspaceUrl(getWorkspaceUrl(workspace.workspaceUrls))}
-              onClick={(event) => {
-                event?.preventDefault();
-                handleChange(workspace);
-              }}
-            >
-              <MenuItemSelectAvatar
-                text={workspace.displayName ?? '(No name)'}
-                avatar={
-                  <Avatar
-                    placeholder={workspace.displayName || ''}
-                    avatarUrl={workspace.logo ?? DEFAULT_WORKSPACE_LOGO}
+      {workspaces.length > 1 && (
+        <>
+          <StyledDropdownMenuItemsContainer>
+            {workspaces
+              .filter(({ id }) => id !== currentWorkspace?.id)
+              .slice(0, 3)
+              .map((workspace) => (
+                <UndecoratedLink
+                  key={workspace.id}
+                  to={buildWorkspaceUrl(
+                    getWorkspaceUrl(workspace.workspaceUrls),
+                  )}
+                  onClick={(event) => {
+                    event?.preventDefault();
+                    handleChange(workspace);
+                  }}
+                >
+                  <MenuItemSelectAvatar
+                    text={workspace.displayName ?? '(No name)'}
+                    avatar={
+                      <Avatar
+                        placeholder={workspace.displayName || ''}
+                        avatarUrl={workspace.logo ?? DEFAULT_WORKSPACE_LOGO}
+                      />
+                    }
+                    selected={false}
                   />
+                </UndecoratedLink>
+              ))}
+            {workspaces.length > 4 && (
+              <MenuItem
+                LeftIcon={IconSwitchHorizontal}
+                text={t`Other workspaces`}
+                onClick={() =>
+                  setMultiWorkspaceDropdownState('workspaces-list')
                 }
-                selected={false}
+                hasSubMenu={true}
               />
-            </UndecoratedLink>
-          ))}
-        {workspaces.length > 4 && (
-          <MenuItem
-            LeftIcon={IconSwitchHorizontal}
-            text={t`Other workspaces`}
-            onClick={() => setMultiWorkspaceDropdownState('workspaces-list')}
-            hasSubMenu={true}
-          />
-        )}
-      </StyledDropdownMenuItemsContainer>
-      {workspaces.length > 1 && <DropdownMenuSeparator />}
+            )}
+          </StyledDropdownMenuItemsContainer>
+          <DropdownMenuSeparator />
+        </>
+      )}
       <StyledDropdownMenuItemsContainer>
         <MenuItem
           LeftIcon={colorSchemeList.find(({ id }) => id === colorScheme)?.icon}