github-mirrors/VictoriaMetrics
1
0
Fork 0
mirror of https://github.com/VictoriaMetrics/VictoriaMetrics.git synced 2024-11-21 14:44:00 +00:00
Code Issues Projects Releases Packages Wiki Activity

vmui: lazy loading predefined panels (#3795)

Browse source 
* fix: change logic lazy loading predefined panels

* app/vmselect/vmui: `make vmui-update`

---------

Co-authored-by: Aliaksandr Valialkin <valyala@victoriametrics.com>
This commit is contained in:
Yury Molodov 2023-02-09 09:11:55 +01:00 committed by GitHub
parent e1063ce3c1
commit bff18cb5dd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 16 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
app/vmselect/vmui/asset-manifest.json
View file

@ -1,14 +1,14 @@
{ {
"files": { "files": {
"main.css": "./static/css/main.f22be84b.css", "main.css": "./static/css/main.08ded1c6.css",
"main.js": "./static/js/main.eca4a392.js", "main.js": "./static/js/main.2aca3017.js",
"static/js/27.c1ccfd29.chunk.js": "./static/js/27.c1ccfd29.chunk.js", "static/js/27.c1ccfd29.chunk.js": "./static/js/27.c1ccfd29.chunk.js",
"static/media/Lato-Regular.ttf": "./static/media/Lato-Regular.d714fec1633b69a9c2e9.ttf", "static/media/Lato-Regular.ttf": "./static/media/Lato-Regular.d714fec1633b69a9c2e9.ttf",
"static/media/Lato-Bold.ttf": "./static/media/Lato-Bold.32360ba4b57802daa4d6.ttf", "static/media/Lato-Bold.ttf": "./static/media/Lato-Bold.32360ba4b57802daa4d6.ttf",
"index.html": "./index.html" "index.html": "./index.html"
}, },
"entrypoints": [ "entrypoints": [
"static/css/main.f22be84b.css", "static/css/main.08ded1c6.css",
"static/js/main.eca4a392.js" "static/js/main.2aca3017.js"
] ]
} }

2
app/vmselect/vmui/index.html
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,maximum-scale=1,user-scalable=no"/><meta name="theme-color" content="#000000"/><meta name="description" content="UI for VictoriaMetrics"/><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><script src="./dashboards/index.js" type="module"></script><meta name="twitter:card" content="summary_large_image"><meta name="twitter:image" content="./preview.jpg"><meta name="twitter:title" content="UI for VictoriaMetrics"><meta name="twitter:description" content="Explore and troubleshoot your VictoriaMetrics data"><meta name="twitter:site" content="@VictoriaMetrics"><meta property="og:title" content="Metric explorer for VictoriaMetrics"><meta property="og:description" content="Explore and troubleshoot your VictoriaMetrics data"><meta property="og:image" content="./preview.jpg"><meta property="og:type" content="website"><script defer="defer" src="./static/js/main.eca4a392.js"></script><link href="./static/css/main.f22be84b.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 rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/><meta name="theme-color" content="#000000"/><meta name="description" content="UI for VictoriaMetrics"/><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><script src="./dashboards/index.js" type="module"></script><meta name="twitter:card" content="summary_large_image"><meta name="twitter:image" content="./preview.jpg"><meta name="twitter:title" content="UI for VictoriaMetrics"><meta name="twitter:description" content="Explore and troubleshoot your VictoriaMetrics data"><meta name="twitter:site" content="@VictoriaMetrics"><meta property="og:title" content="Metric explorer for VictoriaMetrics"><meta property="og:description" content="Explore and troubleshoot your VictoriaMetrics data"><meta property="og:image" content="./preview.jpg"><meta property="og:type" content="website"><script defer="defer" src="./static/js/main.2aca3017.js"></script><link href="./static/css/main.08ded1c6.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

1
app/vmselect/vmui/static/css/main.08ded1c6.css Normal file
View file

File diff suppressed because one or more lines are too long

1
app/vmselect/vmui/static/css/main.f22be84b.css
View file

File diff suppressed because one or more lines are too long

2
app/vmselect/vmui/static/js/main.2aca3017.js Normal file
View file

File diff suppressed because one or more lines are too long

0
app/vmselect/vmui/static/js/main.eca4a392.js.LICENSE.txt → app/vmselect/vmui/static/js/main.2aca3017.js.LICENSE.txt
View file

2
app/vmselect/vmui/static/js/main.eca4a392.js
View file

File diff suppressed because one or more lines are too long

6
app/vmui/packages/vmui/src/hooks/useFetchQuery.ts
View file

@ -155,8 +155,11 @@ export const useFetchQuery = ({
}, },
[serverUrl, period, displayType, customStep, hideQuery]); [serverUrl, period, displayType, customStep, hideQuery]);
const [prevUrl, setPrevUrl] = useState<string[]>([]);
useEffect(() => { useEffect(() => {
if (!visible || !fetchUrl?.length) return; const isLazyPredefined = (fetchUrl === prevUrl && !!predefinedQuery);
if (!visible || !fetchUrl?.length || isLazyPredefined) return;
setIsLoading(true); setIsLoading(true);
const expr = predefinedQuery ?? query; const expr = predefinedQuery ?? query;
throttledFetchData({ throttledFetchData({
@ -168,6 +171,7 @@ export const useFetchQuery = ({
showAllSeries, showAllSeries,
hideQuery, hideQuery,
}); });
setPrevUrl(fetchUrl);
}, [fetchUrl, visible, stateSeriesLimits, showAllSeries]); }, [fetchUrl, visible, stateSeriesLimits, showAllSeries]);
useEffect(() => { useEffect(() => {

4
app/vmui/packages/vmui/src/pages/PredefinedPanels/PredefinedPanel/PredefinedPanel.tsx
View file

@ -32,7 +32,7 @@ const PredefinedPanel: FC<PredefinedPanelsProps> = ({
const dispatch = useTimeDispatch(); const dispatch = useTimeDispatch();
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const [visible, setVisible] = useState(true); const [visible, setVisible] = useState(false);
const [yaxis, setYaxis] = useState<YaxisState>({ const [yaxis, setYaxis] = useState<YaxisState>({
limits: { limits: {
enable: false, enable: false,
@ -73,7 +73,7 @@ const PredefinedPanel: FC<PredefinedPanelsProps> = ({
return () => { return () => {
if (containerRef.current) observer.unobserve(containerRef.current); if (containerRef.current) observer.unobserve(containerRef.current);
}; };
}, []); }, [containerRef]);
if (!validExpr) return ( if (!validExpr) return (
<Alert variant="error"> <Alert variant="error">

1
app/vmui/packages/vmui/src/pages/PredefinedPanels/PredefinedPanel/style.scss
View file

@ -37,5 +37,6 @@
&-body { &-body {
padding: $padding-small $padding-small*2; padding: $padding-small $padding-small*2;
min-height: 500px;
} }
} }