Removes default export for time and template srvs

Also uses @grafana/runtime versions of the interfaces where possible

public/app/features/dashboard/components/DashboardRow/DashboardRow.tsx

@@ -3,7 +3,7 @@ import classNames from 'classnames';
 import { Icon } from '@grafana/ui';
 import { PanelModel } from '../../state/PanelModel';
 import { DashboardModel } from '../../state/DashboardModel';
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 import appEvents from 'app/core/app_events';
 import { CoreEvents } from 'app/types';
 import { RowOptionsButton } from '../RowOptions/RowOptionsButton';
@@ -69,7 +69,7 @@ export class DashboardRow extends React.Component<DashboardRowProps, any> {
       'dashboard-row--collapsed': this.state.collapsed,
     });
 
-    const title = templateSrv.replace(this.props.panel.title, this.props.panel.scopedVars, 'text');
+    const title = getTemplateSrv().replace(this.props.panel.title, this.props.panel.scopedVars, 'text');
     const count = this.props.panel.panels ? this.props.panel.panels.length : 0;
     const panels = count === 1 ? 'panel' : 'panels';
     const canEdit = this.props.dashboard.meta.canEdit === true;

public/app/features/dashboard/components/ShareModal/ShareLink.test.tsx

@@ -14,9 +14,11 @@ jest.mock('app/features/dashboard/services/TimeSrv', () => ({
 let fillVariableValuesForUrlMock = (params: any) => {};
 
 jest.mock('app/features/templating/template_srv', () => ({
-  fillVariableValuesForUrl: (params: any) => {
-    fillVariableValuesForUrlMock(params);
-  },
+  getTemplateSrv: () => ({
+    fillVariableValuesForUrl: (params: any) => {
+      fillVariableValuesForUrlMock(params);
+    },
+  }),
 }));
 
 function mockLocationHref(href: string) {

public/app/features/dashboard/components/ShareModal/utils.ts

@@ -1,6 +1,6 @@
 import { config } from '@grafana/runtime';
 import { getTimeSrv } from 'app/features/dashboard/services/TimeSrv';
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 import { PanelModel, dateTime, urlUtil } from '@grafana/data';
 
 export function buildParams(
@@ -22,7 +22,7 @@ export function buildParams(
   }
 
   if (includeTemplateVars) {
-    templateSrv.fillVariableValuesForUrl(params);
+    getTemplateSrv().fillVariableValuesForUrl(params);
   }
 
   if (selectedTheme !== 'current') {

public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx

@@ -8,7 +8,7 @@ import { selectors } from '@grafana/e2e-selectors';
 
 import PanelHeaderCorner from './PanelHeaderCorner';
 import { PanelHeaderMenu } from './PanelHeaderMenu';
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 
 import { DashboardModel } from 'app/features/dashboard/state/DashboardModel';
 import { PanelModel } from 'app/features/dashboard/state/PanelModel';
@@ -131,7 +131,7 @@ export class PanelHeader extends Component<Props, State> {
   render() {
     const { panel, scopedVars, error, isViewing, isEditing, data, alertState } = this.props;
     const { menuItems } = this.state;
-    const title = templateSrv.replace(panel.title, scopedVars, 'text');
+    const title = getTemplateSrv().replace(panel.title, scopedVars, 'text');
 
     const panelHeaderClass = classNames({
       'panel-header': true,

public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx

@@ -5,7 +5,7 @@ import { Tooltip, PopoverContent } from '@grafana/ui';
 import { getLocationSrv } from '@grafana/runtime';
 
 import { PanelModel } from 'app/features/dashboard/state/PanelModel';
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 import { getTimeSrv, TimeSrv } from 'app/features/dashboard/services/TimeSrv';
 import { InspectTab } from '../../components/Inspector/types';
 
@@ -45,7 +45,7 @@ export class PanelHeaderCorner extends Component<Props> {
   getInfoContent = (): JSX.Element => {
     const { panel } = this.props;
     const markdown = panel.description || '';
-    const interpolatedMarkdown = templateSrv.replace(markdown, panel.scopedVars);
+    const interpolatedMarkdown = getTemplateSrv().replace(markdown, panel.scopedVars);
     const markedInterpolatedMarkdown = renderMarkdown(interpolatedMarkdown);
     const links = this.props.links && this.props.links.getLinks(panel);
 

public/app/features/dashboard/services/TimeSrv.ts

@@ -316,5 +316,3 @@ export function getTimeSrv(): TimeSrv {
 }
 
 coreModule.service('timeSrv', TimeSrv);
-
-export default getTimeSrv();

public/app/features/dashboard/state/PanelModel.ts

@@ -3,7 +3,7 @@ import _ from 'lodash';
 // Utils
 import { Emitter } from 'app/core/utils/emitter';
 import { getNextRefIdChar } from 'app/core/utils/query';
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 // Types
 import {
   DataConfigSource,
@@ -470,7 +470,7 @@ export class PanelModel implements DataConfigSource {
     if (extraVars) {
       vars = vars ? { ...vars, ...extraVars } : extraVars;
     }
-    return templateSrv.replace(value, vars, format);
+    return getTemplateSrv().replace(value, vars, format);
   }
 
   resendLastResult() {

public/app/features/dashboard/state/PanelQueryRunner.ts

@@ -5,7 +5,7 @@ import { map } from 'rxjs/operators';
 
 // Services & Utils
 import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 import { runRequest, preProcessPanelData } from './runRequest';
 import { runSharedRequest, isSharedDashboardQuery } from '../../../plugins/datasource/dashboard';
 
@@ -164,7 +164,7 @@ export class PanelQueryRunner {
         return query;
       });
 
-      const lowerIntervalLimit = minInterval ? templateSrv.replace(minInterval, request.scopedVars) : ds.interval;
+      const lowerIntervalLimit = minInterval ? getTemplateSrv().replace(minInterval, request.scopedVars) : ds.interval;
       const norm = rangeUtil.calculateInterval(timeRange, maxDataPoints, lowerIntervalLimit);
 
       // make shallow copy of scoped vars,

public/app/features/dashboard/utils/panel.ts

@@ -14,7 +14,7 @@ import appEvents from 'app/core/app_events';
 import config from 'app/core/config';
 
 // Services
-import templateSrv from 'app/features/templating/template_srv';
+import { getTemplateSrv } from 'app/features/templating/template_srv';
 
 // Constants
 import { LS_PANEL_COPY_KEY, PANEL_BORDER } from 'app/core/constants';
@@ -84,7 +84,7 @@ export function applyPanelTimeOverrides(panel: PanelModel, timeRange: TimeRange)
   };
 
   if (panel.timeFrom) {
-    const timeFromInterpolated = templateSrv.replace(panel.timeFrom, panel.scopedVars);
+    const timeFromInterpolated = getTemplateSrv().replace(panel.timeFrom, panel.scopedVars);
     const timeFromInfo = rangeUtil.describeTextRange(timeFromInterpolated);
     if (timeFromInfo.invalid) {
       newTimeData.timeInfo = 'invalid time override';
@@ -106,7 +106,7 @@ export function applyPanelTimeOverrides(panel: PanelModel, timeRange: TimeRange)
   }
 
   if (panel.timeShift) {
-    const timeShiftInterpolated = templateSrv.replace(panel.timeShift, panel.scopedVars);
+    const timeShiftInterpolated = getTemplateSrv().replace(panel.timeShift, panel.scopedVars);
     const timeShiftInfo = rangeUtil.describeTextRange(timeShiftInterpolated);
     if (timeShiftInfo.invalid) {
       newTimeData.timeInfo = 'invalid timeshift';

public/app/features/panel/panellinks/link_srv.ts

@@ -1,6 +1,6 @@
 import _ from 'lodash';
 import { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
-import templateSrv, { TemplateSrv } from 'app/features/templating/template_srv';
+import { getTemplateSrv, TemplateSrv } from 'app/features/templating/template_srv';
 import coreModule from 'app/core/core_module';
 import { getConfig } from 'app/core/config';
 import {
@@ -80,11 +80,13 @@ const buildLabelPath = (label: string) => {
 };
 
 export const getPanelLinksVariableSuggestions = (): VariableSuggestion[] => [
-  ...templateSrv.getVariables().map(variable => ({
-    value: variable.name as string,
-    label: variable.name,
-    origin: VariableOrigin.Template,
-  })),
+  ...getTemplateSrv()
+    .getVariables()
+    .map(variable => ({
+      value: variable.name as string,
+      label: variable.name,
+      origin: VariableOrigin.Template,
+    })),
   {
     value: `${DataLinkBuiltInVars.includeVars}`,
     label: 'All variables',
@@ -240,11 +242,13 @@ export const getPanelOptionsVariableSuggestions = (plugin: PanelPlugin, data?: D
   const dataVariables = plugin.meta.skipDataQuery ? [] : getDataFrameVars(data || []);
   return [
     ...dataVariables, // field values
-    ...templateSrv.getVariables().map(variable => ({
-      value: variable.name as string,
-      label: variable.name,
-      origin: VariableOrigin.Template,
-    })),
+    ...getTemplateSrv()
+      .getVariables()
+      .map(variable => ({
+        value: variable.name as string,
+        label: variable.name,
+        origin: VariableOrigin.Template,
+      })),
   ];
 };
 

public/app/features/templating/all.ts

@@ -1,4 +1,4 @@
 import coreModule from 'app/core/core_module';
-import templateSrv from './template_srv';
+import { getTemplateSrv } from './template_srv';
 
-coreModule.factory('templateSrv', () => templateSrv);
+coreModule.factory('templateSrv', () => getTemplateSrv());

public/app/features/templating/template_srv.ts

@@ -336,4 +336,4 @@ export class TemplateSrv implements BaseTemplateSrv {
 // Expose the template srv
 const srv = new TemplateSrv();
 setTemplateSrv(srv);
-export default srv;
+export const getTemplateSrv = () => srv;

public/app/features/variables/datasource/actions.ts

@@ -6,7 +6,7 @@ import { DataSourceSelectItem, stringToJsRegex } from '@grafana/data';
 import { getDatasourceSrv } from '../../plugins/datasource_srv';
 import { getVariable } from '../state/selectors';
 import { DataSourceVariableModel } from '../types';
-import templateSrv from '../../templating/template_srv';
+import { getTemplateSrv } from '../../templating/template_srv';
 import _ from 'lodash';
 import { changeVariableEditorExtended } from '../editor/reducer';
 
@@ -23,7 +23,7 @@ export const updateDataSourceVariableOptions = (
   let regex;
 
   if (variableInState.regex) {
-    regex = templateSrv.replace(variableInState.regex, undefined, 'regex');
+    regex = getTemplateSrv().replace(variableInState.regex, undefined, 'regex');
     regex = stringToJsRegex(regex);
   }
 

public/app/features/variables/interval/actions.ts

@@ -7,7 +7,7 @@ import { validateVariableSelectionState } from '../state/actions';
 import { getVariable } from '../state/selectors';
 import { IntervalVariableModel } from '../types';
 import { getTimeSrv } from '../../dashboard/services/TimeSrv';
-import templateSrv from '../../templating/template_srv';
+import { getTemplateSrv, TemplateSrv } from '../../templating/template_srv';
 import appEvents from '../../../core/app_events';
 
 export interface UpdateIntervalVariableOptionsDependencies {
@@ -30,15 +30,15 @@ export const updateIntervalVariableOptions = (
 export interface UpdateAutoValueDependencies {
   calculateInterval: typeof rangeUtil.calculateInterval;
   getTimeSrv: typeof getTimeSrv;
-  templateSrv: typeof templateSrv;
+  templateSrv: TemplateSrv;
 }
 
 export const updateAutoValue = (
   identifier: VariableIdentifier,
   dependencies: UpdateAutoValueDependencies = {
     calculateInterval: rangeUtil.calculateInterval,
     getTimeSrv: getTimeSrv,
-    templateSrv: templateSrv,
+    templateSrv: getTemplateSrv(),
   }
 ): ThunkResult<void> => (dispatch, getState) => {
   const variableInState = getVariable<IntervalVariableModel>(identifier.id, getState());

public/app/features/variables/query/QueryVariableEditor.tsx

@@ -2,7 +2,7 @@ import React, { ChangeEvent, PureComponent } from 'react';
 import { InlineFormLabel, LegacyForms } from '@grafana/ui';
 import { selectors } from '@grafana/e2e-selectors';
 
-import templateSrv from '../../templating/template_srv';
+import { getTemplateSrv } from '../../templating/template_srv';
 import { SelectionOptionsEditor } from '../editor/SelectionOptionsEditor';
 import { QueryVariableModel, VariableRefresh, VariableSort, VariableWithMultiSupport } from '../types';
 import { QueryVariableEditorState } from './reducer';
@@ -174,7 +174,7 @@ export class QueryVariableEditorUnConnected extends PureComponent<Props, State>
             <VariableQueryEditor
               datasource={this.props.editor.extended?.dataSource}
               query={this.props.variable.query}
-              templateSrv={templateSrv}
+              templateSrv={getTemplateSrv()}
               onChange={this.onQueryChange}
             />
           )}

public/app/features/variables/query/actions.ts

@@ -3,7 +3,7 @@ import { validateVariableSelectionState } from '../state/actions';
 import { QueryVariableModel, VariableRefresh } from '../types';
 import { ThunkResult } from '../../../types';
 import { getDatasourceSrv } from '../../plugins/datasource_srv';
-import templateSrv from '../../templating/template_srv';
+import { getTemplateSrv } from '../../templating/template_srv';
 import { getTimeSrv } from '../../dashboard/services/TimeSrv';
 import appEvents from '../../../core/app_events';
 import { importDataSourcePlugin } from '../../plugins/plugin_loader';
@@ -138,5 +138,5 @@ const getTemplatedRegex = (variable: QueryVariableModel): string => {
     return '';
   }
 
-  return templateSrv.replace(variable.regex, {}, 'regex');
+  return getTemplateSrv().replace(variable.regex, {}, 'regex');
 };

public/app/features/variables/state/actions.ts

@@ -30,7 +30,7 @@ import {
 import { toVariableIdentifier, toVariablePayload, VariableIdentifier } from './types';
 import { appEvents } from 'app/core/core';
 import { contextSrv } from 'app/core/services/context_srv';
-import templateSrv from '../../templating/template_srv';
+import { getTemplateSrv, TemplateSrv } from '../../templating/template_srv';
 import { alignCurrentWithMulti } from '../shared/multiOptions';
 import { isMulti } from '../guard';
 import { getTimeSrv } from 'app/features/dashboard/services/TimeSrv';
@@ -89,7 +89,7 @@ export const initDashboardTemplating = (list: VariableModel[]): ThunkResult<void
       dispatch(addVariable(toVariablePayload(model, { global: false, index: orderIndex++, model })));
     }
 
-    templateSrv.updateTimeRange(getTimeSrv().timeRange());
+    getTemplateSrv().updateTimeRange(getTimeSrv().timeRange());
 
     for (let index = 0; index < getVariables(getState()).length; index++) {
       dispatch(addInitLock(toVariablePayload(getVariables(getState())[index])));
@@ -458,13 +458,13 @@ export const variableUpdated = (
 };
 
 export interface OnTimeRangeUpdatedDependencies {
-  templateSrv: typeof templateSrv;
+  templateSrv: TemplateSrv;
   appEvents: typeof appEvents;
 }
 
 export const onTimeRangeUpdated = (
   timeRange: TimeRange,
-  dependencies: OnTimeRangeUpdatedDependencies = { templateSrv: templateSrv, appEvents: appEvents }
+  dependencies: OnTimeRangeUpdatedDependencies = { templateSrv: getTemplateSrv(), appEvents: appEvents }
 ): ThunkResult<Promise<void>> => async (dispatch, getState) => {
   dependencies.templateSrv.updateTimeRange(timeRange);
   const variablesThatNeedRefresh = getVariables(getState()).filter(variable => {

public/app/plugins/datasource/cloud-monitoring/datasource.ts

@@ -9,8 +9,8 @@ import {
   SelectableValue,
   toDataFrame,
 } from '@grafana/data';
-import defaultTemplateSrv, { TemplateSrv } from 'app/features/templating/template_srv';
-import defaultTimeSrv, { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
+import { getTemplateSrv, TemplateSrv } from 'app/features/templating/template_srv';
+import { getTimeSrv, TimeSrv } from 'app/features/dashboard/services/TimeSrv';
 
 import {
   CloudMonitoringQuery,
@@ -30,8 +30,8 @@ export default class CloudMonitoringDatasource extends DataSourceApi<CloudMonito
 
   constructor(
     private instanceSettings: DataSourceInstanceSettings<CloudMonitoringOptions>,
-    public templateSrv: TemplateSrv = defaultTemplateSrv,
-    private readonly timeSrv: TimeSrv = defaultTimeSrv
+    public templateSrv: TemplateSrv = getTemplateSrv(),
+    private readonly timeSrv: TimeSrv = getTimeSrv()
   ) {
     super(instanceSettings);
     this.authenticationType = instanceSettings.jsonData.authenticationType || 'jwt';

public/app/plugins/datasource/cloudwatch/datasource.ts

@@ -21,8 +21,8 @@ import {
   DataQueryErrorType,
 } from '@grafana/data';
 import { getBackendSrv, toDataQueryResponse } from '@grafana/runtime';
-import defaultTemplateSrv, { TemplateSrv } from 'app/features/templating/template_srv';
-import defaultTimeSrv, { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
+import { getTemplateSrv, TemplateSrv } from 'app/features/templating/template_srv';
+import { getTimeSrv, TimeSrv } from 'app/features/dashboard/services/TimeSrv';
 import { ThrottlingErrorMessage } from './components/ThrottlingErrorMessage';
 import memoizedDebounce from './memoizedDebounce';
 import {
@@ -85,8 +85,8 @@ export class CloudWatchDatasource extends DataSourceApi<CloudWatchQuery, CloudWa
 
   constructor(
     instanceSettings: DataSourceInstanceSettings<CloudWatchJsonData>,
-    private readonly templateSrv: TemplateSrv = defaultTemplateSrv,
-    private readonly timeSrv: TimeSrv = defaultTimeSrv
+    private readonly templateSrv: TemplateSrv = getTemplateSrv(),
+    private readonly timeSrv: TimeSrv = getTimeSrv()
   ) {
     super(instanceSettings);
     this.type = 'cloudwatch';

public/app/plugins/datasource/elasticsearch/datasource.ts

@@ -18,8 +18,8 @@ import { ElasticQueryBuilder } from './query_builder';
 import { toUtc } from '@grafana/data';
 import * as queryDef from './query_def';
 import { getBackendSrv } from '@grafana/runtime';
-import defaultTemplateSrv, { TemplateSrv } from 'app/features/templating/template_srv';
-import defaultTimeSrv, { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
+import { getTemplateSrv, TemplateSrv } from 'app/features/templating/template_srv';
+import { getTimeSrv, TimeSrv } from 'app/features/dashboard/services/TimeSrv';
 import { DataLinkConfig, ElasticsearchOptions, ElasticsearchQuery } from './types';
 
 // Those are metadata fields as defined in https://www.elastic.co/guide/en/elasticsearch/reference/current/mapping-fields.html#_identity_metadata_fields.
@@ -56,8 +56,8 @@ export class ElasticDatasource extends DataSourceApi<ElasticsearchQuery, Elastic
 
   constructor(
     instanceSettings: DataSourceInstanceSettings<ElasticsearchOptions>,
-    private readonly templateSrv: TemplateSrv = defaultTemplateSrv,
-    private readonly timeSrv: TimeSrv = defaultTimeSrv
+    private readonly templateSrv: TemplateSrv = getTemplateSrv(),
+    private readonly timeSrv: TimeSrv = getTimeSrv()
   ) {
     super(instanceSettings);
     this.basicAuth = instanceSettings.basicAuth;