vmui: fix render heatmap (#4957)

This commit is contained in:
Yury Molodov 2023-09-06 10:26:45 +02:00 committed by Aliaksandr Valialkin
parent a0c4095ec9
commit 6c96bebc23
No known key found for this signature in database
GPG key ID: A72BEC6CD3D0DED1
2 changed files with 13 additions and 1 deletions

View file

@ -11,6 +11,8 @@ import { useQueryState } from "../state/query/QueryStateContext";
import { useTimeState } from "../state/time/TimeStateContext";
import { useCustomPanelState } from "../state/customPanel/CustomPanelStateContext";
import { isHistogramData } from "../utils/metric";
import { useGraphState } from "../state/graph/GraphStateContext";
import { getStepFromDuration } from "../utils/time";
interface FetchQueryParams {
predefinedQuery?: string[]
@ -57,6 +59,7 @@ export const useFetchQuery = ({
const { period } = useTimeState();
const { displayType, nocache, isTracingEnabled, seriesLimits: stateSeriesLimits } = useCustomPanelState();
const { serverUrl } = useAppState();
const { isHistogram: isHistogramState } = useGraphState();
const [isLoading, setIsLoading] = useState(false);
const [graphData, setGraphData] = useState<MetricResult[]>();
@ -69,6 +72,10 @@ export const useFetchQuery = ({
const [fetchQueue, setFetchQueue] = useState<AbortController[]>([]);
const [isHistogram, setIsHistogram] = useState(false);
const defaultStep = useMemo(() => {
const { end, start } = period;
return getStepFromDuration(end - start, isHistogramState);
}, [period, isHistogramState]);
const fetchData = async ({
fetchUrl,
@ -137,7 +144,7 @@ export const useFetchQuery = ({
setWarning(totalLength > seriesLimit ? limitText : "");
isDisplayChart ? setGraphData(tempData as MetricResult[]) : setLiveData(tempData as InstantMetricResult[]);
setTraces(tempTraces);
setIsHistogram(totalLength ? isHistogramResult: false);
setIsHistogram(prev => totalLength ? isHistogramResult : prev);
} catch (e) {
if (e instanceof Error && e.name !== "AbortError") {
setError(`${e.name}: ${e.message}`);
@ -197,5 +204,9 @@ export const useFetchQuery = ({
setFetchQueue(fetchQueue.filter(f => !f.signal.aborted));
}, [fetchQueue]);
useEffect(() => {
if (defaultStep === customStep) setGraphData([]);
}, [isHistogram]);
return { fetchUrl, isLoading, graphData, liveData, error, queryErrors, setQueryErrors, queryStats, warning, traces, isHistogram };
};

View file

@ -41,6 +41,7 @@ The following `tip` changes can be tested by building VictoriaMetrics components
* FEATURE: [vmauth](https://docs.victoriametrics.com/vmauth.html): added ability to set, override and clear request and response headers on a per-user and per-path basis. See [this issue](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/4825) and [these docs](https://docs.victoriametrics.com/vmauth.html#auth-config) for details.
* BUGFIX: [Official Grafana dashboards for VictoriaMetrics](https://grafana.com/orgs/victoriametrics): fix display of ingested rows rate for `Samples ingested/s` and `Samples rate` panels for vmagent's dasbhoard. Previously, not all ingested protocols were accounted in these panels. An extra panel `Rows rate` was added to `Ingestion` section to display the split for rows ingested rate by protocol.
* BUGFIX: [vmui](https://docs.victoriametrics.com/#vmui): fix the bug causing render looping when switching to heatmap.
## [v1.93.3](https://github.com/VictoriaMetrics/VictoriaMetrics/releases/tag/v1.93.3)