Skip to content

Commit a883e1a

Browse files
dgolovindgolovin
committed
File structure for Create Service View
This PR fixes #1787. Signed-off-by: Denis Golovin [email protected]
1 parent 4157cd3 commit a883e1a

File tree

7 files changed

+247
-0
lines changed

7 files changed

+247
-0
lines changed

‎.eslintignore

+1
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,4 @@ src/webview/describe
1111
src/webview/cluster
1212
src/webview/webpack.config.js
1313
out
14+
src/webview/create-service

‎package.json

+3
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@
6161
"dev:log-view": "webpack-dev-server --mode development --config src/webview/log/webpack.config.js",
6262
"dev:describe-view": "webpack-dev-server --mode development --config src/webview/describe/webpack.config.js",
6363
"dev:cluster-view": "webpack-dev-server --mode development --config src/webview/cluster/webpack.config.js",
64+
"dev:create-service-view": "webpack-dev-server --mode development --config src/webview/create-service/webpack.config.js",
6465
"watch": "tsc -watch -p ./",
6566
"clean": "shx rm -rf out/build out/coverage out/src out/test out/tools out/test-resources out/logViewer",
6667
"lint": "eslint . --ext .ts --quiet",
@@ -83,6 +84,7 @@
8384
"base64-inline-loader": "^1.1.1",
8485
"binary-search": "^1.3.6",
8586
"byline": "^5.0.0",
87+
"chokidar": "^3.5.1",
8688
"fs-extra": "^8.1.0",
8789
"git-fetch-pack": "^0.1.1",
8890
"git-transport-protocol": "^0.1.0",
@@ -107,6 +109,7 @@
107109
"@material-ui/core": "^4.11.0",
108110
"@material-ui/icons": "^4.9.1",
109111
"@material-ui/lab": "^4.0.0-alpha.56",
112+
"@rjsf/core": "^2.5.1",
110113
"@types/byline": "^4.2.31",
111114
"@types/chai": "^4.2.10",
112115
"@types/collections": "^5.0.0",

‎src/webview/create-service/app/index.html

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<base href="%BASE_URL%" />
5+
<meta charset="UTF-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Create Service View</title>
8+
<!-- meta http-equiv="Content-Security-Policy" -->
9+
<script>
10+
if (typeof acquireVsCodeApi !== 'undefined') {
11+
window.acquireVsCodeApi = acquireVsCodeApi;
12+
window.cmdText = "%COMMAND%";
13+
window.platform = "%PLATFORM%";
14+
}
15+
</script>
16+
<style>
17+
html,
18+
body {
19+
padding: 0;
20+
overflow: visible;
21+
}
22+
23+
body.vscode-light {
24+
color: black;
25+
}
26+
27+
body.vscode-dark {
28+
color: white;
29+
}
30+
31+
body.vscode-high-contrast {
32+
color: red;
33+
}
34+
35+
.box {
36+
display: flex;
37+
flex-flow: column;
38+
position: absolute;
39+
top: 0px;
40+
bottom: 1px;
41+
left: 0px;
42+
right: 0px;
43+
}
44+
45+
.box .row.header {
46+
flex: 0 1 auto;
47+
}
48+
49+
.box .row.content {
50+
flex: 1 1 auto;
51+
}
52+
</style>
53+
</head>
54+
<body>
55+
<div class="box" id="root"></div>
56+
</body>
57+
</html>

‎src/webview/create-service/app/index.tsx

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
/*-----------------------------------------------------------------------------------------------
2+
* Copyright (c) Red Hat, Inc. All rights reserved.
3+
* Licensed under the MIT License. See LICENSE file in the project root for license information.
4+
*-----------------------------------------------------------------------------------------------*/
5+
6+
import * as ReactDOM from 'react-dom';
7+
import * as React from 'react';
8+
import Form from '@rjsf/core';
9+
import { JSONSchema7 } from 'json-schema';
10+
11+
const schema: JSONSchema7 = {
12+
title: "Todo",
13+
type: "object",
14+
required: ["title"],
15+
properties: {
16+
title: {type: "string", title: "Title", default: "A new task"},
17+
done: {type: "boolean", title: "Done?", default: false}
18+
}
19+
};
20+
21+
const log = (type) => console.log.bind(console, type);
22+
23+
ReactDOM.render((
24+
<Form schema={schema}
25+
onChange={log("changed")}
26+
onSubmit={log("submitted")}
27+
onError={log("errors")}
28+
liveValidate />
29+
), document.getElementById('root'));

‎src/webview/create-service/app/tsconfig.json

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"compilerOptions": {
3+
"module": "esnext",
4+
"moduleResolution": "node",
5+
"target": "es6",
6+
"outDir": "creatServiceView",
7+
"lib": [
8+
"es6",
9+
"dom"
10+
],
11+
"jsx": "react",
12+
"sourceMap": true,
13+
"noUnusedLocals": true,
14+
// "noImplicitReturns": true,
15+
"noFallthroughCasesInSwitch": true,
16+
"experimentalDecorators": true,
17+
"typeRoots": [
18+
"../../../../node_modules/@types",
19+
"../../@types"
20+
],
21+
"baseUrl": ".",
22+
},
23+
"exclude": [
24+
"node_modules"
25+
]
26+
}

‎src/webview/create-service/createServiceViewLoader.ts

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
/*-----------------------------------------------------------------------------------------------
2+
* Copyright (c) Red Hat, Inc. All rights reserved.
3+
* Licensed under the MIT License. See LICENSE file in the project root for license information.
4+
*-----------------------------------------------------------------------------------------------*/
5+
import * as vscode from 'vscode';
6+
import * as path from 'path';
7+
import * as fs from 'fs';
8+
import { spawn, ChildProcess } from 'child_process';
9+
import { ExtenisonID } from '../../util/constants';
10+
import { WindowUtil } from '../../util/windowUtils';
11+
import { CliChannel } from '../../cli';
12+
import { vsCommand } from '../../vscommand';
13+
14+
let panel: vscode.WebviewPanel;
15+
16+
const channel: vscode.OutputChannel = vscode.window.createOutputChannel('CRC Logs');
17+
18+
async function clusterEditorMessageListener (event: any ): Promise<any> {
19+
//temp empty
20+
}
21+
22+
export default class ClusterViewLoader {
23+
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
24+
static get extensionPath() {
25+
return vscode.extensions.getExtension(ExtenisonID).extensionPath
26+
}
27+
28+
// eslint-disable-next-line @typescript-eslint/require-await
29+
static async loadView(title: string): Promise<vscode.WebviewPanel> {
30+
const localResourceRoot = vscode.Uri.file(path.join(ClusterViewLoader.extensionPath, 'out', 'createServiceView'));
31+
if (panel) {
32+
// If we already have a panel, show it in the target column
33+
panel.reveal(vscode.ViewColumn.One);
34+
} else {
35+
panel = vscode.window.createWebviewPanel('createServiceView', title, vscode.ViewColumn.One, {
36+
enableScripts: true,
37+
localResourceRoots: [localResourceRoot],
38+
retainContextWhenHidden: true
39+
});
40+
}
41+
panel.iconPath = vscode.Uri.file(path.join(ClusterViewLoader.extensionPath, 'images/context/cluster-node.png'));
42+
panel.webview.html = ClusterViewLoader.getWebviewContent(ClusterViewLoader.extensionPath, panel);
43+
panel.webview.postMessage({action: 'cluster', data: ''});
44+
panel.onDidDispose(()=> {
45+
panel = undefined;
46+
});
47+
panel.webview.onDidReceiveMessage(clusterEditorMessageListener);
48+
return panel;
49+
}
50+
51+
private static getWebviewContent(extensionPath: string, p: vscode.WebviewPanel): string {
52+
// Local path to main script run in the webview
53+
const reactAppRootOnDisk = path.join(extensionPath, 'out', 'createServiceView');
54+
const reactAppPathOnDisk = vscode.Uri.file(
55+
path.join(reactAppRootOnDisk, 'createServiceView.js'),
56+
);
57+
const reactAppUri = p.webview.asWebviewUri(reactAppPathOnDisk);
58+
const htmlString:Buffer = fs.readFileSync(path.join(reactAppRootOnDisk, 'index.html'));
59+
const meta = `<meta http-equiv="Content-Security-Policy"
60+
content="connect-src *;
61+
default-src 'none';
62+
img-src ${p.webview.cspSource} https: 'self' data:;
63+
script-src 'unsafe-eval' 'unsafe-inline' vscode-resource:;
64+
style-src 'self' vscode-resource: 'unsafe-inline';">`;
65+
return `${htmlString}`
66+
.replace('%COMMAND%', '')
67+
.replace('%PLATFORM%', process.platform)
68+
.replace('createServiceView.js',`${reactAppUri}`)
69+
.replace('%BASE_URL%', `${reactAppUri}`)
70+
.replace('<!-- meta http-equiv="Content-Security-Policy" -->', meta);
71+
}
72+
}

‎src/webview/create-service/webpack.config.js

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
/*-----------------------------------------------------------------------------------------------
2+
* Copyright (c) Red Hat, Inc. All rights reserved.
3+
* Licensed under the MIT License. See LICENSE file in the project root for license information.
4+
*-----------------------------------------------------------------------------------------------*/
5+
6+
// eslint-disable-next-line @typescript-eslint/no-var-requires
7+
const path = require("path");
8+
9+
// eslint-disable-next-line @typescript-eslint/no-var-requires
10+
const HtmlWebPackPlugin = require( 'html-webpack-plugin' );
11+
12+
module.exports = {
13+
entry: {
14+
createServiceView: "./src/webview/create-service/app/index.tsx"
15+
},
16+
output: {
17+
path: path.resolve(__dirname, "../../../out", "createServiceView"),
18+
filename: "[name].js"
19+
},
20+
devtool: "eval-source-map",
21+
resolve: {
22+
extensions: [".js", ".ts", ".tsx", ".json"]
23+
},
24+
module: {
25+
rules: [
26+
{
27+
test: /\.(ts|tsx)$/,
28+
loader: "ts-loader",
29+
},
30+
{
31+
test: /\.css$/,
32+
use: [
33+
{
34+
loader: "style-loader",
35+
},
36+
{
37+
loader: "css-loader",
38+
},
39+
]
40+
},
41+
{
42+
test: /\.(png|jpg|jpeg|gif|svg|woff2?|ttf|eot|otf)(\?.*$|$)/,
43+
loader: 'file-loader',
44+
options: {
45+
name: 'assets/[name].[ext]',
46+
},
47+
},
48+
]
49+
},
50+
performance: {
51+
hints: false,
52+
},
53+
plugins: [
54+
new HtmlWebPackPlugin({
55+
template: path.resolve( __dirname, 'app', 'index.html' ),
56+
filename: 'index.html',
57+
})
58+
],
59+
};

0 commit comments

Comments
 (0)