feat: add linkComponents prop for Markdown rendering in ThinkingBlock

Adds a `linkComponents` prop that can be supplied to `RenderMarkdown` within
`ThinkingBlock` and propagates this prop to the thread view.  The change
enables custom link rendering (e.g., special handling of URLs or
interactions) without modifying the core component logic.  It also renames
the “Tool Call” label to “Tool Input” to more accurately describe the
content being displayed.
This commit is contained in:
Akarshan 2025-10-30 10:26:16 +05:30
parent d9b42d4699
commit 890e6694c2
No known key found for this signature in database
GPG Key ID: D75C9634A870665F
2 changed files with 14 additions and 3 deletions

View File

@ -22,6 +22,7 @@ interface Props {
steps?: ReActStep[] // Updated type steps?: ReActStep[] // Updated type
loading?: boolean loading?: boolean
duration?: number duration?: number
linkComponents?: object
} }
// Utility function to safely parse JSON // Utility function to safely parse JSON
@ -69,6 +70,7 @@ const ThinkingBlock = ({
steps = [], steps = [],
loading: propLoading, loading: propLoading,
duration, duration,
linkComponents,
}: Props) => { }: Props) => {
const thinkingState = useThinkingStore((state) => state.thinkingState) const thinkingState = useThinkingStore((state) => state.thinkingState)
const setThinkingState = useThinkingStore((state) => state.setThinkingState) const setThinkingState = useThinkingStore((state) => state.setThinkingState)
@ -157,7 +159,7 @@ const ThinkingBlock = ({
contentDisplay = ( contentDisplay = (
<> <>
<p className="font-medium text-main-view-fg/90"> <p className="font-medium text-main-view-fg/90">
Tool Call: <span className="text-accent">{step.content}</span> Tool Input: <span className="text-accent">{step.content}</span>
</p> </p>
{args && ( {args && (
<div className="mt-1"> <div className="mt-1">
@ -210,14 +212,22 @@ const ThinkingBlock = ({
<> <>
<p className="font-medium text-main-view-fg/90">Tool Output:</p> <p className="font-medium text-main-view-fg/90">Tool Output:</p>
<div className="mt-1"> <div className="mt-1">
<RenderMarkdown isWrapping={true} content={content} /> <RenderMarkdown
isWrapping={true}
content={content}
components={linkComponents}
/>
</div> </div>
</> </>
) )
} }
} else { } else {
contentDisplay = ( contentDisplay = (
<RenderMarkdown isWrapping={true} content={step.content} /> <RenderMarkdown
isWrapping={true}
content={step.content}
components={linkComponents}
/>
) )
} }

View File

@ -642,6 +642,7 @@ export const ThreadContent = memo(
duration={ duration={
item.metadata?.totalThinkingTime as number | undefined item.metadata?.totalThinkingTime as number | undefined
} }
linkComponents={linkComponents}
/> />
)} )}