From e3a6c33670bbf3611ed4ee5986835ed784ffd6d6 Mon Sep 17 00:00:00 2001
From: GCWing <gcwing@foxmail.com>
Date: Fri, 8 May 2026 16:15:16 +0800
Subject: [PATCH] refactor(web-ui): apply dense-command on CompactToolCard
 wrapper

Move compact-tool-card-wrapper--dense-command from individual tool cards into CompactToolCard so all compact cards share the same header density without per-card duplication.
---
 src/web-ui/src/flow_chat/tool-cards/CompactToolCard.tsx       | 2 +-
 src/web-ui/src/flow_chat/tool-cards/FileOperationToolCard.tsx | 2 +-
 src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.scss       | 2 +-
 src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.tsx        | 2 +-
 src/web-ui/src/flow_chat/tool-cards/GlobSearchDisplay.tsx     | 2 +-
 src/web-ui/src/flow_chat/tool-cards/GrepSearchDisplay.tsx     | 2 +-
 src/web-ui/src/flow_chat/tool-cards/LSDisplay.tsx             | 2 +-
 src/web-ui/src/flow_chat/tool-cards/ReadFileDisplay.tsx       | 2 +-
 src/web-ui/src/flow_chat/tool-cards/TerminalToolCard.tsx      | 2 +-
 9 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/web-ui/src/flow_chat/tool-cards/CompactToolCard.tsx b/src/web-ui/src/flow_chat/tool-cards/CompactToolCard.tsx
index 57935fc75..ce19d2925 100644
--- a/src/web-ui/src/flow_chat/tool-cards/CompactToolCard.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/CompactToolCard.tsx
@@ -70,7 +70,7 @@ export const CompactToolCard: React.FC<CompactToolCardProps> = ({
 
   return (
     <div
-      className={`compact-tool-card-wrapper${loadingShimmer ? ' compact-tool-card-wrapper--loading-shimmer' : ''} ${className}`.trim()}
+      className={`compact-tool-card-wrapper compact-tool-card-wrapper--dense-command${loadingShimmer ? ' compact-tool-card-wrapper--loading-shimmer' : ''} ${className}`.trim()}
     >
       <div
         className={`compact-tool-card status-${status} ${clickable ? 'clickable' : ''} ${isExpanded ? 'expanded' : ''}`}
diff --git a/src/web-ui/src/flow_chat/tool-cards/FileOperationToolCard.tsx b/src/web-ui/src/flow_chat/tool-cards/FileOperationToolCard.tsx
index ecc159026..22a6765c3 100644
--- a/src/web-ui/src/flow_chat/tool-cards/FileOperationToolCard.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/FileOperationToolCard.tsx
@@ -875,7 +875,7 @@ export const FileOperationToolCard: React.FC<FileOperationToolCardProps> = ({
       <CompactToolCard
         status={status}
         isExpanded={false}
-        className="read-file-card delete-file-card compact-tool-card-wrapper--dense-command"
+        className="read-file-card delete-file-card"
         clickable={false}
         header={
           <CompactToolCardHeader
diff --git a/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.scss b/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.scss
index 87281adf5..1c0a95530 100644
--- a/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.scss
+++ b/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.scss
@@ -19,7 +19,7 @@
   cursor: pointer;
 }
 
-.compact-tool-card-wrapper.git-tool-display.compact-tool-card-wrapper--dense-command {
+.compact-tool-card-wrapper.git-tool-display {
   .tool-card-icon-slot {
     width: 24px;
     margin-right: 7px;
diff --git a/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.tsx b/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.tsx
index 2a7efa604..816deeefa 100644
--- a/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/GitToolDisplay.tsx
@@ -326,7 +326,7 @@ export const GitToolDisplay: React.FC<ToolCardProps> = ({
         status={status}
         isExpanded={isExpanded}
         onClick={handleCardClick}
-        className="git-tool-display compact-tool-card-wrapper--dense-command"
+        className="git-tool-display"
         clickable
         header={renderHeader()}
         expandedContent={expandedContent}
diff --git a/src/web-ui/src/flow_chat/tool-cards/GlobSearchDisplay.tsx b/src/web-ui/src/flow_chat/tool-cards/GlobSearchDisplay.tsx
index bcc9cd2a1..c58ac469f 100644
--- a/src/web-ui/src/flow_chat/tool-cards/GlobSearchDisplay.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/GlobSearchDisplay.tsx
@@ -192,7 +192,7 @@ export const GlobSearchDisplay: React.FC<ToolCardProps> = ({
         status={status}
         isExpanded={isExpanded}
         onClick={handleClick}
-        className="glob-search-card compact-tool-card-wrapper--dense-command"
+        className="glob-search-card"
         clickable={hasDetails}
         header={
           <CompactToolCardHeader
diff --git a/src/web-ui/src/flow_chat/tool-cards/GrepSearchDisplay.tsx b/src/web-ui/src/flow_chat/tool-cards/GrepSearchDisplay.tsx
index 5fc295b2e..6c2e44ae9 100644
--- a/src/web-ui/src/flow_chat/tool-cards/GrepSearchDisplay.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/GrepSearchDisplay.tsx
@@ -147,7 +147,7 @@ export const GrepSearchDisplay: React.FC<ToolCardProps> = ({
         status={status}
         isExpanded={isExpanded}
         onClick={handleClick}
-        className="grep-search-card compact-tool-card-wrapper--dense-command"
+        className="grep-search-card"
         clickable={hasDetails}
         header={
           <CompactToolCardHeader
diff --git a/src/web-ui/src/flow_chat/tool-cards/LSDisplay.tsx b/src/web-ui/src/flow_chat/tool-cards/LSDisplay.tsx
index 08b408afb..0175fd2db 100644
--- a/src/web-ui/src/flow_chat/tool-cards/LSDisplay.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/LSDisplay.tsx
@@ -188,7 +188,7 @@ export const LSDisplay: React.FC<ToolCardProps> = ({
         status={status}
         isExpanded={isExpanded}
         onClick={handleClick}
-        className="ls-display-card compact-tool-card-wrapper--dense-command"
+        className="ls-display-card"
         clickable={hasDetails}
         header={
           <CompactToolCardHeader
diff --git a/src/web-ui/src/flow_chat/tool-cards/ReadFileDisplay.tsx b/src/web-ui/src/flow_chat/tool-cards/ReadFileDisplay.tsx
index 19214e9c1..8ffd99cbe 100644
--- a/src/web-ui/src/flow_chat/tool-cards/ReadFileDisplay.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/ReadFileDisplay.tsx
@@ -130,7 +130,7 @@ export const ReadFileDisplay: React.FC<ToolCardProps> = React.memo(({
       status={status}
       isExpanded={false}
       onClick={() => canOpenFile && handleOpenInEditor()}
-      className="read-file-card compact-tool-card-wrapper--dense-command"
+      className="read-file-card"
       clickable={canOpenFile}
       header={
         <CompactToolCardHeader
diff --git a/src/web-ui/src/flow_chat/tool-cards/TerminalToolCard.tsx b/src/web-ui/src/flow_chat/tool-cards/TerminalToolCard.tsx
index 3ad8fd7cc..419406fe7 100644
--- a/src/web-ui/src/flow_chat/tool-cards/TerminalToolCard.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/TerminalToolCard.tsx
@@ -626,7 +626,7 @@ export const TerminalToolCard: React.FC<TerminalToolCardProps> = ({
           status={status}
           isExpanded={false}
           onClick={handleCardClick}
-          className="terminal-tool-card terminal-tool-card--compact-collapsed compact-tool-card-wrapper--dense-command"
+          className="terminal-tool-card terminal-tool-card--compact-collapsed"
           clickable
           header={renderCompactHeader()}
         />