mirror of
https://github.com/RooVetGit/Roo-Code.git
synced 2026-08-28 05:27:24 +00:00
113 lines
4.4 KiB
TypeScript
113 lines
4.4 KiB
TypeScript
import { getUri } from "../utilities/getUri"
|
|
import { getNonce } from "../utilities/getNonce"
|
|
//import * as weather from "weather-js"
|
|
import * as vscode from "vscode"
|
|
|
|
/*
|
|
https://github.com/microsoft/vscode-webview-ui-toolkit-samples/blob/main/default/weather-webview/src/providers/WeatherViewProvider.ts
|
|
|
|
https://github.com/KumarVariable/vscode-extension-sidebar-html/blob/master/src/customSidebarViewProvider.ts
|
|
*/
|
|
|
|
|
|
export class SidebarProvider implements vscode.WebviewViewProvider {
|
|
public static readonly viewType = "vscodeSidebar.openview"
|
|
|
|
private _view?: vscode.WebviewView
|
|
|
|
constructor(private readonly _extensionUri: vscode.Uri) {}
|
|
|
|
resolveWebviewView(
|
|
webviewView: vscode.WebviewView,
|
|
context: vscode.WebviewViewResolveContext<unknown>,
|
|
token: vscode.CancellationToken
|
|
): void | Thenable<void> {
|
|
this._view = webviewView
|
|
|
|
webviewView.webview.options = {
|
|
// Allow scripts in the webview
|
|
enableScripts: true,
|
|
localResourceRoots: [this._extensionUri],
|
|
}
|
|
webviewView.webview.html = this.getHtmlContent(webviewView.webview)
|
|
|
|
// Sets up an event listener to listen for messages passed from the webview view context
|
|
// and executes code based on the message that is recieved
|
|
this._setWebviewMessageListener(webviewView.webview)
|
|
}
|
|
|
|
/**
|
|
* Defines and returns the HTML that should be rendered within the webview panel.
|
|
*
|
|
* @remarks This is also the place where references to the React webview build files
|
|
* are created and inserted into the webview HTML.
|
|
*
|
|
* @param webview A reference to the extension webview
|
|
* @param extensionUri The URI of the directory containing the extension
|
|
* @returns A template string literal containing the HTML that should be
|
|
* rendered within the webview panel
|
|
*/
|
|
private getHtmlContent(webview: vscode.Webview): string {
|
|
// Get the local path to main script run in the webview,
|
|
// then convert it to a uri we can use in the webview.
|
|
|
|
// The CSS file from the React build output
|
|
const stylesUri = getUri(webview, this._extensionUri, ["webview-ui", "build", "static", "css", "main.css"])
|
|
// The JS file from the React build output
|
|
const scriptUri = getUri(webview, this._extensionUri, ["webview-ui", "build", "static", "js", "main.js"])
|
|
|
|
// const scriptUri = webview.asWebviewUri(vscode.Uri.joinPath(this._extensionUri, "assets", "main.js"))
|
|
|
|
// const styleResetUri = webview.asWebviewUri(vscode.Uri.joinPath(this._extensionUri, "assets", "reset.css"))
|
|
// const styleVSCodeUri = webview.asWebviewUri(vscode.Uri.joinPath(this._extensionUri, "assets", "vscode.css"))
|
|
|
|
// // Same for stylesheet
|
|
// const stylesheetUri = webview.asWebviewUri(vscode.Uri.joinPath(this._extensionUri, "assets", "main.css"))
|
|
|
|
// Use a nonce to only allow a specific script to be run.
|
|
const nonce = getNonce()
|
|
|
|
// Tip: Install the es6-string-html VS Code extension to enable code highlighting below
|
|
return /*html*/ `
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
|
|
<meta name="theme-color" content="#000000">
|
|
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src ${webview.cspSource}; script-src 'nonce-${nonce}';">
|
|
<link rel="stylesheet" type="text/css" href="${stylesUri}">
|
|
<title>Hello World</title>
|
|
</head>
|
|
<body>
|
|
<noscript>You need to enable JavaScript to run this app.</noscript>
|
|
<div id="root"></div>
|
|
<script nonce="${nonce}" src="${scriptUri}"></script>
|
|
</body>
|
|
</html>
|
|
`
|
|
}
|
|
|
|
/**
|
|
* Sets up an event listener to listen for messages passed from the webview context and
|
|
* executes code based on the message that is recieved.
|
|
*
|
|
* @param webview A reference to the extension webview
|
|
* @param context A reference to the extension context
|
|
*/
|
|
private _setWebviewMessageListener(webview: vscode.Webview) {
|
|
webview.onDidReceiveMessage((message: any) => {
|
|
const command = message.command
|
|
const text = message.text
|
|
|
|
switch (command) {
|
|
case "hello":
|
|
// Code that should run in response to the hello message command
|
|
vscode.window.showInformationMessage(text)
|
|
return
|
|
// Add more switch case statements here as more webview message commands
|
|
// are created within the webview context (i.e. inside media/main.js)
|
|
}
|
|
})
|
|
}
|
|
}
|