3
0
Fork 0
mirror of https://github.com/ZeppelinBot/Zeppelin.git synced 2025-06-06 15:45:03 +00:00

feat: add config-checker page

This commit is contained in:
Dragory 2025-05-23 01:23:16 +00:00
parent 83d35052c3
commit bca5d05d72
No known key found for this signature in database
11 changed files with 19158 additions and 1 deletions

View file

@ -29,7 +29,7 @@
"migrate-rollback-prod": "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",
"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",
"run-tests": "ava",
"test-watch": "tsc-watch --build --onSuccess \"npx ava\""

24
config-checker/.gitignore vendored Normal file
View 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
View 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

File diff suppressed because it is too large Load diff

View 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"
}
}

File diff suppressed because it is too large Load diff

View 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([]);

View 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
View file

@ -0,0 +1 @@
/// <reference types="vite/client" />

View file

@ -0,0 +1 @@
import "monaco-yaml/yaml.worker.js";

View 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"]
}