fix(code): truncate text properly in tool call output (#1498)

## Problem

tool call output is not truncated properly, and overflows too far out of the container:

<!-- Who is this for and what problem does it solve? -->

<!-- Closes #ISSUE_ID -->

## ![Screenshot 2026-04-03 at 2.19.15 PM.png](https://app.graphite.com/user-attachments/assets/f1dd58f7-4ede-4dcb-94a8-2928614fcdd2.png)





## Changes

some claude css trickery to fix it

<!-- What did you change and why? -->

<!-- If there are frontend changes, include screenshots. -->

## How did you test this?

manually

<!-- Describe what you tested -- manual steps, automated tests, or both. -->

<!-- If you're an agent, only list tests you actually ran. -->

Author: adboio

apps/code/src/renderer/features/sessions/components/session-update/ExecuteToolView.tsx

@@ -55,7 +55,7 @@ export function ExecuteToolView({
       className={`group py-0.5 ${isExpandable ? "cursor-pointer" : ""}`}
       onClick={handleClick}
     >
-      <Flex gap="2">
+      <Flex gap="2" className="min-w-0">
         <Box className="shrink-0 pt-px">
           <ExpandableIcon
             icon={Terminal}
@@ -64,10 +64,10 @@ export function ExecuteToolView({
             isExpanded={isExpanded}
           />
         </Box>
-        <Flex align="center" gap="2" wrap="wrap">
+        <Flex align="center" gap="2" wrap="wrap" className="min-w-0">
           {description && <ToolTitle>{description}</ToolTitle>}
           {command && (
-            <ToolTitle className="truncate">
+            <ToolTitle className="min-w-0 truncate">
               <span className="font-mono text-accent-11" title={command}>
                 {truncateText(compactHomePath(command), MAX_COMMAND_LENGTH)}
               </span>

apps/code/src/renderer/features/sessions/components/session-update/FetchToolView.tsx

@@ -46,7 +46,7 @@ export function FetchToolView({
       <Flex
         align="center"
         gap="2"
-        className={`group py-0.5 ${isExpandable ? "cursor-pointer" : ""}`}
+        className={`group min-w-0 py-0.5 ${isExpandable ? "cursor-pointer" : ""}`}
         onClick={handleClick}
       >
         <ExpandableIcon

apps/code/src/renderer/features/sessions/components/session-update/ReadToolView.tsx

@@ -43,7 +43,7 @@ export function ReadToolView({
       <Flex
         align="center"
         gap="2"
-        className={`group py-0.5 ${isExpandable ? "cursor-pointer" : ""}`}
+        className={`group min-w-0 py-0.5 ${isExpandable ? "cursor-pointer" : ""}`}
         onClick={handleClick}
       >
         <ExpandableIcon

apps/code/src/renderer/features/sessions/components/session-update/SearchToolView.tsx

@@ -54,7 +54,7 @@ export function SearchToolView({
       <Flex
         align="center"
         gap="2"
-        className="group cursor-pointer py-0.5"
+        className="group min-w-0 cursor-pointer py-0.5"
         onClick={handleClick}
       >
         <ExpandableIcon
@@ -63,7 +63,7 @@ export function SearchToolView({
           isExpandable
           isExpanded={isExpanded}
         />
-        <ToolTitle className="truncate">
+        <ToolTitle className="min-w-0 truncate">
           <span className="font-mono">{title || "Search"}</span>
         </ToolTitle>
         <ToolTitle className="shrink-0 whitespace-nowrap">

apps/code/src/renderer/features/sessions/components/session-update/ToolCallView.tsx

@@ -98,7 +98,7 @@ export function ToolCallView({
       className={`group py-0.5 ${isExpandable ? "cursor-pointer" : ""}`}
       onClick={handleClick}
     >
-      <Flex gap="2">
+      <Flex gap="2" className="min-w-0">
         <Box className="shrink-0 pt-px">
           <ExpandableIcon
             icon={KindIcon}

apps/code/src/renderer/features/sessions/components/session-update/ToolRow.tsx

@@ -19,7 +19,7 @@ export function ToolRow({
   children,
 }: ToolRowProps) {
   return (
-    <Flex align="center" gap="2" className="py-0.5">
+    <Flex align="center" gap="2" className="min-w-0 py-0.5">
       <LoadingIcon icon={icon} isLoading={isLoading} />
       <ToolTitle>{children}</ToolTitle>
       <StatusIndicators isFailed={isFailed} wasCancelled={wasCancelled} />