diff --git a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/page_results_content.tsx b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/page_results_content.tsx index 0ec027958cc33..3629413d6d30c 100644 --- a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/page_results_content.tsx +++ b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/page_results_content.tsx @@ -101,6 +101,17 @@ export const AnalysisResultsContent = ({ [setSelectedTimeRange, handleQueryTimeRangeChange] ); + const handleChartTimeRangeChange = useCallback( + ({ startTime, endTime }: TimeRange) => { + handleSelectedTimeRangeChange({ + end: new Date(endTime).toISOString(), + isInvalid: false, + start: new Date(startTime).toISOString(), + }); + }, + [handleSelectedTimeRangeChange] + ); + const handleAutoRefreshChange = useCallback( ({ isPaused, refreshInterval: interval }: { isPaused: boolean; refreshInterval: number }) => { setAutoRefresh({ @@ -183,6 +194,7 @@ export const AnalysisResultsContent = ({ diff --git a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/chart.tsx b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/chart.tsx index 71cacdcecf35d..0d703420e7412 100644 --- a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/chart.tsx +++ b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/chart.tsx @@ -30,15 +30,11 @@ const lineSeriesColour = 'rgb(49, 133, 252)'; interface Props { data: GetLogEntryRateSuccessResponsePayload['data'] | null; + setTimeRange: (timeRange: TimeRange) => void; timeRange: TimeRange; } -export const ChartView = ({ data, timeRange }: Props) => { - const showModelBoundsLabel = i18n.translate( - 'xpack.infra.logs.analysis.logRateSectionModelBoundsCheckboxLabel', - { defaultMessage: 'Show model bounds' } - ); - +export const ChartView = ({ data, setTimeRange, timeRange }: Props) => { const { areaSeries, lineSeries, anomalySeries } = useLogEntryRateGraphData({ data }); const dateFormatter = useMemo( @@ -55,15 +51,26 @@ export const ChartView = ({ data, timeRange }: Props) => { const [dateFormat] = useKibanaUiSetting('dateFormat'); - const tooltipProps = { - headerFormatter: useCallback( - (tooltipData: TooltipValue) => + const tooltipProps = useMemo( + () => ({ + headerFormatter: (tooltipData: TooltipValue) => moment(tooltipData.value).format(dateFormat || 'Y-MM-DD HH:mm:ss.SSS'), - [dateFormat] - ), - }; + }), + [dateFormat] + ); const [isShowingModelBounds, setIsShowingModelBounds] = useState(true); + + const handleBrushEnd = useCallback( + (startTime: number, endTime: number) => { + setTimeRange({ + endTime, + startTime, + }); + }, + [setTimeRange] + ); + return ( <> @@ -172,6 +179,7 @@ export const ChartView = ({ data, timeRange }: Props) => { customSeriesColors={!isDarkMode() ? getColorsMap('red', anomalySpecId) : undefined} /> { ); }; + +const showModelBoundsLabel = i18n.translate( + 'xpack.infra.logs.analysis.logRateSectionModelBoundsCheckboxLabel', + { defaultMessage: 'Show model bounds' } +); diff --git a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/index.tsx b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/index.tsx index 18d316c07bbc1..8a23d7ac09111 100644 --- a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/index.tsx +++ b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/log_rate/index.tsx @@ -24,10 +24,12 @@ import { TimeRange } from '../../../../../../common/http_api/shared/time_range'; export const LogRateResults = ({ isLoading, results, + setTimeRange, timeRange, }: { isLoading: boolean; results: GetLogEntryRateSuccessResponsePayload['data'] | null; + setTimeRange: (timeRange: TimeRange) => void; timeRange: TimeRange; }) => { const title = i18n.translate('xpack.infra.logs.analysis.logRateSectionTitle', { @@ -83,7 +85,7 @@ export const LogRateResults = ({ {viewMode === 'chart' ? ( - + ) : ( )}