From 7d2e9aa9799b3043ef18e146ff18a8e6724ad326 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Piotr=20Jamr=C3=B3z?= Date: Wed, 10 Nov 2021 11:20:30 +0100 Subject: [PATCH] Elasticsearch: Enable full range log volume histogram (#41202) * Rename "Logs volume" labels to "Log volume" Code references are kept intact as there's a lot of them, it could be renamed in a separate PR just with renaming * Add log level docs * Remove feature flag to enable log volume by default * Update error message * Update docs * Fix unit test * Fix unit test Queries are now run automatically * Add extra param for Loki API * Remove "Load volume" button * Update documentation about log volume * Move comment * Make reload button more accessible * Update docs/sources/explore/logs-integration.md Co-authored-by: achatterjee-grafana <70489351+achatterjee-grafana@users.noreply.github.com> * Hide full range log volume for Loki behind the feature toggle Co-authored-by: achatterjee-grafana <70489351+achatterjee-grafana@users.noreply.github.com> --- docs/sources/datasources/loki.md | 2 +- docs/sources/explore/logs-integration.md | 6 +- packages/grafana-data/src/types/config.ts | 1 - packages/grafana-runtime/src/config.ts | 1 - public/app/core/logs_model.ts | 14 ++- public/app/features/explore/Logs.tsx | 16 ---- public/app/features/explore/LogsContainer.tsx | 14 +-- .../features/explore/LogsVolumePanel.test.tsx | 6 +- .../app/features/explore/LogsVolumePanel.tsx | 23 ++--- .../explore/SecondaryActions.test.tsx | 17 ---- .../app/features/explore/state/query.test.ts | 27 +----- public/app/features/explore/state/query.ts | 7 +- .../app/features/explore/utils/decorators.ts | 5 +- .../datasource/loki/datasource.test.ts | 95 ++++++++++++++----- .../app/plugins/datasource/loki/datasource.ts | 9 ++ public/app/plugins/datasource/loki/types.ts | 3 + 16 files changed, 120 insertions(+), 126 deletions(-) diff --git a/docs/sources/datasources/loki.md b/docs/sources/datasources/loki.md index 54ce2b1b6ee..ada73be0f69 100644 --- a/docs/sources/datasources/loki.md +++ b/docs/sources/datasources/loki.md @@ -66,7 +66,7 @@ You can use the Loki query editor to create log and metric queries. ### Log browser -With Loki log browser you can easily navigate trough your list of labels and values and construct the query of your choice. Log browser has multi-step selection: +With Loki log browser you can easily navigate through your list of labels and values and construct the query of your choice. Log browser has multi-step selection: 1. Choose the labels you would like to consider for your search. 2. Pick the values for selected labels. Log browser supports facetting and therefore it shows you only possible label combinations. diff --git a/docs/sources/explore/logs-integration.md b/docs/sources/explore/logs-integration.md index 940fa111bca..b818656b212 100644 --- a/docs/sources/explore/logs-integration.md +++ b/docs/sources/explore/logs-integration.md @@ -21,7 +21,11 @@ During an infrastructure monitoring and incident response, you can dig deeper in ### Logs visualization -Results of log queries are shown as histograms in the graph and individual logs are displayed below. If the data source does not send histogram data for the requested time range, the logs model computes a time series based on the log row counts bucketed by an automatically calculated time interval and the start of the histogram is then anchored by the first log row's timestamp from the result. The end of the time series is anchored to the time picker's **To** range. +Results of log queries are shown as histograms in the graph and individual logs are explained in the following sections. + +If the data source supports a full range log volume histogram, the graph with log distribution for all entered log queries is shown automatically. This feature is currently supported by Elasticsearch data source. + +If the data source does not support loading full range log volume histogram, the logs model computes a time series based on the log row counts bucketed by an automatically calculated time interval, and the first log row's timestamp then anchors the start of the histogram from the result. The end of the time series is anchored to the time picker's **To** range. #### Log level diff --git a/packages/grafana-data/src/types/config.ts b/packages/grafana-data/src/types/config.ts index 14d723dd74f..bb6b7259b83 100644 --- a/packages/grafana-data/src/types/config.ts +++ b/packages/grafana-data/src/types/config.ts @@ -52,7 +52,6 @@ export interface FeatureToggles { recordedQueries: boolean; newNavigation: boolean; fullRangeLogsVolume: boolean; - autoLoadFullRangeLogsVolume: boolean; } /** diff --git a/packages/grafana-runtime/src/config.ts b/packages/grafana-runtime/src/config.ts index cae7cc4854c..3d1bfce422a 100644 --- a/packages/grafana-runtime/src/config.ts +++ b/packages/grafana-runtime/src/config.ts @@ -68,7 +68,6 @@ export class GrafanaBootConfig implements GrafanaConfig { recordedQueries: false, newNavigation: false, fullRangeLogsVolume: false, - autoLoadFullRangeLogsVolume: false, }; licenseInfo: LicenseInfo = {} as LicenseInfo; rendererAvailable = false; diff --git a/public/app/core/logs_model.ts b/public/app/core/logs_model.ts index 86e5e2b1c90..d7f2fef4d06 100644 --- a/public/app/core/logs_model.ts +++ b/public/app/core/logs_model.ts @@ -54,7 +54,8 @@ export const LogLevelColor = { [LogLevel.unknown]: getThemeColor('#8e8e8e', '#dde4ed'), }; -const SECOND = 1000; +const MILLISECOND = 1; +const SECOND = 1000 * MILLISECOND; const MINUTE = 60 * SECOND; const HOUR = 60 * MINUTE; const DAY = 24 * HOUR; @@ -633,7 +634,8 @@ export function queryLogsVolume( logsVolumeRequest: DataQueryRequest, options: LogsVolumeQueryOptions ): Observable { - const intervalInfo = getIntervalInfo(logsVolumeRequest.scopedVars); + const timespan = options.range.to.valueOf() - options.range.from.valueOf(); + const intervalInfo = getIntervalInfo(logsVolumeRequest.scopedVars, timespan); logsVolumeRequest.interval = intervalInfo.interval; logsVolumeRequest.scopedVars.__interval = { value: intervalInfo.interval, text: intervalInfo.interval }; if (intervalInfo.intervalMs !== undefined) { @@ -692,11 +694,15 @@ export function queryLogsVolume( }); } -function getIntervalInfo(scopedVars: ScopedVars): { interval: string; intervalMs?: number } { +function getIntervalInfo(scopedVars: ScopedVars, timespanMs: number): { interval: string; intervalMs?: number } { if (scopedVars.__interval) { let intervalMs: number = scopedVars.__interval_ms.value; let interval = ''; - if (intervalMs > HOUR) { + // below 5 seconds we force the resolution to be per 1ms as interval in scopedVars is not less than 10ms + if (timespanMs < SECOND * 5) { + intervalMs = MILLISECOND; + interval = '1ms'; + } else if (intervalMs > HOUR) { intervalMs = DAY; interval = '1d'; } else if (intervalMs > MINUTE) { diff --git a/public/app/features/explore/Logs.tsx b/public/app/features/explore/Logs.tsx index 8210b225620..ca04fc794bd 100644 --- a/public/app/features/explore/Logs.tsx +++ b/public/app/features/explore/Logs.tsx @@ -69,8 +69,6 @@ interface Props extends Themeable2 { getFieldLinks: (field: Field, rowIndex: number) => Array>; addResultsToCache: () => void; clearCache: () => void; - loadingLogsVolumeAvailable: boolean; - onClickLoadLogsVolume: () => void; } interface State { @@ -270,8 +268,6 @@ class UnthemedLogs extends PureComponent { logsQueries, clearCache, addResultsToCache, - onClickLoadLogsVolume, - loadingLogsVolumeAvailable, } = this.props; const { @@ -351,18 +347,6 @@ class UnthemedLogs extends PureComponent {
- {loadingLogsVolumeAvailable && ( - - )}