mirror of
https://github.com/ZeppelinBot/Zeppelin.git
synced 2025-06-07 16:05:01 +00:00
feat: add config-checker page
This commit is contained in:
parent
83d35052c3
commit
bca5d05d72
11 changed files with 19158 additions and 1 deletions
|
@ -29,7 +29,7 @@
|
||||||
"migrate-rollback-prod": "npm run migrate-rollback",
|
"migrate-rollback-prod": "npm run migrate-rollback",
|
||||||
"migrate-rollback-dev": "npm run build && npm run migrate-rollback",
|
"migrate-rollback-dev": "npm run build && npm run migrate-rollback",
|
||||||
"validate-active-configs": "node --enable-source-maps dist/validateActiveConfigs.js > ../config-errors.txt",
|
"validate-active-configs": "node --enable-source-maps dist/validateActiveConfigs.js > ../config-errors.txt",
|
||||||
"export-config-json-schema": "node --enable-source-maps dist/exportSchemas.js",
|
"export-config-json-schema": "node --enable-source-maps dist/exportSchemas.js ../config-checker/public/config-schema.json",
|
||||||
"test": "npm run build && npm run run-tests",
|
"test": "npm run build && npm run run-tests",
|
||||||
"run-tests": "ava",
|
"run-tests": "ava",
|
||||||
"test-watch": "tsc-watch --build --onSuccess \"npx ava\""
|
"test-watch": "tsc-watch --build --onSuccess \"npx ava\""
|
||||||
|
|
24
config-checker/.gitignore
vendored
Normal file
24
config-checker/.gitignore
vendored
Normal file
|
@ -0,0 +1,24 @@
|
||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
|
||||||
|
node_modules
|
||||||
|
dist
|
||||||
|
dist-ssr
|
||||||
|
*.local
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.vscode/*
|
||||||
|
!.vscode/extensions.json
|
||||||
|
.idea
|
||||||
|
.DS_Store
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
36
config-checker/index.html
Normal file
36
config-checker/index.html
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<link rel="stylesheet" href="/src/style.css">
|
||||||
|
<title>Zeppelin config checker</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="wrap">
|
||||||
|
<div class="section" style="flex: 1 1 auto">
|
||||||
|
<div class="title">
|
||||||
|
<h1>Config</h1>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="editor-wrap">
|
||||||
|
<div id="editor"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section" style="flex: 0 0 max(300px, 40vh)">
|
||||||
|
<div class="title">
|
||||||
|
<h1>Errors</h1>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="errors-wrap">
|
||||||
|
<div id="errors"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type="module" src="/src/main.ts"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
1179
config-checker/package-lock.json
generated
Normal file
1179
config-checker/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
18
config-checker/package.json
Normal file
18
config-checker/package.json
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
{
|
||||||
|
"name": "config-checker",
|
||||||
|
"private": true,
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite --host 127.0.0.1",
|
||||||
|
"build": "tsc && vite build",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"typescript": "~5.8.3",
|
||||||
|
"vite": "^6.3.5"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"monaco-editor": "^0.52.2",
|
||||||
|
"monaco-yaml": "^5.4.0"
|
||||||
|
}
|
||||||
|
}
|
17699
config-checker/public/config-schema.json
Normal file
17699
config-checker/public/config-schema.json
Normal file
File diff suppressed because it is too large
Load diff
88
config-checker/src/main.ts
Normal file
88
config-checker/src/main.ts
Normal file
|
@ -0,0 +1,88 @@
|
||||||
|
import * as monaco from "monaco-editor";
|
||||||
|
import { configureMonacoYaml } from "monaco-yaml";
|
||||||
|
import schemaUri from "/config-schema.json?url";
|
||||||
|
|
||||||
|
window.MonacoEnvironment = {
|
||||||
|
getWorker(_, label) {
|
||||||
|
switch (label) {
|
||||||
|
case "editorWorkerService":
|
||||||
|
return new Worker(new URL("monaco-editor/esm/vs/editor/editor.worker.js", import.meta.url), { type: "module" });
|
||||||
|
case "yaml":
|
||||||
|
return new Worker(new URL("./yaml.worker.js", import.meta.url), { type: "module" })
|
||||||
|
default:
|
||||||
|
throw new Error(`Unknown label ${label}`);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
configureMonacoYaml(monaco, {
|
||||||
|
enableSchemaRequest: true,
|
||||||
|
schemas: [{
|
||||||
|
fileMatch: ["**/config.yaml"],
|
||||||
|
uri: schemaUri,
|
||||||
|
}],
|
||||||
|
});
|
||||||
|
|
||||||
|
const initialModel = monaco.editor.createModel("# Paste your config here to check it\n", undefined, monaco.Uri.parse("file:///config.yaml"));
|
||||||
|
initialModel.updateOptions({ tabSize: 2 });
|
||||||
|
|
||||||
|
const editorRoot = document.getElementById("editor")!;
|
||||||
|
const errorsRoot = document.getElementById("errors")!;
|
||||||
|
|
||||||
|
monaco.editor.defineTheme("zeppelin", {
|
||||||
|
base: "vs-dark",
|
||||||
|
inherit: true,
|
||||||
|
rules: [],
|
||||||
|
colors: {
|
||||||
|
"editor.background": "#00000000",
|
||||||
|
"editor.focusBorder": "#00000000",
|
||||||
|
"list.focusOutline": "#00000000",
|
||||||
|
"editorStickyScroll.background": "#070c11",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
monaco.editor.create(editorRoot, {
|
||||||
|
automaticLayout: true,
|
||||||
|
model: initialModel,
|
||||||
|
quickSuggestions: {
|
||||||
|
other: true,
|
||||||
|
comments: true,
|
||||||
|
strings: true,
|
||||||
|
},
|
||||||
|
theme: "zeppelin",
|
||||||
|
minimap: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
function showErrors(markers: monaco.editor.IMarker[]) {
|
||||||
|
if (markers.length) {
|
||||||
|
markers.sort((a, b) => a.startLineNumber - b.startLineNumber);
|
||||||
|
const frag = document.createDocumentFragment();
|
||||||
|
for (const marker of markers) {
|
||||||
|
const error = document.createElement("div");
|
||||||
|
error.classList.add("error");
|
||||||
|
|
||||||
|
const lineMarker = document.createElement("strong");
|
||||||
|
lineMarker.innerText = `Line ${marker.startLineNumber}: `;
|
||||||
|
|
||||||
|
const errorText = document.createElement("span");
|
||||||
|
errorText.innerText = marker.message;
|
||||||
|
|
||||||
|
error.append(lineMarker, errorText);
|
||||||
|
frag.append(error);
|
||||||
|
}
|
||||||
|
errorsRoot.replaceChildren(frag);
|
||||||
|
} else {
|
||||||
|
const success = document.createElement("div");
|
||||||
|
success.classList.add("noErrors");
|
||||||
|
success.innerText = "No errors!";
|
||||||
|
errorsRoot.replaceChildren(success);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
monaco.editor.onDidChangeMarkers(([uri]) => {
|
||||||
|
const markers = monaco.editor.getModelMarkers({ resource: uri });
|
||||||
|
showErrors(markers);
|
||||||
|
});
|
||||||
|
|
||||||
|
showErrors([]);
|
86
config-checker/src/style.css
Normal file
86
config-checker/src/style.css
Normal file
|
@ -0,0 +1,86 @@
|
||||||
|
*, *::before, *::after {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||||
|
font-size: 14px;
|
||||||
|
background: linear-gradient(45deg, #040a0e, #27699e);
|
||||||
|
color: #f8f8f8;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrap {
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 16px;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
background-color: #000000b8;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 0 12px rgba(0, 0, 0, 0.397);
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
flex: 0 0 32px;
|
||||||
|
background-color: #ffffff11;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title h1 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.editor-wrap {
|
||||||
|
flex: 0 0 100%;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#editor {
|
||||||
|
flex: 0 0 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.monaco-editor {
|
||||||
|
outline: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.errors-wrap {
|
||||||
|
flex: 0 0 100%;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#errors {
|
||||||
|
flex: 0 0 max(300px, 40vh);
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: hsl(10.7deg 58.76% 57.09%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.noErrors {
|
||||||
|
color: hsl(93.81deg 56.52% 52.07%);
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
1
config-checker/src/vite-env.d.ts
vendored
Normal file
1
config-checker/src/vite-env.d.ts
vendored
Normal file
|
@ -0,0 +1 @@
|
||||||
|
/// <reference types="vite/client" />
|
1
config-checker/src/yaml.worker.js
Normal file
1
config-checker/src/yaml.worker.js
Normal file
|
@ -0,0 +1 @@
|
||||||
|
import "monaco-yaml/yaml.worker.js";
|
25
config-checker/tsconfig.json
Normal file
25
config-checker/tsconfig.json
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "ES2020",
|
||||||
|
"useDefineForClassFields": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||||
|
"skipLibCheck": true,
|
||||||
|
|
||||||
|
/* Bundler mode */
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowImportingTsExtensions": true,
|
||||||
|
"verbatimModuleSyntax": true,
|
||||||
|
"moduleDetection": "force",
|
||||||
|
"noEmit": true,
|
||||||
|
|
||||||
|
/* Linting */
|
||||||
|
"strict": true,
|
||||||
|
"noUnusedLocals": true,
|
||||||
|
"noUnusedParameters": true,
|
||||||
|
"erasableSyntaxOnly": true,
|
||||||
|
"noFallthroughCasesInSwitch": true,
|
||||||
|
"noUncheckedSideEffectImports": true
|
||||||
|
},
|
||||||
|
"include": ["src"]
|
||||||
|
}
|
Loading…
Add table
Add a link
Reference in a new issue