@easy_vscode/webview 1.6.8 → 2.0.0

package/index.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react'
+
+export * from './src/helpers/callVscode'
+
+export type WebviewComponents = Record<string, React.FC>
+
+export interface WebviewRootProps {
+  components: WebviewComponents
+}
+
+export interface RegisterWebviewOptions {
+  Root?: React.FC<WebviewRootProps>
+}
+
+export declare function registerWebview(
+  webviewComponents: WebviewComponents,
+  options?: RegisterWebviewOptions
+): void

package/index.tsx

@@ -1,20 +1,34 @@
 import * as React from 'react'
 import { render } from 'react-dom'
-import App from './src/App'
-import i18n, { i18next } from '@easy_vscode/i18n'
 
 export * from './src/helpers/callVscode'
 
-interface IWebviewComponents {
-  [componentName: string]: React.FC
+export type WebviewComponents = Record<string, React.FC>
+
+export interface WebviewRootProps {
+  components: WebviewComponents
+}
+
+export interface RegisterWebviewOptions {
+  /** Root layout (e.g. Ant Design ConfigProvider). Default: mount selected view only. */
+  Root?: React.FC<WebviewRootProps>
+}
+
+const NO_CURRENT_VIEW = '$currentView$'
+
+const DefaultWebviewRoot: React.FC<WebviewRootProps> = ({ components }) => {
+  let currentView = (window as any).currentView
+  if (currentView === NO_CURRENT_VIEW) {
+    currentView = Object.keys(components)[0]
+  }
+  const CurrentComponent = components[currentView]
+  return CurrentComponent ? <CurrentComponent /> : null
 }
 
-export const registerWebview = function (webviewComponents: IWebviewComponents) {
-  const vscodeEnv = (window as any).vscodeEnv
-  const lng = vscodeEnv.language || 'en'
-  i18next.then(() => {
-    i18n.changeLanguage(lng,()=>{
-      render(<App components={webviewComponents} />, document.getElementById('root'))
-    })
-  })
+export const registerWebview = function (
+  webviewComponents: WebviewComponents,
+  options?: RegisterWebviewOptions
+) {
+  const Root = options?.Root ?? DefaultWebviewRoot
+  render(<Root components={webviewComponents} />, document.getElementById('root'))
 }

package/package.json

@@ -1,53 +1,25 @@
 {
   "name": "@easy_vscode/webview",
-  "version": "1.6.8",
-  "description": "webview of Easy Vscode",
+  "version": "2.0.0",
+  "description": "Lightweight webview runtime: registerWebview, callVscode",
   "license": "MIT",
   "author": "zhangjian",
   "main": "index.tsx",
+  "types": "index.d.ts",
   "scripts": {
-    "check-type": "tsc --noEmit",
-    "lint-staged": "lint-staged",
-    "ui-build": "webpack --config webpack.webview.js --color --mode production",
-    "ui-dev": "webpack serve --config webpack.webview.js --color --progress --mode development",
-    "ui-watch": "webpack --config webpack.webview.js --watch --mode development"
-  },
-  "dependencies": {
-    "@ant-design/icons": "^4.7.16",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.18.10",
-    "@easy_vscode/i18n": "^1.2.7",
-    "antd": "^4.22.5",
-    "babel-loader": "^8.2.5",
-    "babel-plugin-import": "^1.13.5",
-    "babel-plugin-styled-components": "^2.0.7",
-    "clean-webpack-plugin": "^4.0.0",
-    "commander": "^9.4.0",
-    "css-loader": "^6.7.1",
-    "fork-ts-checker-webpack-plugin": "4.1.6",
-    "html-webpack-plugin": "^5.5.0",
-    "less-loader": "^11.0.0",
-    "mini-css-extract-plugin": "^2.6.1",
-    "react-hot-loader": "^4.13.0",
-    "style-loader": "^3.3.1",
-    "styled-components": "^5.3.5",
-    "terser-webpack-plugin": "^5.3.4",
-    "vscode": "^1.1.37",
-    "webpack": "^5.45.1",
-    "webpack-cli": "^4.7.2"
-  },
-  "devDependencies": {
-    "@types/react-router-dom": "^5.3.3",
-    "@types/styled-components": "^5.1.26",
-    "@types/vscode": "^1.70.0"
+    "check-type": "tsc --noEmit"
   },
   "peerDependencies": {
     "react": ">=16.6.0",
     "react-dom": ">=16.6.0"
   },
+  "devDependencies": {
+    "@types/vscode": "^1.70.0",
+    "typescript": "^4.3.5"
+  },
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "c058050cda452621c095dac66fa93298417092fe"
+  "gitHead": "f3b585804107bc72f4d9834f36dced2074a713da"
 }

package/src/constants/index.ts

@@ -1,18 +1,18 @@
 /* eslint-disable @typescript-eslint/naming-convention */
 
-export const DIST_WEBVIEW_PATH = 'distWebview'
-export const DIST_WEBVIEW_INDEX_HTML = `${DIST_WEBVIEW_PATH}/index.html`
+// export const DIST_WEBVIEW_PATH = 'distWebview'
+// export const DIST_WEBVIEW_INDEX_HTML = `${DIST_WEBVIEW_PATH}/index.html`
 
-export const WEBVIEW_NAMES = {
-  PreviewImages: 'PreviewImages',
-}
+// export const WEBVIEW_NAMES = {
+//   PreviewImages: 'PreviewImages',
+// }
 
-export const NATIVE_CMD = {
-  WORKBENCH_ACTION_OPEN_SNIPPETS: 'workbench.action.openSnippets'
-}
+// export const NATIVE_CMD = {
+//   WORKBENCH_ACTION_OPEN_SNIPPETS: 'workbench.action.openSnippets'
+// }
 
-export const MESSAGE_CMD = {
-  EXECUTE_SPECIFIC_COMMAND: 'executeSpecificCommand',
-  EXECUTE_CHILD_PROCESS: 'executeChildProcess',
-  LOG_INFO: 'logInfo', // log for debug
-}
+// export const MESSAGE_CMD = {
+//   EXECUTE_SPECIFIC_COMMAND: 'executeSpecificCommand',
+//   EXECUTE_CHILD_PROCESS: 'executeChildProcess',
+//   LOG_INFO: 'logInfo', // log for debug
+// }

package/.babelrc

@@ -1,25 +0,0 @@
-{
-  "presets": [
-    "@babel/preset-env",
-    "@babel/preset-typescript",
-    "@babel/preset-react"
-  ],
-  "plugins": [
-    "@babel/plugin-transform-runtime",
-    ["@babel/plugin-proposal-decorators", { "legacy": true }],
-    ["@babel/plugin-proposal-class-properties", { "loose" : true }],
-    ["@babel/plugin-proposal-private-property-in-object", { "loose": true }],
-    ["@babel/plugin-proposal-private-methods", { "loose": true }],
-    ["babel-plugin-styled-components", { "ssr": false }],
-    "@babel/plugin-syntax-dynamic-import",
-    "react-hot-loader/babel",
-    [
-      "import",
-      {
-        "libraryName": "antd",
-        "style": true
-      }
-    ]
-  ],
-  "sourceType": "unambiguous"
-}

package/es/assets/open-link.svg

@@ -1,3 +0,0 @@
-<svg width="15" height="19" viewBox="0 0 15 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M14.8085 9.21906C14.8559 9.13191 14.8821 9.03265 14.8845 8.93096V8.93096C14.8824 8.77265 14.8239 8.62164 14.7216 8.51083L10.8897 4.36945C10.6739 4.13741 10.3288 4.14279 10.119 4.38146C9.90916 4.62012 9.91402 5.0017 10.1298 5.23374L13.0716 8.40279H4.53938C4.23962 8.40279 3.99661 8.67151 3.99661 9.00299C3.99661 9.33447 4.23962 9.60319 4.53938 9.60319H12.9848L10.1298 12.7842C9.91702 13.0196 9.91702 13.4012 10.1298 13.6365C10.3427 13.8719 10.6877 13.8719 10.9006 13.6365L14.6239 9.48315C14.7072 9.41667 14.7713 9.32495 14.8085 9.21906L14.8085 9.21906ZM5.08214 16.8056H1.82556C1.5258 16.8056 1.28279 16.5369 1.28279 16.2054V1.8006V1.8006C1.28279 1.46912 1.5258 1.2004 1.82556 1.2004H5.08214C5.3819 1.2004 5.6249 0.93168 5.6249 0.600199C5.6249 0.268719 5.3819 0 5.08214 0H1.82556C0.926277 0 0.197266 0.806156 0.197266 1.8006V16.2054V16.2054C0.197266 17.1998 0.926277 18.006 1.82556 18.006H5.08214C5.3819 18.006 5.6249 17.7373 5.6249 17.4058C5.6249 17.0743 5.3819 16.8056 5.08214 16.8056Z" fill="currentColor" />
-</svg>

package/es/assets/react-logo.svg

@@ -1,7 +0,0 @@
-<svg viewBox="-11.5 -10.23174 23 20.46348" color="white" xmlns="http://www.w3.org/2000/svg">
-  <circle fill="currentColor" r="2.05"/>
-  <g fill="none" stroke="currentColor">
-    <ellipse rx="11" ry="4.2"/>
-    <ellipse rx="11" ry="4.2" transform="matrix(.5 .8660254 -.8660254 .5 0 0)"/><ellipse rx="11" ry="4.2" transform="matrix(-.5 .8660254 -.8660254 -.5 0 0)"/>
-  </g>
-</svg>

package/es/global.css

@@ -1,100 +0,0 @@
-body {
-  background-color: #fff;
-  font-family: 'Roboto,PingFang SC';
-  font-size: 14px;
-  padding: 0;
-  margin: 0;
-}
-#root {
-  height: 100%;
-}
-
-/* remove drawer horizontal split line */
-.ant-drawer-wrapper-body .ant-drawer-header {
-  border-bottom: none;
-  padding: 16px 24px 8px;
-}
-.ant-drawer-wrapper-body .ant-drawer-footer {
-  border-top: none;
-  padding: 24px;
-}
-.ant-drawer-wrapper-body .ant-drawer-footer span {
-  font-weight: 500;
-}
-.ant-drawer-wrapper-body .ant-form-item-label > label {
-  font-size: 16px;
-}
-
-/* remove table columns split */
-div
-  .ant-table-thead
-  > tr
-  > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
-  background: none;
-}
-
-/* change selected menu appearance */
-div .ant-menu-inline .ant-menu-item::after {
-  border-right: none;
-}
-.ant-menu-item {
-  border-left: 3px solid rgba(0, 0, 0, 0);
-}
-.ant-menu-item-selected {
-  border-left: 3px solid #2673dd;
-}
-
-/* sub menu bgcolor */
-.ant-menu-submenu .ant-menu-sub.ant-menu-inline {
-  background: #fff;
-}
-
-div .ant-tag {
-  line-height: 24px;
-}
-
-/* let it be coverd by Modal.confirm,error... */
-div .ant-notification {
-  z-index: 800;
-}
-
-/* change horizontal Form label margin right */
-div .ant-form-horizontal .ant-form-item-label > label {
-  margin-right: 12px;
-}
-
-/* ui modal */
-div .ant-modal-confirm-body .ant-modal-confirm-title {
-  font-size: 20px;
-  font-weight: 500;
-}
-div .ant-modal-confirm .ant-modal-body {
-  padding: 24px;
-}
-div .ant-modal-close-x {
-  width: 64px;
-  height: 64px;
-  line-height: 64px;
-}
-
-div .ant-popover-inner-content {
-  padding: 24px;
-}
-div .ant-popover-title {
-  padding: 16px 24px 4px;
-  border-bottom: none;
-}
-
-div .ant-tooltip {
-  max-width: none;
-}
-
-.ant-modal-header {
-  border-bottom: none;
-}
-.ant-modal-footer {
-  border-top: none;
-}
-.ant-modal-body {
-  padding: 12px 24px;
-}

package/es/index.html

@@ -1,25 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <meta http-equiv="Content-Security-Policy" content="
-    default-src 'self' https://*;
-    connect-src 'self' https://* wss://* ws:;
-    font-src 'self' https://* blob: data:;
-    frame-src 'self' https://* blob: data:;
-    media-src 'self' https://* blob: data:;
-    img-src 'self' https://* blob: data:;
-    script-src 'self' 'unsafe-inline' 'unsafe-eval' https://* http://*;
-    style-src 'self' 'unsafe-inline' https://* blob: data: http://*;
-    "
-  />
-  <title>vscode-infra-webview</title>
-  <script type="text/javascript"> window.currentView = '$currentView$' </script>
-  <script type="text/javascript"> window.vscodeEnv = $vscodeEnv$ </script>
-</head>
-<body>
-  <div id="root"></div>
-</body>
-</html>

package/src/App.tsx

@@ -1,30 +0,0 @@
-import * as React from 'react'
-import { ConfigProvider } from 'antd'
-import 'antd/dist/antd.css'
-import './global.css'
-
-const NO_CURRENT_VIEW = '$currentView$'
-
-interface IAppProps{
-  components:Record<string, React.FunctionComponent>
-}
-
-const App: React.FC<IAppProps> = ({components={}}:IAppProps)=> {
-  let currentView = (window as any).currentView
-  if(currentView === NO_CURRENT_VIEW) {
-    currentView = Object.keys(components)[0]
-  }
- const CurrentComponent = components[currentView]
-  return (
-    <ConfigProvider
-      getPopupContainer={(triggerNode) => {
-        if (triggerNode) return triggerNode
-        return document.body
-      }}
-    >
-      <CurrentComponent />
-    </ConfigProvider>
-      )
-  }
-
-export default App

package/src/assets/open-link.svg

@@ -1,3 +0,0 @@
-<svg width="15" height="19" viewBox="0 0 15 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M14.8085 9.21906C14.8559 9.13191 14.8821 9.03265 14.8845 8.93096V8.93096C14.8824 8.77265 14.8239 8.62164 14.7216 8.51083L10.8897 4.36945C10.6739 4.13741 10.3288 4.14279 10.119 4.38146C9.90916 4.62012 9.91402 5.0017 10.1298 5.23374L13.0716 8.40279H4.53938C4.23962 8.40279 3.99661 8.67151 3.99661 9.00299C3.99661 9.33447 4.23962 9.60319 4.53938 9.60319H12.9848L10.1298 12.7842C9.91702 13.0196 9.91702 13.4012 10.1298 13.6365C10.3427 13.8719 10.6877 13.8719 10.9006 13.6365L14.6239 9.48315C14.7072 9.41667 14.7713 9.32495 14.8085 9.21906L14.8085 9.21906ZM5.08214 16.8056H1.82556C1.5258 16.8056 1.28279 16.5369 1.28279 16.2054V1.8006V1.8006C1.28279 1.46912 1.5258 1.2004 1.82556 1.2004H5.08214C5.3819 1.2004 5.6249 0.93168 5.6249 0.600199C5.6249 0.268719 5.3819 0 5.08214 0H1.82556C0.926277 0 0.197266 0.806156 0.197266 1.8006V16.2054V16.2054C0.197266 17.1998 0.926277 18.006 1.82556 18.006H5.08214C5.3819 18.006 5.6249 17.7373 5.6249 17.4058C5.6249 17.0743 5.3819 16.8056 5.08214 16.8056Z" fill="currentColor" />
-</svg>

package/src/assets/react-logo.svg

@@ -1,7 +0,0 @@
-<svg viewBox="-11.5 -10.23174 23 20.46348" color="white" xmlns="http://www.w3.org/2000/svg">
-  <circle fill="currentColor" r="2.05"/>
-  <g fill="none" stroke="currentColor">
-    <ellipse rx="11" ry="4.2"/>
-    <ellipse rx="11" ry="4.2" transform="matrix(.5 .8660254 -.8660254 .5 0 0)"/><ellipse rx="11" ry="4.2" transform="matrix(-.5 .8660254 -.8660254 -.5 0 0)"/>
-  </g>
-</svg>

package/src/common-styles/basic.ts

@@ -1,71 +0,0 @@
-import { Link } from 'react-router-dom'
-import styled from 'styled-components'
-import { Button } from 'antd'
-
-export const StyledCommonContent = styled.div`
-  background-color: #fff;
-  padding: 24px;
-  // height: 100%;
-  margin-bottom: 16px;
-`
-
-export const StyledSuffix = styled.span`
-  font-size: 14px;
-  color: #999;
-`
-
-export const StyledLinkName = styled(Link)`
-  display: block;
-  line-height: 16px;
-  font-size: 14px;
-  font-weight: 500;
-  color: #2673dd;
-  text-decoration: underline;
-  cursor: pointer;
-`
-
-export const StyledEllipsis = styled.div`
-  display: inline-block;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-`
-
-export const StyledTitle = styled.div`
-  font-weight: bold;
-  font-size: 26px;
-  line-height: 28px;
-  color: #333;
-  margin-bottom: 24px;
-`
-
-export const StyleTag = styled.span`
-  padding: 4px 8px;
-  border: 1px solid #e5e5e5;
-  border-radius: 2px;
-  background: #fafafa;
-  color: #333333;
-  font-size: 14px;
-  margin: 0 4px 4px 0;
-  display: inline-block;
-`
-
-export const StyledLinkButton = styled(Button)`
-  padding-left: 0;
-`
-
-export const StyledSubTitle = styled.div`
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-size: 18px;
-  line-height: 20px;
-  color: #333;
-  margin-bottom: 32px;
-`
-
-export const StyledBlockTitle = styled.div`
-  font-weight: 500;
-  font-size: 18px;
-  margin-bottom: 24px;
-`

package/src/common-styles/descriptions.ts

@@ -1,9 +0,0 @@
-import styled from 'styled-components'
-import { Descriptions as AntdDescriptions } from 'antd'
-
-export const Descriptions = styled(AntdDescriptions)`
-  .ant-descriptions-item-label {
-    color: #999;
-    padding: 0 16px;
-  }
-`

package/src/common-styles/flexWrapper.ts

@@ -1,44 +0,0 @@
-import styled from 'styled-components'
-
-export const StyledEndWrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-`
-
-export const StyledCenterWrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`
-
-export const StyledBetweenWrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-`
-
-export const styledAroundWrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: space-around;
-`
-
-export const StyledHorizonCenterWrapper = styled.div`
-  display: flex;
-  align-items: center;
-`
-
-export const StyledFlexWrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  display: flex;
-`

package/src/common-styles/table.ts

@@ -1,72 +0,0 @@
-import styled from 'styled-components'
-import { Table as AntdTable, Input, DatePicker } from 'antd'
-
-const { RangePicker } = DatePicker
-
-export const Table = styled(AntdTable)`
-  .ant-table-container {
-    border: 1px solid #f0f0f0;
-    border-bottom: none;
-  }
-
-  .ant-table-thead {
-    height: 40px;
-  }
-
-  .ant-table-thead > tr > th {
-    padding: 5px 15px;
-    font-weight: 400;
-    font-size: 14px;
-    color: #666;
-  }
-
-  .ant-table-tbody > tr .ant-table-wrapper:only-child .ant-table {
-    margin: 0;
-
-    .ant-table-tbody > tr:last-child > td {
-      border-bottom: 1px solid #f0f0f0;
-    }
-  }
-
-  .ant-table-tbody > tr > td {
-    color: #333;
-    padding: 16px 16px;
-  }
-
-  .ant-table-expanded-row > .ant-table-cell {
-    background: #fff;
-  }
-
-  .ant-table-column-sorters {
-    padding: 16px 0;
-  }
-
-  .ant-table {
-    position: relative;
-    z-index: 1;
-  }
-`
-
-export const IPAddress = styled.div`
-  white-space: nowrap;
-  font-size: 12px;
-  font-weight: 400;
-  line-height: 14px;
-`
-
-export const IPLabel = styled.span`
-  color: #b7b7b7;
-`
-
-export const StyledInput = styled(Input)`
-  width: 480px;
-`
-
-export const StyledRangePicker = styled(RangePicker)`
-  margin-left: 24px;
-`
-
-export const Header = styled.div`
-  display: flex;
-  margin-bottom: 24px;
-`

package/src/common-styles/tabs.ts

@@ -1,18 +0,0 @@
-import styled from 'styled-components'
-import { Tabs as AntdTabs } from 'antd'
-
-export const Tabs = styled(AntdTabs)`
-  .ant-tabs-nav {
-    margin: 0 0 24px 0;
-    line-height: 18px;
-  }
-  .ant-tabs-tab {
-    padding: 0 19px 16px 19px;
-  }
-  .ant-tabs-tab + .ant-tabs-tab {
-    margin: 0;
-  }
-  .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn span {
-    color: #2673dd;
-  }
-`

package/src/global.css

@@ -1,100 +0,0 @@
-body {
-  background-color: #fff;
-  font-family: 'Roboto,PingFang SC';
-  font-size: 14px;
-  padding: 0;
-  margin: 0;
-}
-#root {
-  height: 100%;
-}
-
-/* remove drawer horizontal split line */
-.ant-drawer-wrapper-body .ant-drawer-header {
-  border-bottom: none;
-  padding: 16px 24px 8px;
-}
-.ant-drawer-wrapper-body .ant-drawer-footer {
-  border-top: none;
-  padding: 24px;
-}
-.ant-drawer-wrapper-body .ant-drawer-footer span {
-  font-weight: 500;
-}
-.ant-drawer-wrapper-body .ant-form-item-label > label {
-  font-size: 16px;
-}
-
-/* remove table columns split */
-div
-  .ant-table-thead
-  > tr
-  > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
-  background: none;
-}
-
-/* change selected menu appearance */
-div .ant-menu-inline .ant-menu-item::after {
-  border-right: none;
-}
-.ant-menu-item {
-  border-left: 3px solid rgba(0, 0, 0, 0);
-}
-.ant-menu-item-selected {
-  border-left: 3px solid #2673dd;
-}
-
-/* sub menu bgcolor */
-.ant-menu-submenu .ant-menu-sub.ant-menu-inline {
-  background: #fff;
-}
-
-div .ant-tag {
-  line-height: 24px;
-}
-
-/* let it be coverd by Modal.confirm,error... */
-div .ant-notification {
-  z-index: 800;
-}
-
-/* change horizontal Form label margin right */
-div .ant-form-horizontal .ant-form-item-label > label {
-  margin-right: 12px;
-}
-
-/* ui modal */
-div .ant-modal-confirm-body .ant-modal-confirm-title {
-  font-size: 20px;
-  font-weight: 500;
-}
-div .ant-modal-confirm .ant-modal-body {
-  padding: 24px;
-}
-div .ant-modal-close-x {
-  width: 64px;
-  height: 64px;
-  line-height: 64px;
-}
-
-div .ant-popover-inner-content {
-  padding: 24px;
-}
-div .ant-popover-title {
-  padding: 16px 24px 4px;
-  border-bottom: none;
-}
-
-div .ant-tooltip {
-  max-width: none;
-}
-
-.ant-modal-header {
-  border-bottom: none;
-}
-.ant-modal-footer {
-  border-top: none;
-}
-.ant-modal-body {
-  padding: 12px 24px;
-}

package/src/helpers/fetch.ts

@@ -1,98 +0,0 @@
-import axio from 'axios'
-
-const STATUS_UNAUTH = 401
-const STATUS_NOT_FOUND = 404
-
-const axios = axio.create({
-  baseURL: '',
-  timeout: 15000,
-  headers: {
-    Accept: 'application/json',
-    'Content-Type': 'application/json;charset=utf-8'
-  }
-})
-axios.interceptors.request.use(
-  (config) => {
-    return config
-  },
-  (error) => Promise.reject(error)
-)
-axios.interceptors.response.use(
-  (res) => res,
-  (error) => {
-    if (error.response) {
-      if (error.response.status === STATUS_UNAUTH) {
-        // unauthorizedCb()
-        console.error('please login')
-      } else if (error.response.status === STATUS_NOT_FOUND) {
-        console.error('resource not found')
-      } else if (error.response.status >= 500) {
-        console.error('server error')
-      }
-    } else {
-      console.error('network error')
-    }
-    return Promise.reject(error)
-  }
-)
-
-interface IFetchParam {
-  server?: string
-  version?: string
-  resource?: string
-  payload?: any
-  params?: any
-  contentType?: string
-  method?: 'GET' | 'POST' | 'DELETE' | 'PATCH' | 'PUT'
-  headers?: any
-  credentials?: string
-  timeout?: number
-}
-
-/**
- * fetch util
- * @param {*} fetchParam
- * @returns promise
- */
-// const request = (url, method, params = {}, config) => {
-const request = (fetchParam: IFetchParam): Promise<any> => {
-  const { resource, method = 'GET', params = {}, payload = {}, headers = {}, ...config } = fetchParam
-  const reqParams: any = {
-    url: resource,
-    method,
-    headers,
-    ...config
-  }
-  reqParams.params = { env: 'test', ...params }
-  if (method.toUpperCase() !== 'GET') {
-    reqParams.data = payload
-  }
-  return new Promise((resolve, reject) => {
-    axios(reqParams)
-      .then((response: any) => {
-        const error = response.data?.error
-        if (error) {
-          reject(error)
-        }
-        resolve(response.data)
-      })
-      .catch((error) => {
-        reject(error.response && error.response.data)
-        console.error('fetch error', error)
-      })
-  })
-}
-
-export default request
-
-export class HTTPError extends Error {
-  code: number
-  details: any
-
-  constructor(message: string, code: number, details: any) {
-    super(message)
-    this.message = message
-    this.code = code
-    this.details = details
-  }
-}

package/src/index.html

@@ -1,26 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <meta http-equiv="Content-Security-Policy" content="
-    default-src 'self' https://*;
-    connect-src 'self' https://* wss://* ws:;
-    font-src 'self' https://* blob: data:;
-    frame-src 'self' https://* blob: data:;
-    media-src 'self' https://* blob: data:;
-    img-src 'self' https://* blob: data:;
-    script-src 'self' 'unsafe-inline' 'unsafe-eval' https://* http://*;
-    style-src 'self' 'unsafe-inline' https://* blob: data: http://*;
-    "
-  />
-  <title>vscode-infra-webview</title>
-  <script type="text/javascript"> window.currentView = '$currentView$' </script>
-  <script type="text/javascript"> window.vscodeEnv = $vscodeEnv$ </script>
-  <script type="text/javascript"> window.commandArgs = $commandArgs$ </script>
-</head>
-<body>
-  <div id="root"></div>
-</body>
-</html>

package/webpack.webview.js

@@ -1,137 +0,0 @@
-const { CleanWebpackPlugin } = require('clean-webpack-plugin')
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
-const path = require('path')
-const TerserPlugin = require('terser-webpack-plugin')
-const webpack = require('webpack')
-
-const cssUse = [MiniCssExtractPlugin.loader].concat('css-loader')
-const cssUseDebug = ['style-loader', 'css-loader']
-
-console.log('process.cwd():', process.cwd())
-console.log('__dirname:', __dirname)
-
-// const isProductionMode = argv.mode === 'production'
-const isProductionMode = true
-exports.default = {
-  target: 'web',
-  entry: {
-    // app: ['./src/webviewUI/src/index.tsx']
-    app: [path.resolve(__dirname, './src/index.tsx')]
-  },
-  output: {
-    path: path.resolve('./distWebview/'),
-    publicPath: '/'
-  },
-  optimization: {
-    chunkIds: 'named',
-    minimizer: [
-      new TerserPlugin({
-        parallel: true
-      })
-    ]
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(j|t)sx?$/,
-        use: {
-          loader: 'babel-loader',
-          options: {
-            cacheDirectory: true,
-            babelrc: true,
-            configFile: path.resolve(__dirname, './.babelrc')
-          }
-        }
-      },
-      {
-        test: /\.css$/,
-        use: isProductionMode ? cssUse : cssUseDebug
-      },
-      {
-        test: /\.less$/,
-        use: [
-          { loader: 'style-loader' },
-          { loader: 'css-loader' },
-          {
-            loader: 'less-loader',
-            options: {
-              lessOptions: {
-                modifyVars: {
-                  'primary-color': '#2673DD',
-                  'link-color': '#2673DD'
-                },
-                javascriptEnabled: true
-              }
-            }
-          }
-        ]
-      },
-      {
-        test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
-        use: [
-          {
-            loader: 'babel-loader'
-          },
-          {
-            loader: '@svgr/webpack',
-            options: {
-              babel: false,
-              icon: true
-            }
-          }
-        ]
-      },
-      {
-        test: /\.(png|jpg|gif|woff2|svg?)$/,
-        use: [
-          {
-            loader: 'url-loader',
-            options: {
-              limit: 10000
-            }
-          }
-        ]
-      }
-    ]
-  },
-  resolve: {
-    extensions: ['.tsx', '.ts', '.js'],
-    modules: [path.resolve(__dirname, 'src'), 'node_modules']
-  },
-  plugins: [
-    new CleanWebpackPlugin(),
-    // !isProductionMode &&
-    new ForkTsCheckerWebpackPlugin({
-      reportFiles: ['src/**/*.{ts,tsx}']
-    }),
-    new HtmlWebpackPlugin({
-      template: path.resolve(__dirname, './src/index.html'),
-      favicon: path.resolve(__dirname, './src/favicon.ico'),
-      inject: true,
-      minify: {
-        html5: true,
-        minifyCSS: false,
-        minifyJS: false,
-        removeComments: false,
-        collapseWhitespace: false,
-        preserveLineBreaks: true
-      }
-    }),
-    new webpack.HotModuleReplacementPlugin(),
-    new MiniCssExtractPlugin({
-      filename: isProductionMode ? '[name].[hash].css' : '[name].css',
-      chunkFilename: isProductionMode ? '[id].[hash].css' : '[id].css'
-    })
-  ],
-  devServer: {
-    historyApiFallback: {
-      disableDotRule: true
-    },
-    hot: true,
-    compress: true,
-    port: 5000
-  },
-  devtool: isProductionMode ? false : 'source-map'
-}