fix(messages): normalize tool-call card shells under custom themes#14828
Open
Fu-Jumping wants to merge 1 commit into
Open
fix(messages): normalize tool-call card shells under custom themes#14828Fu-Jumping wants to merge 1 commit into
Fu-Jumping wants to merge 1 commit into
Conversation
Signed-off-by: sjsjysfj <gc160514190803@163.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this PR does
Before this PR:
Under some custom themes from Cherry CSS, tool-call UI could show two visible rounded layers with inconsistent corner radii.
This was most obvious on tool-call cards that use
Collapseinternally, such as grouped tool calls, generic agent tool cards, MCP tool cards, and permission request cards.In the MCP response-only path, the expanded body could also show an extra divider line.
After this PR:
Affected tool-call cards render as a single visible outer shell under custom themes.
Inner
Collapselayers no longer render their own independent rounded/background shell.The MCP response-only expanded view now keeps a single divider between the header and body.
The visible corner radius of these tool-call cards is also kept aligned with the previous UI instead of becoming overly rounded.
Fixes #
Why we need it and why it was done in this way
Some custom themes style
.ant-collapseand.ant-collapse-content, which exposed that these tool-call components were rendering multiple visible card layers with separate backgrounds and corner radii.This fix keeps the change local to the affected tool-call components and makes the outer tool card the only visible shell.
That keeps the hotfix small and avoids changing the global theme system, custom CSS injection behavior, or unrelated
Collapseusage.The following tradeoffs were made:
A local renderer-only fix was chosen instead of adding a global Ant Design override.
Component-local radii were kept for these tool-call cards so the UI stays closer to the previous appearance and does not become pill-shaped in layouts where list-item radius tokens are larger.
The following alternatives were considered:
A global override in
ant.csswas considered, but rejected because it would broaden the change surface and could affect unrelated collapsible components.Changing the custom theme contract was also considered, but rejected because tool-call cards should render correctly even when themes style Ant Design collapse internals.
Links to places where the discussion took place:
N/A
Breaking changes
None.
Special notes for your reviewer
A renderer regression test was added for:
Focused local verification was performed with:
pnpm exec eslint src/renderer/src/pages/home/Messages/Blocks/ToolBlockGroup.tsx src/renderer/src/pages/home/Messages/Tools/MessageAgentTools/index.tsx src/renderer/src/pages/home/Messages/Tools/MessageMcpTool.tsx src/renderer/src/pages/home/Messages/Tools/ToolPermissionRequestCard.tsx src/renderer/src/pages/home/Messages/Tools/__tests__/ToolCallThemeRadius.test.tsxpnpm typecheck:webpnpm test:renderer -- src/renderer/src/pages/home/Messages/Tools/__tests__/ToolCallThemeRadius.test.tsxpnpm test:renderer -- src/renderer/src/pages/home/Messages/Tools/__tests__/MessageAgentTools.test.tsxpnpm test:renderer -- src/renderer/src/pages/home/Messages/Blocks/__tests__/ThinkingBlock.test.tsxpnpm test:renderer -- src/renderer/src/pages/home/Messages/Tools/hooks/__tests__/useMcpToolApproval.test.tspnpm test:renderer -- src/renderer/src/pages/home/Messages/Tools/__tests__/ClickableFilePath.test.tsxManual verification was also performed with the default theme and a Cherry CSS custom theme, including:
The attached images use the
雁灰 (Yan-hui)custom theme from Cherry CSS as a reproducible example of the issue.Before:


After:


Checklist
Release note