fix: Apply approved PR feedback

- Fix chevron direction in BrowserSessionRow.tsx (now shows down when expanded, right when collapsed)
- Add aria-labels to all Lucide icons for better accessibility in ChatRow.tsx
- Add aria-label to Pointer icon in BrowserSessionRow.tsx
- Remove redundant displayName from ErrorRow.tsx component

These changes address all feedback marked with 👍 in PR #7985

Author: roomote

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

@@ -238,7 +238,7 @@ const BrowserSessionRow = memo((props: BrowserSessionRowProps) => {
 	const [browserSessionRow, { height: rowHeight }] = useSize(
 		<div style={{ padding: "10px 6px 10px 15px", marginBottom: -10 }}>
 			<div style={{ display: "flex", alignItems: "center", gap: "10px", marginBottom: "10px" }}>
-				{isBrowsing ? <ProgressIndicator /> : <Pointer className="w-4" />}
+				{isBrowsing ? <ProgressIndicator /> : <Pointer className="w-4" aria-label="Browser action indicator" />}
 				<span style={{ fontWeight: "bold" }}>
 					<>{t("chat:browser.rooWantsToUse")}</>
 				</span>
@@ -347,7 +347,7 @@ const BrowserSessionRow = memo((props: BrowserSessionRowProps) => {
 					}}>
 					<SquareTerminal className="w-3" />
 					<span className="grow text-xs">{t("chat:browser.consoleLogs")}</span>
-					<span className={`codicon codicon-chevron-${consoleLogsExpanded ? "right" : "down"}`}></span>
+					<span className={`codicon codicon-chevron-${consoleLogsExpanded ? "down" : "right"}`}></span>
 				</div>
 				{consoleLogsExpanded && (
 					<CodeBlock source={displayState.consoleLogs || t("chat:browser.noNewLogs")} language="shell" />

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

@@ -317,7 +317,7 @@ export const ChatRowContent = ({
 				]
 			case "followup":
 				return [
-					<MessageCircleQuestionMark className="w-4" />,
+					<MessageCircleQuestionMark className="w-4" aria-label="Question icon" />,
 					<span style={{ color: normalColor, fontWeight: "bold" }}>{t("chat:questions.hasQuestion")}</span>,
 				]
 			default:
@@ -370,7 +370,7 @@ export const ChatRowContent = ({
 					return (
 						<>
 							<div style={headerStyle}>
-								<FileDiff className="w-4" />
+								<FileDiff className="w-4" aria-label="Batch diff icon" />
 								<span style={{ fontWeight: "bold" }}>
 									{t("chat:fileOperations.wantsToApplyBatchChanges")}
 								</span>
@@ -559,7 +559,7 @@ export const ChatRowContent = ({
 					return (
 						<>
 							<div style={headerStyle}>
-								<Eye className="w-4" />
+								<Eye className="w-4" aria-label="View files icon" />
 								<span style={{ fontWeight: "bold" }}>
 									{t("chat:fileOperations.wantsToReadMultiple")}
 								</span>
@@ -579,7 +579,7 @@ export const ChatRowContent = ({
 				return (
 					<>
 						<div style={headerStyle}>
-							<FileCode2 className="w-4" />
+							<FileCode2 className="w-4" aria-label="Read file icon" />
 							<span style={{ fontWeight: "bold" }}>
 								{message.type === "ask"
 									? tool.isOutsideWorkspace
@@ -634,7 +634,7 @@ export const ChatRowContent = ({
 				return (
 					<>
 						<div style={headerStyle}>
-							<ListTree className="w-4" />
+							<ListTree className="w-4" aria-label="List files icon" />
 							<span style={{ fontWeight: "bold" }}>
 								{message.type === "ask"
 									? tool.isOutsideWorkspace
@@ -660,7 +660,7 @@ export const ChatRowContent = ({
 				return (
 					<>
 						<div style={headerStyle}>
-							<FolderTree className="w-4" />
+							<FolderTree className="w-4" aria-label="Folder tree icon" />
 							<span style={{ fontWeight: "bold" }}>
 								{message.type === "ask"
 									? tool.isOutsideWorkspace
@@ -752,7 +752,7 @@ export const ChatRowContent = ({
 				return (
 					<>
 						<div style={headerStyle}>
-							<PocketKnife className="w-4" />
+							<PocketKnife className="w-4" aria-label="Switch mode icon" />
 							<span style={{ fontWeight: "bold" }}>
 								{message.type === "ask" ? (
 									<>
@@ -1131,7 +1131,7 @@ export const ChatRowContent = ({
 					return (
 						<div className="group">
 							<div style={headerStyle}>
-								<User className="w-4" />
+								<User className="w-4" aria-label="User icon" />
 								<span style={{ fontWeight: "bold" }}>{t("chat:feedback.youSaid")}</span>
 							</div>
 							<div
@@ -1182,7 +1182,7 @@ export const ChatRowContent = ({
 													e.stopPropagation()
 													handleEditClick()
 												}}>
-												<Edit className="w-4" />
+												<Edit className="w-4" aria-label="Edit message icon" />
 											</div>
 											<div
 												className="cursor-pointer shrink-0 opacity-0 group-hover:opacity-100 transition-opacity"
@@ -1191,7 +1191,7 @@ export const ChatRowContent = ({
 													e.stopPropagation()
 													vscode.postMessage({ type: "deleteMessage", value: message.ts })
 												}}>
-												<Trash2 className="w-4" />
+												<Trash2 className="w-4" aria-label="Delete message icon" />
 											</div>
 										</div>
 									</div>

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

@@ -136,6 +136,4 @@ export const ErrorRow = memo(
 	},
 )
 
-ErrorRow.displayName = "ErrorRow"
-
 export default ErrorRow