From 25256367e706b611ed6e6c399b0b2fb8c672710c Mon Sep 17 00:00:00 2001
From: Kyle Johnson <kyle@solidstategroup.com>
Date: Tue, 9 Jul 2024 18:05:24 +0100
Subject: [PATCH] fix: version diff overflow (#4313)

---
 frontend/web/components/diff/DiffFeature.tsx  | 2 +-
 frontend/web/components/diff/DiffSegments.tsx | 2 +-
 frontend/web/components/diff/DiffString.tsx   | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/web/components/diff/DiffFeature.tsx b/frontend/web/components/diff/DiffFeature.tsx
index c6563564f71b..d4e0475906ff 100644
--- a/frontend/web/components/diff/DiffFeature.tsx
+++ b/frontend/web/components/diff/DiffFeature.tsx
@@ -109,7 +109,7 @@ const DiffFeature: FC<FeatureDiffType> = ({
                   </div>
                   <div className='flex-row pt-4 list-item list-item-sm'>
                     {!hideValue && (
-                      <div className='table-column flex flex-1'>
+                      <div className='table-column flex flex-1 overflow-hidden'>
                         <div>
                           <DiffString
                             data-test={'version-value'}
diff --git a/frontend/web/components/diff/DiffSegments.tsx b/frontend/web/components/diff/DiffSegments.tsx
index 39fd2727172f..7cd098ec232c 100644
--- a/frontend/web/components/diff/DiffSegments.tsx
+++ b/frontend/web/components/diff/DiffSegments.tsx
@@ -24,7 +24,7 @@ const DiffSegment: FC<DiffSegment> = ({ diff }) => {
           newValue={diff.deleted ? diff.oldPriority : diff.newPriority}
         />
       </div>
-      <div className='table-column flex-fill'>
+      <div className='table-column flex-1 overflow-hidden'>
         <DiffString
           oldValue={diff.created ? diff.newValue : diff.oldValue}
           newValue={diff.deleted ? diff.oldValue : diff.newValue}
diff --git a/frontend/web/components/diff/DiffString.tsx b/frontend/web/components/diff/DiffString.tsx
index 66bfcbe19b6d..3bed8ccd7393 100644
--- a/frontend/web/components/diff/DiffString.tsx
+++ b/frontend/web/components/diff/DiffString.tsx
@@ -37,7 +37,7 @@ const DiffString: FC<DiffType> = ({
       return null
     }
     return (
-      <div className='react-diff react-diff-line d-flex align-items-center'>
+      <div className='react-diff overflow-auto react-diff-line d-flex align-items-center'>
         <pre
           className='d-inline'
           dangerouslySetInnerHTML={{