IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

ZoomPlugin: Remove the timeRange prop (#69148)

Browse Source 
* fix: remove a breaking change

---------

Co-authored-by: Leon Sorokin <leeoniya@gmail.com>
This commit is contained in:
Levente Balogh 2023-05-26 18:52:09 +02:00 committed by GitHub
parent 2e6c71fd39
commit fa6afc7ea4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 11 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/grafana-ui/src/components/uPlot/plugins/ZoomPlugin.tsx
View File

@ -1,6 +1,4 @@
import { useEffect, useLayoutEffect, useRef, useState } from 'react';
import { TimeRange } from '@grafana/data';
import { useEffect, useLayoutEffect, useState } from 'react';
import { UPlotConfigBuilder } from '../config/UPlotConfigBuilder';
import { PlotSelection } from '../types';
@ -9,7 +7,6 @@ import { pluginLog } from '../utils';
interface ZoomPluginProps {
onZoom: (range: { from: number; to: number }) => void;
config: UPlotConfigBuilder;
timeRange: TimeRange;
}
// min px width that triggers zoom
@ -18,14 +15,9 @@ const MIN_ZOOM_DIST = 5;
/**
* @alpha
*/
export const ZoomPlugin = ({ onZoom, config, timeRange }: ZoomPluginProps) => {
export const ZoomPlugin = ({ onZoom, config }: ZoomPluginProps) => {
const [selection, setSelection] = useState<PlotSelection | null>(null);
const refTimeRange = useRef<TimeRange>(timeRange);
useEffect(() => {
refTimeRange.current = timeRange;
}, [timeRange]);
useEffect(() => {
if (selection) {
pluginLog('ZoomPlugin', false, 'selected', selection);
@ -59,9 +51,11 @@ export const ZoomPlugin = ({ onZoom, config, timeRange }: ZoomPluginProps) => {
config.setCursor({
bind: {
dblclick: () => () => {
const frTs = refTimeRange.current.from.valueOf();
const toTs = refTimeRange.current.to.valueOf();
dblclick: (u) => () => {
let xScale = u.scales.x;
const frTs = xScale.min!;
const toTs = xScale.max!;
const pad = (toTs - frTs) / 2;
onZoom({ from: frTs - pad, to: toTs + pad });

2
public/app/plugins/panel/candlestick/CandlestickPanel.tsx
View File

@ -260,7 +260,7 @@ export const CandlestickPanel = ({
return (
<>
<ZoomPlugin config={config} onZoom={onChangeTimeRange} timeRange={timeRange} />
<ZoomPlugin config={config} onZoom={onChangeTimeRange} />
<TooltipPlugin
data={alignedDataFrame}
config={config}

2
public/app/plugins/panel/state-timeline/StateTimelinePanel.tsx
View File

@ -191,7 +191,7 @@ export const StateTimelinePanel = ({
return (
<>
<ZoomPlugin config={config} onZoom={onChangeTimeRange} timeRange={timeRange} />
<ZoomPlugin config={config} onZoom={onChangeTimeRange} />
<OutsideRangePlugin config={config} onChangeTimeRange={onChangeTimeRange} />

2
public/app/plugins/panel/status-history/StatusHistoryPanel.tsx
View File

@ -215,7 +215,7 @@ export const StatusHistoryPanel = ({
return (
<>
<ZoomPlugin config={config} onZoom={onChangeTimeRange} timeRange={timeRange} />
<ZoomPlugin config={config} onZoom={onChangeTimeRange} />
{renderTooltip(alignedFrame)}
<OutsideRangePlugin config={config} onChangeTimeRange={onChangeTimeRange} />
</>

2
public/app/plugins/panel/timeseries/TimeSeriesPanel.tsx
View File

@ -88,7 +88,7 @@ export const TimeSeriesPanel = ({
return (
<>
<KeyboardPlugin config={config} />
<ZoomPlugin config={config} onZoom={onChangeTimeRange} timeRange={timeRange} />
<ZoomPlugin config={config} onZoom={onChangeTimeRange} />
{options.tooltip.mode === TooltipDisplayMode.None || (
<TooltipPlugin
frames={frames}