From bcf4e5047a189ffd45b9c6cd0ef04a6d81b7bc7b Mon Sep 17 00:00:00 2001
From: James Ritchie <james@trigger.dev>
Date: Mon, 7 Apr 2025 15:58:26 +0100
Subject: [PATCH] Fix for long file names wrapping instead of truncating on the
 RunTimeline

---
 apps/webapp/app/components/run/RunTimeline.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/apps/webapp/app/components/run/RunTimeline.tsx b/apps/webapp/app/components/run/RunTimeline.tsx
index 27a19e9640..3933e11b56 100644
--- a/apps/webapp/app/components/run/RunTimeline.tsx
+++ b/apps/webapp/app/components/run/RunTimeline.tsx
@@ -345,11 +345,11 @@ export function RunTimelineEvent({
       <div className="relative flex flex-col items-center justify-center">
         <EventMarker variant={variant} state={state} style={style} />
       </div>
-      <div className="flex items-baseline justify-between gap-3">
+      <div className="flex min-w-0 items-baseline justify-between gap-3">
         <TooltipProvider disableHoverableContent>
           <Tooltip>
-            <TooltipTrigger className="cursor-default">
-              <span className="font-medium text-text-bright">{title}</span>
+            <TooltipTrigger className="min-w-0 max-w-full cursor-default text-left">
+              <div className="truncate font-medium text-text-bright">{title}</div>
             </TooltipTrigger>
             {helpText && (
               <TooltipContent className="flex items-center gap-1 text-xs">
@@ -359,7 +359,9 @@ export function RunTimelineEvent({
           </Tooltip>
         </TooltipProvider>
         {subtitle ? (
-          <span className="text-xs tabular-nums text-text-dimmed">{subtitle}</span>
+          <span className="whitespace-nowrap text-xs tabular-nums text-text-dimmed">
+            {subtitle}
+          </span>
         ) : null}
       </div>
     </div>