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: fix issue preventing first query trace expansion (#6197)

Browse source 
https://github.com/VictoriaMetrics/VictoriaMetrics/issues/6186
(cherry picked from commit 046a4a5ecf)
This commit is contained in:
Yury Molodov 2024-04-30 13:32:29 +02:00 committed by hagen1778
parent 798a446d5a
commit 75af52c1d0
No known key found for this signature in database
GPG key ID: 3BF75F3741CA9640
5 changed files with 6 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/vmui/packages/vmui/src/hooks/useElementSize.ts
View file

@ -1,5 +1,4 @@
import { useCallback, useState } from "react";
import useIsomorphicLayoutEffect from "./useIsomorphicLayoutEffect";
import { useCallback, useEffect, useState } from "react";
import useEventListener from "./useEventListener";
export interface ElementSize {
@ -28,7 +27,7 @@ const useElementSize = <T extends HTMLElement = HTMLDivElement>(): [(node: T | n
useEventListener("resize", handleSize);
useIsomorphicLayoutEffect(handleSize, [ref?.offsetHeight, ref?.offsetWidth]);
useEffect(handleSize, [ref?.offsetHeight, ref?.offsetWidth]);
return [setRef, size];
};

3
app/vmui/packages/vmui/src/hooks/useEventListener.ts
View file

@ -1,5 +1,4 @@
import { RefObject, useEffect, useRef } from "react";
import useIsomorphicLayoutEffect from "./useIsomorphicLayoutEffect";
// MediaQueryList Event based useEventListener interface
function useEventListener<K extends keyof MediaQueryListEventMap>(
@ -56,7 +55,7 @@ function useEventListener<
// Create a ref that stores handler
const savedHandler = useRef(handler);
useIsomorphicLayoutEffect(() => {
useEffect(() => {
savedHandler.current = handler;
}, [handler]);

5
app/vmui/packages/vmui/src/hooks/useIsomorphicLayoutEffect.ts
View file

@ -1,5 +0,0 @@
import { useEffect, useLayoutEffect } from "react";
const useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
export default useIsomorphicLayoutEffect;

4
app/vmui/packages/vmui/src/hooks/useWindowSize.ts
View file

@ -1,6 +1,6 @@
import { useState } from "react";
import useIsomorphicLayoutEffect from "./useIsomorphicLayoutEffect";
import useEventListener from "./useEventListener";
import { useEffect } from "preact/compat";
interface WindowSize {
width: number
@ -23,7 +23,7 @@ const useWindowSize = (): WindowSize => {
useEventListener("resize", handleSize);
// Set size at the first client-side load
useIsomorphicLayoutEffect(handleSize, []);
useEffect(handleSize, []);
return windowSize;
};

1
docs/CHANGELOG.md
View file

@ -36,6 +36,7 @@ See also [LTS releases](https://docs.victoriametrics.com/lts-releases/).
* FEATURE: [dashboards/operator](https://grafana.com/grafana/dashboards/17869), [dashboards/backupmanager](https://grafana.com/grafana/dashboards/17798) and [dashboard/tenant-statistic](https://grafana.com/grafana/dashboards/16399): update dashboard to be compatible with Grafana 10+ version.
* FEATURE: [dashboards/cluster](https://grafana.com/grafana/dashboards/11176): add new panel `Concurrent selects` to `vmstorage` row. The panel will show how many ongoing select queries are processed by vmstorage and should help to identify resource bottlenecks. See panel description for more details.
* BUGFIX: [vmui](https://docs.victoriametrics.com/#vmui): fix bug that prevents the first query trace from expanding on click event. See [this issue](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/6186). The issue was introduced in [v1.100.0](https://docs.victoriametrics.com/changelog/#v11000) release.
## [v1.101.0](https://github.com/VictoriaMetrics/VictoriaMetrics/releases/tag/v1.101.0)