vmui: import dashboards (#2642)

* fix: switch dashboards import to fetch

* make vmui-update
This commit is contained in:
Yury Molodov 2022-05-26 09:39:10 +03:00 committed by Aliaksandr Valialkin
parent f149d56ac2
commit b9ef9ddbfd
No known key found for this signature in database
GPG key ID: A72BEC6CD3D0DED1
11 changed files with 19 additions and 17 deletions

View file

@ -1,12 +1,12 @@
{
"files": {
"main.css": "./static/css/main.d8362c27.css",
"main.js": "./static/js/main.348f50e1.js",
"main.js": "./static/js/main.a35e61a3.js",
"static/js/27.939f971b.chunk.js": "./static/js/27.939f971b.chunk.js",
"index.html": "./index.html"
},
"entrypoints": [
"static/css/main.d8362c27.css",
"static/js/main.348f50e1.js"
"static/js/main.a35e61a3.js"
]
}

View file

@ -1,7 +1,7 @@
### Setup
1. Create `.json` config file in a folder `dashboards`
2. Import your config file into the `dashboards/index.js`
3. Add imported variable into the array `window.__VMUI_PREDEFINED_DASHBOARDS__`
3. Add filename into the array `window.__VMUI_PREDEFINED_DASHBOARDS__`
### Configuration options

View file

@ -1,5 +1,3 @@
import perJob from "./perJobUsage.json" assert { type: "json" };
window.__VMUI_PREDEFINED_DASHBOARDS__ = [
perJob
"perJobUsage.json"
];

View file

@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="VM-UI is a metric explorer for Victoria Metrics"/><link rel="apple-touch-icon" href="./apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png"><link rel="manifest" href="./manifest.json"/><title>VM UI</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"/><script src="./dashboards/index.js" type="module"></script><script defer="defer" src="./static/js/main.348f50e1.js"></script><link href="./static/css/main.d8362c27.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link href="./favicon.ico" rel="icon"/><meta content="width=device-width,initial-scale=1" name="viewport"/><meta content="#000000" name="theme-color"/><meta content="VM-UI is a metric explorer for Victoria Metrics" name="description"/><link href="./apple-touch-icon.png" rel="apple-touch-icon"/><link href="./favicon-32x32.png" rel="icon" sizes="32x32" type="image/png"><link href="./manifest.json" rel="manifest"/><title>VM UI</title><link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet"/><script src="./dashboards/index.js" type="module"></script><script defer="defer" src="./static/js/main.a35e61a3.js"></script><link href="./static/css/main.d8362c27.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div data-params='{"serverURL": "https://play.victoriametrics.com/select/accounting/1/6a716b0f-38bc-4856-90ce-448fd713e3fe/prometheus/"}' id="root"></div></body></html>

View file

@ -1,7 +1,7 @@
### Setup
1. Create `.json` config file in a folder `dashboards`
2. Import your config file into the `dashboards/index.js`
3. Add imported variable into the array `window.__VMUI_PREDEFINED_DASHBOARDS__`
3. Add filename into the array `window.__VMUI_PREDEFINED_DASHBOARDS__`
### Configuration options

View file

@ -1,5 +1,3 @@
import perJob from "./perJobUsage.json" assert { type: "json" };
window.__VMUI_PREDEFINED_DASHBOARDS__ = [
perJob
"perJobUsage.json"
];

View file

@ -20,7 +20,7 @@ const DashboardLayout: FC = () => {
}, [dashboards, tab]);
useEffect(() => {
setDashboards(getDashboardSettings());
getDashboardSettings().then(d => d.length && setDashboards(d));
}, []);
return <>

View file

@ -1,6 +1,12 @@
import {DashboardSettings} from "../../types";
export default (): DashboardSettings[] => {
return window.__VMUI_PREDEFINED_DASHBOARDS__ || [];
const importModule = async (filename: string) => {
const data = await fetch(`./dashboards/${filename}`);
const json = await data.json();
return json as DashboardSettings;
};
export default async () => {
const filenames = window.__VMUI_PREDEFINED_DASHBOARDS__;
return await Promise.all(filenames.map(async f => importModule(f)));
};

View file

@ -2,7 +2,7 @@ import {MetricBase} from "../api/types";
declare global {
interface Window {
__VMUI_PREDEFINED_DASHBOARDS__: DashboardSettings[];
__VMUI_PREDEFINED_DASHBOARDS__: string[];
}
}