From 5d8d01a65eeda8db2379fddfc1223a9ec9a00c1d Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Mon, 10 Feb 2020 17:00:21 +0100 Subject: [PATCH] Move data links suggestions to grafana-data --- packages/grafana-data/src/index.ts | 1 + packages/grafana-data/src/links/index.ts | 1 + .../src/links/variableSuggestions.ts | 232 ++++++++++++++++++ .../components/DataLinks/DataLinkEditor.tsx | 3 +- .../components/DataLinks/DataLinkInput.tsx | 6 +- .../DataLinks/DataLinkSuggestions.tsx | 18 +- .../components/DataLinks/DataLinksEditor.tsx | 3 +- packages/grafana-ui/src/components/index.ts | 1 - packages/grafana-ui/src/utils/dataLinks.ts | 15 -- .../dashboard/panel_editor/GeneralTab.tsx | 3 +- .../dashboard/state/DashboardMigrator.test.ts | 2 +- .../dashboard/state/DashboardMigrator.ts | 3 +- .../app/features/panel/panellinks/link_srv.ts | 204 +-------------- .../panel/panellinks/specs/link_srv.test.ts | 4 +- .../elasticsearch/configuration/DataLink.tsx | 4 +- .../elasticsearch/configuration/DataLinks.tsx | 4 +- .../loki/configuration/DerivedField.tsx | 3 +- .../loki/configuration/DerivedFields.tsx | 4 +- .../panel/bargauge/BarGaugePanelEditor.tsx | 6 +- .../plugins/panel/gauge/GaugePanelEditor.tsx | 6 +- public/app/plugins/panel/graph/module.ts | 12 +- .../panel/graph/specs/graph_ctrl.test.ts | 5 +- .../plugins/panel/stat/StatPanelEditor.tsx | 6 +- public/app/routes/ReactContainer.tsx | 4 +- 24 files changed, 278 insertions(+), 272 deletions(-) create mode 100644 packages/grafana-data/src/links/index.ts create mode 100644 packages/grafana-data/src/links/variableSuggestions.ts diff --git a/packages/grafana-data/src/index.ts b/packages/grafana-data/src/index.ts index fab26964da0..2dccc5010ec 100644 --- a/packages/grafana-data/src/index.ts +++ b/packages/grafana-data/src/index.ts @@ -7,3 +7,4 @@ export * from './datetime'; export * from './text'; export * from './valueFormats'; export * from './field'; +export * from './links'; diff --git a/packages/grafana-data/src/links/index.ts b/packages/grafana-data/src/links/index.ts new file mode 100644 index 00000000000..1a9d520ef02 --- /dev/null +++ b/packages/grafana-data/src/links/index.ts @@ -0,0 +1 @@ +export * from './variableSuggestions'; diff --git a/packages/grafana-data/src/links/variableSuggestions.ts b/packages/grafana-data/src/links/variableSuggestions.ts new file mode 100644 index 00000000000..86963e35c7a --- /dev/null +++ b/packages/grafana-data/src/links/variableSuggestions.ts @@ -0,0 +1,232 @@ +import { DataFrame, Field, FieldType } from '../types/dataFrame'; +import { KeyValue } from '../types/data'; +import { chain } from 'lodash'; + +export enum VariableOrigin { + Series = 'series', + Field = 'field', + Fields = 'fields', + Value = 'value', + BuiltIn = 'built-in', + Template = 'template', +} + +export interface VariableSuggestion { + value: string; + label: string; + documentation?: string; + origin: VariableOrigin; +} + +export const DataLinkBuiltInVars = { + keepTime: '__url_time_range', + timeRangeFrom: '__from', + timeRangeTo: '__to', + includeVars: '__all_variables', + seriesName: '__series.name', + fieldName: '__field.name', + valueTime: '__value.time', + valueNumeric: '__value.numeric', + valueText: '__value.text', + valueRaw: '__value.raw', + // name of the calculation represented by the value + valueCalc: '__value.calc', +}; + +const timeRangeVars = [ + { + value: `${DataLinkBuiltInVars.keepTime}`, + label: 'Time range', + documentation: 'Adds current time range', + origin: VariableOrigin.BuiltIn, + }, + { + value: `${DataLinkBuiltInVars.timeRangeFrom}`, + label: 'Time range: from', + documentation: "Adds current time range's from value", + origin: VariableOrigin.BuiltIn, + }, + { + value: `${DataLinkBuiltInVars.timeRangeTo}`, + label: 'Time range: to', + documentation: "Adds current time range's to value", + origin: VariableOrigin.BuiltIn, + }, +]; + +const seriesVars = [ + { + value: `${DataLinkBuiltInVars.seriesName}`, + label: 'Name', + documentation: 'Name of the series', + origin: VariableOrigin.Series, + }, +]; + +const valueVars = [ + { + value: `${DataLinkBuiltInVars.valueNumeric}`, + label: 'Numeric', + documentation: 'Numeric representation of selected value', + origin: VariableOrigin.Value, + }, + { + value: `${DataLinkBuiltInVars.valueText}`, + label: 'Text', + documentation: 'Text representation of selected value', + origin: VariableOrigin.Value, + }, + { + value: `${DataLinkBuiltInVars.valueRaw}`, + label: 'Raw', + documentation: 'Raw value', + origin: VariableOrigin.Value, + }, +]; + +const buildLabelPath = (label: string) => { + return label.indexOf('.') > -1 ? `["${label}"]` : `.${label}`; +}; + +let templateSrvInstance: { + variables: Array<{ name: string }>; +}; + +export const getPanelLinksVariableSuggestions = (): VariableSuggestion[] => [ + ...templateSrvInstance.variables.map(variable => ({ + value: variable.name as string, + label: variable.name, + origin: VariableOrigin.Template, + })), + { + value: `${DataLinkBuiltInVars.includeVars}`, + label: 'All variables', + documentation: 'Adds current variables', + origin: VariableOrigin.Template, + }, + ...timeRangeVars, +]; + +const getFieldVars = (dataFrames: DataFrame[]) => { + const all = []; + for (const df of dataFrames) { + for (const f of df.fields) { + if (f.labels) { + for (const k of Object.keys(f.labels)) { + all.push(k); + } + } + } + } + + const labels = chain(all) + .flatten() + .uniq() + .value(); + + return [ + { + value: `${DataLinkBuiltInVars.fieldName}`, + label: 'Name', + documentation: 'Field name of the clicked datapoint (in ms epoch)', + origin: VariableOrigin.Field, + }, + ...labels.map(label => ({ + value: `__field.labels${buildLabelPath(label)}`, + label: `labels.${label}`, + documentation: `${label} label value`, + origin: VariableOrigin.Field, + })), + ]; +}; + +const getDataFrameVars = (dataFrames: DataFrame[]) => { + // @ts-ignore + let numeric: Field = undefined; + // @ts-ignore + let title: Field = undefined; + const suggestions: VariableSuggestion[] = []; + const keys: KeyValue = {}; + for (const df of dataFrames) { + for (const f of df.fields) { + if (keys[f.name]) { + continue; + } + suggestions.push({ + value: `__data.fields[${f.name}]`, + label: `${f.name}`, + documentation: `Formatted value for ${f.name} on the same row`, + origin: VariableOrigin.Fields, + }); + keys[f.name] = true; + if (!numeric && f.type === FieldType.number) { + numeric = f; + } + if (!title && f.config.title && f.config.title !== f.name) { + title = f; + } + } + } + + if (suggestions.length) { + suggestions.push({ + value: `__data.fields[0]`, + label: `Select by index`, + documentation: `Enter the field order`, + origin: VariableOrigin.Fields, + }); + } + if (numeric) { + suggestions.push({ + value: `__data.fields[${numeric.name}].numeric`, + label: `Show numeric value`, + documentation: `the numeric field value`, + origin: VariableOrigin.Fields, + }); + suggestions.push({ + value: `__data.fields[${numeric.name}].text`, + label: `Show text value`, + documentation: `the text value`, + origin: VariableOrigin.Fields, + }); + } + if (title) { + suggestions.push({ + value: `__data.fields[${title.config.title}]`, + label: `Select by title`, + documentation: `Use the title to pick the field`, + origin: VariableOrigin.Fields, + }); + } + return suggestions; +}; + +export const getDataLinksVariableSuggestions = (dataFrames: DataFrame[]): VariableSuggestion[] => { + const valueTimeVar = { + value: `${DataLinkBuiltInVars.valueTime}`, + label: 'Time', + documentation: 'Time value of the clicked datapoint (in ms epoch)', + origin: VariableOrigin.Value, + }; + return [ + ...seriesVars, + ...getFieldVars(dataFrames), + ...valueVars, + valueTimeVar, + ...getDataFrameVars(dataFrames), + ...getPanelLinksVariableSuggestions(), + ]; +}; + +export const getCalculationValueDataLinksVariableSuggestions = (dataFrames: DataFrame[]): VariableSuggestion[] => { + const fieldVars = getFieldVars(dataFrames); + const valueCalcVar = { + value: `${DataLinkBuiltInVars.valueCalc}`, + label: 'Calculation name', + documentation: 'Name of the calculation the value is a result of', + origin: VariableOrigin.Value, + }; + return [...seriesVars, ...fieldVars, ...valueVars, valueCalcVar, ...getPanelLinksVariableSuggestions()]; +}; + +export const initialiseVariableSuggestions = (templateSrv: any) => (templateSrvInstance = templateSrv); diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx index dda63d4c8d7..d209216f4a4 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx @@ -1,11 +1,10 @@ import React, { ChangeEvent, useContext } from 'react'; import { DataLink } from '@grafana/data'; import { FormField, Switch } from '../index'; -import { VariableSuggestion } from './DataLinkSuggestions'; import { css } from 'emotion'; import { ThemeContext, stylesFactory } from '../../themes/index'; import { DataLinkInput } from './DataLinkInput'; -import { GrafanaTheme } from '@grafana/data'; +import { GrafanaTheme, VariableSuggestion } from '@grafana/data'; interface DataLinkEditorProps { index: number; diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx index 82d4a6892cc..74cd5c0d1d8 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx @@ -1,7 +1,7 @@ import React, { useState, useMemo, useContext, useRef, RefObject, memo, useEffect } from 'react'; import usePrevious from 'react-use/lib/usePrevious'; -import { VariableSuggestion, VariableOrigin, DataLinkSuggestions } from './DataLinkSuggestions'; -import { ThemeContext, DataLinkBuiltInVars, makeValue } from '../../index'; +import { DataLinkSuggestions } from './DataLinkSuggestions'; +import { ThemeContext, makeValue } from '../../index'; import { SelectionReference } from './SelectionReference'; import { Portal } from '../index'; @@ -14,7 +14,7 @@ import { css, cx } from 'emotion'; import { SlatePrism } from '../../slate-plugins'; import { SCHEMA } from '../../utils/slate'; import { stylesFactory } from '../../themes'; -import { GrafanaTheme } from '@grafana/data'; +import { GrafanaTheme, VariableSuggestion, VariableOrigin, DataLinkBuiltInVars } from '@grafana/data'; const modulo = (a: number, n: number) => a - n * Math.floor(a / n); diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinkSuggestions.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinkSuggestions.tsx index 7295143a326..fe2806172ee 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinkSuggestions.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinkSuggestions.tsx @@ -1,5 +1,5 @@ import { selectThemeVariant, ThemeContext } from '../../index'; -import { GrafanaTheme } from '@grafana/data'; +import { GrafanaTheme, VariableSuggestion } from '@grafana/data'; import { css, cx } from 'emotion'; import _ from 'lodash'; import React, { useRef, useContext, useMemo } from 'react'; @@ -8,22 +8,6 @@ import { List } from '../index'; import tinycolor from 'tinycolor2'; import { stylesFactory } from '../../themes'; -export enum VariableOrigin { - Series = 'series', - Field = 'field', - Fields = 'fields', - Value = 'value', - BuiltIn = 'built-in', - Template = 'template', -} - -export interface VariableSuggestion { - value: string; - label: string; - documentation?: string; - origin: VariableOrigin; -} - interface DataLinkSuggestionsProps { suggestions: VariableSuggestion[]; activeIndex: number; diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinksEditor.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinksEditor.tsx index 8ac6c69feba..03746e166fb 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinksEditor.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinksEditor.tsx @@ -4,10 +4,9 @@ import React, { FC } from 'react'; import Prism from 'prismjs'; // Components import { css } from 'emotion'; -import { DataLink } from '@grafana/data'; +import { DataLink, VariableSuggestion } from '@grafana/data'; import { Button } from '../index'; import { DataLinkEditor } from './DataLinkEditor'; -import { VariableSuggestion } from './DataLinkSuggestions'; import { useTheme } from '../../themes/ThemeContext'; interface DataLinksEditorProps { diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts index eb3e8095570..990ecb3ff64 100644 --- a/packages/grafana-ui/src/components/index.ts +++ b/packages/grafana-ui/src/components/index.ts @@ -95,7 +95,6 @@ export { ClickOutsideWrapper } from './ClickOutsideWrapper/ClickOutsideWrapper'; export * from './SingleStatShared/index'; export { CallToActionCard } from './CallToActionCard/CallToActionCard'; export { ContextMenu, ContextMenuItem, ContextMenuGroup, ContextMenuProps } from './ContextMenu/ContextMenu'; -export { VariableSuggestion, VariableOrigin } from './DataLinks/DataLinkSuggestions'; export { DataLinksEditor } from './DataLinks/DataLinksEditor'; export { DataLinkInput } from './DataLinks/DataLinkInput'; export { DataLinksContextMenu } from './DataLinks/DataLinksContextMenu'; diff --git a/packages/grafana-ui/src/utils/dataLinks.ts b/packages/grafana-ui/src/utils/dataLinks.ts index 26b4f3917ad..f6c5e7f9bcf 100644 --- a/packages/grafana-ui/src/utils/dataLinks.ts +++ b/packages/grafana-ui/src/utils/dataLinks.ts @@ -1,21 +1,6 @@ import { ContextMenuItem } from '../components/ContextMenu/ContextMenu'; import { LinkModelSupplier } from '@grafana/data'; -export const DataLinkBuiltInVars = { - keepTime: '__url_time_range', - timeRangeFrom: '__from', - timeRangeTo: '__to', - includeVars: '__all_variables', - seriesName: '__series.name', - fieldName: '__field.name', - valueTime: '__value.time', - valueNumeric: '__value.numeric', - valueText: '__value.text', - valueRaw: '__value.raw', - // name of the calculation represented by the value - valueCalc: '__value.calc', -}; - /** * Delays creating links until we need to open the ContextMenu */ diff --git a/public/app/features/dashboard/panel_editor/GeneralTab.tsx b/public/app/features/dashboard/panel_editor/GeneralTab.tsx index cf899a6042b..10a542609ea 100644 --- a/public/app/features/dashboard/panel_editor/GeneralTab.tsx +++ b/public/app/features/dashboard/panel_editor/GeneralTab.tsx @@ -8,9 +8,8 @@ import './../../panel/GeneralTabCtrl'; // Types import { PanelModel } from '../state/PanelModel'; -import { DataLink } from '@grafana/data'; +import { DataLink, getPanelLinksVariableSuggestions } from '@grafana/data'; import { PanelOptionsGroup, DataLinksEditor } from '@grafana/ui'; -import { getPanelLinksVariableSuggestions } from 'app/features/panel/panellinks/link_srv'; interface Props { panel: PanelModel; diff --git a/public/app/features/dashboard/state/DashboardMigrator.test.ts b/public/app/features/dashboard/state/DashboardMigrator.test.ts index 1e26c477ec1..37b3e4ef2c0 100644 --- a/public/app/features/dashboard/state/DashboardMigrator.test.ts +++ b/public/app/features/dashboard/state/DashboardMigrator.test.ts @@ -3,7 +3,7 @@ import { DashboardModel } from '../state/DashboardModel'; import { PanelModel } from '../state/PanelModel'; import { GRID_CELL_HEIGHT, GRID_CELL_VMARGIN } from 'app/core/constants'; import { expect } from 'test/lib/common'; -import { DataLinkBuiltInVars } from '@grafana/ui'; +import { DataLinkBuiltInVars } from '@grafana/data'; jest.mock('app/core/services/context_srv', () => ({})); diff --git a/public/app/features/dashboard/state/DashboardMigrator.ts b/public/app/features/dashboard/state/DashboardMigrator.ts index 358f9086635..ccb4d6edf5d 100644 --- a/public/app/features/dashboard/state/DashboardMigrator.ts +++ b/public/app/features/dashboard/state/DashboardMigrator.ts @@ -9,7 +9,7 @@ import kbn from 'app/core/utils/kbn'; // Types import { PanelModel } from './PanelModel'; import { DashboardModel } from './DashboardModel'; -import { DataLink } from '@grafana/data'; +import { DataLink, DataLinkBuiltInVars } from '@grafana/data'; // Constants import { @@ -20,7 +20,6 @@ import { MIN_PANEL_HEIGHT, DEFAULT_PANEL_SPAN, } from 'app/core/constants'; -import { DataLinkBuiltInVars } from '@grafana/ui'; export class DashboardMigrator { dashboard: DashboardModel; diff --git a/public/app/features/panel/panellinks/link_srv.ts b/public/app/features/panel/panellinks/link_srv.ts index 4b33d48c724..c48359fbb13 100644 --- a/public/app/features/panel/panellinks/link_srv.ts +++ b/public/app/features/panel/panellinks/link_srv.ts @@ -1,211 +1,11 @@ import _ from 'lodash'; import { TimeSrv } from 'app/features/dashboard/services/TimeSrv'; -import templateSrv, { TemplateSrv } from 'app/features/templating/template_srv'; +import { TemplateSrv } from 'app/features/templating/template_srv'; import coreModule from 'app/core/core_module'; import { appendQueryToUrl, toUrlParams } from 'app/core/utils/url'; import { sanitizeUrl } from 'app/core/utils/text'; import { getConfig } from 'app/core/config'; -import { VariableSuggestion, VariableOrigin, DataLinkBuiltInVars } from '@grafana/ui'; -import { - DataLink, - KeyValue, - deprecationWarning, - LinkModel, - DataFrame, - ScopedVars, - FieldType, - Field, -} from '@grafana/data'; - -const timeRangeVars = [ - { - value: `${DataLinkBuiltInVars.keepTime}`, - label: 'Time range', - documentation: 'Adds current time range', - origin: VariableOrigin.BuiltIn, - }, - { - value: `${DataLinkBuiltInVars.timeRangeFrom}`, - label: 'Time range: from', - documentation: "Adds current time range's from value", - origin: VariableOrigin.BuiltIn, - }, - { - value: `${DataLinkBuiltInVars.timeRangeTo}`, - label: 'Time range: to', - documentation: "Adds current time range's to value", - origin: VariableOrigin.BuiltIn, - }, -]; - -const seriesVars = [ - { - value: `${DataLinkBuiltInVars.seriesName}`, - label: 'Name', - documentation: 'Name of the series', - origin: VariableOrigin.Series, - }, -]; - -const valueVars = [ - { - value: `${DataLinkBuiltInVars.valueNumeric}`, - label: 'Numeric', - documentation: 'Numeric representation of selected value', - origin: VariableOrigin.Value, - }, - { - value: `${DataLinkBuiltInVars.valueText}`, - label: 'Text', - documentation: 'Text representation of selected value', - origin: VariableOrigin.Value, - }, - { - value: `${DataLinkBuiltInVars.valueRaw}`, - label: 'Raw', - documentation: 'Raw value', - origin: VariableOrigin.Value, - }, -]; - -const buildLabelPath = (label: string) => { - return label.indexOf('.') > -1 ? `["${label}"]` : `.${label}`; -}; - -export const getPanelLinksVariableSuggestions = (): VariableSuggestion[] => [ - ...templateSrv.variables.map(variable => ({ - value: variable.name as string, - label: variable.name, - origin: VariableOrigin.Template, - })), - { - value: `${DataLinkBuiltInVars.includeVars}`, - label: 'All variables', - documentation: 'Adds current variables', - origin: VariableOrigin.Template, - }, - ...timeRangeVars, -]; - -const getFieldVars = (dataFrames: DataFrame[]) => { - const all = []; - for (const df of dataFrames) { - for (const f of df.fields) { - if (f.labels) { - for (const k of Object.keys(f.labels)) { - all.push(k); - } - } - } - } - - const labels = _.chain(all) - .flatten() - .uniq() - .value(); - - return [ - { - value: `${DataLinkBuiltInVars.fieldName}`, - label: 'Name', - documentation: 'Field name of the clicked datapoint (in ms epoch)', - origin: VariableOrigin.Field, - }, - ...labels.map(label => ({ - value: `__field.labels${buildLabelPath(label)}`, - label: `labels.${label}`, - documentation: `${label} label value`, - origin: VariableOrigin.Field, - })), - ]; -}; - -const getDataFrameVars = (dataFrames: DataFrame[]) => { - let numeric: Field = undefined; - let title: Field = undefined; - const suggestions: VariableSuggestion[] = []; - const keys: KeyValue = {}; - for (const df of dataFrames) { - for (const f of df.fields) { - if (keys[f.name]) { - continue; - } - suggestions.push({ - value: `__data.fields[${f.name}]`, - label: `${f.name}`, - documentation: `Formatted value for ${f.name} on the same row`, - origin: VariableOrigin.Fields, - }); - keys[f.name] = true; - if (!numeric && f.type === FieldType.number) { - numeric = f; - } - if (!title && f.config.title && f.config.title !== f.name) { - title = f; - } - } - } - - if (suggestions.length) { - suggestions.push({ - value: `__data.fields[0]`, - label: `Select by index`, - documentation: `Enter the field order`, - origin: VariableOrigin.Fields, - }); - } - if (numeric) { - suggestions.push({ - value: `__data.fields[${numeric.name}].numeric`, - label: `Show numeric value`, - documentation: `the numeric field value`, - origin: VariableOrigin.Fields, - }); - suggestions.push({ - value: `__data.fields[${numeric.name}].text`, - label: `Show text value`, - documentation: `the text value`, - origin: VariableOrigin.Fields, - }); - } - if (title) { - suggestions.push({ - value: `__data.fields[${title.config.title}]`, - label: `Select by title`, - documentation: `Use the title to pick the field`, - origin: VariableOrigin.Fields, - }); - } - return suggestions; -}; - -export const getDataLinksVariableSuggestions = (dataFrames: DataFrame[]): VariableSuggestion[] => { - const valueTimeVar = { - value: `${DataLinkBuiltInVars.valueTime}`, - label: 'Time', - documentation: 'Time value of the clicked datapoint (in ms epoch)', - origin: VariableOrigin.Value, - }; - return [ - ...seriesVars, - ...getFieldVars(dataFrames), - ...valueVars, - valueTimeVar, - ...getDataFrameVars(dataFrames), - ...getPanelLinksVariableSuggestions(), - ]; -}; - -export const getCalculationValueDataLinksVariableSuggestions = (dataFrames: DataFrame[]): VariableSuggestion[] => { - const fieldVars = getFieldVars(dataFrames); - const valueCalcVar = { - value: `${DataLinkBuiltInVars.valueCalc}`, - label: 'Calculation name', - documentation: 'Name of the calculation the value is a result of', - origin: VariableOrigin.Value, - }; - return [...seriesVars, ...fieldVars, ...valueVars, valueCalcVar, ...getPanelLinksVariableSuggestions()]; -}; +import { DataLink, KeyValue, deprecationWarning, LinkModel, ScopedVars, DataLinkBuiltInVars } from '@grafana/data'; export interface LinkService { getDataLinkUIModel: (link: DataLink, scopedVars: ScopedVars, origin: T) => LinkModel; diff --git a/public/app/features/panel/panellinks/specs/link_srv.test.ts b/public/app/features/panel/panellinks/specs/link_srv.test.ts index 5405f1bf47c..9364cf041f7 100644 --- a/public/app/features/panel/panellinks/specs/link_srv.test.ts +++ b/public/app/features/panel/panellinks/specs/link_srv.test.ts @@ -1,5 +1,5 @@ import { LinkSrv } from '../link_srv'; -import { DataLinkBuiltInVars } from '@grafana/ui'; +import { DataLinkBuiltInVars, initialiseVariableSuggestions } from '@grafana/data'; import _ from 'lodash'; import { TimeSrv } from 'app/features/dashboard/services/TimeSrv'; import { TemplateSrv } from 'app/features/templating/template_srv'; @@ -71,6 +71,8 @@ describe('linkSrv', () => { }, ]); + initialiseVariableSuggestions(_templateSrv); + linkSrv = new LinkSrv(_templateSrv, timeSrv); } diff --git a/public/app/plugins/datasource/elasticsearch/configuration/DataLink.tsx b/public/app/plugins/datasource/elasticsearch/configuration/DataLink.tsx index 37adb02470b..b0e8bc13d8a 100644 --- a/public/app/plugins/datasource/elasticsearch/configuration/DataLink.tsx +++ b/public/app/plugins/datasource/elasticsearch/configuration/DataLink.tsx @@ -1,6 +1,8 @@ import React from 'react'; import { css } from 'emotion'; -import { Button, FormField, VariableSuggestion, DataLinkInput, stylesFactory } from '@grafana/ui'; +import { Button, FormField, DataLinkInput, stylesFactory } from '@grafana/ui'; +import { VariableSuggestion } from '@grafana/data'; + import { DataLinkConfig } from '../types'; const getStyles = stylesFactory(() => ({ diff --git a/public/app/plugins/datasource/elasticsearch/configuration/DataLinks.tsx b/public/app/plugins/datasource/elasticsearch/configuration/DataLinks.tsx index 7800955209c..52bdc8a63a8 100644 --- a/public/app/plugins/datasource/elasticsearch/configuration/DataLinks.tsx +++ b/public/app/plugins/datasource/elasticsearch/configuration/DataLinks.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { css } from 'emotion'; -import { Button, DataLinkBuiltInVars, stylesFactory, useTheme, VariableOrigin } from '@grafana/ui'; -import { GrafanaTheme } from '@grafana/data'; +import { Button, stylesFactory, useTheme } from '@grafana/ui'; +import { GrafanaTheme, VariableOrigin, DataLinkBuiltInVars } from '@grafana/data'; import { DataLinkConfig } from '../types'; import { DataLink } from './DataLink'; diff --git a/public/app/plugins/datasource/loki/configuration/DerivedField.tsx b/public/app/plugins/datasource/loki/configuration/DerivedField.tsx index 9498e80eb86..f87fcf94949 100644 --- a/public/app/plugins/datasource/loki/configuration/DerivedField.tsx +++ b/public/app/plugins/datasource/loki/configuration/DerivedField.tsx @@ -1,6 +1,7 @@ import React from 'react'; import { css } from 'emotion'; -import { Button, FormField, VariableSuggestion, DataLinkInput, stylesFactory } from '@grafana/ui'; +import { VariableSuggestion } from '@grafana/data'; +import { Button, FormField, DataLinkInput, stylesFactory } from '@grafana/ui'; import { DerivedFieldConfig } from '../types'; const getStyles = stylesFactory(() => ({ diff --git a/public/app/plugins/datasource/loki/configuration/DerivedFields.tsx b/public/app/plugins/datasource/loki/configuration/DerivedFields.tsx index e634ab364ff..1e8d84369e4 100644 --- a/public/app/plugins/datasource/loki/configuration/DerivedFields.tsx +++ b/public/app/plugins/datasource/loki/configuration/DerivedFields.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { css } from 'emotion'; -import { Button, DataLinkBuiltInVars, stylesFactory, useTheme, VariableOrigin } from '@grafana/ui'; -import { GrafanaTheme } from '@grafana/data'; +import { Button, stylesFactory, useTheme } from '@grafana/ui'; +import { GrafanaTheme, DataLinkBuiltInVars, VariableOrigin } from '@grafana/data'; import { DerivedFieldConfig } from '../types'; import { DerivedField } from './DerivedField'; import { DebugSection } from './DebugSection'; diff --git a/public/app/plugins/panel/bargauge/BarGaugePanelEditor.tsx b/public/app/plugins/panel/bargauge/BarGaugePanelEditor.tsx index 0b5955070b3..cc7176ae1f9 100644 --- a/public/app/plugins/panel/bargauge/BarGaugePanelEditor.tsx +++ b/public/app/plugins/panel/bargauge/BarGaugePanelEditor.tsx @@ -20,13 +20,11 @@ import { FieldConfig, DataLink, PanelEditorProps, + getDataLinksVariableSuggestions, + getCalculationValueDataLinksVariableSuggestions, } from '@grafana/data'; import { BarGaugeOptions, displayModes } from './types'; import { orientationOptions } from '../gauge/types'; -import { - getDataLinksVariableSuggestions, - getCalculationValueDataLinksVariableSuggestions, -} from 'app/features/panel/panellinks/link_srv'; import { config } from 'app/core/config'; export class BarGaugePanelEditor extends PureComponent> { diff --git a/public/app/plugins/panel/gauge/GaugePanelEditor.tsx b/public/app/plugins/panel/gauge/GaugePanelEditor.tsx index 8ccf9b7d9eb..72ef317c5ea 100644 --- a/public/app/plugins/panel/gauge/GaugePanelEditor.tsx +++ b/public/app/plugins/panel/gauge/GaugePanelEditor.tsx @@ -17,13 +17,11 @@ import { ValueMapping, FieldConfig, DataLink, + getCalculationValueDataLinksVariableSuggestions, + getDataLinksVariableSuggestions, } from '@grafana/data'; import { GaugeOptions } from './types'; -import { - getCalculationValueDataLinksVariableSuggestions, - getDataLinksVariableSuggestions, -} from 'app/features/panel/panellinks/link_srv'; import { config } from 'app/core/config'; export class GaugePanelEditor extends PureComponent> { diff --git a/public/app/plugins/panel/graph/module.ts b/public/app/plugins/panel/graph/module.ts index ab0169bb543..b3c468553ba 100644 --- a/public/app/plugins/panel/graph/module.ts +++ b/public/app/plugins/panel/graph/module.ts @@ -11,12 +11,18 @@ import { DataProcessor } from './data_processor'; import { axesEditorComponent } from './axes_editor'; import config from 'app/core/config'; import TimeSeries from 'app/core/time_series2'; -import { VariableSuggestion } from '@grafana/ui'; import { getProcessedDataFrames } from 'app/features/dashboard/state/runRequest'; -import { getColorFromHexRgbOrName, PanelEvents, DataFrame, DataLink, DateTimeInput } from '@grafana/data'; +import { + getColorFromHexRgbOrName, + PanelEvents, + DataFrame, + DataLink, + DateTimeInput, + VariableSuggestion, + getDataLinksVariableSuggestions, +} from '@grafana/data'; import { GraphContextMenuCtrl } from './GraphContextMenuCtrl'; -import { getDataLinksVariableSuggestions } from 'app/features/panel/panellinks/link_srv'; import { auto } from 'angular'; import { AnnotationsSrv } from 'app/features/annotations/all'; diff --git a/public/app/plugins/panel/graph/specs/graph_ctrl.test.ts b/public/app/plugins/panel/graph/specs/graph_ctrl.test.ts index ed4bcfbdd69..df0fb55b2f0 100644 --- a/public/app/plugins/panel/graph/specs/graph_ctrl.test.ts +++ b/public/app/plugins/panel/graph/specs/graph_ctrl.test.ts @@ -1,5 +1,5 @@ import { GraphCtrl } from '../module'; -import { dateTime } from '@grafana/data'; +import { dateTime, initialiseVariableSuggestions } from '@grafana/data'; import TimeSeries from 'app/core/time_series2'; jest.mock('../graph', () => ({})); @@ -44,6 +44,9 @@ describe('GraphCtrl', () => { }; ctx.ctrl.annotationsPromise = Promise.resolve({}); ctx.ctrl.updateTimeRange(); + initialiseVariableSuggestions({ + variables: [], + }); }); describe('when time series are outside range', () => { diff --git a/public/app/plugins/panel/stat/StatPanelEditor.tsx b/public/app/plugins/panel/stat/StatPanelEditor.tsx index 70ed03b6152..790b6fc1f3c 100644 --- a/public/app/plugins/panel/stat/StatPanelEditor.tsx +++ b/public/app/plugins/panel/stat/StatPanelEditor.tsx @@ -20,15 +20,13 @@ import { DataLink, PanelEditorProps, FieldDisplayOptions, + getDataLinksVariableSuggestions, + getCalculationValueDataLinksVariableSuggestions, } from '@grafana/data'; import { StatPanelOptions, colorModes, graphModes, justifyModes } from './types'; import { orientationOptions } from '../gauge/types'; -import { - getDataLinksVariableSuggestions, - getCalculationValueDataLinksVariableSuggestions, -} from 'app/features/panel/panellinks/link_srv'; import { config } from 'app/core/config'; export class StatPanelEditor extends PureComponent> { diff --git a/public/app/routes/ReactContainer.tsx b/public/app/routes/ReactContainer.tsx index a6eb2227510..49d8131724e 100644 --- a/public/app/routes/ReactContainer.tsx +++ b/public/app/routes/ReactContainer.tsx @@ -10,6 +10,7 @@ import { ContextSrv } from 'app/core/services/context_srv'; import { provideTheme } from 'app/core/utils/ConfigProvider'; import { ErrorBoundaryAlert } from '@grafana/ui'; import { GrafanaRootScope } from './GrafanaCtrl'; +import { initialiseVariableSuggestions } from '@grafana/data'; function WrapInProvider(store: any, Component: any, props: any) { return ( @@ -56,9 +57,8 @@ export function reactContainer( }; document.body.classList.add('is-react'); - ReactDOM.render(WrapInProvider(store, provideTheme(component), props), elem[0]); - + initialiseVariableSuggestions($injector.get('templateSrv')); scope.$on('$destroy', () => { document.body.classList.remove('is-react'); ReactDOM.unmountComponentAtNode(elem[0]);