Chore: Update version of @grafana/eslint-config (#53403)

* use let/const over var

* use new version of @grafana/eslint-config

package.json

@@ -96,7 +96,7 @@
     "@emotion/eslint-plugin": "11.7.0",
     "@grafana/api-documenter": "7.11.2",
     "@grafana/e2e": "workspace:*",
-    "@grafana/eslint-config": "4.0.0",
+    "@grafana/eslint-config": "5.0.0",
     "@grafana/toolkit": "workspace:*",
     "@grafana/tsconfig": "^1.2.0-rc1",
     "@lingui/cli": "3.14.0",

packages/grafana-data/src/utils/url.ts

@@ -139,7 +139,7 @@ function getUrlSearchParams(): UrlQueryMap {
  * @returns {Object.<string,boolean|Array>}
  */
 export function parseKeyValue(keyValue: string) {
-  var obj: any = {};
+  const obj: any = {};
   const parts = (keyValue || '').split('&');
 
   for (let keyValue of parts) {

packages/grafana-toolkit/bin/grafana-toolkit.js

@@ -32,7 +32,7 @@ const entrypoint = () => {
   if (isLinkedMode() || !fs.existsSync(resolvedJsDir)) {
     console.log('Running in local/linked mode');
     // This bin is used for cli executed internally
-    var tsProjectPath = path.resolve(__dirname, '../tsconfig.json');
+    const tsProjectPath = path.resolve(__dirname, '../tsconfig.json');
     require('ts-node').register({
       project: tsProjectPath,
       transpileOnly: true,

packages/grafana-toolkit/docker/grafana-plugin-ci-alpine/install/bin/githubRelease.js

@@ -1,16 +1,16 @@
 'use strict';
 Object.defineProperty(exports, '__esModule', { value: true });
-var fs = require('fs');
+const fs = require('fs');
-var path = require('path');
+const path = require('path');
-var tslib_1 = require('tslib');
+const tslib_1 = require('tslib');
 
-var getPluginId_1 = require('../../config/utils/getPluginId');
+const getPluginId_1 = require('../../config/utils/getPluginId');
-var pluginValidation_1 = require('../../config/utils/pluginValidation');
+const pluginValidation_1 = require('../../config/utils/pluginValidation');
-var env_1 = require('../../plugins/env');
+const env_1 = require('../../plugins/env');
 // @ts-ignore
 // import execa = require('execa');
-var githubClient_1 = tslib_1.__importDefault(require('./githubClient'));
+const githubClient_1 = tslib_1.__importDefault(require('./githubClient'));
-var resolveContentType = function (extension) {
+const resolveContentType = function (extension) {
   if (extension.startsWith('.')) {
     extension = extension.slice(1);
   }
@@ -25,7 +25,7 @@ var resolveContentType = function (extension) {
       return 'application/octet-stream';
   }
 };
-var GitHubRelease = /** @class */ (function () {
+const GitHubRelease = /** @class */ (function () {
   function GitHubRelease(token, username, repository, releaseNotes, commitHash) {
     this.token = token;
     this.username = username;
@@ -38,12 +38,12 @@ var GitHubRelease = /** @class */ (function () {
     });
   }
   GitHubRelease.prototype.publishAssets = function (srcLocation, destUrl) {
-    var _this = this;
+    const _this = this;
     // Add the assets. Loop through files in the ci/dist folder and upload each asset.
-    var files = fs.readdirSync(srcLocation);
+    const files = fs.readdirSync(srcLocation);
     return files.map(function (file) {
       return tslib_1.__awaiter(_this, void 0, void 0, function () {
-        var fileStat, fileData;
+        let fileStat, fileData;
         return tslib_1.__generator(this, function (_a) {
           fileStat = fs.statSync(srcLocation + '/' + file);
           fileData = fs.readFileSync(srcLocation + '/' + file);
@@ -62,9 +62,9 @@ var GitHubRelease = /** @class */ (function () {
     });
   };
   GitHubRelease.prototype.release = function () {
-    var _a, _b, _c, _d;
+    let _a, _b, _c, _d;
     return tslib_1.__awaiter(this, void 0, void 0, function () {
-      var ciDir,
+      let ciDir,
         distDir,
         distContentDir,
         pluginJsonFile,

packages/jaeger-ui-components/src/utils/color-generator.tsx

@@ -52,7 +52,7 @@ class ColorGenerator {
   }
 
   hashCode(key: string) {
-    var hash = 0,
+    let hash = 0,
       i,
       chr;
     for (i = 0; i < key.length; i++) {

public/app/angular/bsTooltip.ts

@@ -11,7 +11,7 @@ coreModule.directive('bsTooltip', [
       restrict: 'A',
       scope: true,
       link: function postLink(scope: any, element: any, attrs: any) {
-        var getter = $parse(attrs.bsTooltip),
+        let getter = $parse(attrs.bsTooltip),
           value = getter(scope);
         scope.$watch(attrs.bsTooltip, function (newValue: any, oldValue: any) {
           if (newValue !== oldValue) {
@@ -22,7 +22,7 @@ coreModule.directive('bsTooltip', [
         if (true) {
           element.on('show', function (ev: any) {
             $('.tooltip.in').each(function () {
-              var $this = $(this),
+              const $this = $(this),
                 tooltip = $this.data('tooltip');
               if (tooltip && !tooltip.$element.is(element)) {
                 $this.tooltip('hide');
@@ -37,9 +37,9 @@ coreModule.directive('bsTooltip', [
           html: true,
           container: 'body', // Grafana change
         });
-        var tooltip = element.data('tooltip');
+        const tooltip = element.data('tooltip');
         tooltip.show = function () {
-          var r = $.fn.tooltip.Constructor.prototype.show.apply(this, arguments);
+          const r = $.fn.tooltip.Constructor.prototype.show.apply(this, arguments);
           this.tip().data('tooltip', this);
           return r;
         };

public/app/angular/bsTypeahead.ts

@@ -11,7 +11,7 @@ coreModule.directive('bsTypeahead', [
       restrict: 'A',
       require: '?ngModel',
       link: function postLink(scope: any, element: any, attrs: any, controller: any) {
-        var getter = $parse(attrs.bsTypeahead),
+        let getter = $parse(attrs.bsTypeahead),
           value = getter(scope);
         scope.$watch(attrs.bsTypeahead, function (newValue: any, oldValue: any) {
           if (newValue !== oldValue) {
@@ -35,9 +35,9 @@ coreModule.directive('bsTypeahead', [
             return value;
           },
         });
-        var typeahead = element.data('typeahead');
+        const typeahead = element.data('typeahead');
         typeahead.lookup = function () {
-          var items;
+          let items;
           this.query = this.$element.val() || '';
           if (this.query.length < this.options.minLength) {
             return this.shown ? this.hide() : this;

public/app/angular/components/code_editor/theme-grafana-dark.js

@@ -111,7 +111,7 @@ ace.define(
   background: url(data:image/png;base64,ivborw0kggoaaaansuheugaaaaeaaaaccayaaaczgbynaaaaekleqvqimwpq0fd0zxbzd/wpaajvaoxesgneaaaaaelftksuqmcc) right repeat-y\
   }';
 
-    var dom = acequire('../lib/dom');
+    const dom = acequire('../lib/dom');
     dom.importCssString(exports.cssText, exports.cssClass);
   }
 );

public/app/core/components/QueryOperationRow/QueryOperationRow.tsx

@@ -56,8 +56,8 @@ export const QueryOperationRow: React.FC<QueryOperationRowProps> = ({
     // Ref: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/how-we-use-dom-events.md#a-mouse-drag-has-started-and-the-user-is-now-dragging
     if (e.defaultPrevented) {
       const rect = e.currentTarget.getBoundingClientRect();
-      var x = e.clientX - rect.left;
+      const x = e.clientX - rect.left;
-      var y = e.clientY - rect.top;
+      const y = e.clientY - rect.top;
 
       // report relative mouse position within the header element
       reportInteraction('query_row_reorder_drag_position', {

public/app/core/navigation/parseKeyValue.ts

@@ -15,7 +15,7 @@ export function isArray(arr: any) {
 }
 
 export function isError(value: any) {
-  var tag = toString.call(value);
+  const tag = toString.call(value);
   switch (tag) {
     case '[object Error]':
       return true;
@@ -65,7 +65,7 @@ export function isArrayLike(obj: any) {
 
   // Support: iOS 8.2 (not reproducible in simulator)
   // "length" in obj used to prevent JIT error (gh-11508)
-  var length = 'length' in Object(obj) && obj.length;
+  const length = 'length' in Object(obj) && obj.length;
 
   // NodeList objects (with `item` method) and
   // other objects with suitable length characteristics are array-like
@@ -76,7 +76,7 @@ export function isFunction(value: any) {
 }
 
 export function forEach(obj: any, iterator: any, context?: any) {
-  var key, length;
+  let key, length;
   if (obj) {
     if (isFunction(obj)) {
       for (key in obj) {
@@ -85,7 +85,7 @@ export function forEach(obj: any, iterator: any, context?: any) {
         }
       }
     } else if (isArray(obj) || isArrayLike(obj)) {
-      var isPrimitive = typeof obj !== 'object';
+      const isPrimitive = typeof obj !== 'object';
       for (key = 0, length = obj.length; key < length; key++) {
         if (isPrimitive || key in obj) {
           iterator.call(context, obj[key], key, obj);
@@ -126,9 +126,9 @@ export function tryDecodeURIComponent(value: string): string {
 }
 
 function parseKeyValue(keyValue: string | null) {
-  var obj = {};
+  const obj = {};
   forEach((keyValue || '').split('&'), function (keyValue: string) {
-    var splitPoint, key, val;
+    let splitPoint, key, val;
     if (keyValue) {
       key = keyValue = keyValue.replace(/\+/g, '%20');
       splitPoint = keyValue.indexOf('=');

public/app/core/services/echo/backends/analytics/ApplicationInsightsBackend.ts

@@ -23,13 +23,13 @@ export class ApplicationInsightsBackend implements EchoBackend<PageviewEchoEvent
       dataType: 'script',
       cache: true,
     }).done(function () {
-      var applicationInsightsOpts = {
+      const applicationInsightsOpts = {
         config: {
           connectionString: options.connectionString,
           endpointUrl: options.endpointUrl,
         },
       };
-      var init = new (window as any).Microsoft.ApplicationInsights.ApplicationInsights(applicationInsightsOpts);
+      const init = new (window as any).Microsoft.ApplicationInsights.ApplicationInsights(applicationInsightsOpts);
       (window as any).applicationInsights = init.loadAppInsights();
     });
   }

public/app/core/services/echo/backends/analytics/RudderstackBackend.ts

@@ -34,7 +34,7 @@ export class RudderstackBackend implements EchoBackend<PageviewEchoEvent, Rudder
 
     const rds = ((window as any).rudderanalytics = []);
 
-    var methods = [
+    const methods = [
       'load',
       'page',
       'track',

public/app/core/utils/isShallowEqual.ts

@@ -10,8 +10,8 @@ export function isShallowEqual(a: any, b: any) {
     return false;
   }
 
-  var keys = Object.keys(a);
+  const keys = Object.keys(a);
-  var length = keys.length;
+  const length = keys.length;
 
   for (let i = 0; i < length; i++) {
     if (!(keys[i] in b)) {

public/app/features/alerting/unified/utils/rule-id.ts

@@ -165,8 +165,8 @@ function hash(value: string): number {
   if (value.length === 0) {
     return hash;
   }
-  for (var i = 0; i < value.length; i++) {
+  for (let i = 0; i < value.length; i++) {
-    var char = value.charCodeAt(i);
+    const char = value.charCodeAt(i);
     hash = (hash << 5) - hash + char;
     hash = hash & hash; // Convert to 32bit integer
   }

public/app/features/dashboard/components/PanelEditor/state/OptionSearchEngine.ts

@@ -56,7 +56,7 @@ export class OptionSearchEngine {
   }
 
   getAllOptionsCount(categories: OptionsPaneCategoryDescriptor[]) {
-    var total = 0;
+    let total = 0;
 
     for (const category of categories) {
       total += category.items.length;

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

@@ -26,7 +26,7 @@ export function getVariable(
 ): TypedVariableModel | undefined {
   const { id, rootStateKey } = identifier;
   const variablesState = getVariablesState(rootStateKey, state);
-  var variable = variablesState.variables[id];
+  const variable = variablesState.variables[id];
 
   if (!variable) {
     if (throwWhenMissing) {

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

@@ -1,2 +1,2 @@
-declare var CloudWatchDatasource: any;
+declare let CloudWatchDatasource: any;
 export default CloudWatchDatasource;

public/app/plugins/datasource/influxdb/response_parser.ts

@@ -157,7 +157,7 @@ export default class ResponseParser {
 
 function colContainsTag(colText: string, tagsColumn: string): boolean {
   const tags = (tagsColumn || '').replace(' ', '').split(',');
-  for (var tag of tags) {
+  for (const tag of tags) {
     if (colText.includes(tag)) {
       return true;
     }

public/app/plugins/datasource/jaeger/components/SearchForm.test.tsx

@@ -123,7 +123,7 @@ describe('SearchForm', () => {
     jest.advanceTimersByTime(3000);
 
     await user.type(asyncServiceSelect, 'j');
-    var option = await screen.findByText('jaeger-query');
+    let option = await screen.findByText('jaeger-query');
     expect(option).toBeDefined();
 
     await user.type(asyncServiceSelect, 'c');
@@ -147,7 +147,7 @@ describe('SearchForm', () => {
     jest.advanceTimersByTime(3000);
 
     await user.type(asyncServiceSelect, '$');
-    var serviceOption = await screen.findByText('$service');
+    const serviceOption = await screen.findByText('$service');
     expect(serviceOption).toBeDefined();
 
     const asyncOperationSelect = screen.getByRole('combobox', { name: 'select-operation-name' });
@@ -156,7 +156,7 @@ describe('SearchForm', () => {
     jest.advanceTimersByTime(3000);
 
     await user.type(asyncOperationSelect, '$');
-    var operationOption = await screen.findByText('$operation');
+    const operationOption = await screen.findByText('$operation');
     expect(operationOption).toBeDefined();
   });
 });

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

@@ -1,2 +1,2 @@
-declare var OpenTsDatasource: any;
+declare let OpenTsDatasource: any;
 export default OpenTsDatasource;

public/app/plugins/datasource/postgres/mode-sql.js

@@ -4,25 +4,25 @@ ace.define(
   function (require, exports, module) {
     'use strict';
 
-    var oop = require('../lib/oop');
+    const oop = require('../lib/oop');
-    var TextHighlightRules = require('./text_highlight_rules').TextHighlightRules;
+    const TextHighlightRules = require('./text_highlight_rules').TextHighlightRules;
 
-    var SqlHighlightRules = function () {
+    const SqlHighlightRules = function () {
-      var keywords =
+      const keywords =
         'select|insert|update|delete|from|where|and|or|group|by|order|limit|offset|having|as|case|' +
         'when|else|end|type|left|right|join|on|outer|desc|asc|union|create|table|primary|key|if|' +
         'foreign|not|references|default|null|inner|cross|natural|database|drop|grant';
 
-      var builtinConstants = 'true|false';
+      const builtinConstants = 'true|false';
 
-      var builtinFunctions =
+      const builtinFunctions =
         'avg|count|first|last|max|min|sum|upper|lower|substring|char_length|round|rank|now|' + 'coalesce';
 
-      var dataTypes =
+      const dataTypes =
         'int|int2|int4|int8|numeric|decimal|date|varchar|char|bigint|float|bool|bytea|text|timestamp|' +
         'time|money|real|integer';
 
-      var keywordMapper = this.createKeywordMapper(
+      const keywordMapper = this.createKeywordMapper(
         {
           'support.function': builtinFunctions,
           keyword: keywords,
@@ -93,11 +93,11 @@ ace.define(
   function (require, exports, module) {
     'use strict';
 
-    var oop = require('../lib/oop');
+    const oop = require('../lib/oop');
-    var TextMode = require('./text').Mode;
+    const TextMode = require('./text').Mode;
-    var SqlHighlightRules = require('./sql_highlight_rules').SqlHighlightRules;
+    const SqlHighlightRules = require('./sql_highlight_rules').SqlHighlightRules;
 
-    var Mode = function () {
+    const Mode = function () {
       this.HighlightRules = SqlHighlightRules;
       this.$behaviour = this.$defaultBehaviour;
     };

public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.test.tsx

@@ -123,7 +123,7 @@ describe('NativeSearch', () => {
     expect(select).toBeInTheDocument();
 
     await user.type(select, 'd');
-    var option = await screen.findByText('driver');
+    let option = await screen.findByText('driver');
     expect(option).toBeDefined();
 
     await user.type(select, 'a');
@@ -149,7 +149,7 @@ describe('NativeSearch', () => {
     jest.advanceTimersByTime(3000);
 
     await user.type(asyncServiceSelect, '$');
-    var serviceOption = await screen.findByText('$service');
+    const serviceOption = await screen.findByText('$service');
     expect(serviceOption).toBeDefined();
 
     const asyncSpanSelect = screen.getByRole('combobox', { name: 'select-span-name' });
@@ -158,7 +158,7 @@ describe('NativeSearch', () => {
     jest.advanceTimersByTime(3000);
 
     await user.type(asyncSpanSelect, '$');
-    var operationOption = await screen.findByText('$span');
+    const operationOption = await screen.findByText('$span');
     expect(operationOption).toBeDefined();
   });
 });

public/app/plugins/panel/graph/graph_tooltip.d.ts

@@ -1,2 +1,2 @@
-declare var GraphTooltip: any;
+declare let GraphTooltip: any;
 export default GraphTooltip;

public/dashboards/scripted.js

@@ -14,14 +14,14 @@
 'use strict';
 
 // accessible variables in this scope
-var window, document, ARGS, $, jQuery, moment, kbn;
+let window, document, $, jQuery, moment, kbn;
 
 // Setup some variables
-var dashboard;
+let dashboard;
 
 // All url parameters are available via the ARGS object
 // eslint-disable-next-line no-redeclare
-var ARGS;
+let ARGS;
 
 // Initialize a skeleton with nothing but a rows array and service object
 dashboard = {
@@ -39,8 +39,8 @@ dashboard.time = {
   to: 'now',
 };
 
-var rows = 1;
+let rows = 1;
-var seriesName = 'argName';
+let seriesName = 'argName';
 
 if (!_.isUndefined(ARGS.rows)) {
   rows = parseInt(ARGS.rows, 10);
@@ -50,7 +50,7 @@ if (!_.isUndefined(ARGS.name)) {
   seriesName = ARGS.name;
 }
 
-for (var i = 0; i < rows; i++) {
+for (let i = 0; i < rows; i++) {
   dashboard.rows.push({
     title: 'Chart',
     height: '300px',

public/dashboards/scripted_async.js

@@ -17,11 +17,11 @@
 'use strict';
 
 // accessible variables in this scope
-var window, document, ARGS, $, jQuery, moment, kbn;
+let window, document, ARGS, $, jQuery, moment, kbn;
 
 return function (callback) {
   // Setup some variables
-  var dashboard;
+  let dashboard;
 
   // Initialize a skeleton with nothing but a rows array and service object
   dashboard = {
@@ -40,8 +40,8 @@ return function (callback) {
     to: 'now',
   };
 
-  var rows = 1;
+  let rows = 1;
-  var seriesName = 'argName';
+  let seriesName = 'argName';
 
   if (!_.isUndefined(ARGS.rows)) {
     rows = parseInt(ARGS.rows, 10);

public/dashboards/scripted_templated.js

@@ -14,14 +14,14 @@
 'use strict';
 
 // accessible variables in this scope
-var window, document, ARGS, $, jQuery, moment, kbn;
+let window, document, $, jQuery, moment, kbn;
 
 // Setup some variables
-var dashboard;
+let dashboard;
 
 // All url parameters are available via the ARGS object
 // eslint-disable-next-line no-redeclare
-var ARGS;
+let ARGS;
 
 // Initialize a skeleton with nothing but a rows array and service object
 dashboard = {
@@ -61,8 +61,8 @@ dashboard.templating = {
   ],
 };
 
-var rows = 1;
+let rows = 1;
-var seriesName = 'argName';
+let seriesName = 'argName';
 
 if (!_.isUndefined(ARGS.rows)) {
   rows = parseInt(ARGS.rows, 10);
@@ -72,7 +72,7 @@ if (!_.isUndefined(ARGS.name)) {
   seriesName = ARGS.name;
 }
 
-for (var i = 0; i < rows; i++) {
+for (let i = 0; i < rows; i++) {
   dashboard.rows.push({
     title: 'Chart',
     height: '300px',

yarn.lock

@@ -4927,7 +4927,23 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@grafana/eslint-config@npm:4.0.0, @grafana/eslint-config@npm:^4.0.0":
+"@grafana/eslint-config@npm:5.0.0":
+  version: 5.0.0
+  resolution: "@grafana/eslint-config@npm:5.0.0"
+  dependencies:
+    "@typescript-eslint/eslint-plugin": 5.16.0
+    "@typescript-eslint/parser": 5.16.0
+    eslint: 8.11.0
+    eslint-config-prettier: 8.5.0
+    eslint-plugin-jsdoc: 38.0.6
+    eslint-plugin-react: 7.29.4
+    eslint-plugin-react-hooks: 4.3.0
+    typescript: 4.6.4
+  checksum: b5ad3e34109a0abac6c6c5291f971cc45b1b3edff33584ff5d39f149e969641c21a7c93c6be2eb89b4ea04b99de76e0b38b6d7b95f357e947297fc11e8fbf430
+  languageName: node
+  linkType: hard
+
+"@grafana/eslint-config@npm:^4.0.0":
   version: 4.0.0
   resolution: "@grafana/eslint-config@npm:4.0.0"
   dependencies:
@@ -21546,7 +21562,7 @@ __metadata:
     "@grafana/data": "workspace:*"
     "@grafana/e2e": "workspace:*"
     "@grafana/e2e-selectors": "workspace:*"
-    "@grafana/eslint-config": 4.0.0
+    "@grafana/eslint-config": 5.0.0
     "@grafana/experimental": ^0.0.2-canary.36
     "@grafana/google-sdk": 0.0.3
     "@grafana/lezer-logql": 0.0.14