Revert "Update dependency prettier to v3 (#71586)" (#71755)

This reverts commit 2e8cd1c021.

.yarn/sdks/prettier/package.json

@@ -1,6 +1,6 @@
 {
   "name": "prettier",
-  "version": "3.0.0-sdk",
+  "version": "2.8.4-sdk",
   "main": "./index.js",
   "type": "commonjs"
 }

e2e/cloud-plugins-suite/azure-monitor.spec.ts

@@ -92,62 +92,26 @@ const addAzureMonitorVariable = (
     .type(`${type.replace('Azure', '').trim()}{enter}`);
   switch (type) {
     case AzureQueryType.ResourceGroupsQuery:
-      e2eSelectors.variableEditor.subscription
+      e2eSelectors.variableEditor.subscription.input().find('input').type(`${options?.subscription}{enter}`);
-        .input()
-        .find('input')
-        .type(`${options?.subscription}{enter}`);
       break;
     case AzureQueryType.LocationsQuery:
-      e2eSelectors.variableEditor.subscription
+      e2eSelectors.variableEditor.subscription.input().find('input').type(`${options?.subscription}{enter}`);
-        .input()
-        .find('input')
-        .type(`${options?.subscription}{enter}`);
       break;
     case AzureQueryType.NamespacesQuery:
-      e2eSelectors.variableEditor.subscription
+      e2eSelectors.variableEditor.subscription.input().find('input').type(`${options?.subscription}{enter}`);
-        .input()
+      e2eSelectors.variableEditor.resourceGroup.input().find('input').type(`${options?.resourceGroup}{enter}`);
-        .find('input')
-        .type(`${options?.subscription}{enter}`);
-      e2eSelectors.variableEditor.resourceGroup
-        .input()
-        .find('input')
-        .type(`${options?.resourceGroup}{enter}`);
       break;
     case AzureQueryType.ResourceNamesQuery:
-      e2eSelectors.variableEditor.subscription
+      e2eSelectors.variableEditor.subscription.input().find('input').type(`${options?.subscription}{enter}`);
-        .input()
+      e2eSelectors.variableEditor.resourceGroup.input().find('input').type(`${options?.resourceGroup}{enter}`);
-        .find('input')
+      e2eSelectors.variableEditor.namespace.input().find('input').type(`${options?.namespace}{enter}`);
-        .type(`${options?.subscription}{enter}`);
+      e2eSelectors.variableEditor.region.input().find('input').type(`${options?.region}{enter}`);
-      e2eSelectors.variableEditor.resourceGroup
-        .input()
-        .find('input')
-        .type(`${options?.resourceGroup}{enter}`);
-      e2eSelectors.variableEditor.namespace
-        .input()
-        .find('input')
-        .type(`${options?.namespace}{enter}`);
-      e2eSelectors.variableEditor.region
-        .input()
-        .find('input')
-        .type(`${options?.region}{enter}`);
       break;
     case AzureQueryType.MetricNamesQuery:
-      e2eSelectors.variableEditor.subscription
+      e2eSelectors.variableEditor.subscription.input().find('input').type(`${options?.subscription}{enter}`);
-        .input()
+      e2eSelectors.variableEditor.resourceGroup.input().find('input').type(`${options?.resourceGroup}{enter}`);
-        .find('input')
+      e2eSelectors.variableEditor.namespace.input().find('input').type(`${options?.namespace}{enter}`);
-        .type(`${options?.subscription}{enter}`);
+      e2eSelectors.variableEditor.resource.input().find('input').type(`${options?.resource}{enter}`);
-      e2eSelectors.variableEditor.resourceGroup
-        .input()
-        .find('input')
-        .type(`${options?.resourceGroup}{enter}`);
-      e2eSelectors.variableEditor.namespace
-        .input()
-        .find('input')
-        .type(`${options?.namespace}{enter}`);
-      e2eSelectors.variableEditor.resource
-        .input()
-        .find('input')
-        .type(`${options?.resource}{enter}`);
       break;
   }
   e2e.pages.Dashboard.Settings.Variables.Edit.General.submitButton().click();

package.json

@@ -31,8 +31,8 @@
     "packages:pack": "mkdir -p ./npm-artifacts && lerna exec --no-private -- yarn pack --out \"../../npm-artifacts/%s-%v.tgz\"",
     "packages:typecheck": "lerna run typecheck",
     "precommit": "yarn run lint-staged",
-    "prettier:check": "prettier --check --list-different=false --log-level=warn \"**/*.{ts,tsx,scss,md,mdx}\"",
+    "prettier:check": "prettier --check --list-different=false --loglevel=warn \"**/*.{ts,tsx,scss,md,mdx}\"",
-    "prettier:checkDocs": "prettier --check --list-different=false --log-level=warn \"docs/**/*.md\" \"*.md\" \"packages/**/*.{ts,tsx,scss,md,mdx}\"",
+    "prettier:checkDocs": "prettier --check --list-different=false --loglevel=warn \"docs/**/*.md\" \"*.md\" \"packages/**/*.{ts,tsx,scss,md,mdx}\"",
     "prettier:write": "prettier --list-different \"**/*.{js,ts,tsx,scss,md,mdx}\" --write",
     "start": "yarn themes:generate && yarn dev --watch",
     "start:noTsCheck": "yarn start --env noTsCheck=1",
@@ -223,7 +223,7 @@
     "postcss-loader": "7.3.3",
     "postcss-reporter": "7.0.5",
     "postcss-scss": "4.0.6",
-    "prettier": "3.0.0",
+    "prettier": "2.8.4",
     "react-refresh": "0.14.0",
     "react-select-event": "5.5.1",
     "react-simple-compat": "1.2.3",

packages/grafana-data/src/events/EventBus.ts

@@ -113,11 +113,7 @@ class ScopedEventBus implements EventBus {
   filterConfig: EventFilterOptions;
 
   // The path is not yet exposed, but can be used to indicate nested groups and support faster filtering
-  constructor(
+  constructor(public path: string[], private eventBus: EventBus, filter?: EventFilterOptions) {
-    public path: string[],
-    private eventBus: EventBus,
-    filter?: EventFilterOptions
-  ) {
     this.filterConfig = filter ?? { onlyLocal: false };
   }
 

packages/grafana-data/src/panel/PanelPlugin.ts

@@ -94,7 +94,7 @@ export type PanelOptionsSupplier<TOptions> = (
 
 export class PanelPlugin<
   TOptions = any,
-  TFieldConfigOptions extends object = any,
+  TFieldConfigOptions extends object = any
 > extends GrafanaPlugin<PanelPluginMeta> {
   private _defaults?: TOptions;
   private _fieldConfigDefaults: FieldConfigSource<TFieldConfigOptions> = {

packages/grafana-data/src/types/OptionsUIRegistryBuilder.ts

@@ -33,7 +33,7 @@ export interface OptionsEditorItem<TOptions, TSettings, TEditorProps, TValue>
 export interface OptionsUIRegistryBuilderAPI<
   TOptions,
   TEditorProps,
-  T extends OptionsEditorItem<TOptions, any, TEditorProps, any>,
+  T extends OptionsEditorItem<TOptions, any, TEditorProps, any>
 > {
   addNumberInput?<TSettings extends NumberFieldConfigSettings = NumberFieldConfigSettings>(
     config: OptionEditorConfig<TOptions, TSettings, number>
@@ -80,7 +80,7 @@ export interface OptionsUIRegistryBuilderAPI<
 export abstract class OptionsUIRegistryBuilder<
   TOptions,
   TEditorProps,
-  T extends OptionsEditorItem<TOptions, any, TEditorProps, any>,
+  T extends OptionsEditorItem<TOptions, any, TEditorProps, any>
 > implements OptionsUIRegistryBuilderAPI<TOptions, TEditorProps, T>
 {
   private properties: T[] = [];

packages/grafana-data/src/types/datasource.ts

@@ -18,7 +18,7 @@ import { DataSourceRef, WithAccessControlMetadata } from '.';
 
 export interface DataSourcePluginOptionsEditorProps<
   JSONData extends DataSourceJsonData = DataSourceJsonData,
-  SecureJSONData = {},
+  SecureJSONData = {}
 > {
   options: DataSourceSettings<JSONData, SecureJSONData>;
   onOptionsChange: (options: DataSourceSettings<JSONData, SecureJSONData>) => void;
@@ -34,7 +34,7 @@ export class DataSourcePlugin<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataSourceQueryType<DSType>,
   TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>,
-  TSecureOptions = {},
+  TSecureOptions = {}
 > extends GrafanaPlugin<DataSourcePluginMeta<TOptions>> {
   components: DataSourcePluginComponents<DSType, TQuery, TOptions, TSecureOptions> = {};
 
@@ -155,7 +155,7 @@ export interface DataSourcePluginComponents<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataQuery,
   TOptions extends DataSourceJsonData = DataSourceJsonData,
-  TSecureOptions = {},
+  TSecureOptions = {}
 > {
   QueryCtrl?: any;
   AnnotationsQueryCtrl?: any;
@@ -176,7 +176,7 @@ export interface DataSourcePluginComponents<
 export interface DataSourceConstructor<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > {
   new (instanceSettings: DataSourceInstanceSettings<TOptions>, ...args: any[]): DSType;
 }
@@ -197,7 +197,7 @@ type VariableSupport<TQuery extends DataQuery, TOptions extends DataSourceJsonDa
 abstract class DataSourceApi<
   TQuery extends DataQuery = DataQuery,
   TOptions extends DataSourceJsonData = DataSourceJsonData,
-  TQueryImportConfiguration extends Record<string, object> = {},
+  TQueryImportConfiguration extends Record<string, object> = {}
 > {
   /**
    *  Set in constructor
@@ -375,7 +375,7 @@ abstract class DataSourceApi<
 export interface MetadataInspectorProps<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > {
   datasource: DSType;
 
@@ -387,7 +387,7 @@ export interface QueryEditorProps<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataQuery,
   TOptions extends DataSourceJsonData = DataSourceJsonData,
-  TVQuery extends DataQuery = TQuery,
+  TVQuery extends DataQuery = TQuery
 > {
   datasource: DSType;
   query: TVQuery;
@@ -419,7 +419,7 @@ export enum ExploreMode {
 export type ExploreQueryFieldProps<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > = QueryEditorProps<DSType, TQuery, TOptions>;
 
 export interface QueryEditorHelpProps<TQuery extends DataQuery = DataQuery> {

packages/grafana-data/src/types/variables.ts

@@ -32,7 +32,7 @@ export enum VariableSupportType {
 export abstract class VariableSupportBase<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataSourceQueryType<DSType>,
-  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>,
+  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>
 > {
   abstract getType(): VariableSupportType;
 
@@ -50,7 +50,7 @@ export abstract class VariableSupportBase<
 export abstract class StandardVariableSupport<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataSourceQueryType<DSType>,
-  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>,
+  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>
 > extends VariableSupportBase<DSType, TQuery, TOptions> {
   getType(): VariableSupportType {
     return VariableSupportType.Standard;
@@ -69,7 +69,7 @@ export abstract class CustomVariableSupport<
   DSType extends DataSourceApi<TQuery, TOptions>,
   VariableQuery extends DataQuery = any,
   TQuery extends DataQuery = DataSourceQueryType<DSType>,
-  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>,
+  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>
 > extends VariableSupportBase<DSType, TQuery, TOptions> {
   getType(): VariableSupportType {
     return VariableSupportType.Custom;
@@ -87,7 +87,7 @@ export abstract class CustomVariableSupport<
 export abstract class DataSourceVariableSupport<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataSourceQueryType<DSType>,
-  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>,
+  TOptions extends DataSourceJsonData = DataSourceOptionsType<DSType>
 > extends VariableSupportBase<DSType, TQuery, TOptions> {
   getType(): VariableSupportType {
     return VariableSupportType.Datasource;

packages/grafana-data/src/vector/SortedVector.ts

@@ -9,10 +9,7 @@ import { vectorToArray } from './vectorToArray';
  * @deprecated use a simple Arrays
  */
 export class SortedVector<T = any> extends FunctionalVector<T> {
-  constructor(
+  constructor(private source: Vector<T>, private order: number[]) {
-    private source: Vector<T>,
-    private order: number[]
-  ) {
     super();
     return makeArrayIndexableVector(this);
   }

packages/grafana-runtime/src/utils/DataSourceWithBackend.ts

@@ -113,7 +113,7 @@ export interface HealthCheckResult {
  */
 class DataSourceWithBackend<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > extends DataSourceApi<TQuery, TOptions> {
   constructor(instanceSettings: DataSourceInstanceSettings<TOptions>) {
     super(instanceSettings);

packages/grafana-toolkit/src/cli/tasks/task.ts

@@ -3,10 +3,7 @@ export type TaskRunner<T> = (options: T) => Promise<any>;
 export class Task<TOptions> {
   options: TOptions = {} as any;
 
-  constructor(
+  constructor(public name: string, public runner: TaskRunner<TOptions>) {}
-    public name: string,
-    public runner: TaskRunner<TOptions>
-  ) {}
   setName = (name: string) => {
     this.name = name;
   };

packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx

@@ -164,9 +164,7 @@ const getStyles = stylesFactory((theme: GrafanaTheme2) => {
     `,
     buttonHide: css`
       opacity: 0;
-      transition:
+      transition: opacity 0.1s ease, visibility 0 0.1s;
-        opacity 0.1s ease,
-        visibility 0 0.1s;
       visibility: hidden;
       z-index: 0;
     `,
@@ -180,19 +178,14 @@ const getStyles = stylesFactory((theme: GrafanaTheme2) => {
     confirmButtonShow: css`
       z-index: 1;
       opacity: 1;
-      transition:
+      transition: opacity 0.08s ease-out, transform 0.1s ease-out;
-        opacity 0.08s ease-out,
-        transform 0.1s ease-out;
       transform: translateX(0);
       pointer-events: all;
     `,
     confirmButtonHide: css`
       opacity: 0;
       visibility: hidden;
-      transition:
+      transition: opacity 0.12s ease-in, transform 0.14s ease-in, visibility 0s 0.12s;
-        opacity 0.12s ease-in,
-        transform 0.14s ease-in,
-        visibility 0s 0.12s;
       transform: translateX(100px);
     `,
     disabled: css`

packages/grafana-ui/src/components/Forms/Legacy/Select/_Select.scss

@@ -11,7 +11,6 @@ $select-input-bg-disabled: $input-bg-disabled;
 @mixin select-control-focus() {
   border-color: $input-border-focus;
   outline: none;
-  // prettier-ignore
   $shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px $input-box-shadow-focus;
   @include box-shadow($shadow);
 }

packages/grafana-ui/src/components/Forms/RadioButtonList/RadioButtonDot.tsx

@@ -75,9 +75,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
 
     :focus {
       outline: none !important;
-      box-shadow:
+      box-shadow: 0 0 0 1px ${theme.colors.background.canvas}, 0 0 0 3px ${theme.colors.primary.main};
-        0 0 0 1px ${theme.colors.background.canvas},
-        0 0 0 3px ${theme.colors.primary.main};
     }
   `,
   label: css`

packages/grafana-ui/src/components/Forms/commonStyles.ts

@@ -33,20 +33,15 @@ export const sharedInputStyle = (theme: GrafanaTheme2, invalid = false) => {
       &:-webkit-autofill,
       &:-webkit-autofill:hover {
         /* Welcome to 2005. This is a HACK to get rid od Chromes default autofill styling */
-        box-shadow:
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px ${background}!important;
-          inset 0 0 0 1px rgba(255, 255, 255, 0),
-          inset 0 0 0 100px ${background}!important;
         -webkit-text-fill-color: ${textColor} !important;
         border-color: ${autoFillBorder};
       }
 
       &:-webkit-autofill:focus {
         /* Welcome to 2005. This is a HACK to get rid od Chromes default autofill styling */
-        box-shadow:
+        box-shadow: 0 0 0 2px ${theme.colors.background.primary}, 0 0 0px 4px ${theme.colors.primary.main},
-          0 0 0 2px ${theme.colors.background.primary},
+          inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px ${background}!important;
-          0 0 0px 4px ${theme.colors.primary.main},
-          inset 0 0 0 1px rgba(255, 255, 255, 0),
-          inset 0 0 0 100px ${background}!important;
         -webkit-text-fill-color: ${textColor} !important;
       }
 

packages/grafana-ui/src/components/Input/Input.tsx

@@ -100,33 +100,35 @@ export const getInputStyles = stylesFactory(({ theme, invalid = false, width }:
 
   return {
     // Wraps inputWrapper and addons
-    wrapper: cx(css`
+    wrapper: cx(
-      label: input-wrapper;
+      css`
-      display: flex;
+        label: input-wrapper;
-      width: ${width ? `${theme.spacing(width)}` : '100%'};
+        display: flex;
-      height: ${theme.spacing(theme.components.height.md)};
+        width: ${width ? `${theme.spacing(width)}` : '100%'};
-      border-radius: ${theme.shape.borderRadius()};
+        height: ${theme.spacing(theme.components.height.md)};
-      &:hover {
+        border-radius: ${theme.shape.borderRadius()};
-        > .prefix,
+        &:hover {
-        .suffix,
+          > .prefix,
-        .input {
+          .suffix,
-          border-color: ${invalid ? theme.colors.error.border : theme.colors.primary.border};
+          .input {
-        }
+            border-color: ${invalid ? theme.colors.error.border : theme.colors.primary.border};
+          }
 
-        // only show number buttons on hover
+          // only show number buttons on hover
-        input[type='number'] {
+          input[type='number'] {
-          -moz-appearance: number-input;
+            -moz-appearance: number-input;
-          -webkit-appearance: number-input;
+            -webkit-appearance: number-input;
-          appearance: textfield;
+            appearance: textfield;
-        }
+          }
 
-        input[type='number']::-webkit-inner-spin-button,
+          input[type='number']::-webkit-inner-spin-button,
-        input[type='number']::-webkit-outer-spin-button {
+          input[type='number']::-webkit-outer-spin-button {
-          -webkit-appearance: inner-spin-button !important;
+            -webkit-appearance: inner-spin-button !important;
-          opacity: 1;
+            opacity: 1;
+          }
         }
-      }
+      `
-    `),
+    ),
     // Wraps input and prefix/suffix
     inputWrapper: css`
       label: input-inputWrapper;

packages/grafana-ui/src/components/Menu/utils.test.ts

@@ -8,7 +8,7 @@ describe('utils', () => {
           getBoundingClientRect: () => ({ right }),
         },
         getBoundingClientRect: () => ({ width }),
-      }) as HTMLElement;
+      } as HTMLElement);
 
     Object.defineProperty(window, 'innerWidth', { value: 1000 });
 

packages/grafana-ui/src/components/PanelContainer/PanelContainer.tsx

@@ -16,8 +16,9 @@ export const PanelContainer = ({ children, className, ...props }: Props) => {
   );
 };
 
-const getStyles = (theme: GrafanaTheme2) => css`
+const getStyles = (theme: GrafanaTheme2) =>
-  background-color: ${theme.components.panel.background};
+  css`
-  border: 1px solid ${theme.components.panel.borderColor};
+    background-color: ${theme.components.panel.background};
-  border-radius: ${theme.shape.radius.default};
+    border: 1px solid ${theme.components.panel.borderColor};
-`;
+    border-radius: ${theme.shape.radius.default};
+  `;

packages/grafana-ui/src/components/Typeahead/TypeaheadItem.tsx

@@ -36,11 +36,8 @@ const getStyles = (theme: GrafanaTheme2) => ({
     display: block;
     white-space: nowrap;
     cursor: pointer;
-    transition:
+    transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
+      background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
-      border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
   `,
 
   typeaheadItemSelected: css`

packages/grafana-ui/src/components/transitions/SlideOutTransition.tsx

@@ -15,9 +15,7 @@ const getStyles = stylesFactory((duration: number, measurement: 'width' | 'heigh
       label: enterActive;
       ${measurement}: ${size}px;
       opacity: 1;
-      transition:
+      transition: opacity ${duration}ms ease-out, ${measurement} ${duration}ms ease-out;
-        opacity ${duration}ms ease-out,
-        ${measurement} ${duration}ms ease-out;
     `,
     exit: css`
       label: exit;
@@ -28,9 +26,7 @@ const getStyles = stylesFactory((duration: number, measurement: 'width' | 'heigh
       label: exitActive;
       opacity: 0;
       ${measurement}: 0;
-      transition:
+      transition: opacity ${duration}ms ease-out, ${measurement} ${duration}ms ease-out;
-        opacity ${duration}ms ease-out,
-        ${measurement} ${duration}ms ease-out;
     `,
   };
 });

packages/grafana-ui/src/utils/storybook/withStoryContainer.tsx

@@ -17,9 +17,7 @@ const StoryContainer = ({ width, height, showBoundaries, children }: React.Props
     css`
       background-color: white;
       background-size: 30px 30px;
-      background-position:
+      background-position: 0 0, 15px 15px;
-        0 0,
-        15px 15px;
       background-image: linear-gradient(
           45deg,
           ${checkColor} 25%,

packages/grafana-ui/src/utils/storybook/withTheme.tsx

@@ -52,4 +52,5 @@ export const renderComponentWithTheme = (component: React.ComponentType<any>, pr
 export const withTheme =
   (handleSassThemeChange: SassThemeChangeHandler): DecoratorFn =>
   // eslint-disable-next-line react/display-name
-  (story) => <ThemeableStory handleSassThemeChange={handleSassThemeChange}>{story()}</ThemeableStory>;
+  (story) =>
+    <ThemeableStory handleSassThemeChange={handleSassThemeChange}>{story()}</ThemeableStory>;

public/app/angular/components/form_dropdown/form_dropdown.ts

@@ -41,12 +41,7 @@ export class FormDropdownCtrl {
 
   static $inject = ['$scope', '$element', '$sce', 'templateSrv'];
 
-  constructor(
+  constructor(private $scope: any, $element: JQLite, private $sce: ISCEService, private templateSrv: any) {
-    private $scope: any,
-    $element: JQLite,
-    private $sce: ISCEService,
-    private templateSrv: any
-  ) {
     this.inputElement = $element.find('input').first();
     this.linkElement = $element.find('a').first();
     this.linkMode = true;

public/app/angular/components/switch.ts

@@ -39,10 +39,7 @@ export class SwitchCtrl {
 
   static $inject = ['$scope', '$timeout'];
 
-  constructor(
+  constructor($scope: any, private $timeout: any) {
-    $scope: any,
-    private $timeout: any
-  ) {
     this.show = true;
     this.id = $scope.$id;
   }

public/app/angular/diff-view.ts

@@ -42,11 +42,7 @@ coreModule.directive('diffDelta', delta);
 export class LinkJSONCtrl {
   static $inject = ['$scope', '$rootScope', '$anchorScroll'];
 
-  constructor(
+  constructor(private $scope: any, private $rootScope: GrafanaRootScope, private $anchorScroll: any) {}
-    private $scope: any,
-    private $rootScope: GrafanaRootScope,
-    private $anchorScroll: any
-  ) {}
 
   goToLine(line: number) {
     let unbind: () => void;

public/app/angular/panel/query_ctrl.ts

@@ -10,10 +10,7 @@ export class QueryCtrl<T = any> {
   error?: string | null;
   isLastQuery: boolean;
 
-  constructor(
+  constructor(public $scope: any, public $injector: auto.IInjectorService) {
-    public $scope: any,
-    public $injector: auto.IInjectorService
-  ) {
     this.panelCtrl = this.panelCtrl ?? $scope.ctrl.panelCtrl;
     this.target = this.target ?? $scope.ctrl.target;
     this.datasource = this.datasource ?? $scope.ctrl.datasource;

public/app/angular/services/AngularLoader.ts

@@ -8,10 +8,7 @@ import coreModule from 'app/angular/core_module';
 export class AngularLoader implements AngularLoaderInterface {
   static $inject = ['$compile', '$rootScope'];
 
-  constructor(
+  constructor(private $compile: any, private $rootScope: GrafanaRootScope) {}
-    private $compile: any,
-    private $rootScope: GrafanaRootScope
-  ) {}
 
   load(elem: any, scopeProps: any, template: string): AngularComponent {
     const scope = this.$rootScope.$new();

public/app/core/components/AppChrome/SectionNav/SectionNavItem.tsx

@@ -56,7 +56,9 @@ export function SectionNavItem({ item, isSectionRoot = false }: Props) {
         {item.text}
         {item.tabSuffix && <item.tabSuffix className={styles.suffix} />}
       </a>
-      {children?.map((child, index) => <SectionNavItem item={child} key={index} />)}
+      {children?.map((child, index) => (
+        <SectionNavItem item={child} key={index} />
+      ))}
     </>
   );
 }

public/app/core/components/CloseButton/CloseButton.tsx

@@ -24,8 +24,9 @@ export const CloseButton = ({ onClick, 'aria-label': ariaLabel, style }: Props)
   );
 };
 
-const getStyles = (theme: GrafanaTheme2) => css`
+const getStyles = (theme: GrafanaTheme2) =>
-  position: absolute;
+  css`
-  right: ${theme.spacing(0.5)};
+    position: absolute;
-  top: ${theme.spacing(1)};
+    right: ${theme.spacing(0.5)};
-`;
+    top: ${theme.spacing(1)};
+  `;

public/app/core/components/RolePicker/RolePickerInput.tsx

@@ -101,7 +101,9 @@ export const RolesLabel = ({ showBuiltInRole, numberOfRoles, appliedRoles }: Rol
         <Tooltip
           content={
             <div className={styles.tooltip}>
-              {appliedRoles?.map((role) => <p key={role.uid}>{role.displayName}</p>)}
+              {appliedRoles?.map((role) => (
+                <p key={role.uid}>{role.displayName}</p>
+              ))}
             </div>
           }
         >

public/app/core/components/help/HelpModal.tsx

@@ -140,12 +140,7 @@ function getStyles(theme: GrafanaTheme2) {
       text-align: center;
       margin-right: ${theme.spacing(0.5)};
       padding: 3px 5px;
-      font:
+      font: 11px Consolas, 'Liberation Mono', Menlo, Courier, monospace;
-        11px Consolas,
-        'Liberation Mono',
-        Menlo,
-        Courier,
-        monospace;
       line-height: 10px;
       vertical-align: middle;
       border: solid 1px ${theme.colors.border.medium};

public/app/core/history/richHistoryLocalStorageUtils.ts

@@ -57,8 +57,8 @@ function filterQueriesBySearchFilter(queries: RichHistoryQuery[], searchFilter:
 
     const listOfMatchingQueries = query.queries.filter((query) =>
       // Remove fields in which we don't want to be searching
-      Object.values(omit(query, ['datasource', 'key', 'refId', 'hide', 'queryType'])).some(
+      Object.values(omit(query, ['datasource', 'key', 'refId', 'hide', 'queryType'])).some((value) =>
-        (value) => value?.toString().includes(searchFilter)
+        value?.toString().includes(searchFilter)
       )
     );
 

public/app/core/services/keybindingSrv.ts

@@ -29,10 +29,7 @@ import { toggleTheme } from './theme';
 import { withFocusedPanel } from './withFocusedPanelId';
 
 export class KeybindingSrv {
-  constructor(
+  constructor(private locationService: LocationService, private chromeService: AppChromeService) {}
-    private locationService: LocationService,
-    private chromeService: AppChromeService
-  ) {}
 
   clearAndInitGlobalBindings(route: RouteDescriptor) {
     Mousetrap.reset();

public/app/features/alerting/unified/components/alert-groups/AlertGroupHeader.tsx

@@ -13,17 +13,14 @@ interface Props {
 export const AlertGroupHeader = ({ group }: Props) => {
   const textStyles = useStyles2(getNotificationsTextColors);
   const total = group.alerts.length;
-  const countByStatus = group.alerts.reduce(
+  const countByStatus = group.alerts.reduce((statusObj, alert) => {
-    (statusObj, alert) => {
+    if (statusObj[alert.status.state]) {
-      if (statusObj[alert.status.state]) {
+      statusObj[alert.status.state] += 1;
-        statusObj[alert.status.state] += 1;
+    } else {
-      } else {
+      statusObj[alert.status.state] = 1;
-        statusObj[alert.status.state] = 1;
+    }
-      }
+    return statusObj;
-      return statusObj;
+  }, {} as Record<AlertState, number>);
-    },
-    {} as Record<AlertState, number>
-  );
 
   return (
     <div>

public/app/features/alerting/unified/components/notification-policies/Modals.tsx

@@ -206,7 +206,7 @@ const useDeletePolicyModal = (handleDelete: (route: RouteWithID) => void, loadin
 const useAlertGroupsModal = (): [
   JSX.Element,
   (alertGroups: AlertmanagerGroup[], matchers?: ObjectMatcher[]) => void,
-  () => void,
+  () => void
 ] => {
   const [showModal, setShowModal] = useState(false);
   const [alertGroups, setAlertGroups] = useState<AlertmanagerGroup[]>([]);

public/app/features/alerting/unified/components/receivers/editor/autocomplete.ts

@@ -63,10 +63,7 @@ function isInsideGoExpression(model: editor.ITextModel, position: Position) {
 }
 
 export class CompletionProvider {
-  constructor(
+  constructor(private readonly monaco: Monaco, private readonly range: IRange) {}
-    private readonly monaco: Monaco,
-    private readonly range: IRange
-  ) {}
 
   getSnippetsSuggestions = (): languages.ProviderResult<languages.CompletionList> => {
     return this.getCompletionsFromDefinitions(getSnippetsSuggestions(this.monaco));

public/app/features/alerting/unified/components/receivers/form/GrafanaReceiverForm.tsx

@@ -59,7 +59,7 @@ export const GrafanaReceiverForm = ({ existing, alertManagerSourceName, config }
   // transform receiver DTO to form values
   const [existingValue, id2original] = useMemo((): [
     ReceiverFormValues<GrafanaChannelValues> | undefined,
-    Record<string, GrafanaManagedReceiverConfig>,
+    Record<string, GrafanaManagedReceiverConfig>
   ] => {
     if (!existing || !grafanaNotifiers.result) {
       return [undefined, {}];

public/app/features/alerting/unified/components/rule-editor/QueryOptions.tsx

@@ -62,11 +62,7 @@ export const QueryOptions = ({
       </Toggletip>
 
       <div className={styles.staticValues}>
-        <span>
+        <span>{dateTime(timeRange?.from).locale('en').fromNow(true)}</span>
-          {dateTime(timeRange?.from)
-            .locale('en')
-            .fromNow(true)}
-        </span>
         {queryOptions.maxDataPoints && <span>, MD {queryOptions.maxDataPoints}</span>}
       </div>
     </>

public/app/features/alerting/unified/components/rules/RuleDetailsDataSources.tsx

@@ -27,19 +27,16 @@ export function RuleDetailsDataSources(props: Props): JSX.Element | null {
 
     if (isGrafanaRulerRule(rule.rulerRule)) {
       const { data } = rule.rulerRule.grafana_alert;
-      const unique = data.reduce(
+      const unique = data.reduce((dataSources, query) => {
-        (dataSources, query) => {
+        const ds = getDataSourceSrv().getInstanceSettings(query.datasourceUid);
-          const ds = getDataSourceSrv().getInstanceSettings(query.datasourceUid);
 
-          if (!ds || ds.uid === ExpressionDatasourceUID) {
+        if (!ds || ds.uid === ExpressionDatasourceUID) {
-            return dataSources;
-          }
-
-          dataSources[ds.name] = { name: ds.name, icon: ds.meta.info.logos.small };
           return dataSources;
-        },
+        }
-        {} as Record<string, { name: string; icon?: string }>
+
-      );
+        dataSources[ds.name] = { name: ds.name, icon: ds.meta.info.logos.small };
+        return dataSources;
+      }, {} as Record<string, { name: string; icon?: string }>);
 
       return Object.values(unique);
     }

public/app/features/alerting/unified/components/rules/state-history/LogRecordViewer.tsx

@@ -181,9 +181,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
     background: transparent;
     outline: 1px solid transparent;
 
-    transition:
+    transition: background 150ms, outline 150ms;
-      background 150ms,
-      outline 150ms;
     padding: ${theme.spacing(1)} ${theme.spacing(1.5)};
   `,
 });

public/app/features/alerting/unified/components/silences/SilencesTable.tsx

@@ -148,15 +148,14 @@ const useFilteredSilences = (silences: Silence[], expired = false) => {
       }
       if (queryString) {
         const matchers = parseMatchers(queryString);
-        const matchersMatch = matchers.every(
+        const matchersMatch = matchers.every((matcher) =>
-          (matcher) =>
+          silence.matchers?.some(
-            silence.matchers?.some(
+            ({ name, value, isEqual, isRegex }) =>
-              ({ name, value, isEqual, isRegex }) =>
+              matcher.name === name &&
-                matcher.name === name &&
+              matcher.value === value &&
-                matcher.value === value &&
+              matcher.isEqual === isEqual &&
-                matcher.isEqual === isEqual &&
+              matcher.isRegex === isRegex
-                matcher.isRegex === isRegex
+          )
-            )
         );
         if (!matchersMatch) {
           return false;

public/app/features/alerting/unified/hooks/useURLSearchParams.ts

@@ -5,7 +5,7 @@ import { locationService } from '@grafana/runtime';
 
 export function useURLSearchParams(): [
   URLSearchParams,
-  (searchValues: Record<string, string | string[] | undefined>, replace?: boolean) => void,
+  (searchValues: Record<string, string | string[] | undefined>, replace?: boolean) => void
 ] {
   const { search } = useLocation();
   const queryParams = useMemo(() => new URLSearchParams(search), [search]);

public/app/features/alerting/unified/state/AlertingQueryRunner.ts

@@ -35,10 +35,7 @@ export class AlertingQueryRunner {
   private subscription?: Unsubscribable;
   private lastResult: Record<string, PanelData>;
 
-  constructor(
+  constructor(private backendSrv = getBackendSrv(), private dataSourceSrv = getDataSourceSrv()) {
-    private backendSrv = getBackendSrv(),
-    private dataSourceSrv = getDataSourceSrv()
-  ) {
     this.subject = new ReplaySubject(1);
     this.lastResult = {};
   }

public/app/features/alerting/unified/utils/rules.ts

@@ -169,20 +169,17 @@ export function getFirstActiveAt(promRule?: AlertingRule) {
   if (!promRule?.alerts) {
     return null;
   }
-  return promRule.alerts.reduce(
+  return promRule.alerts.reduce((prev, alert) => {
-    (prev, alert) => {
+    const isNotNormal =
-      const isNotNormal =
+      mapStateWithReasonToBaseState(alert.state as GrafanaAlertStateWithReason) !== GrafanaAlertState.Normal;
-        mapStateWithReasonToBaseState(alert.state as GrafanaAlertStateWithReason) !== GrafanaAlertState.Normal;
+    if (alert.activeAt && isNotNormal) {
-      if (alert.activeAt && isNotNormal) {
+      const activeAt = new Date(alert.activeAt);
-        const activeAt = new Date(alert.activeAt);
+      if (prev === null || prev.getTime() > activeAt.getTime()) {
-        if (prev === null || prev.getTime() > activeAt.getTime()) {
+        return activeAt;
-          return activeAt;
-        }
       }
-      return prev;
+    }
-    },
+    return prev;
-    null as Date | null
+  }, null as Date | null);
-  );
 }
 
 /**

public/app/features/auth-config/ErrorContainer.tsx

@@ -26,12 +26,16 @@ export const ErrorContainerUnconnected = ({ error, warning, resetError, resetWar
     <div>
       {error && (
         <Alert title={error.message} onRemove={() => resetError()}>
-          {error.errors?.map((e, i) => <div key={i}>{e}</div>)}
+          {error.errors?.map((e, i) => (
+            <div key={i}>{e}</div>
+          ))}
         </Alert>
       )}
       {warning && (
         <Alert title={warning.message} onRemove={() => resetWarning()} severity="warning">
-          {warning.errors?.map((e, i) => <div key={i}>{e}</div>)}
+          {warning.errors?.map((e, i) => (
+            <div key={i}>{e}</div>
+          ))}
         </Alert>
       )}
     </div>

public/app/features/canvas/runtime/element.tsx

@@ -36,11 +36,7 @@ export class ElementState implements LayerElement {
   // Calculated
   data?: any; // depends on the type
 
-  constructor(
+  constructor(public item: CanvasElementItem, public options: CanvasElementOptions, public parent?: FrameState) {
-    public item: CanvasElementItem,
-    public options: CanvasElementOptions,
-    public parent?: FrameState
-  ) {
     const fallbackName = `Element ${Date.now()}`;
     if (!options) {
       this.options = { type: item.id, name: fallbackName };

public/app/features/canvas/runtime/frame.tsx

@@ -36,11 +36,7 @@ export class FrameState extends ElementState {
   elements: ElementState[] = [];
   scene: Scene;
 
-  constructor(
+  constructor(public options: CanvasFrameOptions, scene: Scene, public parent?: FrameState) {
-    public options: CanvasFrameOptions,
-    scene: Scene,
-    public parent?: FrameState
-  ) {
     super(frameItemDummy, options, parent);
 
     this.scene = scene;

public/app/features/canvas/runtime/root.tsx

@@ -6,11 +6,7 @@ import { FrameState } from './frame';
 import { Scene } from './scene';
 
 export class RootElement extends FrameState {
-  constructor(
+  constructor(public options: CanvasFrameOptions, public scene: Scene, private changeCallback: () => void) {
-    public options: CanvasFrameOptions,
-    public scene: Scene,
-    private changeCallback: () => void
-  ) {
     super(options, scene);
 
     this.sizeStyle = {

public/app/features/correlations/Forms/ConfigureCorrelationSourceForm.tsx

@@ -37,9 +37,9 @@ export const ConfigureCorrelationSourceForm = () => {
   return (
     <>
       <FieldSet
-        label={`Configure the data source that will link to ${getDatasourceSrv().getInstanceSettings(
+        label={`Configure the data source that will link to ${
-          correlation?.targetUID
+          getDatasourceSrv().getInstanceSettings(correlation?.targetUID)?.name
-        )?.name} (Step 3 of 3)`}
+        } (Step 3 of 3)`}
       >
         <p>
           Define what data source will display the correlation, and what data will replace previously defined variables.

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

@@ -232,10 +232,10 @@ const getStyles = (theme: GrafanaTheme2) => {
   const pulsate = keyframes`
     0% {box-shadow: 0 0 0 2px ${theme.colors.background.canvas}, 0 0 0px 4px ${theme.colors.primary.main};}
     50% {box-shadow: 0 0 0 2px ${theme.components.dashboard.background}, 0 0 0px 4px ${tinycolor(
-      theme.colors.primary.main
+    theme.colors.primary.main
-    )
+  )
-      .darken(20)
+    .darken(20)
-      .toHexString()};}
+    .toHexString()};}
     100% {box-shadow: 0 0 0 2px ${theme.components.dashboard.background}, 0 0 0px 4px  ${theme.colors.primary.main};}
   `;
 
@@ -249,9 +249,7 @@ const getStyles = (theme: GrafanaTheme2) => {
       overflow: hidden;
       outline: 2px dotted transparent;
       outline-offset: 2px;
-      box-shadow:
+      box-shadow: 0 0 0 2px black, 0 0 0px 4px #1f60c4;
-        0 0 0 2px black,
-        0 0 0px 4px #1f60c4;
       animation: ${pulsate} 2s ease infinite;
     `,
     actionsWrapper: css`

public/app/features/dashboard/components/DashboardSettings/AutoRefreshIntervals.test.tsx

@@ -100,7 +100,7 @@ describe('getValidIntervals', () => {
         getTimeSrv: () =>
           ({
             getValidIntervals: (intervals: string[]) => intervals,
-          }) as unknown as TimeSrv,
+          } as unknown as TimeSrv),
       };
 
       const result = getValidIntervals(emptyIntervals, dependencies);
@@ -116,7 +116,7 @@ describe('getValidIntervals', () => {
         getTimeSrv: () =>
           ({
             getValidIntervals: (intervals: string[]) => intervals,
-          }) as unknown as TimeSrv,
+          } as unknown as TimeSrv),
       };
 
       const result = getValidIntervals(duplicateIntervals, dependencies);
@@ -132,7 +132,7 @@ describe('getValidIntervals', () => {
         getTimeSrv: () =>
           ({
             getValidIntervals: (intervals: string[]) => intervals,
-          }) as unknown as TimeSrv,
+          } as unknown as TimeSrv),
       };
 
       const result = getValidIntervals(duplicateIntervals, dependencies);
@@ -149,7 +149,7 @@ describe('validateIntervals', () => {
         getTimeSrv: () =>
           ({
             getValidIntervals: (intervals: string[]) => intervals,
-          }) as unknown as TimeSrv,
+          } as unknown as TimeSrv),
       };
 
       const result = validateIntervals(defaultIntervals, dependencies);
@@ -166,7 +166,7 @@ describe('validateIntervals', () => {
             getValidIntervals: () => {
               throw new Error('Some error');
             },
-          }) as unknown as TimeSrv,
+          } as unknown as TimeSrv),
       };
 
       const result = validateIntervals(defaultIntervals, dependencies);

public/app/features/dashboard/components/PanelEditor/DynamicConfigValueEditor.tsx

@@ -53,29 +53,30 @@ export const DynamicConfigValueEditor = ({
   /* eslint-disable react/display-name */
   const renderLabel =
     (includeDescription = true, includeCounter = false) =>
-    (isExpanded = false) => (
+    (isExpanded = false) =>
-      <HorizontalGroup justify="space-between">
+      (
-        <Label
+        <HorizontalGroup justify="space-between">
-          category={labelCategory}
+          <Label
-          description={includeDescription ? item.description : undefined}
+            category={labelCategory}
-          htmlFor={componentId}
+            description={includeDescription ? item.description : undefined}
-        >
+            htmlFor={componentId}
-          <Highlighter
+          >
-            textToHighlight={item.name}
+            <Highlighter
-            searchWords={[searchQuery]}
+              textToHighlight={item.name}
-            highlightClassName={'search-fragment-highlight'}
+              searchWords={[searchQuery]}
-          />
+              highlightClassName={'search-fragment-highlight'}
-          {!isExpanded && includeCounter && item.getItemsCount && (
+            />
-            <Counter value={item.getItemsCount(property.value)} />
+            {!isExpanded && includeCounter && item.getItemsCount && (
+              <Counter value={item.getItemsCount(property.value)} />
+            )}
+          </Label>
+          {!isSystemOverride && (
+            <div>
+              <IconButton name="times" onClick={onRemove} tooltip="Remove label" />
+            </div>
           )}
-        </Label>
+        </HorizontalGroup>
-        {!isSystemOverride && (
+      );
-          <div>
-            <IconButton name="times" onClick={onRemove} tooltip="Remove label" />
-          </div>
-        )}
-      </HorizontalGroup>
-    );
   /* eslint-enable react/display-name */
 
   if (isCollapsible) {

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

@@ -499,7 +499,7 @@ describe('PanelModel', () => {
     describe('destroy', () => {
       it('Should still preserve last query result', () => {
         model.getQueryRunner().useLastResultFrom({
-          getLastResult: () => ({}) as PanelData,
+          getLastResult: () => ({} as PanelData),
         } as PanelQueryRunner);
 
         model.destroy();

public/app/features/datasources/state/actions.test.ts

@@ -50,7 +50,7 @@ const getBackendSrvMock = () =>
       }),
     }),
     withNoBackendCache: jest.fn().mockImplementationOnce((cb) => cb()),
-  }) as any;
+  } as any);
 
 const failDataSourceTest = async (error: object) => {
   const dependencies: TestDataSourceDependencies = {
@@ -61,7 +61,7 @@ const failDataSourceTest = async (error: object) => {
             throw error;
           }),
         }),
-      }) as any,
+      } as any),
     getBackendSrv: getBackendSrvMock,
   };
   const state = {
@@ -223,7 +223,7 @@ describe('testDataSource', () => {
               type: 'cloudwatch',
               uid: 'CW1234',
             }),
-          }) as any,
+          } as any),
         getBackendSrv: getBackendSrvMock,
       };
       const state = {
@@ -258,7 +258,7 @@ describe('testDataSource', () => {
               type: 'azure-monitor',
               uid: 'azM0nit0R',
             }),
-          }) as any,
+          } as any),
         getBackendSrv: getBackendSrvMock,
       };
       const result = {

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

@@ -37,7 +37,7 @@ const mockPlugin = () =>
     pinned: true,
     type: PluginType.datasource,
     module: 'path/to/module',
-  }) as PluginMeta;
+  } as PluginMeta);
 
 describe('dataSourcesReducer', () => {
   describe('when dataSourcesLoaded is dispatched', () => {

public/app/features/explore/FeatureTogglePage.tsx

@@ -7,9 +7,10 @@ import { Page } from 'app/core/components/Page/Page';
 
 export default function FeatureTogglePage() {
   const styles = useStyles2(
-    (theme: GrafanaTheme2) => css`
+    (theme: GrafanaTheme2) =>
-      margin-top: ${theme.spacing(2)};
+      css`
-    `
+        margin-top: ${theme.spacing(2)};
+      `
   );
 
   return (

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

@@ -403,13 +403,14 @@ const Query = ({ query, showDsInfo = false }: QueryProps) => {
   );
 };
 
-const getDsInfoStyles = (size: 'sm' | 'md') => (theme: GrafanaTheme2) => css`
+const getDsInfoStyles = (size: 'sm' | 'md') => (theme: GrafanaTheme2) =>
-  display: flex;
+  css`
-  align-items: center;
+    display: flex;
-  font-size: ${theme.typography[size === 'sm' ? 'bodySmall' : 'body'].fontSize};
+    align-items: center;
-  font-weight: ${theme.typography.fontWeightMedium};
+    font-size: ${theme.typography[size === 'sm' ? 'bodySmall' : 'body'].fontSize};
-  white-space: nowrap;
+    font-weight: ${theme.typography.fontWeightMedium};
-`;
+    white-space: nowrap;
+  `;
 
 function DatasourceInfo({ dsApi, size }: { dsApi?: DataSourceApi; size: 'sm' | 'md' }) {
   const getStyles = useCallback((theme: GrafanaTheme2) => getDsInfoStyles(size)(theme), [size]);

public/app/features/explore/TraceView/TraceView.tsx

@@ -264,8 +264,8 @@ function useFocusSpanLink(options: {
       })
     );
 
-  const query = useSelector(
+  const query = useSelector((state) =>
-    (state) => state.explore.panes[options.exploreId]?.queries.find((query) => query.refId === options.refId)
+    state.explore.panes[options.exploreId]?.queries.find((query) => query.refId === options.refId)
   );
 
   const createFocusSpanLink = (traceId: string, spanId: string) => {

public/app/features/plugins/admin/helpers.ts

@@ -223,13 +223,10 @@ export const sortPlugins = (plugins: CatalogPlugin[], sortBy: Sorters) => {
 };
 
 function groupErrorsByPluginId(errors: PluginError[] = []): Record<string, PluginError | undefined> {
-  return errors.reduce(
+  return errors.reduce((byId, error) => {
-    (byId, error) => {
+    byId[error.pluginId] = error;
-      byId[error.pluginId] = error;
+    return byId;
-      return byId;
+  }, {} as Record<string, PluginError | undefined>);
-    },
-    {} as Record<string, PluginError | undefined>
-  );
 }
 
 function getPluginSignature(options: {

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

@@ -44,7 +44,7 @@ import { runRequest } from './runRequest';
 
 export interface QueryRunnerOptions<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > {
   datasource: DataSourceRef | DataSourceApi<TQuery, TOptions> | null;
   queries: TQuery[];

public/app/features/storage/RootView.tsx

@@ -72,7 +72,9 @@ export function RootView({ root, onPathChange }: Props) {
                 {s.config.description}
                 {s.config.git?.remote && <a href={s.config.git?.remote}>{s.config.git?.remote}</a>}
               </Card.Meta>
-              {s.notice?.map((notice) => <Alert key={notice.text} severity={notice.severity} title={notice.text} />)}
+              {s.notice?.map((notice) => (
+                <Alert key={notice.text} severity={notice.severity} title={notice.text} />
+              ))}
 
               <Card.Tags className={styles.clickable}>
                 <HorizontalGroup>

public/app/features/transformers/editors/OrganizeFieldsTransformerEditor.tsx

@@ -192,13 +192,10 @@ const reorderToIndex = (fieldNames: string[], startIndex: number, endIndex: numb
   const [removed] = result.splice(startIndex, 1);
   result.splice(endIndex, 0, removed);
 
-  return result.reduce(
+  return result.reduce((nameByIndex, fieldName, index) => {
-    (nameByIndex, fieldName, index) => {
+    nameByIndex[fieldName] = index;
-      nameByIndex[fieldName] = index;
+    return nameByIndex;
-      return nameByIndex;
+  }, {} as Record<string, number>);
-    },
-    {} as Record<string, number>
-  );
 };
 
 const orderFieldNamesByIndex = (fieldNames: string[], indexByName: Record<string, number> = {}): string[] => {

public/app/features/transformers/utils.ts

@@ -9,20 +9,17 @@ export function useAllFieldNamesFromDataFrames(input: DataFrame[]): string[] {
     }
 
     return Object.keys(
-      input.reduce(
+      input.reduce((names, frame) => {
-        (names, frame) => {
+        if (!frame || !Array.isArray(frame.fields)) {
-          if (!frame || !Array.isArray(frame.fields)) {
+          return names;
-            return names;
+        }
-          }
 
-          return frame.fields.reduce((names, field) => {
+        return frame.fields.reduce((names, field) => {
-            const t = getFieldDisplayName(field, frame, input);
+          const t = getFieldDisplayName(field, frame, input);
-            names[t] = true;
+          names[t] = true;
-            return names;
+          return names;
-          }, names);
+        }, names);
-        },
+      }, {} as Record<string, boolean>)
-        {} as Record<string, boolean>
-      )
     );
   }, [input]);
 }

public/app/features/variables/editor/getVariableQueryEditor.tsx

@@ -17,7 +17,7 @@ import { LegacyVariableQueryEditor } from './LegacyVariableQueryEditor';
 export async function getVariableQueryEditor<
   TQuery extends DataQuery = DataQuery,
   TOptions extends DataSourceJsonData = DataSourceJsonData,
-  VariableQuery extends DataQuery = TQuery,
+  VariableQuery extends DataQuery = TQuery
 >(
   datasource: DataSourceApi<TQuery, TOptions>,
   importDataSourcePluginFunc = importDataSourcePlugin
@@ -50,7 +50,7 @@ export async function getVariableQueryEditor<
 
 export function StandardVariableQueryEditor<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >({
   datasource: propsDatasource,
   query: propsQuery,

public/app/features/variables/guard.ts

@@ -62,7 +62,7 @@ export function isLegacyAdHocDataSource(datasource: null | DataSourceRef | strin
 
 interface DataSourceWithLegacyVariableSupport<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > extends DataSourceApi<TQuery, TOptions> {
   metricFindQuery(query: any, options?: any): Promise<MetricFindValue[]>;
   variables: undefined;
@@ -70,7 +70,7 @@ interface DataSourceWithLegacyVariableSupport<
 
 interface DataSourceWithStandardVariableSupport<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > extends DataSourceApi<TQuery, TOptions> {
   variables: {
     getType(): VariableSupportType;
@@ -81,7 +81,7 @@ interface DataSourceWithStandardVariableSupport<
 
 interface DataSourceWithCustomVariableSupport<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > extends DataSourceApi<TQuery, TOptions> {
   variables: {
     getType(): VariableSupportType;
@@ -92,7 +92,7 @@ interface DataSourceWithCustomVariableSupport<
 
 interface DataSourceWithDatasourceVariableSupport<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > extends DataSourceApi<TQuery, TOptions> {
   variables: {
     getType(): VariableSupportType;
@@ -105,7 +105,7 @@ interface DataSourceWithDatasourceVariableSupport<
  * */
 export const hasLegacyVariableSupport = <
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >(
   datasource: DataSourceApi<TQuery, TOptions>
 ): datasource is DataSourceWithLegacyVariableSupport<TQuery, TOptions> => {
@@ -114,7 +114,7 @@ export const hasLegacyVariableSupport = <
 
 export const hasStandardVariableSupport = <
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >(
   datasource: DataSourceApi<TQuery, TOptions>
 ): datasource is DataSourceWithStandardVariableSupport<TQuery, TOptions> => {
@@ -132,7 +132,7 @@ export const hasStandardVariableSupport = <
 
 export const hasCustomVariableSupport = <
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >(
   datasource: DataSourceApi<TQuery, TOptions>
 ): datasource is DataSourceWithCustomVariableSupport<TQuery, TOptions> => {
@@ -155,7 +155,7 @@ export const hasCustomVariableSupport = <
 
 export const hasDatasourceVariableSupport = <
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >(
   datasource: DataSourceApi<TQuery, TOptions>
 ): datasource is DataSourceWithDatasourceVariableSupport<TQuery, TOptions> => {
@@ -168,7 +168,7 @@ export const hasDatasourceVariableSupport = <
 
 export function isLegacyQueryEditor<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >(
   component: VariableQueryEditorType,
   datasource: DataSourceApi<TQuery, TOptions>
@@ -182,7 +182,7 @@ export function isLegacyQueryEditor<
 
 export function isQueryEditor<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 >(
   component: VariableQueryEditorType,
   datasource: DataSourceApi<TQuery, TOptions>

public/app/features/variables/inspect/utils.ts

@@ -118,58 +118,52 @@ const validVariableNames: Record<string, RegExp[]> = {
 };
 
 export const getPropsWithVariable = (variableId: string, parent: { key: string; value: any }, result: any) => {
-  const stringValues = Object.keys(parent.value).reduce(
+  const stringValues = Object.keys(parent.value).reduce((all, key) => {
-    (all, key) => {
+    const value = parent.value[key];
-      const value = parent.value[key];
+    if (!value || typeof value !== 'string') {
-      if (!value || typeof value !== 'string') {
+      return all;
-        return all;
+    }
+
+    const isValidName = validVariableNames[key]
+      ? validVariableNames[key].find((regex: RegExp) => regex.test(variableId))
+      : undefined;
+
+    let hasVariable = containsVariable(value, variableId);
+    if (key === 'repeat' && value === variableId) {
+      // repeat stores value without variable format
+      hasVariable = true;
+    }
+
+    if (!isValidName && hasVariable) {
+      all = {
+        ...all,
+        [key]: value,
+      };
+    }
+
+    return all;
+  }, {} as Record<string, any>);
+
+  const objectValues = Object.keys(parent.value).reduce((all, key) => {
+    const value = parent.value[key];
+    if (value && typeof value === 'object' && Object.keys(value).length) {
+      let id = value.title || value.name || value.id || key;
+      if (Array.isArray(parent.value) && parent.key === 'panels') {
+        id = `${id}[${value.id}]`;
       }
 
-      const isValidName = validVariableNames[key]
+      const newResult = getPropsWithVariable(variableId, { key, value }, {});
-        ? validVariableNames[key].find((regex: RegExp) => regex.test(variableId))
-        : undefined;
 
-      let hasVariable = containsVariable(value, variableId);
+      if (Object.keys(newResult).length) {
-      if (key === 'repeat' && value === variableId) {
-        // repeat stores value without variable format
-        hasVariable = true;
-      }
-
-      if (!isValidName && hasVariable) {
         all = {
           ...all,
-          [key]: value,
+          [id]: newResult,
         };
       }
+    }
 
-      return all;
+    return all;
-    },
+  }, {} as Record<string, any>);
-    {} as Record<string, any>
-  );
-
-  const objectValues = Object.keys(parent.value).reduce(
-    (all, key) => {
-      const value = parent.value[key];
-      if (value && typeof value === 'object' && Object.keys(value).length) {
-        let id = value.title || value.name || value.id || key;
-        if (Array.isArray(parent.value) && parent.key === 'panels') {
-          id = `${id}[${value.id}]`;
-        }
-
-        const newResult = getPropsWithVariable(variableId, { key, value }, {});
-
-        if (Object.keys(newResult).length) {
-          all = {
-            ...all,
-            [id]: newResult,
-          };
-        }
-      }
-
-      return all;
-    },
-    {} as Record<string, any>
-  );
 
   if (Object.keys(stringValues).length || Object.keys(objectValues).length) {
     result = {

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

@@ -184,25 +184,22 @@ export function flattenQuery(query: any): any {
   }
 
   const keys = Object.keys(query);
-  const flattened = keys.reduce(
+  const flattened = keys.reduce((all, key) => {
-    (all, key) => {
+    const value = query[key];
-      const value = query[key];
+    if (typeof value !== 'object' || value === null) {
-      if (typeof value !== 'object' || value === null) {
+      all[key] = value;
-        all[key] = value;
-        return all;
-      }
-
-      const result = flattenQuery(value);
-      for (let childProp in result) {
-        if (result.hasOwnProperty(childProp)) {
-          all[`${key}_${childProp}`] = result[childProp];
-        }
-      }
-
       return all;
-    },
+    }
-    {} as Record<string, any>
+
-  );
+    const result = flattenQuery(value);
+    for (let childProp in result) {
+      if (result.hasOwnProperty(childProp)) {
+        all[`${key}_${childProp}`] = result[childProp];
+      }
+    }
+
+    return all;
+  }, {} as Record<string, any>);
 
   return flattened;
 }

public/app/features/variables/shared/testing/datasourceVariableBuilder.ts

@@ -3,7 +3,7 @@ import { DataSourceVariableModel, QueryVariableModel, VariableRefresh } from 'ap
 import { MultiVariableBuilder } from './multiVariableBuilder';
 
 export class DatasourceVariableBuilder<
-  T extends DataSourceVariableModel | QueryVariableModel,
+  T extends DataSourceVariableModel | QueryVariableModel
 > extends MultiVariableBuilder<T> {
   withRefresh(refresh: VariableRefresh) {
     this.variable.refresh = refresh;

public/app/features/variables/types.ts

@@ -89,7 +89,7 @@ export interface VariableQueryEditorProps {
 
 export type VariableQueryEditorType<
   TQuery extends DataQuery = DataQuery,
-  TOptions extends DataSourceJsonData = DataSourceJsonData,
+  TOptions extends DataSourceJsonData = DataSourceJsonData
 > = ComponentType<VariableQueryEditorProps> | ComponentType<QueryEditorProps<any, TQuery, TOptions, any>> | null;
 
 export interface VariablesChangedEvent {

public/app/plugins/datasource/alertmanager/types.ts

@@ -218,7 +218,7 @@ export type AlertmanagerAlert = {
   receivers: [
     {
       name: string;
-    },
+    }
   ];
   fingerprint: string;
   status: {

public/app/plugins/datasource/cloudwatch/query-runner/CloudWatchRequest.ts

@@ -20,10 +20,7 @@ export abstract class CloudWatchRequest {
     AppNotificationTimeout.Error
   );
 
-  constructor(
+  constructor(public instanceSettings: DataSourceInstanceSettings<CloudWatchJsonData>, templateSrv: TemplateSrv) {
-    public instanceSettings: DataSourceInstanceSettings<CloudWatchJsonData>,
-    templateSrv: TemplateSrv
-  ) {
     this.templateSrv = templateSrv;
     this.ref = getDataSourceRef(instanceSettings);
   }

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

@@ -27,10 +27,7 @@ interface TopMetricBucket {
 }
 
 export class ElasticResponse {
-  constructor(
+  constructor(private targets: ElasticsearchQuery[], private response: any) {
-    private targets: ElasticsearchQuery[],
-    private response: any
-  ) {
     this.targets = targets;
     this.response = response;
   }
@@ -787,10 +784,8 @@ const addPreferredVisualisationType = (series: any, type: PreferredVisualisation
 
 const toNameTypePair =
   (docs: Array<Record<string, any>>) =>
-  (propName: string): [string, FieldType] => [
+  (propName: string): [string, FieldType] =>
-    propName,
+    [propName, guessType(docs.find((doc) => doc[propName] !== undefined)?.[propName])];
-    guessType(docs.find((doc) => doc[propName] !== undefined)?.[propName]),
-  ];
 
 /**
  * Trying to guess data type from its value. This is far from perfect, as in order to have accurate guess

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

@@ -21,10 +21,7 @@ export const intervalMap: IntervalMap = {
 export class IndexPattern {
   private dateLocale = 'en';
 
-  constructor(
+  constructor(private pattern: string, private interval?: keyof typeof intervalMap) {}
-    private pattern: string,
-    private interval?: keyof typeof intervalMap
-  ) {}
 
   getIndexForToday() {
     if (this.interval) {

public/app/plugins/datasource/graphite/datasource.ts

@@ -84,10 +84,7 @@ export class GraphiteDatasource
   requestCounter = 100;
   private readonly metricMappings: GraphiteLokiMapping[];
 
-  constructor(
+  constructor(instanceSettings: any, private readonly templateSrv: TemplateSrv = getTemplateSrv()) {
-    instanceSettings: any,
-    private readonly templateSrv: TemplateSrv = getTemplateSrv()
-  ) {
     super(instanceSettings);
     this.basicAuth = instanceSettings.basicAuth;
     this.url = instanceSettings.url;

public/app/plugins/datasource/loki/components/monaco-query-field/monaco-completion-provider/CompletionDataProvider.ts

@@ -13,10 +13,7 @@ interface HistoryRef {
 }
 
 export class CompletionDataProvider {
-  constructor(
+  constructor(private languageProvider: LanguageProvider, private historyRef: HistoryRef = { current: [] }) {}
-    private languageProvider: LanguageProvider,
-    private historyRef: HistoryRef = { current: [] }
-  ) {}
 
   private buildSelector(labels: Label[]): string {
     const allLabelTexts = labels.map(

public/app/plugins/datasource/mysql/sqlCompletionProvider.ts

@@ -53,47 +53,48 @@ export const customStatementPlacementProvider: StatementPlacementProvider = () =
 ];
 
 export const customSuggestionKinds: (getMeta: CompletionProviderGetterArgs['getMeta']) => SuggestionKindProvider =
-  (getMeta) => () => [
+  (getMeta) => () =>
-    {
+    [
-      id: SuggestionKind.Tables,
+      {
-      overrideDefault: true,
+        id: SuggestionKind.Tables,
-      suggestionsResolver: async (ctx) => {
+        overrideDefault: true,
-        const databaseName = getDatabaseName(ctx.currentToken);
+        suggestionsResolver: async (ctx) => {
+          const databaseName = getDatabaseName(ctx.currentToken);
 
-        const suggestions = await getMeta({ schema: databaseName });
+          const suggestions = await getMeta({ schema: databaseName });
 
-        return suggestions.map(mapToSuggestion(ctx));
+          return suggestions.map(mapToSuggestion(ctx));
+        },
       },
-    },
+      {
-    {
+        id: SuggestionKind.Columns,
-      id: SuggestionKind.Columns,
+        overrideDefault: true,
-      overrideDefault: true,
+        suggestionsResolver: async (ctx) => {
-      suggestionsResolver: async (ctx) => {
+          const databaseToken = getDatabaseToken(ctx.currentToken);
-        const databaseToken = getDatabaseToken(ctx.currentToken);
+          const databaseName = getDatabaseName(databaseToken);
-        const databaseName = getDatabaseName(databaseToken);
+          const tableName = getTableName(databaseToken);
-        const tableName = getTableName(databaseToken);
 
-        if (!databaseName || !tableName) {
+          if (!databaseName || !tableName) {
-          return [];
+            return [];
-        }
+          }
 
-        const suggestions = await getMeta({ schema: databaseName, table: tableName });
+          const suggestions = await getMeta({ schema: databaseName, table: tableName });
 
-        return suggestions.map(mapToSuggestion(ctx));
+          return suggestions.map(mapToSuggestion(ctx));
+        },
       },
-    },
+      {
-    {
+        id: customSuggestionKind.tablesWithinDatabase,
-      id: customSuggestionKind.tablesWithinDatabase,
+        applyTo: [customStatementPlacement.afterDatabase],
-      applyTo: [customStatementPlacement.afterDatabase],
+        suggestionsResolver: async (ctx) => {
-      suggestionsResolver: async (ctx) => {
+          const databaseName = getDatabaseName(ctx.currentToken);
-        const databaseName = getDatabaseName(ctx.currentToken);
 
-        const suggestions = await getMeta({ schema: databaseName });
+          const suggestions = await getMeta({ schema: databaseName });
 
-        return suggestions.map(mapToSuggestion(ctx));
+          return suggestions.map(mapToSuggestion(ctx));
+        },
       },
-    },
+    ];
-  ];
 
 function mapToSuggestion(ctx: PositionContext) {
   return function (tableDefinition: TableDefinition) {

public/app/plugins/datasource/opentsdb/datasource.ts

@@ -46,10 +46,7 @@ export default class OpenTsDatasource extends DataSourceApi<OpenTsdbQuery, OpenT
   aggregatorsPromise: any;
   filterTypesPromise: any;
 
-  constructor(
+  constructor(instanceSettings: any, private readonly templateSrv: TemplateSrv = getTemplateSrv()) {
-    instanceSettings: any,
-    private readonly templateSrv: TemplateSrv = getTemplateSrv()
-  ) {
     super(instanceSettings);
     this.type = 'opentsdb';
     this.url = instanceSettings.url;

public/app/plugins/datasource/prometheus/metric_find_query.ts

@@ -18,10 +18,7 @@ import { PromQueryRequest } from './types';
 export default class PrometheusMetricFindQuery {
   range: TimeRange;
 
-  constructor(
+  constructor(private datasource: PrometheusDatasource, private query: string) {
-    private datasource: PrometheusDatasource,
-    private query: string
-  ) {
     this.datasource = datasource;
     this.query = query;
     this.range = getTimeSrv().timeRange();

public/app/plugins/datasource/prometheus/querybuilder/binaryScalarOperations.ts

@@ -71,16 +71,13 @@ export const binaryScalarDefs = [
   },
 ];
 
-export const binaryScalarOperatorToOperatorName = binaryScalarDefs.reduce(
+export const binaryScalarOperatorToOperatorName = binaryScalarDefs.reduce((acc, def) => {
-  (acc, def) => {
+  acc[def.sign] = {
-    acc[def.sign] = {
+    id: def.id,
-      id: def.id,
+    comparison: def.comparison,
-      comparison: def.comparison,
+  };
-    };
+  return acc;
-    return acc;
+}, {} as Record<string, { id: string; comparison?: boolean }>);
-  },
-  {} as Record<string, { id: string; comparison?: boolean }>
-);
 
 // Not sure about this one. It could also be a more generic 'Simple math operation' where user specifies
 // both the operator and the operand in a single input

public/app/plugins/datasource/prometheus/querybuilder/components/LabelFilters.tsx

@@ -85,9 +85,11 @@ export function LabelFilters({
       {variableEditor ? (
         <InlineFieldRow>
           <div
-            className={cx(css`
+            className={cx(
-              display: flex;
+              css`
-            `)}
+                display: flex;
+              `
+            )}
           >
             <InlineLabel
               width={20}

public/app/plugins/panel/annolist/AnnoListPanel.test.tsx

@@ -67,7 +67,7 @@ async function setupTestContext({
       getStream: () =>
         ({
           subscribe: jest.fn(),
-        }) as any,
+        } as any),
       publish: jest.fn(),
       removeAllListeners: jest.fn(),
       newScopedBus: jest.fn(),

public/app/plugins/panel/barchart/quadtree.ts

@@ -50,13 +50,7 @@ export class Quadtree {
   o: Rect[];
   q: Quads | null;
 
-  constructor(
+  constructor(public x: number, public y: number, public w: number, public h: number, public l: number = 0) {
-    public x: number,
-    public y: number,
-    public w: number,
-    public h: number,
-    public l: number = 0
-  ) {
     this.o = [];
     this.q = null;
   }

public/app/plugins/panel/table-old/editor.ts

@@ -15,10 +15,7 @@ export class TablePanelEditorCtrl {
 
   static $inject = ['$scope', 'uiSegmentSrv'];
 
-  constructor(
+  constructor($scope: any, private uiSegmentSrv: any) {
-    $scope: any,
-    private uiSegmentSrv: any
-  ) {
     $scope.editor = this;
     this.panelCtrl = $scope.ctrl;
     this.panel = this.panelCtrl.panel;

public/app/plugins/panel/table-old/module.ts

@@ -56,12 +56,7 @@ export class TablePanelCtrl extends MetricsPanelCtrl {
 
   static $inject = ['$scope', '$injector', 'annotationsSrv', '$sanitize'];
 
-  constructor(
+  constructor($scope: any, $injector: any, private annotationsSrv: any, private $sanitize: any) {
-    $scope: any,
-    $injector: any,
-    private annotationsSrv: any,
-    private $sanitize: any
-  ) {
     super($scope, $injector);
 
     this.pageIndex = 0;

public/app/plugins/panel/timeseries/plugins/annotations/AnnotationTooltip.tsx

@@ -82,7 +82,9 @@ export const AnnotationTooltip = ({
         {alertText}
         <>
           <HorizontalGroup spacing="xs" wrap>
-            {tags?.map((t, i) => <Tag name={t} key={`${t}-${i}`} />)}
+            {tags?.map((t, i) => (
+              <Tag name={t} key={`${t}-${i}`} />
+            ))}
           </HorizontalGroup>
         </>
       </div>

public/sass/base/_grafana_icons.scss

@@ -1,8 +1,7 @@
 @font-face {
   font-family: 'grafana-icons';
   src: url('../fonts/grafana-icons.eot?okx5td');
-  src:
+  src: url('../fonts/grafana-icons.eot?okx5td#iefix') format('embedded-opentype'),
-    url('../fonts/grafana-icons.eot?okx5td#iefix') format('embedded-opentype'),
     url('../fonts/grafana-icons.ttf?okx5td') format('truetype'),
     url('../fonts/grafana-icons.woff?okx5td') format('woff'),
     url('../fonts/grafana-icons.svg?okx5td#grafana-icons') format('svg');

public/sass/base/font-awesome/_path.scss

@@ -4,8 +4,7 @@
 @font-face {
   font-family: 'FontAwesome';
   src: url('#{$fa-font-path}/fontawesome-webfont.eot?v=#{$fa-version}');
-  src:
+  src: url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
-    url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
     url('#{$fa-font-path}/fontawesome-webfont.woff2?v=#{$fa-version}') format('woff2'),
     url('#{$fa-font-path}/fontawesome-webfont.woff?v=#{$fa-version}') format('woff'),
     url('#{$fa-font-path}/fontawesome-webfont.ttf?v=#{$fa-version}') format('truetype'),

public/sass/components/_scrollbar.scss

@@ -20,12 +20,8 @@
 .ps__rail-x {
   display: none;
   opacity: 0;
-  transition:
+  transition: background-color 0.2s linear, opacity 0.2s linear;
-    background-color 0.2s linear,
+  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
-    opacity 0.2s linear;
-  -webkit-transition:
-    background-color 0.2s linear,
-    opacity 0.2s linear;
   height: 15px;
   /* there must be 'bottom' or 'top' for ps__rail-x */
   bottom: 0px;
@@ -36,12 +32,8 @@
 .ps__rail-y {
   display: none;
   opacity: 0;
-  transition:
+  transition: background-color 0.2s linear, opacity 0.2s linear;
-    background-color 0.2s linear,
+  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
-    opacity 0.2s linear;
-  -webkit-transition:
-    background-color 0.2s linear,
-    opacity 0.2s linear;
   width: 15px;
   /* there must be 'right' or 'left' for ps__rail-y */
   right: 0;
@@ -250,9 +242,7 @@
 
   // height: 15px;
   width: 15px;
-  transition:
+  transition: background-color 0.2s linear, opacity 0.2s linear;
-    background-color 0.2s linear,
-    opacity 0.2s linear;
   opacity: 0;
 }
 

public/sass/components/_slate_editor.scss

@@ -61,11 +61,8 @@
     display: block;
     white-space: nowrap;
     cursor: pointer;
-    transition:
+    transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
+      background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
-      border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
   }
 
   .typeahead-item__selected {

public/sass/components/_tagsinput.scss

@@ -36,9 +36,7 @@
       }
 
       &:hover {
-        box-shadow:
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-          inset 0 1px 0 rgba(255, 255, 255, 0.2),
-          0 1px 2px rgba(0, 0, 0, 0.05);
 
         &:active {
           box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

public/test/matchers/utils.ts

@@ -15,8 +15,8 @@ export function forceObservableCompletion(subscription: Subscription, resolve: (
           `${matcherHint('.toEmitValues')}
 
     Expected ${printReceived('Observable')} to be ${printExpected(
-      `completed within ${OBSERVABLE_TEST_TIMEOUT_IN_MS}ms`
+            `completed within ${OBSERVABLE_TEST_TIMEOUT_IN_MS}ms`
-    )} but it did not.`,
+          )} but it did not.`,
       });
     })
   );

public/test/mocks/datasource_srv.ts

@@ -12,10 +12,7 @@ import {
 } from '@grafana/data';
 
 export class DatasourceSrvMock {
-  constructor(
+  constructor(private defaultDS: DataSourceApi, private datasources: { [name: string]: DataSourceApi }) {
-    private defaultDS: DataSourceApi,
-    private datasources: { [name: string]: DataSourceApi }
-  ) {
     //
   }
 

yarn.lock

@@ -19502,7 +19502,7 @@ __metadata:
     postcss-loader: 7.3.3
     postcss-reporter: 7.0.5
     postcss-scss: 4.0.6
-    prettier: 3.0.0
+    prettier: 2.8.4
     prismjs: 1.29.0
     prop-types: 15.8.1
     pseudoizer: ^0.1.0
@@ -26332,12 +26332,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"prettier@npm:3.0.0":
+"prettier@npm:2.8.4":
-  version: 3.0.0
+  version: 2.8.4
-  resolution: "prettier@npm:3.0.0"
+  resolution: "prettier@npm:2.8.4"
   bin:
-    prettier: bin/prettier.cjs
+    prettier: bin-prettier.js
-  checksum: 6a832876a1552dc58330d2467874e5a0b46b9ccbfc5d3531eb69d15684743e7f83dc9fbd202db6270446deba9c82b79d24383d09924c462b457136a759425e33
+  checksum: c173064bf3df57b6d93d19aa98753b9b9dd7657212e33b41ada8e2e9f9884066bb9ca0b4005b89b3ab137efffdf8fbe0b462785aba20364798ff4303aadda57e
   languageName: node
   linkType: hard