Eslint: no-duplicate-imports rule (bump grafana-eslint-config) (#30989)

* Eslint: no-duplicate-imports rule (bump grafana-eslint-config)

* Chore: Fix duplicate imports (#31041)

* Rebased this branch into eslint-no-duplicate-imports

* updated some changes

* merged uncaught duplicate imports

* fixes frontend test- I hope

* fixes e2e test- I hope

Co-authored-by: Uchechukwu Obasi <obasiuche62@gmail.com>

public/app/app.ts

@@ -8,9 +8,9 @@ import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'; // fetch polyfill n
 import ttiPolyfill from 'tti-polyfill';
 
 import 'file-saver';
-import 'lodash';
 import 'jquery';
-import 'angular';
+import _ from 'lodash';
+import angular from 'angular';
 import 'angular-route';
 import 'angular-sanitize';
 import 'angular-bindonce';
@@ -19,12 +19,8 @@ import 'react-dom';
 
 import 'vendor/bootstrap/bootstrap';
 import 'vendor/angular-other/angular-strap';
-
-import $ from 'jquery';
-import angular from 'angular';
 import config from 'app/core/config';
 // @ts-ignore ignoring this for now, otherwise we would have to extend _ interface with move
-import _ from 'lodash';
 import {
   AppEvents,
   setLocale,

public/app/core/components/Login/LoginCtrl.tsx

@@ -1,10 +1,9 @@
-import React from 'react';
+import React, { PureComponent } from 'react';
 import config from 'app/core/config';
 
 import { updateLocation } from 'app/core/actions';
 import { connect } from 'react-redux';
 import { StoreState } from 'app/types';
-import { PureComponent } from 'react';
 import { getBackendSrv } from '@grafana/runtime';
 import { hot } from 'react-hot-loader';
 import appEvents from 'app/core/app_events';

public/app/core/components/Select/TeamPicker.tsx

@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
-import _ from 'lodash';
+import _, { debounce } from 'lodash';
 import { AsyncSelect } from '@grafana/ui';
-import { debounce } from 'lodash';
 import { getBackendSrv } from '@grafana/runtime';
 
 export interface Team {

public/app/core/components/Select/UserPicker.tsx

@@ -1,12 +1,11 @@
 // Libraries
 import React, { Component } from 'react';
-import _ from 'lodash';
+import _, { debounce } from 'lodash';
 
 // Components
 import { AsyncSelect } from '@grafana/ui';
 
 // Utils & Services
-import { debounce } from 'lodash';
 import { getBackendSrv } from '@grafana/runtime';
 
 // Types

public/app/core/specs/rangeutil.test.ts

@@ -1,6 +1,5 @@
-import { rangeUtil } from '@grafana/data';
+import { rangeUtil, dateTime } from '@grafana/data';
 import _ from 'lodash';
-import { dateTime } from '@grafana/data';
 
 describe('rangeUtil', () => {
   describe('Can get range grouped list of ranges', () => {

public/app/core/specs/time_series.test.ts

@@ -1,5 +1,4 @@
-import TimeSeries from 'app/core/time_series2';
-import { updateLegendValues } from 'app/core/time_series2';
+import TimeSeries, { updateLegendValues } from 'app/core/time_series2';
 
 describe('TimeSeries', () => {
   let points, series: any;

public/app/core/utils/richHistory.test.ts

@@ -8,9 +8,9 @@ import {
   deleteAllFromRichHistory,
   deleteQueryInRichHistory,
   filterAndSortQueries,
+  SortOrder,
 } from './richHistory';
 import store from 'app/core/store';
-import { SortOrder } from './richHistory';
 import { dateTime, DataQuery } from '@grafana/data';
 
 const mock: any = {

public/app/features/alerting/getAlertingValidationMessage.ts

@@ -1,6 +1,5 @@
-import { DataQuery } from '@grafana/data';
+import { DataQuery, DataTransformerConfig } from '@grafana/data';
 import { DataSourceSrv } from '@grafana/runtime';
-import { DataTransformerConfig } from '@grafana/data';
 
 export const getDefaultCondition = () => ({
   type: 'query',

public/app/features/annotations/event_editor.ts

@@ -1,8 +1,7 @@
 import _ from 'lodash';
 import { coreModule } from 'app/core/core';
 import { MetricsPanelCtrl } from 'app/plugins/sdk';
-import { AnnotationEvent } from '@grafana/data';
-import { dateTime } from '@grafana/data';
+import { AnnotationEvent, dateTime } from '@grafana/data';
 import { AnnotationsSrv } from './all';
 
 export class EventEditorCtrl {

public/app/features/dashboard/components/DashNav/DashNavTimeControls.tsx

@@ -1,12 +1,11 @@
 // Libraries
 import React, { Component } from 'react';
-import { dateMath, GrafanaTheme, TimeZone } from '@grafana/data';
+import { dateMath, GrafanaTheme, TimeZone, TimeRange } from '@grafana/data';
 import { css } from 'emotion';
 
 // Types
 import { DashboardModel } from '../../state';
 import { LocationState, CoreEvents } from 'app/types';
-import { TimeRange } from '@grafana/data';
 
 // Components
 import { RefreshPicker, withTheme, stylesFactory, Themeable, defaultIntervals } from '@grafana/ui';

public/app/features/dashboard/components/Inspector/InspectDataTab.tsx

@@ -10,9 +10,9 @@ import {
   SelectableValue,
   toCSV,
   transformDataFrame,
+  CSVConfig,
 } from '@grafana/data';
 import { Button, Container, Field, HorizontalGroup, Spinner, Select, Switch, Table, VerticalGroup } from '@grafana/ui';
-import { CSVConfig } from '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
 
 import { getPanelInspectorStyles } from './styles';

public/app/features/dashboard/state/reducers.test.ts

@@ -4,9 +4,10 @@ import {
   dashboardInitFetching,
   dashboardInitSlow,
   loadDashboardPermissions,
+  dashboardReducer,
+  initialState,
 } from './reducers';
 import { DashboardInitPhase, DashboardState, OrgRole, PermissionLevel } from 'app/types';
-import { dashboardReducer, initialState } from './reducers';
 import { DashboardModel } from './DashboardModel';
 
 describe('dashboard reducer', () => {

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

@@ -4,12 +4,10 @@ import store from 'app/core/store';
 // Models
 import { DashboardModel } from 'app/features/dashboard/state/DashboardModel';
 import { PanelModel } from 'app/features/dashboard/state/PanelModel';
-import { TimeRange, AppEvents } from '@grafana/data';
+import { TimeRange, AppEvents, rangeUtil, dateMath } from '@grafana/data';
 
 // Utils
 import { isString as _isString } from 'lodash';
-import { rangeUtil } from '@grafana/data';
-import { dateMath } from '@grafana/data';
 import appEvents from 'app/core/app_events';
 import config from 'app/core/config';
 

public/app/features/datasources/DataSourceDashboards.test.tsx

@@ -1,8 +1,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 import { DataSourceDashboards, Props } from './DataSourceDashboards';
-import { DataSourceSettings } from '@grafana/data';
-import { NavModel } from '@grafana/data';
+import { DataSourceSettings, NavModel } from '@grafana/data';
 import { PluginDashboard } from 'app/types';
 
 const setup = (propOverrides?: object) => {

public/app/features/datasources/DataSourceDashboards.tsx

@@ -17,8 +17,7 @@ import { getDataSource } from './state/selectors';
 
 // Types
 import { PluginDashboard, StoreState } from 'app/types';
-import { DataSourceSettings } from '@grafana/data';
-import { NavModel } from '@grafana/data';
+import { DataSourceSettings, NavModel } from '@grafana/data';
 
 export interface Props {
   navModel: NavModel;

public/app/features/explore/NodeGraphContainer.tsx

@@ -1,10 +1,9 @@
 import React from 'react';
-import { Badge, NodeGraph } from '@grafana/ui';
+import { Badge, NodeGraph, Collapse } from '@grafana/ui';
 import { DataFrame, TimeRange } from '@grafana/data';
 import { ExploreId, StoreState } from '../../types';
 import { splitOpen } from './state/main';
 import { connect, ConnectedProps } from 'react-redux';
-import { Collapse } from '@grafana/ui';
 import { useLinks } from './utils/links';
 
 interface Props {

public/app/features/explore/QueryRow.test.tsx

@@ -2,8 +2,7 @@ import React from 'react';
 import { QueryRow, QueryRowProps } from './QueryRow';
 import { shallow } from 'enzyme';
 import { ExploreId } from 'app/types/explore';
-import { EventBusExtended } from '@grafana/data';
-import { DataSourceApi, TimeRange, AbsoluteTimeRange, PanelData } from '@grafana/data';
+import { DataSourceApi, TimeRange, AbsoluteTimeRange, PanelData, EventBusExtended } from '@grafana/data';
 
 const setup = (propOverrides?: object) => {
   const props: QueryRowProps = {

public/app/features/explore/RichHistory/RichHistory.test.tsx

@@ -2,8 +2,7 @@ import React from 'react';
 import { mount } from 'enzyme';
 import { GrafanaTheme } from '@grafana/data';
 import { ExploreId } from '../../../types/explore';
-import { RichHistory, RichHistoryProps } from './RichHistory';
-import { Tabs } from './RichHistory';
+import { RichHistory, RichHistoryProps, Tabs } from './RichHistory';
 import { Tab } from '@grafana/ui';
 
 jest.mock('../state/selectors', () => ({ getExploreDatasources: jest.fn() }));

public/app/features/explore/RichHistory/RichHistory.tsx

@@ -3,12 +3,11 @@ import React, { PureComponent } from 'react';
 //Services & Utils
 import { RICH_HISTORY_SETTING_KEYS, SortOrder } from 'app/core/utils/richHistory';
 import store from 'app/core/store';
-import { withTheme, TabbedContainer, TabConfig } from '@grafana/ui';
+import { Themeable, withTheme, TabbedContainer, TabConfig } from '@grafana/ui';
 
 //Types
 import { RichHistoryQuery, ExploreId } from 'app/types/explore';
 import { SelectableValue } from '@grafana/data';
-import { Themeable } from '@grafana/ui';
 
 //Components
 import { RichHistorySettings } from './RichHistorySettings';

public/app/features/explore/RichHistory/RichHistoryQueriesTab.tsx

@@ -6,7 +6,7 @@ import { uniqBy, debounce } from 'lodash';
 import { RichHistoryQuery, ExploreId } from 'app/types/explore';
 
 // Utils
-import { stylesFactory, useTheme } from '@grafana/ui';
+import { stylesFactory, useTheme, RangeSlider, Select } from '@grafana/ui';
 import { GrafanaTheme, SelectableValue } from '@grafana/data';
 
 import {
@@ -20,7 +20,6 @@ import {
 // Components
 import RichHistoryCard from './RichHistoryCard';
 import { sortOrderOptions } from './RichHistory';
-import { RangeSlider, Select } from '@grafana/ui';
 import { FilterInput } from 'app/core/components/FilterInput/FilterInput';
 
 export interface Props {

public/app/features/explore/RichHistory/RichHistoryStarredTab.tsx

@@ -6,14 +6,13 @@ import { uniqBy, debounce } from 'lodash';
 import { RichHistoryQuery, ExploreId } from 'app/types/explore';
 
 // Utils
-import { stylesFactory, useTheme } from '@grafana/ui';
+import { stylesFactory, useTheme, Select } from '@grafana/ui';
 import { GrafanaTheme, SelectableValue } from '@grafana/data';
 import { filterAndSortQueries, createDatasourcesList, SortOrder } from 'app/core/utils/richHistory';
 
 // Components
 import RichHistoryCard from './RichHistoryCard';
 import { sortOrderOptions } from './RichHistory';
-import { Select } from '@grafana/ui';
 import { FilterInput } from 'app/core/components/FilterInput/FilterInput';
 
 export interface Props {

public/app/features/explore/state/explorePane.ts

@@ -1,10 +1,9 @@
 import { AnyAction } from 'redux';
 import { isEqual } from 'lodash';
-import { getQueryKeys } from 'app/core/utils/explore';
 import { ExploreId, ExploreItemState } from 'app/types/explore';
-import { queryReducer } from './query';
+import { queryReducer, runQueries, setQueriesAction } from './query';
 import { datasourceReducer } from './datasource';
-import { timeReducer } from './time';
+import { timeReducer, updateTime } from './time';
 import { historyReducer } from './history';
 import { makeExplorePaneState, makeInitialUpdateState, loadAndInitDatasource, createEmptyQueryResponse } from './utils';
 import { createAction, PayloadAction } from '@reduxjs/toolkit';
@@ -23,14 +22,13 @@ import {
   ensureQueries,
   generateNewKeyAndAddRefIdIfMissing,
   getTimeRangeFromUrl,
+  getQueryKeys,
 } from 'app/core/utils/explore';
 // Types
 import { ThunkResult } from 'app/types';
 import { getTimeZone } from 'app/features/profile/state/selectors';
 import { updateLocation } from '../../../core/actions';
 import { serializeStateToUrlParam } from '@grafana/data/src/utils/url';
-import { runQueries, setQueriesAction } from './query';
-import { updateTime } from './time';
 import { toRawTimeRange } from '../utils/time';
 import { getDataSourceSrv } from '@grafana/runtime';
 

public/app/features/explore/useLiveTailControls.ts

@@ -3,9 +3,8 @@ import { useDispatch } from 'react-redux';
 import { RefreshPicker } from '@grafana/ui';
 
 import { changeRefreshInterval } from './state/time';
-import { setPausedStateAction } from './state/query';
+import { setPausedStateAction, runQueries } from './state/query';
 import { ExploreId } from '../../types';
-import { runQueries } from './state/query';
 
 /**
  * Hook that gives you all the functions needed to control the live tailing.

public/app/features/playlist/playlists_ctrl.ts

@@ -1,13 +1,12 @@
 import { IScope } from 'angular';
 import _ from 'lodash';
 import { AppEvents } from '@grafana/data';
-import { OrgRole } from 'app/types';
+import { OrgRole, AppEventEmitter, CoreEvents } from 'app/types';
 import { getBackendSrv } from '@grafana/runtime';
 
 import coreModule from '../../core/core_module';
 import config from '../../core/config';
 import { NavModelSrv } from 'app/core/nav_model_srv';
-import { AppEventEmitter, CoreEvents } from 'app/types';
 import { promiseToDigest } from '../../core/utils/promiseToDigest';
 
 export class PlaylistsCtrl {

public/app/features/playlist/specs/playlist_edit_ctrl.test.ts

@@ -1,4 +1,3 @@
-import '../playlist_edit_ctrl';
 import { PlaylistEditCtrl } from '../playlist_edit_ctrl';
 import { ILocationService, IScope } from 'angular';
 import { AppEventEmitter } from '../../../types';

public/app/features/plugins/plugin_loader.ts

@@ -21,17 +21,6 @@ import config from 'app/core/config';
 import TimeSeries from 'app/core/time_series2';
 import TableModel from 'app/core/table_model';
 import { coreModule, appEvents, contextSrv } from 'app/core/core';
-import {
-  DataSourcePlugin,
-  AppPlugin,
-  PanelPlugin,
-  PluginMeta,
-  DataSourcePluginMeta,
-  dateMath,
-  DataSourceApi,
-  DataSourceJsonData,
-  DataQuery,
-} from '@grafana/data';
 import * as flatten from 'app/core/utils/flatten';
 import * as ticks from 'app/core/utils/ticks';
 import { BackendSrv, getBackendSrv } from 'app/core/services/backend_srv';
@@ -129,7 +118,7 @@ exposeToPlugin('app/core/services/backend_srv', {
 });
 
 exposeToPlugin('app/plugins/sdk', sdk);
-exposeToPlugin('app/core/utils/datemath', dateMath);
+exposeToPlugin('app/core/utils/datemath', grafanaData.dateMath);
 exposeToPlugin('app/core/utils/flatten', flatten);
 exposeToPlugin('app/core/utils/kbn', kbn);
 exposeToPlugin('app/core/utils/ticks', ticks);
@@ -191,7 +180,7 @@ export async function importPluginModule(path: string): Promise<any> {
   return grafanaRuntime.SystemJS.import(path);
 }
 
-export function importDataSourcePlugin(meta: DataSourcePluginMeta): Promise<GenericDataSourcePlugin> {
+export function importDataSourcePlugin(meta: grafanaData.DataSourcePluginMeta): Promise<GenericDataSourcePlugin> {
   return importPluginModule(meta.module).then((pluginExports) => {
     if (pluginExports.plugin) {
       const dsPlugin = pluginExports.plugin as GenericDataSourcePlugin;
@@ -200,10 +189,10 @@ export function importDataSourcePlugin(meta: DataSourcePluginMeta): Promise<Gene
     }
 
     if (pluginExports.Datasource) {
-      const dsPlugin = new DataSourcePlugin<
-        DataSourceApi<DataQuery, DataSourceJsonData>,
-        DataQuery,
-        DataSourceJsonData
+      const dsPlugin = new grafanaData.DataSourcePlugin<
+        grafanaData.DataSourceApi<grafanaData.DataQuery, grafanaData.DataSourceJsonData>,
+        grafanaData.DataQuery,
+        grafanaData.DataSourceJsonData
       >(pluginExports.Datasource);
       dsPlugin.setComponentsFromLegacyExports(pluginExports);
       dsPlugin.meta = meta;
@@ -214,9 +203,9 @@ export function importDataSourcePlugin(meta: DataSourcePluginMeta): Promise<Gene
   });
 }
 
-export function importAppPlugin(meta: PluginMeta): Promise<AppPlugin> {
+export function importAppPlugin(meta: grafanaData.PluginMeta): Promise<grafanaData.AppPlugin> {
   return importPluginModule(meta.module).then((pluginExports) => {
-    const plugin = pluginExports.plugin ? (pluginExports.plugin as AppPlugin) : new AppPlugin();
+    const plugin = pluginExports.plugin ? (pluginExports.plugin as grafanaData.AppPlugin) : new grafanaData.AppPlugin();
     plugin.init(meta);
     plugin.meta = meta;
     plugin.setComponentsFromLegacyExports(pluginExports);
@@ -228,11 +217,11 @@ import { getPanelPluginNotFound, getPanelPluginLoadError } from '../dashboard/da
 import { GenericDataSourcePlugin } from '../datasources/settings/PluginSettings';
 
 interface PanelCache {
-  [key: string]: Promise<PanelPlugin>;
+  [key: string]: Promise<grafanaData.PanelPlugin>;
 }
 const panelCache: PanelCache = {};
 
-export function importPanelPlugin(id: string): Promise<PanelPlugin> {
+export function importPanelPlugin(id: string): Promise<grafanaData.PanelPlugin> {
   const loaded = panelCache[id];
 
   if (loaded) {
@@ -248,9 +237,9 @@ export function importPanelPlugin(id: string): Promise<PanelPlugin> {
   panelCache[id] = importPluginModule(meta.module)
     .then((pluginExports) => {
       if (pluginExports.plugin) {
-        return pluginExports.plugin as PanelPlugin;
+        return pluginExports.plugin as grafanaData.PanelPlugin;
       } else if (pluginExports.PanelCtrl) {
-        const plugin = new PanelPlugin(null);
+        const plugin = new grafanaData.PanelPlugin(null);
         plugin.angularPanelCtrl = pluginExports.PanelCtrl;
         return plugin;
       }

public/app/features/plugins/plugin_page_ctrl.ts

@@ -2,10 +2,9 @@ import angular from 'angular';
 import _ from 'lodash';
 
 import { getPluginSettings } from './PluginSettingsCache';
-import { PluginMeta } from '@grafana/data';
+import { PluginMeta, AppEvents } from '@grafana/data';
 import { NavModelSrv } from 'app/core/core';
 import { GrafanaRootScope } from 'app/routes/GrafanaCtrl';
-import { AppEvents } from '@grafana/data';
 import { promiseToDigest } from '../../core/utils/promiseToDigest';
 
 export class AppPageCtrl {

public/app/features/plugins/specs/datasource_srv.test.ts

@@ -1,4 +1,3 @@
-import 'app/features/plugins/datasource_srv';
 import { DatasourceSrv } from 'app/features/plugins/datasource_srv';
 import { DataSourceInstanceSettings, DataSourcePlugin } from '@grafana/data';
 

public/app/features/query/components/QueryEditorRowTitle.tsx

@@ -1,9 +1,8 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { css, cx } from 'emotion';
 import { DataQuery, GrafanaTheme } from '@grafana/data';
 import { Icon, Input, stylesFactory, useTheme, FieldValidationMessage } from '@grafana/ui';
 import { selectors } from '@grafana/e2e-selectors';
-import { useState } from 'react';
 
 export interface Props {
   query: DataQuery;

public/app/features/query/state/PanelQueryRunner.test.ts

@@ -9,14 +9,6 @@ jest.mock('@grafana/data', () => ({
 import { PanelQueryRunner } from './PanelQueryRunner';
 // Importing this way to be able to spy on grafana/data
 import * as grafanaData from '@grafana/data';
-import {
-  DataConfigSource,
-  DataQueryRequest,
-  DataTransformerConfig,
-  GrafanaTheme,
-  PanelData,
-  ScopedVars,
-} from '@grafana/data';
 import { DashboardModel } from '../../dashboard/state/index';
 import { setDataSourceSrv, setEchoSrv } from '@grafana/runtime';
 import { Echo } from '../../../core/services/echo/Echo';
@@ -48,21 +40,25 @@ interface ScenarioContext {
   maxDataPoints?: number | null;
   dsInterval?: string;
   minInterval?: string;
-  scopedVars: ScopedVars;
+  scopedVars: grafanaData.ScopedVars;
 
   // Filled in by the Scenario runner
-  events?: PanelData[];
-  res?: PanelData;
-  queryCalledWith?: DataQueryRequest;
+  events?: grafanaData.PanelData[];
+  res?: grafanaData.PanelData;
+  queryCalledWith?: grafanaData.DataQueryRequest;
   runner: PanelQueryRunner;
 }
 
 type ScenarioFn = (ctx: ScenarioContext) => void;
 
-function describeQueryRunnerScenario(description: string, scenarioFn: ScenarioFn, panelConfig?: DataConfigSource) {
+function describeQueryRunnerScenario(
+  description: string,
+  scenarioFn: ScenarioFn,
+  panelConfig?: grafanaData.DataConfigSource
+) {
   describe(description, () => {
     let setupFn = () => {};
-    const defaultPanelConfig: DataConfigSource = {
+    const defaultPanelConfig: grafanaData.DataConfigSource = {
       getFieldOverrideOptions: () => undefined,
       getTransformations: () => undefined,
     };
@@ -98,7 +94,7 @@ function describeQueryRunnerScenario(description: string, scenarioFn: ScenarioFn
       const datasource: any = {
         name: 'TestDB',
         interval: ctx.dsInterval,
-        query: (options: DataQueryRequest) => {
+        query: (options: grafanaData.DataQueryRequest) => {
           ctx.queryCalledWith = options;
           return Promise.resolve(response);
         },
@@ -121,7 +117,7 @@ function describeQueryRunnerScenario(description: string, scenarioFn: ScenarioFn
 
       ctx.runner = new PanelQueryRunner(panelConfig || defaultPanelConfig);
       ctx.runner.getData({ withTransforms: true, withFieldConfig: true }).subscribe({
-        next: (data: PanelData) => {
+        next: (data: grafanaData.PanelData) => {
           ctx.res = data;
           ctx.events?.push(data);
         },
@@ -221,7 +217,7 @@ describe('PanelQueryRunner', () => {
     (ctx) => {
       it('should apply when field override options are set', async () => {
         ctx.runner.getData({ withTransforms: true, withFieldConfig: true }).subscribe({
-          next: (data: PanelData) => {
+          next: (data: grafanaData.PanelData) => {
             return data;
           },
         });
@@ -238,7 +234,7 @@ describe('PanelQueryRunner', () => {
           overrides: [],
         },
         replaceVariables: (v) => v,
-        theme: {} as GrafanaTheme,
+        theme: {} as grafanaData.GrafanaTheme,
       }),
       getTransformations: () => undefined,
     }
@@ -252,7 +248,7 @@ describe('PanelQueryRunner', () => {
         spy.mockClear();
 
         ctx.runner.getData({ withTransforms: true, withFieldConfig: true }).subscribe({
-          next: (data: PanelData) => {
+          next: (data: grafanaData.PanelData) => {
             return data;
           },
         });
@@ -263,7 +259,7 @@ describe('PanelQueryRunner', () => {
     {
       getFieldOverrideOptions: () => undefined,
       // @ts-ignore
-      getTransformations: () => [({} as unknown) as DataTransformerConfig],
+      getTransformations: () => [({} as unknown) as grafanaData.DataTransformerConfig],
     }
   );
 
@@ -274,7 +270,7 @@ describe('PanelQueryRunner', () => {
         const spy = jest.spyOn(grafanaData, 'transformDataFrame');
         spy.mockClear();
         ctx.runner.getData({ withTransforms: false, withFieldConfig: true }).subscribe({
-          next: (data: PanelData) => {
+          next: (data: grafanaData.PanelData) => {
             return data;
           },
         });
@@ -284,7 +280,7 @@ describe('PanelQueryRunner', () => {
 
       it('should not apply field config when applyFieldConfig option is false', async () => {
         ctx.runner.getData({ withFieldConfig: false, withTransforms: true }).subscribe({
-          next: (data: PanelData) => {
+          next: (data: grafanaData.PanelData) => {
             return data;
           },
         });
@@ -302,10 +298,10 @@ describe('PanelQueryRunner', () => {
           overrides: [],
         },
         replaceVariables: (v) => v,
-        theme: {} as GrafanaTheme,
+        theme: {} as grafanaData.GrafanaTheme,
       }),
       // @ts-ignore
-      getTransformations: () => [({} as unknown) as DataTransformerConfig],
+      getTransformations: () => [({} as unknown) as grafanaData.DataTransformerConfig],
     }
   );
 
@@ -316,7 +312,7 @@ describe('PanelQueryRunner', () => {
         const spy = jest.spyOn(grafanaData, 'transformDataFrame');
         spy.mockClear();
         ctx.runner.getData({ withTransforms: false, withFieldConfig: true }).subscribe({
-          next: (data: PanelData) => {
+          next: (data: grafanaData.PanelData) => {
             return data;
           },
         });
@@ -326,7 +322,7 @@ describe('PanelQueryRunner', () => {
 
       it('should not apply field config when applyFieldConfig option is false', async () => {
         ctx.runner.getData({ withFieldConfig: false, withTransforms: true }).subscribe({
-          next: (data: PanelData) => {
+          next: (data: grafanaData.PanelData) => {
             return data;
           },
         });
@@ -344,7 +340,7 @@ describe('PanelQueryRunner', () => {
           overrides: [],
         },
         replaceVariables: (v) => v,
-        theme: {} as GrafanaTheme,
+        theme: {} as grafanaData.GrafanaTheme,
       }),
       // @ts-ignore
       getTransformations: () => [{}],

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

@@ -1,8 +1,7 @@
-import { toDataQueryError } from '@grafana/runtime';
+import { toDataQueryError, getDataSourceSrv } from '@grafana/runtime';
 import { updateOptions } from '../state/actions';
 import { QueryVariableModel } from '../types';
 import { ThunkResult } from '../../../types';
-import { getDataSourceSrv } from '@grafana/runtime';
 import { getVariable } from '../state/selectors';
 import { addVariableEditorError, changeVariableEditorExtended, removeVariableEditorError } from '../editor/reducer';
 import { changeVariableProp } from '../state/sharedReducer';

public/app/plugins/datasource/cloudwatch/components/ConfigEditor.tsx

@@ -3,13 +3,13 @@ import { InlineFormLabel, LegacyForms, Button } from '@grafana/ui';
 const { Select, Input } = LegacyForms;
 import {
   AppEvents,
+  SelectableValue,
   DataSourcePluginOptionsEditorProps,
   onUpdateDatasourceJsonDataOptionSelect,
   onUpdateDatasourceResetOption,
   onUpdateDatasourceJsonDataOption,
   onUpdateDatasourceSecureJsonDataOption,
 } from '@grafana/data';
-import { SelectableValue } from '@grafana/data';
 import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
 import { CloudWatchDatasource } from '../datasource';
 import { CloudWatchJsonData, CloudWatchSecureJsonData } from '../types';

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

@@ -9,7 +9,6 @@ import {
 } from '@grafana/data';
 
 import * as redux from 'app/store/store';
-import '../datasource';
 import { CloudWatchDatasource, MAX_ATTEMPTS } from '../datasource';
 import { TemplateSrv } from 'app/features/templating/template_srv';
 import { CloudWatchLogsQuery, CloudWatchLogsQueryStatus, CloudWatchMetricsQuery, LogAction } from '../types';

public/app/plugins/datasource/dashboard/DashboardQueryEditor.tsx

@@ -3,11 +3,10 @@ import { LegacyForms, VerticalGroup } from '@grafana/ui';
 import { DataQuery, PanelData, SelectableValue } from '@grafana/data';
 import { css } from 'emotion';
 
-import { DashboardQuery, ResultInfo } from './types';
+import { DashboardQuery, ResultInfo, SHARED_DASHBODARD_QUERY } from './types';
 import config from 'app/core/config';
 import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
 import { PanelModel } from 'app/features/dashboard/state';
-import { SHARED_DASHBODARD_QUERY } from './types';
 import { getDashboardSrv } from 'app/features/dashboard/services/DashboardSrv';
 import { filterPanelDataToQuery } from 'app/features/query/components/QueryEditorRow';
 import { DashboardQueryRow } from './DashboardQueryRow';

public/app/plugins/datasource/grafana-azure-monitor-datasource/app_insights/app_insights_datasource.ts

@@ -1,5 +1,4 @@
-import { ScopedVars, MetricFindValue } from '@grafana/data';
-import { DataQueryRequest, DataSourceInstanceSettings } from '@grafana/data';
+import { DataQueryRequest, DataSourceInstanceSettings, ScopedVars, MetricFindValue } from '@grafana/data';
 import { getBackendSrv, getTemplateSrv, DataSourceWithBackend } from '@grafana/runtime';
 import _, { isString } from 'lodash';
 

public/app/plugins/datasource/grafana-azure-monitor-datasource/insights_analytics/insights_analytics_datasource.ts

@@ -1,5 +1,4 @@
-import { ScopedVars } from '@grafana/data';
-import { DataSourceInstanceSettings } from '@grafana/data';
+import { ScopedVars, DataSourceInstanceSettings } from '@grafana/data';
 import { getTemplateSrv } from '@grafana/runtime';
 
 import { AzureDataSourceJsonData, AzureMonitorQuery, AzureQueryType } from '../types';

public/app/plugins/datasource/influxdb/specs/query_ctrl.test.ts

@@ -1,4 +1,3 @@
-import '../query_ctrl';
 import { uiSegmentSrv } from 'app/core/services/segment_srv';
 import { InfluxQueryCtrl } from '../query_ctrl';
 import InfluxDatasource from '../datasource';

public/app/plugins/datasource/loki/components/LokiQueryFieldForm.tsx

@@ -10,6 +10,7 @@ import {
   QueryField,
   TypeaheadInput,
   BracesPlugin,
+  DOMUtil,
 } from '@grafana/ui';
 
 // Utils & Services
@@ -17,7 +18,6 @@ import {
 import { Plugin, Node } from 'slate';
 
 // Types
-import { DOMUtil } from '@grafana/ui';
 import { ExploreQueryFieldProps, AbsoluteTimeRange } from '@grafana/data';
 import { LokiQuery, LokiOptions } from '../types';
 import { LanguageMap, languages as prismLanguages } from 'prismjs';

public/app/plugins/datasource/loki/result_transformer.test.ts

@@ -8,7 +8,6 @@ import {
   LokiMatrixResult,
 } from './types';
 import * as ResultTransformer from './result_transformer';
-import { enhanceDataFrame, lokiPointsToTimeseriesPoints } from './result_transformer';
 import { setTemplateSrv } from '@grafana/runtime';
 import { TemplateSrv } from 'app/features/templating/template_srv';
 
@@ -243,7 +242,7 @@ describe('loki result transformer', () => {
 describe('enhanceDataFrame', () => {
   it('adds links to fields', () => {
     const df = new MutableDataFrame({ fields: [{ name: 'line', values: ['nothing', 'trace1=1234', 'trace2=foo'] }] });
-    enhanceDataFrame(df, {
+    ResultTransformer.enhanceDataFrame(df, {
       derivedFields: [
         {
           matcherRegex: 'trace1=(\\w+)',
@@ -302,7 +301,7 @@ describe('enhanceDataFrame', () => {
 
     it('returns data as is if step, start, and end align', () => {
       const options: Partial<TransformerOptions> = { start: 1 * 1e9, end: 4 * 1e9, step: 1 };
-      const result = lokiPointsToTimeseriesPoints(data, options as TransformerOptions);
+      const result = ResultTransformer.lokiPointsToTimeseriesPoints(data, options as TransformerOptions);
       expect(result).toEqual([
         [1, 1000],
         [0, 2000],

public/app/plugins/datasource/prometheus/components/PromQueryField.tsx

@@ -10,6 +10,8 @@ import {
   TypeaheadOutput,
   QueryField,
   BracesPlugin,
+  DOMUtil,
+  SuggestionsState,
 } from '@grafana/ui';
 
 import { LanguageMap, languages as prismLanguages } from 'prismjs';
@@ -26,7 +28,6 @@ import {
   HistoryItem,
   TimeRange,
 } from '@grafana/data';
-import { DOMUtil, SuggestionsState } from '@grafana/ui';
 import { PrometheusDatasource } from '../datasource';
 
 const HISTOGRAM_GROUP = '__histograms__';

public/app/plugins/datasource/zipkin/utils/transforms.ts

@@ -1,5 +1,4 @@
-import { identity } from 'lodash';
-import { keyBy } from 'lodash';
+import { identity, keyBy } from 'lodash';
 import { ZipkinAnnotation, ZipkinEndpoint, ZipkinSpan } from '../types';
 import { TraceKeyValuePair, TraceLog, TraceProcess, TraceSpanData, TraceData } from '@grafana/data';
 

public/app/plugins/panel/graph/specs/graph.test.ts

@@ -1,4 +1,3 @@
-import '../module';
 import { GraphCtrl } from '../module';
 import { MetricsPanelCtrl } from 'app/features/panel/metrics_panel_ctrl';
 import { PanelCtrl } from 'app/features/panel/panel_ctrl';

public/app/plugins/panel/graph/specs/series_override_ctrl.test.ts

@@ -1,4 +1,3 @@
-import '../series_overrides_ctrl';
 import { SeriesOverridesCtrl } from '../series_overrides_ctrl';
 
 describe('SeriesOverridesCtrl', () => {

public/app/plugins/panel/live/LivePanel.tsx

@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react';
 import { Unsubscribable, PartialObserver } from 'rxjs';
-import { FeatureInfoBox, stylesFactory, Button, JSONFormatter, CustomScrollbar } from '@grafana/ui';
+import { FeatureInfoBox, stylesFactory, Button, JSONFormatter, CustomScrollbar, CodeEditor } from '@grafana/ui';
 import {
   GrafanaTheme,
   PanelProps,
@@ -19,7 +19,6 @@ import { TablePanel } from '../table/TablePanel';
 import { LivePanelOptions, MessageDisplayMode } from './types';
 import { config, getGrafanaLiveSrv, MeasurementCollector } from '@grafana/runtime';
 import { css, cx } from 'emotion';
-import { CodeEditor } from '@grafana/ui';
 
 interface Props extends PanelProps<LivePanelOptions> {}
 

public/app/plugins/panel/piechart/PieChartOptionsBox.tsx

@@ -1,15 +1,9 @@
-// Libraries
 import React, { PureComponent } from 'react';
-
-// Components
-import { LegacyForms, InlineFormLabel } from '@grafana/ui';
-const { Select, FormField } = LegacyForms;
-
-// Types
+import { LegacyForms, InlineFormLabel, PieChartType } from '@grafana/ui';
 import { PanelEditorProps } from '@grafana/data';
-import { PieChartType } from '@grafana/ui';
 import { PieChartOptions } from './types';
 
+const { Select, FormField } = LegacyForms;
 const labelWidth = 8;
 
 const pieChartOptions = [

public/app/plugins/panel/piechart/PieChartPanel.tsx

@@ -1,16 +1,8 @@
-// Libraries
 import React, { PureComponent } from 'react';
-
-// Services & Utils
 import { config } from 'app/core/config';
-
-// Components
 import { PieChart } from '@grafana/ui';
-import { getFieldDisplayValues } from '@grafana/data';
-
-// Types
 import { PieChartOptions } from './types';
-import { PanelProps } from '@grafana/data';
+import { getFieldDisplayValues, PanelProps } from '@grafana/data';
 
 interface Props extends PanelProps<PieChartOptions> {}
 

public/app/plugins/panel/singlestat/module.ts

@@ -3,7 +3,6 @@ import { auto } from 'angular';
 import $ from 'jquery';
 import 'vendor/flot/jquery.flot';
 import 'vendor/flot/jquery.flot.gauge';
-import 'app/features/panel/panellinks/link_srv';
 
 import {
   DataFrame,

public/app/plugins/panel/singlestat/specs/singlestat.test.ts

@@ -1,7 +1,6 @@
 import { SingleStatCtrl, ShowData } from '../module';
-import { dateTime, ReducerID, getFieldDisplayName } from '@grafana/data';
+import { dateTime, ReducerID, getFieldDisplayName, LegacyResponseData } from '@grafana/data';
 import { LinkSrv } from 'app/features/panel/panellinks/link_srv';
-import { LegacyResponseData } from '@grafana/data';
 import { DashboardModel } from 'app/features/dashboard/state';
 
 interface TestContext {

public/app/plugins/panel/stat/types.ts

@@ -12,8 +12,8 @@ import {
   getFieldDisplayName,
   escapeStringForRegex,
   VizOrientation,
+  PanelOptionsEditorBuilder,
 } from '@grafana/data';
-import { PanelOptionsEditorBuilder } from '@grafana/data';
 
 // Structure copied from angular
 export interface StatPanelOptions extends SingleStatBaseOptions {

public/app/plugins/panel/timeseries/plugins/ContextMenuPlugin.tsx

@@ -16,8 +16,8 @@ import {
   getDisplayProcessor,
   getFieldDisplayName,
   InterpolateFunction,
+  TimeZone,
 } from '@grafana/data';
-import { TimeZone } from '@grafana/data';
 import { useClickAway } from 'react-use';
 import { getFieldLinksSupplier } from '../../../../features/panel/panellinks/linkSuppliers';
 

public/app/routes/GrafanaCtrl.ts

@@ -6,7 +6,14 @@ import Drop from 'tether-drop';
 
 // Utils and servies
 import { colors } from '@grafana/ui';
-import { getTemplateSrv, setBackendSrv, setDataSourceSrv, setLegacyAngularInjector } from '@grafana/runtime';
+import {
+  getTemplateSrv,
+  setBackendSrv,
+  setDataSourceSrv,
+  setLegacyAngularInjector,
+  LocationUpdate,
+  setLocationSrv,
+} from '@grafana/runtime';
 import config from 'app/core/config';
 import coreModule from 'app/core/core_module';
 import { profiler } from 'app/core/profiler';
@@ -17,7 +24,6 @@ import { KeybindingSrv, setKeybindingSrv } from 'app/core/services/keybindingSrv
 import { AngularLoader, setAngularLoader } from 'app/core/services/AngularLoader';
 import { configureStore } from 'app/store/configureStore';
 
-import { LocationUpdate, setLocationSrv } from '@grafana/runtime';
 import { updateLocation } from 'app/core/actions';
 
 // Types
@@ -28,10 +34,9 @@ import { ContextSrv } from 'app/core/services/context_srv';
 import { BridgeSrv } from 'app/core/services/bridge_srv';
 import { PlaylistSrv } from 'app/features/playlist/playlist_srv';
 import { DashboardSrv, setDashboardSrv } from 'app/features/dashboard/services/DashboardSrv';
-import { ILocationService, ITimeoutService, IRootScopeService, IAngularEvent } from 'angular';
+import { ILocationService, ITimeoutService, IRootScopeService, IAngularEvent, auto } from 'angular';
 import { AppEvent, AppEvents, locationUtil } from '@grafana/data';
 import { backendSrv } from 'app/core/services/backend_srv';
-import { auto } from 'angular';
 import { initGrafanaLive } from 'app/features/live/live';
 
 export type GrafanaRootScope = IRootScopeService & AppEventEmitter & AppEventConsumer & { colors: string[] };

public/app/types/plugins.ts

@@ -1,5 +1,4 @@
-import { PluginError, PluginMeta } from '@grafana/data';
-import { PanelPlugin } from '@grafana/data';
+import { PluginError, PluginMeta, PanelPlugin } from '@grafana/data';
 import { TemplateSrv } from '@grafana/runtime';
 
 export interface PluginDashboard {

public/test/helpers/getQueryOptions.ts

@@ -1,5 +1,4 @@
-import { DataQueryRequest, DataQuery, CoreApp } from '@grafana/data';
-import { dateTime } from '@grafana/data';
+import { DataQueryRequest, DataQuery, CoreApp, dateTime } from '@grafana/data';
 
 export function getQueryOptions<TQuery extends DataQuery>(
   options: Partial<DataQueryRequest<TQuery>>

public/test/jest-setup.ts

@@ -1,6 +1,5 @@
 import { configure } from 'enzyme';
 import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
-import 'jquery';
 import $ from 'jquery';
 import 'mutationobserver-shim';
 
@@ -9,7 +8,6 @@ global.$ = global.jQuery = $;
 
 import '../vendor/flot/jquery.flot';
 import '../vendor/flot/jquery.flot.time';
-import 'angular';
 import angular from 'angular';
 
 angular.module('grafana', ['ngRoute']);

public/test/specs/helpers.ts

@@ -2,11 +2,9 @@ import each from 'lodash/each';
 import template from 'lodash/template';
 
 import config from 'app/core/config';
-import { dateMath } from '@grafana/data';
 import { angularMocks, sinon } from '../lib/common';
 import { PanelModel } from 'app/features/dashboard/state/PanelModel';
-import { RawTimeRange } from '@grafana/data';
-import { PanelPluginMeta } from '@grafana/data';
+import { RawTimeRange, PanelPluginMeta, dateMath } from '@grafana/data';
 import { GrafanaRootScope } from 'app/routes/GrafanaCtrl';
 
 export function ControllerTestContext(this: any) {