import * as vscode from "vscode" ; import { accessTokenKey , apiBaseUrl , refreshTokenKey } from "./constants" ; import { FlairProvider } from "./FlairProvider" ; import { getNonce } from "./getNonce" ; import { Util } from "./util" ; import jwt from "jsonwebtoken" ; import { RecordingSteps } from "./types" ; type Data = { initRecordingSteps : RecordingSteps ; intialText : string ; } ; export class PreviewStoryPanel { /**
     * Track the currently panel. Only allow a single panel to exist at a time.
     */ public static currentPanel : PreviewStoryPanel | undefined ; public static readonly viewType = "previewStory" ; private readonly _panel : vscode . WebviewPanel ; private readonly _extensionUri : vscode . Uri ; private _data : Data ; private _disposables : vscode . Disposable [ ] = [ ] ; public static createOrShow ( extensionUri , _data ) { const column = vscode . window . activeTextEditor ? vscode . window . activeTextEditor . viewColumn : undefined ; if ( PreviewStoryPanel . currentPanel ) { PreviewStoryPanel . currentPanel . _panel . reveal ( column ) ; PreviewStoryPanel . currentPanel . _data = _data ; PreviewStoryPanel . currentPanel . _update ( ) ; return ; } const panel = vscode . window . createWebviewPanel ( PreviewStoryPanel . viewType , "View Story" , column || vscode . ViewColumn . One , { enableScripts : true , localResourceRoots : [ vscode . Uri . joinPath ( extensionUri , "media" ) , vscode . Uri . joinPath ( extensionUri , "out/compiled" ) , ] , } ) ; PreviewStoryPanel . currentPanel = new PreviewStoryPanel ( panel , extensionUri , _data ) ; } public static revive ( panel , extensionUri , _data ) { PreviewStoryPanel . currentPanel = new PreviewStoryPanel ( panel , extensionUri , _data ) ; } private constructor ( panel , extensionUri , _data ) { this . _panel = panel ; this . _extensionUri = extensionUri ; this . _data = _data ; this . _update ( ) ; this . _panel . onDidDispose ( ( ) => this . dispose ( ) , null , this . _disposables ) ; } public dispose ( ) { PreviewStoryPanel . currentPanel = undefined ; this . _panel . dispose ( ) ; while ( this . _disposables . length ) { const x = this . _disposables . pop ( ) ; if ( x ) { x . dispose ( ) ; } } } private async _update ( ) { const webview = this . _panel . webview ; this . _panel . webview . html = this . _getHtmlForWebview ( webview ) ; } private _getHtmlForWebview ( webview ) { const scriptUri = webview . asWebviewUri ( vscode . Uri . joinPath ( this . _extensionUri , "out" , "compiled/preview-story.js" ) ) ; const styleResetPath = vscode . Uri . joinPath ( this . _extensionUri , "media" , "reset.css" ) ; const stylesPathMainPath = vscode . Uri . joinPath ( this . _extensionUri , "media" , "vscode.css" ) ; const stylesResetUri = webview . asWebviewUri ( styleResetPath ) ; const stylesMainUri = webview . asWebviewUri ( stylesPathMainPath ) ; const cssUri = webview . asWebviewUri ( vscode . Uri . joinPath ( this . _extensionUri , "out" , "compiled/preview-story.css" ) ) ; const nonce = getNonce ( ) ; return `<!DOCTYPE html>
			<html lang="en">
			<head>
				<meta charset="UTF-8">
				<!--
					Use a content security policy to only allow loading images from https or from our extension directory,
					and only allow scripts that have a specific nonce.
        -->
        <meta http-equiv="Content-Security-Policy" content="default-src ${ apiBaseUrl }; img-src https: data:; style-src ${ webview . cspSource }; script-src 'nonce-${ nonce }';">
				<meta name="viewport" content="width=device-width, initial-scale=1.0">
				<link href="${ stylesResetUri }" rel="stylesheet">
				<link href="${ stylesMainUri }" rel="stylesheet">
        <link href="${ cssUri }" rel="stylesheet">
        <script nonce="${ nonce }">
            const initRecordingSteps = ${ JSON . stringify ( this . _data . initRecordingSteps ) };
            const initialText = ${ JSON . stringify ( this . _data . intialText ) };
            const tsvscode = acquireVsCodeApi();
        </script>
			</head>
      <body>
			</body>
				<script nonce="${ nonce }" src="${ scriptUri }"></script>
			</html>` ; } }