From b634057fdd0b4ccb3d414bd0e5dea15d7855b1b5 Mon Sep 17 00:00:00 2001
From: Dev <devanandgowda8@gmail.com>
Date: Wed, 24 Apr 2024 16:57:59 +0530
Subject: [PATCH] Fix ellipsis overflow causing edit icon to be hidden on links
 (#5071)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes #5064

### Demo


https://github.com/twentyhq/twenty/assets/21654351/28ab7374-c57e-4f7e-9720-05138c53a33d

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
---
 .../components/RecordInlineCellContainer.tsx               | 1 +
 .../modules/ui/navigation/link/components/RoundedLink.tsx  | 7 ++++++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellContainer.tsx b/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellContainer.tsx
index 49150429b..e3db9d710 100644
--- a/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellContainer.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellContainer.tsx
@@ -39,6 +39,7 @@ const StyledLabelAndIconContainer = styled.div`
 
 const StyledValueContainer = styled.div`
   display: flex;
+  min-width: 0;
 `;
 
 const StyledLabelContainer = styled.div<{ width?: number }>`
diff --git a/packages/twenty-front/src/modules/ui/navigation/link/components/RoundedLink.tsx b/packages/twenty-front/src/modules/ui/navigation/link/components/RoundedLink.tsx
index 1ca731459..32a2258c7 100644
--- a/packages/twenty-front/src/modules/ui/navigation/link/components/RoundedLink.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/link/components/RoundedLink.tsx
@@ -21,12 +21,17 @@ const StyledClickable = styled.div`
   }
 `;
 
+const StyledChip = styled(Chip)`
+  box-sizing: border-box;
+  padding: ${({ theme }) => theme.spacing(2)};
+`;
+
 export const RoundedLink = ({ children, href, onClick }: RoundedLinkProps) => (
   <div>
     {children !== '' ? (
       <StyledClickable>
         <ReactLink target="_blank" to={href} onClick={onClick}>
-          <Chip
+          <StyledChip
             label={`${children}`}
             variant={ChipVariant.Rounded}
             size={ChipSize.Small}