AXON-1515: add onLinkClick handler for DebugPanel (#1298)

Author: cabella-dot

src/rovo-dev/ui/messaging/ChatStream.tsx

@@ -48,6 +48,7 @@ interface ChatStreamProps {
     jiraWorkItems: MinimalIssue<DetailedSiteInfo>[] | undefined;
     onJiraItemClick: (issue: MinimalIssue<DetailedSiteInfo>) => void;
     onToolPermissionChoice: (toolCallId: string, choice: ToolPermissionDialogChoice | 'enableYolo') => void;
+    onLinkClick: (href: string) => void;
 }
 
 export const ChatStream: React.FC<ChatStreamProps> = ({
@@ -71,6 +72,7 @@ export const ChatStream: React.FC<ChatStreamProps> = ({
     jiraWorkItems,
     onJiraItemClick,
     onToolPermissionChoice,
+    onLinkClick,
 }) => {
     const chatEndRef = React.useRef<HTMLDivElement>(null);
     const sentinelRef = React.useRef<HTMLDivElement>(null);
@@ -88,13 +90,6 @@ export const ChatStream: React.FC<ChatStreamProps> = ({
         );
         setHasChangesInGit(response.hasChanges);
     }, [messagingApi]);
-
-    const onLinkClick = React.useCallback(
-        (href: string) => {
-            messagingApi.postMessage({ type: RovoDevViewResponseType.OpenExternalLink, href });
-        },
-        [messagingApi],
-    );
     const [autoScrollEnabled, setAutoScrollEnabled] = React.useState(true);
 
     // Helper to perform auto-scroll when enabled

src/rovo-dev/ui/rovoDevView.tsx

@@ -805,6 +805,12 @@ const RovoDevView: React.FC = () => {
 
     const onYoloModeToggled = useCallback(() => setIsYoloModeToggled((prev) => !prev), [setIsYoloModeToggled]);
 
+    const onLinkClick = React.useCallback(
+        (href: string) => {
+            postMessage({ type: RovoDevViewResponseType.OpenExternalLink, href });
+        },
+        [postMessage],
+    );
     React.useEffect(() => {
         // the event below (YoloModeToggled) with value true automatically approves any pending confirmation
         if (isYoloModeToggled) {
@@ -859,6 +865,7 @@ const RovoDevView: React.FC = () => {
                         currentState={currentState}
                         debugContext={debugPanelContext}
                         debugMcpContext={debugPanelMcpContext}
+                        onLinkClick={onLinkClick}
                     />
                 )}
                 <ChatStream
@@ -891,6 +898,7 @@ const RovoDevView: React.FC = () => {
                     jiraWorkItems={jiraWorkItems}
                     onJiraItemClick={onJiraItemClick}
                     onToolPermissionChoice={onToolPermissionChoice}
+                    onLinkClick={onLinkClick}
                 />
                 {!hidePromptBox && (
                     <div className="input-section-container">

src/rovo-dev/ui/tools/DebugPanel.tsx

@@ -7,20 +7,21 @@ export const DebugPanel: React.FC<{
     currentState: State;
     debugContext: Record<string, string>;
     debugMcpContext: Record<string, string>;
-}> = ({ currentState, debugContext, debugMcpContext }) => {
+    onLinkClick: (href: string) => void;
+}> = ({ currentState, debugContext, debugMcpContext, onLinkClick }) => {
     return (
         <div style={{ width: '100%', border: '1px solid var(--vscode-inputValidation-errorBorder)', padding: '4px' }}>
             <DebugStatePanel currentState={currentState} />
             {Object.keys(debugContext).length > 0 && (
                 <>
                     <hr />
-                    <DebugContextPanel title="Process state" debugContext={debugContext} />
+                    <DebugContextPanel title="Process state" debugContext={debugContext} onLinkClick={onLinkClick} />
                 </>
             )}
             {Object.keys(debugMcpContext).length > 0 && (
                 <>
                     <hr />
-                    <DebugContextPanel title="MCP servers" debugContext={debugMcpContext} />
+                    <DebugContextPanel title="MCP servers" debugContext={debugMcpContext} onLinkClick={onLinkClick} />
                 </>
             )}
         </div>
@@ -63,7 +64,8 @@ const DebugStatePanel: React.FC<{
 const DebugContextPanel: React.FC<{
     title: string;
     debugContext: Record<string, string>;
-}> = ({ title, debugContext }) => {
+    onLinkClick: (href: string) => void;
+}> = ({ title, debugContext, onLinkClick }) => {
     const props = React.useMemo(() => {
         const p: [string, string][] = [];
         for (const key in debugContext) {
@@ -81,7 +83,7 @@ const DebugContextPanel: React.FC<{
                         <td>{key}</td>
                         {key === 'RovoDevAddress' && (
                             <td>
-                                <MarkedDown value={value + '/docs'} />
+                                <MarkedDown value={value + '/docs'} onLinkClick={onLinkClick} />
                             </td>
                         )}
                         {key !== 'RovoDevAddress' && <td>{value}</td>}