feat(tabby-threads): using tabby thread in chat-panel and VSCode plug…

…in (#3475)

* feat(tabby-thread): adding tabby threads package

* feat(tabby-threads): add customized version of @quilted/threads for Tabby project, also added readme

* feat: add CHECK_CAPABILITY method to target.ts

* feat: update dependencies for tabby-chat-panel and vscode clients

* chore: adding a new interface to encapsulate client apis

* chore: Update createClient function parameter name in index.ts and react.ts

- In index.ts, update the second parameter of the createClient function from `api: ClientApi` to `api: ClientApiMethods`.
- In react.ts, update the second parameter of the useClient function from `api: ClientApi` to `api: ClientApiMethods`.

* [autofix.ci] apply automated fixes

* chore: update tabby-chat-panel to version 0.3.0

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

clients/tabby-chat-panel/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tabby-chat-panel",
   "type": "module",
-  "version": "0.2.2",
+  "version": "0.3.0",
   "keywords": [],
   "sideEffects": false,
   "exports": {
@@ -44,8 +44,8 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@quilted/threads": "^2.2.0",
-    "react": "18.2.0"
+    "react": "18.2.0",
+    "tabby-threads": "workspace:*"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^2.16.0",

clients/tabby-chat-panel/src/index.ts

@@ -1,4 +1,4 @@
-import { createThreadFromIframe, createThreadFromInsideIframe } from '@quilted/threads'
+import { createThreadFromIframe, createThreadFromInsideIframe } from 'tabby-threads'
 import { version } from '../package.json'
 
 export const TABBY_CHAT_PANEL_API_VERSION: string = version
@@ -54,7 +54,7 @@ export interface ServerApi {
   updateActiveSelection: (context: Context | null) => void
 }
 
-export interface ClientApi {
+export interface ClientApiMethods {
   navigate: (context: Context, opts?: NavigateOpts) => void
   refresh: () => Promise<void>
 
@@ -69,6 +69,13 @@ export interface ClientApi {
   onCopy: (content: string) => void
 
   onKeyboardEvent: (type: 'keydown' | 'keyup' | 'keypress', event: KeyboardEventInit) => void
+
+}
+
+export interface ClientApi extends ClientApiMethods {
+  // this is inner function cover by tabby-threads
+  // the function doesn't need to expose to client but can call by client
+  hasCapability: (method: keyof ClientApiMethods) => Promise<boolean>
 }
 
 export interface ChatMessage {
@@ -84,7 +91,7 @@ export interface ChatMessage {
   activeContext?: Context
 }
 
-export function createClient(target: HTMLIFrameElement, api: ClientApi): ServerApi {
+export function createClient(target: HTMLIFrameElement, api: ClientApiMethods): ServerApi {
   return createThreadFromIframe(target, {
     expose: {
       navigate: api.navigate,

clients/tabby-chat-panel/src/react.ts

@@ -1,10 +1,10 @@
 import type { RefObject } from 'react'
 import { useEffect, useState } from 'react'
 
-import type { ClientApi, ServerApi } from './index'
+import type { ClientApi, ClientApiMethods, ServerApi } from './index'
 import { createClient, createServer } from './index'
 
-function useClient(iframeRef: RefObject<HTMLIFrameElement>, api: ClientApi) {
+function useClient(iframeRef: RefObject<HTMLIFrameElement>, api: ClientApiMethods) {
   const [client, setClient] = useState<ServerApi | null>(null)
   let isCreated = false
 

clients/vscode/package.json

@@ -459,7 +459,7 @@
     "publish-prerelease": "pnpm run vscode:publish-prerelease && pnpm run ovsx:publish-prerelease"
   },
   "devDependencies": {
-    "@quilted/threads": "^2.2.0",
+    "tabby-threads": "workspace:*",
     "@types/deep-equal": "^1.0.4",
     "@types/diff": "^5.2.1",
     "@types/fs-extra": "^11.0.1",

clients/vscode/src/chat/chatPanel.ts

@@ -1,5 +1,5 @@
-import { createThread, type ThreadOptions } from "@quilted/threads";
-import type { ServerApi, ClientApi } from "tabby-chat-panel";
+import { createThread, type ThreadOptions } from "tabby-threads";
+import type { ServerApi, ClientApiMethods } from "tabby-chat-panel";
 import { Webview } from "vscode";
 
 export function createThreadFromWebview<Self = Record<string, never>, Target = Record<string, never>>(
@@ -22,7 +22,7 @@ export function createThreadFromWebview<Self = Record<string, never>, Target = R
   );
 }
 
-export function createClient(webview: Webview, api: ClientApi): ServerApi {
+export function createClient(webview: Webview, api: ClientApiMethods): ServerApi {
   return createThreadFromWebview(webview, {
     expose: {
       navigate: api.navigate,