From d5acc24bb703feb204810bc6b75087cd99c815da Mon Sep 17 00:00:00 2001
From: Arun <184187559+carbonFibreCode@users.noreply.github.com>
Date: Mon, 12 Jan 2026 15:39:48 +0530
Subject: [PATCH] fix: removed scrollbar, elipsified overflow text supporting
 tooltip (#17078)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fixes #15152

Added CSS to ellipsify overflowing text with tooltip support, consistent
with existing dropdown implementations such as the address dropdown for
long country names.
This approach resolves the issue locally without modifying global
components, avoiding the limitations of previous attempts.

<img width="655" height="508" alt="Screenshot 2026-01-11 at 4 09 45 PM"
src="https://github.com/user-attachments/assets/3e11f6c2-3f13-4c1a-91da-59fc1a34e9dd"
/>


Before :

<img width="547" height="496" alt="Screenshot 2026-01-11 at 4 09 11 PM"
src="https://github.com/user-attachments/assets/43181d93-0603-4338-bb6e-688cffac91c9"
/>

After :

<img width="578" height="527" alt="Screenshot 2026-01-11 at 4 08 28 PM"
src="https://github.com/user-attachments/assets/0f277f3b-eeff-4866-99d9-6b31309c02af"
/>

---------

Co-authored-by: Arun kumar <arunkumar@Aruns-MacBook-Air.local>
Co-authored-by: Charles Bochet <charles@twenty.com>
---
 .../settings/components/SettingsMorphRelationMultiSelect.tsx    | 2 +-
 .../menu/menu-item/components/MenuItemMultiSelect.tsx           | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/twenty-front/src/modules/settings/components/SettingsMorphRelationMultiSelect.tsx b/packages/twenty-front/src/modules/settings/components/SettingsMorphRelationMultiSelect.tsx
index e80bb8a0d8..a860bf1f3a 100644
--- a/packages/twenty-front/src/modules/settings/components/SettingsMorphRelationMultiSelect.tsx
+++ b/packages/twenty-front/src/modules/settings/components/SettingsMorphRelationMultiSelect.tsx
@@ -259,7 +259,7 @@ export const SettingsMorphRelationMultiSelect = ({
                             onChange?.(newSelectedObjectMetadataIds);
                             onBlur?.();
                           }}
-                        />{' '}
+                        />
                       </SelectableListItem>
                     ))}
                   </SelectableList>
diff --git a/packages/twenty-ui/src/navigation/menu/menu-item/components/MenuItemMultiSelect.tsx b/packages/twenty-ui/src/navigation/menu/menu-item/components/MenuItemMultiSelect.tsx
index ec5bb0dc22..f16937eb47 100644
--- a/packages/twenty-ui/src/navigation/menu/menu-item/components/MenuItemMultiSelect.tsx
+++ b/packages/twenty-ui/src/navigation/menu/menu-item/components/MenuItemMultiSelect.tsx
@@ -12,6 +12,8 @@ const StyledLeftContentWithCheckboxContainer = styled.div`
   display: flex;
   flex-direction: row;
   gap: ${({ theme }) => theme.spacing(2)};
+  min-width: 0;
+  overflow: hidden;
 `;
 
 type MenuItemMultiSelectProps = {