devstar_plugin/src/home.ts

import * as vscode from 'vscode';
import RemoteContainer from './remote-container';
import {fetch} from './utils'

export default class DSHome {
  private context: vscode.ExtensionContext;
  private remoteContainer: RemoteContainer;
  static defaultUrl = 'http://localhost:8080/test/index.html';

  constructor(context: vscode.ExtensionContext) {
    this.context = context;
    this.remoteContainer = new RemoteContainer()
  }

  async toggle(url: string = DSHome.defaultUrl) {
    console.log(url);
    const panel = vscode.window.createWebviewPanel(
      'homeWebview',
      'Home',
      vscode.ViewColumn.One,
      {
        enableScripts: true,
      }
    );

    fetch(url).then(async (content) => {
      panel.webview.html = await this.getWebviewContent(content);
    })

    panel.webview.onDidReceiveMessage(
      async (message) => {
        switch (message.command) {
          case 'firstOpenRemoteFolder':
            await this.remoteContainer.firstConnect(message.host, message.username, message.password, message.port)
            .then((_res) => {
              if (_res == 'success') {
                //  only success then open folder
                this.remoteContainer.openRemoteFolder(message.host, message.path);
              }
            }).catch(error => {
              console.error(`Failed to connect ${message.host}: `, error)
            })
            break;
          case 'openRemoteFolder':
            this.remoteContainer.openRemoteFolder(message.host, message.path);
            break;
          case 'getUserToken':
            const userToken = this.context.globalState.get('devstarUserToken')
            if (userToken === undefined) {
              panel.webview.postMessage({ command: 'getUserToken', data: {userToken: 'none'}})
              break;
            } else {
              panel.webview.postMessage({ command: 'getUserToken', data: {userToken: userToken}})
              break;
            }
          case 'setUserToken':
            this.context.globalState.update('devstarUserToken', message.data.userToken)
            console.log(this.context.globalState.get('devstarUserToken'))
            console.log(message.data.userToken)
            if (message.data.userToken === this.context.globalState.get('devstarUserToken')) {
              panel.webview.postMessage({ command: 'setUserToken', data: {ok: true}})
              break;
            } else {
              panel.webview.postMessage({ command: 'setUserToken', data: {ok: false}})
              break;
            }
        }
      },
      undefined,
      this.context.subscriptions
    );

    this.context.subscriptions.push(panel)
  }


  async getWebviewContent(content: string): Promise<string> {
    return `${content}`
  }
}