* feat(BottomTerminalDock): add close button next to the fullscreen toggle in the dock * style: replace hardcoded gradient with theme value in shine text variant * fix(header): adapt instance button for desktop only * refactor(chat): polish sticky turn UX and message action rows for better readability Switch to stable sticky-only turn behavior and redesign user/assistant action controls (placement, hover rules, ordering, spacing, selection-safe clamp) to reduce visual noise and improve interaction flow. * feat(chat/message): refactor buttons in messages footer * feat: enhance image preview functionality in chat messages - Added a new ImagePreviewDialog component to handle image previews with navigation support. - Updated ToolOutputDialog to utilize the new ImagePreviewDialog for displaying images. - Modified the ToolPopupContent type to include a gallery of images and an index for the current image. - Removed the old inline image display logic from ToolOutputDialog. - Improved file handling in the file store, including better MIME type guessing and handling of server paths. - Introduced a new API endpoint for handling large session message payloads, allowing for better management of multi-file attachments. - Updated the VSCode bridge to support session message requests with appropriate headers and body handling. * feat(proxy): implement SSE forwarding and enhance generic API request handling * feat(chat): support submitting only queued messages * feat: add image preview transition state * fix: default VSCode view to draft and fixed sessions list regression
180 lines
5.0 KiB
TypeScript
180 lines
5.0 KiB
TypeScript
declare const acquireVsCodeApi: () => {
|
|
postMessage: (message: unknown) => void;
|
|
getState: () => unknown;
|
|
setState: (state: unknown) => void;
|
|
};
|
|
|
|
interface VSCodeAPI {
|
|
postMessage: (message: unknown) => void;
|
|
}
|
|
|
|
let vscodeApi: VSCodeAPI | null = null;
|
|
|
|
function getVSCodeAPI(): VSCodeAPI {
|
|
if (!vscodeApi) {
|
|
vscodeApi = acquireVsCodeApi();
|
|
}
|
|
return vscodeApi;
|
|
}
|
|
|
|
// Export vscode API for direct use
|
|
export const vscode = {
|
|
postMessage: (message: unknown) => getVSCodeAPI().postMessage(message),
|
|
};
|
|
|
|
interface BridgeRequest {
|
|
id: string;
|
|
type: string;
|
|
payload?: unknown;
|
|
}
|
|
|
|
interface BridgeResponse {
|
|
id: string;
|
|
type: string;
|
|
success: boolean;
|
|
data?: unknown;
|
|
error?: string;
|
|
}
|
|
|
|
const pendingRequests = new Map<string, {
|
|
resolve: (value: unknown) => void;
|
|
reject: (reason: Error) => void;
|
|
}>();
|
|
|
|
let requestIdCounter = 0;
|
|
|
|
window.addEventListener('message', (event: MessageEvent<BridgeResponse>) => {
|
|
const response = event.data;
|
|
if (!response || typeof response.id !== 'string') return;
|
|
|
|
const pending = pendingRequests.get(response.id);
|
|
if (pending) {
|
|
pendingRequests.delete(response.id);
|
|
if (response.success) {
|
|
pending.resolve(response.data);
|
|
} else {
|
|
pending.reject(new Error(response.error || 'Unknown error'));
|
|
}
|
|
}
|
|
});
|
|
|
|
export function sendBridgeMessage<T = unknown>(type: string, payload?: unknown): Promise<T> {
|
|
return sendBridgeMessageWithOptions<T>(type, payload);
|
|
}
|
|
|
|
export function sendBridgeMessageWithOptions<T = unknown>(
|
|
type: string,
|
|
payload?: unknown,
|
|
options?: { timeoutMs?: number }
|
|
): Promise<T> {
|
|
return new Promise((resolve, reject) => {
|
|
const id = `req_${++requestIdCounter}_${Date.now()}`;
|
|
const request: BridgeRequest = { id, type, payload };
|
|
|
|
pendingRequests.set(id, {
|
|
resolve: resolve as (value: unknown) => void,
|
|
reject,
|
|
});
|
|
|
|
const timeoutMs = typeof options?.timeoutMs === 'number' ? options.timeoutMs : 30000;
|
|
if (Number.isFinite(timeoutMs) && timeoutMs > 0) {
|
|
setTimeout(() => {
|
|
if (pendingRequests.has(id)) {
|
|
pendingRequests.delete(id);
|
|
reject(new Error(`Request ${type} timed out`));
|
|
}
|
|
}, timeoutMs);
|
|
}
|
|
|
|
getVSCodeAPI().postMessage(request);
|
|
});
|
|
}
|
|
|
|
export type ProxiedApiResponse = {
|
|
status: number;
|
|
headers: Record<string, string>;
|
|
bodyBase64: string;
|
|
};
|
|
|
|
export async function proxyApiRequest(options: {
|
|
method: string;
|
|
path: string;
|
|
headers?: Record<string, string>;
|
|
bodyBase64?: string;
|
|
}): Promise<ProxiedApiResponse> {
|
|
// Do not impose a bridge-level timeout. Let the original fetch's AbortSignal
|
|
// (or OpenCode server response timing) control the lifecycle.
|
|
return sendBridgeMessageWithOptions<ProxiedApiResponse>('api:proxy', options, { timeoutMs: 0 });
|
|
}
|
|
|
|
export async function proxySessionMessageRequest(options: {
|
|
path: string;
|
|
headers?: Record<string, string>;
|
|
bodyText: string;
|
|
}): Promise<ProxiedApiResponse> {
|
|
// Keep parity with server-side direct forwarder: let extension host control timeout.
|
|
return sendBridgeMessageWithOptions<ProxiedApiResponse>('api:session:message', options, { timeoutMs: 0 });
|
|
}
|
|
|
|
export type ProxiedSseStartResponse = {
|
|
status: number;
|
|
headers: Record<string, string>;
|
|
streamId: string | null;
|
|
error?: string;
|
|
};
|
|
|
|
export async function startSseProxy(options: {
|
|
path: string;
|
|
headers?: Record<string, string>;
|
|
}): Promise<ProxiedSseStartResponse> {
|
|
return sendBridgeMessage<ProxiedSseStartResponse>('api:sse:start', options);
|
|
}
|
|
|
|
export async function stopSseProxy(options: { streamId: string }): Promise<{ stopped: boolean }> {
|
|
return sendBridgeMessage<{ stopped: boolean }>('api:sse:stop', options);
|
|
}
|
|
|
|
export async function executeVSCodeCommand(command: string, args?: unknown[]): Promise<{ result?: unknown }> {
|
|
return sendBridgeMessage<{ result?: unknown }>('vscode:command', { command, args });
|
|
}
|
|
|
|
type CommandHandler = (payload: unknown) => void;
|
|
const commandHandlers = new Map<string, CommandHandler>();
|
|
|
|
export function onCommand(command: string, handler: CommandHandler): () => void {
|
|
commandHandlers.set(command, handler);
|
|
return () => commandHandlers.delete(command);
|
|
}
|
|
|
|
window.addEventListener('message', (event: MessageEvent) => {
|
|
const message = event.data;
|
|
if (message?.type === 'command' && message.command) {
|
|
const handler = commandHandlers.get(message.command);
|
|
if (handler) {
|
|
handler(message.payload);
|
|
}
|
|
}
|
|
});
|
|
|
|
type ThemeChangePayload =
|
|
| 'light'
|
|
| 'dark'
|
|
| {
|
|
kind?: 'light' | 'dark' | 'high-contrast';
|
|
shikiThemes?: { light?: Record<string, unknown>; dark?: Record<string, unknown> } | null;
|
|
};
|
|
type ThemeChangeHandler = (theme: ThemeChangePayload) => void;
|
|
let themeChangeHandler: ThemeChangeHandler | null = null;
|
|
|
|
export function onThemeChange(handler: ThemeChangeHandler): () => void {
|
|
themeChangeHandler = handler;
|
|
return () => { themeChangeHandler = null; };
|
|
}
|
|
|
|
window.addEventListener('message', (event: MessageEvent) => {
|
|
const message = event.data;
|
|
if (message?.type === 'themeChange' && themeChangeHandler) {
|
|
themeChangeHandler(message.theme);
|
|
}
|
|
});
|