fix: add tooltips to display full file paths on truncated text in chatview

Add tooltips that show the complete file path when hovering over truncated
file names in file editing/reading notices throughout the chat interface.

Changes:
- Add StandardTooltip components to file path displays in CodeAccordian,
ChatRow, and BatchFilePermission components
- Override default tooltip styles with `text-wrap` to prevent excessive
whitespace from text-balance behavior
- Use responsive max-width `max-w-[min(300px,100vw)]` to ensure tooltips
adapt to narrow panel widths and prevent content cutoff
- Leverage existing `break-words` CSS to allow natural line breaking at
path separators

The added tooltips:
- Display full file paths even when truncated in the UI
- Wrap text naturally at path separators without excessive whitespace
- Adapt responsively to panel width (max 300px on wide panels, 100vw on narrow)
- Maintain consistent behavior with other tooltips in the extension

Files modified:
- webview-ui/src/components/common/CodeAccordian.tsx
- webview-ui/src/components/chat/ChatRow.tsx
- webview-ui/src/components/chat/BatchFilePermission.tsx

Author: heyseth

webview-ui/src/components/chat/BatchFilePermission.tsx

@@ -3,6 +3,7 @@ import { memo } from "react"
 import { ToolUseBlock, ToolUseBlockHeader } from "../common/ToolUseBlock"
 import { vscode } from "@src/utils/vscode"
 import { removeLeadingNonAlphanumeric } from "@src/utils/removeLeadingNonAlphanumeric"
+import { StandardTooltip } from "../ui/standard-tooltip"
 
 interface FilePermissionItem {
 	path: string
@@ -35,10 +36,12 @@ export const BatchFilePermission = memo(({ files = [], onPermissionResponse, ts
 								<ToolUseBlockHeader
 									onClick={() => vscode.postMessage({ type: "openFile", text: file.content })}>
 									{file.path?.startsWith(".") && <span>.</span>}
-									<span className="whitespace-nowrap overflow-hidden text-ellipsis text-left mr-2 rtl">
-										{removeLeadingNonAlphanumeric(file.path ?? "") + "\u200E"}
-										{file.lineSnippet && ` ${file.lineSnippet}`}
-									</span>
+									<StandardTooltip content={file.path} side="top" align="start" className="text-wrap max-w-[min(300px,100vw)]">
+										<span className="whitespace-nowrap overflow-hidden text-ellipsis text-left mr-2 rtl">
+											{removeLeadingNonAlphanumeric(file.path ?? "") + "\u200E"}
+											{file.lineSnippet && ` ${file.lineSnippet}`}
+										</span>
+									</StandardTooltip>
 									<div className="flex-grow"></div>
 									<span className="codicon codicon-link-external text-[13.5px] my-[1px]" />
 								</ToolUseBlockHeader>

webview-ui/src/components/chat/ChatRow.tsx

@@ -63,6 +63,7 @@ import {
 	MessageCircle,
 } from "lucide-react"
 import { cn } from "@/lib/utils"
+import { StandardTooltip } from "../ui/standard-tooltip"
 
 interface ChatRowProps {
 	message: ClineMessage
@@ -600,10 +601,12 @@ export const ChatRowContent = ({
 									className="group"
 									onClick={() => vscode.postMessage({ type: "openFile", text: tool.content })}>
 									{tool.path?.startsWith(".") && <span>.</span>}
-									<span className="whitespace-nowrap overflow-hidden text-ellipsis text-left mr-2 rtl">
-										{removeLeadingNonAlphanumeric(tool.path ?? "") + "\u200E"}
-										{tool.reason}
-									</span>
+									<StandardTooltip content={tool.path} side="top" align="start" className="text-wrap max-w-[min(300px,100vw)]">
+										<span className="whitespace-nowrap overflow-hidden text-ellipsis text-left mr-2 rtl">
+											{removeLeadingNonAlphanumeric(tool.path ?? "") + "\u200E"}
+											{tool.reason}
+										</span>
+									</StandardTooltip>
 									<div style={{ flexGrow: 1 }}></div>
 									<SquareArrowOutUpRight
 										className="w-4 shrink-0 codicon codicon-link-external opacity-0 group-hover:opacity-100 transition-opacity"

webview-ui/src/components/common/CodeAccordian.tsx

@@ -6,6 +6,7 @@ import { removeLeadingNonAlphanumeric } from "@src/utils/removeLeadingNonAlphanu
 
 import { ToolUseBlock, ToolUseBlockHeader } from "./ToolUseBlock"
 import CodeBlock from "./CodeBlock"
+import { StandardTooltip } from "../ui/standard-tooltip"
 
 interface CodeAccordianProps {
 	path?: string
@@ -44,7 +45,9 @@ const CodeAccordian = ({
 					{header ? (
 						<div className="flex items-center">
 							<span className="codicon codicon-server mr-1.5"></span>
-							<span className="whitespace-nowrap overflow-hidden text-ellipsis mr-2">{header}</span>
+							<StandardTooltip content={header} side="top" align="start" className="text-wrap max-w-[min(300px,100vw)]">
+								<span className="whitespace-nowrap overflow-hidden text-ellipsis mr-2">{header}</span>
+							</StandardTooltip>
 						</div>
 					) : isFeedback ? (
 						<div className="flex items-center">
@@ -56,9 +59,11 @@ const CodeAccordian = ({
 					) : (
 						<>
 							{path?.startsWith(".") && <span>.</span>}
-							<span className="whitespace-nowrap overflow-hidden text-ellipsis text-left mr-2 rtl">
-								{removeLeadingNonAlphanumeric(path ?? "") + "\u200E"}
-							</span>
+							<StandardTooltip content={path} side="top" align="start" className="text-wrap max-w-[min(300px,100vw)]">
+								<span className="whitespace-nowrap overflow-hidden text-ellipsis text-left mr-2 rtl">
+									{removeLeadingNonAlphanumeric(path ?? "") + "\u200E"}
+								</span>
+							</StandardTooltip>
 						</>
 					)}
 					<div className="flex-grow-1" />