diff --git a/clients/tabby-chat-panel/src/index.ts b/clients/tabby-chat-panel/src/index.ts index 42a9079a1ed1..fe6c868f4c0b 100644 --- a/clients/tabby-chat-panel/src/index.ts +++ b/clients/tabby-chat-panel/src/index.ts @@ -25,7 +25,7 @@ export interface InitRequest { export interface ServerApi { init: (request: InitRequest) => void sendMessage: (message: ChatMessage) => void - + } export interface ClientApi { @@ -41,8 +41,8 @@ export interface ChatMessage { export function createClient(target: HTMLIFrameElement, api: ClientApi): ServerApi { return createThreadFromIframe(target, { expose: { - navigate: api.navigate - } + navigate: api.navigate, + }, }) } diff --git a/clients/tabby-chat-panel/src/react.ts b/clients/tabby-chat-panel/src/react.ts index 67bfeafed691..4e514d2ecd72 100644 --- a/clients/tabby-chat-panel/src/react.ts +++ b/clients/tabby-chat-panel/src/react.ts @@ -1,16 +1,15 @@ import type { RefObject } from 'react' import { useEffect, useRef } from 'react' -import type { ServerApi, ClientApi } from './index' +import type { ClientApi, ServerApi } from './index' import { createClient, createServer } from './index' function useClient(iframeRef: RefObject, api: ClientApi) { const clientRef = useRef(null) useEffect(() => { - if (iframeRef.current && !clientRef.current) { + if (iframeRef.current && !clientRef.current) clientRef.current = createClient(iframeRef.current, api) - } }, [iframeRef.current]) return clientRef.current @@ -21,7 +20,8 @@ function useServer(api: ServerApi) { useEffect(() => { const isInIframe = window.self !== window.top - if (isInIframe && !serverRef.current) serverRef.current = createServer(api) + if (isInIframe && !serverRef.current) + serverRef.current = createServer(api) }, []) return serverRef.current diff --git a/clients/tabby-chat-panel/src/vscode.tsx b/clients/tabby-chat-panel/src/vscode.tsx index 4dba4fa2f1ce..7dba0f265a2b 100644 --- a/clients/tabby-chat-panel/src/vscode.tsx +++ b/clients/tabby-chat-panel/src/vscode.tsx @@ -1,38 +1,37 @@ -import * as React from 'react'; -import { createRoot } from 'react-dom/client'; +import * as React from 'react' +import { createRoot } from 'react-dom/client' -import type { Context } from './index' -import { useClient } from './react'; +import { useClient } from './react' declare global { interface Window { - token?: string; - endpoint?: string; + token?: string + endpoint?: string } } -function ChatPanel () { - const [endpoint, setEndpoint] = React.useState("") - const [token, setToken] = React.useState("") +function ChatPanel() { + const [endpoint, setEndpoint] = React.useState('') + const [token, setToken] = React.useState('') const iframeRef = React.useRef(null) const client = useClient(iframeRef, { - navigate: (context: Context) => { + navigate: () => { // FIXME(wwayne): Send message to VSCode webview to invoke VSCode API - } + }, }) React.useEffect(() => { - setEndpoint(window.endpoint || "") - setToken(window.token || "") + setEndpoint(window.endpoint || '') + setToken(window.token || '') }, []) React.useEffect(() => { if (iframeRef?.current && token) { client?.init({ fetcherOptions: { - authorization: token - } + authorization: token, + }, }) } }, [iframeRef?.current, client, token]) @@ -42,12 +41,13 @@ function ChatPanel () { src={`${endpoint}/chat`} style={{ width: '100vw', - height: '100vh' + height: '100vh', }} - ref={iframeRef} /> + ref={iframeRef} + /> ) } -createRoot(document.getElementById("root") as HTMLElement).render( - -); \ No newline at end of file +createRoot(document.getElementById('root') as HTMLElement).render( + , +) diff --git a/clients/tabby-chat-panel/tsconfig.json b/clients/tabby-chat-panel/tsconfig.json index b8fb82204082..8fa9a910f3df 100644 --- a/clients/tabby-chat-panel/tsconfig.json +++ b/clients/tabby-chat-panel/tsconfig.json @@ -1,6 +1,7 @@ { "compilerOptions": { "target": "ES2020", + "jsx": "react", "lib": ["ESNext", "DOM"], "module": "ESNext", "moduleResolution": "Bundler", @@ -9,8 +10,7 @@ "strictNullChecks": true, "esModuleInterop": true, "skipDefaultLibCheck": true, - "skipLibCheck": true, - "jsx": "react" + "skipLibCheck": true }, "include": ["src", "test", "build.config.ts"] }