diff --git a/packages/kilo-ui/src/components/message-part.tsx b/packages/kilo-ui/src/components/message-part.tsx index 0ff6de64f2..e4b6351e42 100644 --- a/packages/kilo-ui/src/components/message-part.tsx +++ b/packages/kilo-ui/src/components/message-part.tsx @@ -1306,6 +1306,15 @@ function useToolReveal(pending: () => boolean, animate?: () => boolean) { function WebfetchMeta(props: { url: string; animate?: boolean }) { let ref: HTMLSpanElement | undefined useToolFade(() => ref, { wipe: true, animate: props.animate }) + const data = useData() + + const open = (event: MouseEvent) => { + event.stopPropagation() + event.preventDefault() + const handler = data.openUrl + if (handler) return handler(props.url) + window.open(props.url, "_blank", "noopener,noreferrer") + } return ( @@ -1316,11 +1325,11 @@ function WebfetchMeta(props: { url: string; animate?: boolean }) { href={props.url} target="_blank" rel="noopener noreferrer" - onClick={(event) => event.stopPropagation()} + onClick={open} > {props.url} -
+
diff --git a/packages/kilo-vscode/webview-ui/src/App.tsx b/packages/kilo-vscode/webview-ui/src/App.tsx index 05035afd21..9f535c0fcf 100644 --- a/packages/kilo-vscode/webview-ui/src/App.tsx +++ b/packages/kilo-vscode/webview-ui/src/App.tsx @@ -109,6 +109,10 @@ export const DataBridge: Component<{ children: any }> = (props) => { vscode.postMessage({ type: "openFile", filePath, line, column }) } + const openUrl = (url: string) => { + vscode.postMessage({ type: "openExternal", url }) + } + const directory = () => { const dir = server.workspaceDirectory() if (!dir) return "" @@ -124,6 +128,7 @@ export const DataBridge: Component<{ children: any }> = (props) => { onQuestionReply={reply} onQuestionReject={reject} onOpenFile={open} + onOpenUrl={openUrl} > {props.children} diff --git a/packages/ui/src/context/data.tsx b/packages/ui/src/context/data.tsx index 50317e5f64..d51aa9fe76 100644 --- a/packages/ui/src/context/data.tsx +++ b/packages/ui/src/context/data.tsx @@ -28,6 +28,8 @@ export type SessionHrefFn = (sessionID: string) => string export type OpenFileFn = (filePath: string, line?: number, column?: number) => void // kilocode_change +export type OpenUrlFn = (url: string) => void // kilocode_change + export const { use: useData, provider: DataProvider } = createSimpleContext({ name: "Data", init: (props: { @@ -36,6 +38,7 @@ export const { use: useData, provider: DataProvider } = createSimpleContext({ onNavigateToSession?: NavigateToSessionFn onSessionHref?: SessionHrefFn onOpenFile?: OpenFileFn // kilocode_change + onOpenUrl?: OpenUrlFn // kilocode_change }) => { return { get store() { @@ -47,6 +50,7 @@ export const { use: useData, provider: DataProvider } = createSimpleContext({ navigateToSession: props.onNavigateToSession, sessionHref: props.onSessionHref, openFile: props.onOpenFile, // kilocode_change + openUrl: props.onOpenUrl, // kilocode_change } }, })