Merge branch 'master' into postgres-query-builder

CHANGELOG.md

@@ -21,6 +21,8 @@
 * **Prometheus**: Add $__interval, $__interval_ms, $__range, $__range_s & $__range_ms support for dashboard and template queries [#12597](https://github.com/grafana/grafana/issues/12597) [#12882](https://github.com/grafana/grafana/issues/12882), thx [@roidelapluie](https://github.com/roidelapluie)
 * **Variables**: Skip unneeded extra query request when de-selecting variable values used for repeated panels [#8186](https://github.com/grafana/grafana/issues/8186), thx [@mtanda](https://github.com/mtanda)
 * **Variables**: Limit amount of queries executed when updating variable that other variable(s) are dependent on [#11890](https://github.com/grafana/grafana/issues/11890)
+* **Variables**: Support query variable refresh when another variable referenced in `Regex` field change its value [#12952](https://github.com/grafana/grafana/issues/12952), thx [@franciscocpg](https://github.com/franciscocpg)
+* **Variables**: Support variables in query variable `Custom all value` field [#12965](https://github.com/grafana/grafana/issues/12965), thx [@franciscocpg](https://github.com/franciscocpg)
 * **Postgres/MySQL/MSSQL**: New $__unixEpochGroup and $__unixEpochGroupAlias macros [#12892](https://github.com/grafana/grafana/issues/12892), thx [@svenklemm](https://github.com/svenklemm)
 * **Postgres/MySQL/MSSQL**: Add previous fill mode to $__timeGroup macro which will fill in previously seen value when point is missing [#12756](https://github.com/grafana/grafana/issues/12756), thx [@svenklemm](https://github.com/svenklemm)
 * **Postgres/MySQL/MSSQL**: Use floor rounding in $__timeGroup macro function [#12460](https://github.com/grafana/grafana/issues/12460), thx [@svenklemm](https://github.com/svenklemm)
@@ -54,6 +56,7 @@ om/grafana/grafana/issues/12668)
 * **Graphite**: Fix for quoting of int function parameters (when using variables) [#11927](https://github.com/grafana/grafana/pull/11927)
 * **InfluxDB**: Support timeFilter in query templating for InfluxDB [#12598](https://github.com/grafana/grafana/pull/12598), thx [kichristensen](https://github.com/kichristensen)
 * **Provisioning**: Should allow one default datasource per organisation [#12229](https://github.com/grafana/grafana/issues/12229)
+* **Heatmap**: Fix broken tooltip and crosshair on Firefox [#12486](https://github.com/grafana/grafana/issues/12486)
 
 ### Breaking changes
 

build.go

@@ -64,6 +64,10 @@ func main() {
 
 	readVersionFromPackageJson()
 
+	if pkgArch == "" {
+		pkgArch = goarch
+	}
+
 	log.Printf("Version: %s, Linux Version: %s, Package Iteration: %s\n", version, linuxPackageVersion, linuxPackageIteration)
 
 	if flag.NArg() == 0 {
@@ -105,10 +109,17 @@ func main() {
 
 		case "package":
 			grunt(gruntBuildArg("build")...)
-			packageGrafana()
+			grunt(gruntBuildArg("package")...)
+			if goos == "linux" {
+				createLinuxPackages()
+			}
 
 		case "package-only":
-			packageGrafana()
+			grunt(gruntBuildArg("package")...)
+			if goos == "linux" {
+				createLinuxPackages()
+			}
+
 
 		case "pkg-rpm":
 			grunt(gruntBuildArg("release")...)
@@ -133,22 +144,6 @@ func main() {
 	}
 }
 
-func packageGrafana() {
-	platformArg := fmt.Sprintf("--platform=%v", goos)
-	previousPkgArch := pkgArch
-	if pkgArch == "" {
-		pkgArch = goarch
-	}
-	postProcessArgs := gruntBuildArg("package")
-	postProcessArgs = append(postProcessArgs, platformArg)
-	grunt(postProcessArgs...)
-	pkgArch = previousPkgArch
-
-	if goos == "linux" {
-		createLinuxPackages()
-	}
-}
-
 func makeLatestDistCopies() {
 	files, err := ioutil.ReadDir("dist")
 	if err != nil {
@@ -404,6 +399,8 @@ func gruntBuildArg(task string) []string {
 	if phjsToRelease != "" {
 		args = append(args, fmt.Sprintf("--phjsToRelease=%v", phjsToRelease))
 	}
+	args = append(args, fmt.Sprintf("--platform=%v", goos))
+
 	return args
 }
 

package.json

@@ -169,7 +169,8 @@
     "slate-react": "^0.12.4",
     "tether": "^1.4.0",
     "tether-drop": "https://github.com/torkelo/drop/tarball/master",
-    "tinycolor2": "^1.4.1"
+    "tinycolor2": "^1.4.1",
+    "tslint-react": "^3.6.0"
   },
   "resolutions": {
     "caniuse-db": "1.0.30000772"

public/app/app.ts

@@ -53,7 +53,7 @@ export class GrafanaApp {
   }
 
   init() {
-    var app = angular.module('grafana', []);
+    const app = angular.module('grafana', []);
 
     moment.locale(config.bootData.user.locale);
 
@@ -77,7 +77,7 @@ export class GrafanaApp {
         '$delegate',
         '$templateCache',
         function($delegate, $templateCache) {
-          var get = $delegate.get;
+          const get = $delegate.get;
           $delegate.get = function(url, config) {
             if (url.match(/\.html$/)) {
               // some template's already exist in the cache
@@ -105,10 +105,10 @@ export class GrafanaApp {
       'react',
     ];
 
-    var module_types = ['controllers', 'directives', 'factories', 'services', 'filters', 'routes'];
+    const module_types = ['controllers', 'directives', 'factories', 'services', 'filters', 'routes'];
 
     _.each(module_types, type => {
-      var moduleName = 'grafana.' + type;
+      const moduleName = 'grafana.' + type;
       this.useModule(angular.module(moduleName, []));
     });
 
@@ -119,7 +119,7 @@ export class GrafanaApp {
     coreModule.config(setupAngularRoutes);
     registerAngularDirectives();
 
-    var preBootRequires = [System.import('app/features/all')];
+    const preBootRequires = [System.import('app/features/all')];
 
     Promise.all(preBootRequires)
       .then(() => {

public/app/containers/AlertRuleList/AlertRuleList.test.tsx

@@ -46,7 +46,7 @@ describe('AlertRuleList', () => {
 
   it('should render 1 rule', () => {
     page.update();
-    let ruleNode = page.find('.alert-rule-item');
+    const ruleNode = page.find('.alert-rule-item');
     expect(toJson(ruleNode)).toMatchSnapshot();
   });
 

public/app/containers/AlertRuleList/AlertRuleList.tsx

@@ -3,14 +3,14 @@ import { hot } from 'react-hot-loader';
 import classNames from 'classnames';
 import { inject, observer } from 'mobx-react';
 import PageHeader from 'app/core/components/PageHeader/PageHeader';
-import { IAlertRule } from 'app/stores/AlertListStore/AlertListStore';
+import { AlertRule } from 'app/stores/AlertListStore/AlertListStore';
 import appEvents from 'app/core/app_events';
-import IContainerProps from 'app/containers/IContainerProps';
+import ContainerProps from 'app/containers/ContainerProps';
 import Highlighter from 'react-highlight-words';
 
 @inject('view', 'nav', 'alertList')
 @observer
-export class AlertRuleList extends React.Component<IContainerProps, any> {
+export class AlertRuleList extends React.Component<ContainerProps, any> {
   stateFilters = [
     { text: 'All', value: 'all' },
     { text: 'OK', value: 'ok' },
@@ -109,7 +109,7 @@ function AlertStateFilterOption({ text, value }) {
 }
 
 export interface AlertRuleItemProps {
-  rule: IAlertRule;
+  rule: AlertRule;
   search: string;
 }
 
@@ -132,13 +132,13 @@ export class AlertRuleItem extends React.Component<AlertRuleItemProps, any> {
   render() {
     const { rule } = this.props;
 
-    let stateClass = classNames({
+    const stateClass = classNames({
       fa: true,
       'fa-play': rule.isPaused,
       'fa-pause': !rule.isPaused,
     });
 
-    let ruleUrl = `${rule.url}?panelId=${rule.panelId}&fullscreen=true&edit=true&tab=alert`;
+    const ruleUrl = `${rule.url}?panelId=${rule.panelId}&fullscreen=true&edit=true&tab=alert`;
 
     return (
       <li className="alert-rule-item">

public/app/containers/IContainerProps.ts → public/app/containers/ContainerProps.ts

@@ -6,7 +6,7 @@ import { AlertListStore } from './../stores/AlertListStore/AlertListStore';
 import { ViewStore } from './../stores/ViewStore/ViewStore';
 import { FolderStore } from './../stores/FolderStore/FolderStore';
 
-interface IContainerProps {
+interface ContainerProps {
   search: typeof SearchStore.Type;
   serverStats: typeof ServerStatsStore.Type;
   nav: typeof NavStore.Type;
@@ -17,4 +17,4 @@ interface IContainerProps {
   backendSrv: any;
 }
 
-export default IContainerProps;
+export default ContainerProps;

public/app/containers/Explore/Explore.tsx

@@ -63,7 +63,7 @@ function parseUrlState(initial: string | undefined) {
   return { datasource: null, queries: [], range: DEFAULT_RANGE };
 }
 
-interface IExploreState {
+interface ExploreState {
   datasource: any;
   datasourceError: any;
   datasourceLoading: boolean | null;
@@ -88,12 +88,12 @@ interface IExploreState {
   tableResult: any;
 }
 
-export class Explore extends React.Component<any, IExploreState> {
+export class Explore extends React.Component<any, ExploreState> {
   el: any;
 
   constructor(props) {
     super(props);
-    const initialState: IExploreState = props.initialState;
+    const initialState: ExploreState = props.initialState;
     const { datasource, queries, range } = parseUrlState(props.routeParams.state);
     this.state = {
       datasource: null,
@@ -346,19 +346,24 @@ export class Explore extends React.Component<any, IExploreState> {
 
   onQuerySuccess(datasourceId: string, queries: any[]): void {
     // save queries to history
-    let { datasource, history } = this.state;
+    let { history } = this.state;
+    const { datasource } = this.state;
+
     if (datasource.meta.id !== datasourceId) {
       // Navigated away, queries did not matter
       return;
     }
+
     const ts = Date.now();
     queries.forEach(q => {
       const { query } = q;
       history = [{ query, ts }, ...history];
     });
+
     if (history.length > MAX_HISTORY_ITEMS) {
       history = history.slice(0, MAX_HISTORY_ITEMS);
     }
+
     // Combine all queries of a datasource type into one history
     const historyKey = `grafana.explore.history.${datasourceId}`;
     store.setObject(historyKey, history);

public/app/containers/Explore/Graph.tsx

@@ -12,10 +12,10 @@ import Legend from './Legend';
 // Copied from graph.ts
 function time_format(ticks, min, max) {
   if (min && max && ticks) {
-    var range = max - min;
-    var secPerTick = range / ticks / 1000;
-    var oneDay = 86400000;
-    var oneYear = 31536000000;
+    const range = max - min;
+    const secPerTick = range / ticks / 1000;
+    const oneDay = 86400000;
+    const oneYear = 31536000000;
 
     if (secPerTick <= 45) {
       return '%H:%M:%S';

public/app/containers/Explore/Table.tsx

@@ -40,7 +40,7 @@ function Cell(props: SFCCellProps) {
 export default class Table extends PureComponent<TableProps, {}> {
   render() {
     const { className = '', data, loading, onClickCell } = this.props;
-    let tableModel = data || EMPTY_TABLE;
+    const tableModel = data || EMPTY_TABLE;
     if (!loading && data && data.rows.length === 0) {
       return (
         <table className={`${className} filter-table`}>

public/app/containers/Explore/utils/prometheus.ts

@@ -65,7 +65,7 @@ export function parseSelector(query: string, cursorOffset = 1): { labelKeys: any
 
   // Extract clean labels to form clean selector, incomplete labels are dropped
   const selector = query.slice(prefixOpen, suffixClose);
-  let labels = {};
+  const labels = {};
   selector.replace(labelRegexp, match => {
     const delimiterIndex = match.indexOf('=');
     const key = match.slice(0, delimiterIndex);

public/app/containers/ManageDashboards/FolderPermissions.tsx

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { hot } from 'react-hot-loader';
 import { inject, observer } from 'mobx-react';
 import { toJS } from 'mobx';
-import IContainerProps from 'app/containers/IContainerProps';
+import ContainerProps from 'app/containers/ContainerProps';
 import PageHeader from 'app/core/components/PageHeader/PageHeader';
 import Permissions from 'app/core/components/Permissions/Permissions';
 import Tooltip from 'app/core/components/Tooltip/Tooltip';
@@ -12,7 +12,7 @@ import SlideDown from 'app/core/components/Animations/SlideDown';
 
 @inject('nav', 'folder', 'view', 'permissions')
 @observer
-export class FolderPermissions extends Component<IContainerProps, any> {
+export class FolderPermissions extends Component<ContainerProps, any> {
   constructor(props) {
     super(props);
     this.handleAddPermission = this.handleAddPermission.bind(this);

public/app/containers/ManageDashboards/FolderSettings.tsx

@@ -3,13 +3,13 @@ import { hot } from 'react-hot-loader';
 import { inject, observer } from 'mobx-react';
 import { toJS } from 'mobx';
 import PageHeader from 'app/core/components/PageHeader/PageHeader';
-import IContainerProps from 'app/containers/IContainerProps';
+import ContainerProps from 'app/containers/ContainerProps';
 import { getSnapshot } from 'mobx-state-tree';
 import appEvents from 'app/core/app_events';
 
 @inject('nav', 'folder', 'view')
 @observer
-export class FolderSettings extends React.Component<IContainerProps, any> {
+export class FolderSettings extends React.Component<ContainerProps, any> {
   formSnapshot: any;
 
   componentDidMount() {

public/app/containers/ServerStats/ServerStats.tsx

@@ -2,11 +2,11 @@ import React from 'react';
 import { hot } from 'react-hot-loader';
 import { inject, observer } from 'mobx-react';
 import PageHeader from 'app/core/components/PageHeader/PageHeader';
-import IContainerProps from 'app/containers/IContainerProps';
+import ContainerProps from 'app/containers/ContainerProps';
 
 @inject('nav', 'serverStats')
 @observer
-export class ServerStats extends React.Component<IContainerProps, any> {
+export class ServerStats extends React.Component<ContainerProps, any> {
   constructor(props) {
     super(props);
     const { nav, serverStats } = this.props;

public/app/containers/Teams/TeamGroupSync.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { hot } from 'react-hot-loader';
 import { observer } from 'mobx-react';
-import { ITeam, ITeamGroup } from 'app/stores/TeamsStore/TeamsStore';
+import { Team, TeamGroup } from 'app/stores/TeamsStore/TeamsStore';
 import SlideDown from 'app/core/components/Animations/SlideDown';
 import Tooltip from 'app/core/components/Tooltip/Tooltip';
 
 interface Props {
-  team: ITeam;
+  team: Team;
 }
 
 interface State {
@@ -27,7 +27,7 @@ export class TeamGroupSync extends React.Component<Props, State> {
     this.props.team.loadGroups();
   }
 
-  renderGroup(group: ITeamGroup) {
+  renderGroup(group: TeamGroup) {
     return (
       <tr key={group.groupId}>
         <td>{group.groupId}</td>
@@ -53,7 +53,7 @@ export class TeamGroupSync extends React.Component<Props, State> {
     this.setState({ isAdding: false, newGroupId: '' });
   };
 
-  onRemoveGroup = (group: ITeamGroup) => {
+  onRemoveGroup = (group: TeamGroup) => {
     this.props.team.removeGroup(group.groupId);
   };
 

public/app/containers/Teams/TeamList.tsx

@@ -3,7 +3,7 @@ import { hot } from 'react-hot-loader';
 import { inject, observer } from 'mobx-react';
 import PageHeader from 'app/core/components/PageHeader/PageHeader';
 import { NavStore } from 'app/stores/NavStore/NavStore';
-import { TeamsStore, ITeam } from 'app/stores/TeamsStore/TeamsStore';
+import { TeamsStore, Team } from 'app/stores/TeamsStore/TeamsStore';
 import { BackendSrv } from 'app/core/services/backend_srv';
 import DeleteButton from 'app/core/components/DeleteButton/DeleteButton';
 
@@ -27,7 +27,7 @@ export class TeamList extends React.Component<Props, any> {
     this.props.teams.loadTeams();
   }
 
-  deleteTeam(team: ITeam) {
+  deleteTeam(team: Team) {
     this.props.backendSrv.delete('/api/teams/' + team.id).then(this.fetchTeams.bind(this));
   }
 
@@ -35,8 +35,8 @@ export class TeamList extends React.Component<Props, any> {
     this.props.teams.setSearchQuery(evt.target.value);
   };
 
-  renderTeamMember(team: ITeam): JSX.Element {
-    let teamUrl = `org/teams/edit/${team.id}`;
+  renderTeamMember(team: Team): JSX.Element {
+    const teamUrl = `org/teams/edit/${team.id}`;
 
     return (
       <tr key={team.id}>

public/app/containers/Teams/TeamMembers.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { hot } from 'react-hot-loader';
 import { observer } from 'mobx-react';
-import { ITeam, ITeamMember } from 'app/stores/TeamsStore/TeamsStore';
+import { Team, TeamMember } from 'app/stores/TeamsStore/TeamsStore';
 import SlideDown from 'app/core/components/Animations/SlideDown';
 import { UserPicker, User } from 'app/core/components/Picker/UserPicker';
 import DeleteButton from 'app/core/components/DeleteButton/DeleteButton';
 
 interface Props {
-  team: ITeam;
+  team: Team;
 }
 
 interface State {
@@ -30,15 +30,15 @@ export class TeamMembers extends React.Component<Props, State> {
     this.props.team.setSearchQuery(evt.target.value);
   };
 
-  removeMember(member: ITeamMember) {
+  removeMember(member: TeamMember) {
     this.props.team.removeMember(member);
   }
 
-  removeMemberConfirmed(member: ITeamMember) {
+  removeMemberConfirmed(member: TeamMember) {
     this.props.team.removeMember(member);
   }
 
-  renderMember(member: ITeamMember) {
+  renderMember(member: TeamMember) {
     return (
       <tr key={member.userId}>
         <td className="width-4 text-center">

public/app/containers/Teams/TeamPages.tsx

@@ -5,7 +5,7 @@ import { inject, observer } from 'mobx-react';
 import config from 'app/core/config';
 import PageHeader from 'app/core/components/PageHeader/PageHeader';
 import { NavStore } from 'app/stores/NavStore/NavStore';
-import { TeamsStore, ITeam } from 'app/stores/TeamsStore/TeamsStore';
+import { TeamsStore, Team } from 'app/stores/TeamsStore/TeamsStore';
 import { ViewStore } from 'app/stores/ViewStore/ViewStore';
 import TeamMembers from './TeamMembers';
 import TeamSettings from './TeamSettings';
@@ -40,7 +40,7 @@ export class TeamPages extends React.Component<Props, any> {
     nav.initTeamPage(this.getCurrentTeam(), this.currentPage, this.isSyncEnabled);
   }
 
-  getCurrentTeam(): ITeam {
+  getCurrentTeam(): Team {
     const { teams, view } = this.props;
     return teams.map.get(view.routeParams.get('id'));
   }

public/app/containers/Teams/TeamSettings.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import { hot } from 'react-hot-loader';
 import { observer } from 'mobx-react';
-import { ITeam } from 'app/stores/TeamsStore/TeamsStore';
+import { Team } from 'app/stores/TeamsStore/TeamsStore';
 import { Label } from 'app/core/components/Forms/Forms';
 
 interface Props {
-  team: ITeam;
+  team: Team;
 }
 
 @observer

public/app/core/components/EmptyListCTA/EmptyListCTA.tsx

@@ -1,34 +1,37 @@
 import React, { Component } from 'react';
 
-export interface IProps {
-    model: any;
+export interface Props {
+  model: any;
 }
 
-class EmptyListCTA extends Component<IProps, any> {
-    render() {
-        const {
-            title,
-            buttonIcon,
-            buttonLink,
-            buttonTitle,
-            proTip,
-            proTipLink,
-            proTipLinkTitle,
-            proTipTarget
-        } = this.props.model;
-        return (
-            <div className="empty-list-cta">
-                <div className="empty-list-cta__title">{title}</div>
-                <a href={buttonLink} className="empty-list-cta__button btn btn-xlarge btn-success"><i className={buttonIcon} />{buttonTitle}</a>
-                <div className="empty-list-cta__pro-tip">
-                    <i className="fa fa-rocket" /> ProTip: {proTip}
-                    <a className="text-link empty-list-cta__pro-tip-link"
-                        href={proTipLink}
-                        target={proTipTarget}>{proTipLinkTitle}</a>
-                </div>
-            </div>
-        );
-    }
+class EmptyListCTA extends Component<Props, any> {
+  render() {
+    const {
+      title,
+      buttonIcon,
+      buttonLink,
+      buttonTitle,
+      proTip,
+      proTipLink,
+      proTipLinkTitle,
+      proTipTarget,
+    } = this.props.model;
+    return (
+      <div className="empty-list-cta">
+        <div className="empty-list-cta__title">{title}</div>
+        <a href={buttonLink} className="empty-list-cta__button btn btn-xlarge btn-success">
+          <i className={buttonIcon} />
+          {buttonTitle}
+        </a>
+        <div className="empty-list-cta__pro-tip">
+          <i className="fa fa-rocket" /> ProTip: {proTip}
+          <a className="text-link empty-list-cta__pro-tip-link" href={proTipLink} target={proTipTarget}>
+            {proTipLinkTitle}
+          </a>
+        </div>
+      </div>
+    );
+  }
 }
 
 export default EmptyListCTA;

public/app/core/components/PageHeader/PageHeader.tsx

@@ -5,7 +5,7 @@ import classNames from 'classnames';
 import appEvents from 'app/core/app_events';
 import { toJS } from 'mobx';
 
-export interface IProps {
+export interface Props {
   model: NavModel;
 }
 
@@ -15,8 +15,8 @@ const SelectNav = ({ main, customCss }: { main: NavModelItem; customCss: string
   });
 
   const gotoUrl = evt => {
-    var element = evt.target;
-    var url = element.options[element.selectedIndex].value;
+    const element = evt.target;
+    const url = element.options[element.selectedIndex].value;
     appEvents.emit('location-change', { href: url });
   };
 
@@ -82,7 +82,7 @@ const Navigation = ({ main }: { main: NavModelItem }) => {
 };
 
 @observer
-export default class PageHeader extends React.Component<IProps, any> {
+export default class PageHeader extends React.Component<Props, any> {
   constructor(props) {
     super(props);
   }

public/app/core/components/PasswordStrength.tsx

@@ -1,32 +1,31 @@
 import React from 'react';
 
-export interface IProps {
+export interface Props {
   password: string;
 }
 
-export class PasswordStrength extends React.Component<IProps, any> {
-
+export class PasswordStrength extends React.Component<Props, any> {
   constructor(props) {
     super(props);
   }
 
   render() {
     const { password } = this.props;
-    let strengthText = "strength: strong like a bull.";
-    let strengthClass = "password-strength-good";
+    let strengthText = 'strength: strong like a bull.';
+    let strengthClass = 'password-strength-good';
 
     if (!password) {
       return null;
     }
 
     if (password.length <= 8) {
-      strengthText = "strength: you can do better.";
-      strengthClass = "password-strength-ok";
+      strengthText = 'strength: you can do better.';
+      strengthClass = 'password-strength-ok';
     }
 
     if (password.length < 4) {
-      strengthText = "strength: weak sauce.";
-      strengthClass = "password-strength-bad";
+      strengthText = 'strength: weak sauce.';
+      strengthClass = 'password-strength-bad';
     }
 
     return (
@@ -36,5 +35,3 @@ export class PasswordStrength extends React.Component<IProps, any> {
     );
   }
 }
-
-

public/app/core/components/Permissions/AddPermissions.test.tsx

@@ -22,7 +22,7 @@ describe('AddPermissions', () => {
   let wrapper;
   let store;
   let instance;
-  let backendSrv: any = getBackendSrv();
+  const backendSrv: any = getBackendSrv();
 
   beforeAll(() => {
     store = RootStore.create({}, { backendSrv: backendSrv });

public/app/core/components/Permissions/DisabledPermissionsListItem.tsx

@@ -2,11 +2,11 @@ import React, { Component } from 'react';
 import DescriptionPicker from 'app/core/components/Picker/DescriptionPicker';
 import { permissionOptions } from 'app/stores/PermissionsStore/PermissionsStore';
 
-export interface IProps {
+export interface Props {
   item: any;
 }
 
-export default class DisabledPermissionListItem extends Component<IProps, any> {
+export default class DisabledPermissionListItem extends Component<Props, any> {
   render() {
     const { item } = this.props;
 

public/app/core/components/Permissions/Permissions.tsx

@@ -20,7 +20,7 @@ export interface DashboardAcl {
   sortRank?: number;
 }
 
-export interface IProps {
+export interface Props {
   dashboardId: number;
   folderInfo?: FolderInfo;
   permissions?: any;
@@ -29,7 +29,7 @@ export interface IProps {
 }
 
 @observer
-class Permissions extends Component<IProps, any> {
+class Permissions extends Component<Props, any> {
   constructor(props) {
     super(props);
     const { dashboardId, isFolder, folderInfo } = this.props;

public/app/core/components/Permissions/PermissionsList.tsx

@@ -4,7 +4,7 @@ import DisabledPermissionsListItem from './DisabledPermissionsListItem';
 import { observer } from 'mobx-react';
 import { FolderInfo } from './FolderInfo';
 
-export interface IProps {
+export interface Props {
   permissions: any[];
   removeItem: any;
   permissionChanged: any;
@@ -13,7 +13,7 @@ export interface IProps {
 }
 
 @observer
-class PermissionsList extends Component<IProps, any> {
+class PermissionsList extends Component<Props, any> {
   render() {
     const { permissions, removeItem, permissionChanged, fetching, folderInfo } = this.props;
 

public/app/core/components/Picker/DescriptionOption.tsx

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 
-export interface IProps {
+export interface Props {
   onSelect: any;
   onFocus: any;
   option: any;
@@ -8,7 +8,7 @@ export interface IProps {
   className: any;
 }
 
-class DescriptionOption extends Component<IProps, any> {
+class DescriptionOption extends Component<Props, any> {
   constructor(props) {
     super(props);
     this.handleMouseDown = this.handleMouseDown.bind(this);

public/app/core/components/Picker/PickerOption.tsx

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 
-export interface IProps {
+export interface Props {
   onSelect: any;
   onFocus: any;
   option: any;
@@ -8,7 +8,7 @@ export interface IProps {
   className: any;
 }
 
-class UserPickerOption extends Component<IProps, any> {
+class UserPickerOption extends Component<Props, any> {
   constructor(props) {
     super(props);
     this.handleMouseDown = this.handleMouseDown.bind(this);

public/app/core/components/TagFilter/TagBadge.tsx

@@ -1,14 +1,14 @@
 import React from 'react';
 import tags from 'app/core/utils/tags';
 
-export interface IProps {
+export interface Props {
   label: string;
   removeIcon: boolean;
   count: number;
   onClick: any;
 }
 
-export class TagBadge extends React.Component<IProps, any> {
+export class TagBadge extends React.Component<Props, any> {
   constructor(props) {
     super(props);
     this.onClick = this.onClick.bind(this);

public/app/core/components/TagFilter/TagFilter.tsx

@@ -4,13 +4,13 @@ import { Async } from 'react-select';
 import { TagValue } from './TagValue';
 import { TagOption } from './TagOption';
 
-export interface IProps {
+export interface Props {
   tags: string[];
   tagOptions: () => any;
   onSelect: (tag: string) => void;
 }
 
-export class TagFilter extends React.Component<IProps, any> {
+export class TagFilter extends React.Component<Props, any> {
   inlineTags: boolean;
 
   constructor(props) {
@@ -43,7 +43,7 @@ export class TagFilter extends React.Component<IProps, any> {
   }
 
   render() {
-    let selectOptions = {
+    const selectOptions = {
       loadOptions: this.searchTags,
       onChange: this.onChange,
       value: this.props.tags,

public/app/core/components/TagFilter/TagOption.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { TagBadge } from './TagBadge';
 
-export interface IProps {
+export interface Props {
   onSelect: any;
   onFocus: any;
   option: any;
@@ -9,7 +9,7 @@ export interface IProps {
   className: any;
 }
 
-export class TagOption extends React.Component<IProps, any> {
+export class TagOption extends React.Component<Props, any> {
   constructor(props) {
     super(props);
     this.handleMouseDown = this.handleMouseDown.bind(this);

public/app/core/components/TagFilter/TagValue.tsx

@@ -1,14 +1,14 @@
 import React from 'react';
 import { TagBadge } from './TagBadge';
 
-export interface IProps {
+export interface Props {
   value: any;
   className: any;
   onClick: any;
   onRemove: any;
 }
 
-export class TagValue extends React.Component<IProps, any> {
+export class TagValue extends React.Component<Props, any> {
   constructor(props) {
     super(props);
     this.onClick = this.onClick.bind(this);

public/app/core/components/Tooltip/Popover.tsx

@@ -2,11 +2,11 @@
 import withTooltip from './withTooltip';
 import { Target } from 'react-popper';
 
-interface IPopoverProps {
+interface PopoverProps {
   tooltipSetState: (prevState: object) => void;
 }
 
-class Popover extends React.Component<IPopoverProps, any> {
+class Popover extends React.Component<PopoverProps, any> {
   constructor(props) {
     super(props);
     this.toggleTooltip = this.toggleTooltip.bind(this);

public/app/core/components/Tooltip/Tooltip.tsx

@@ -2,11 +2,11 @@
 import withTooltip from './withTooltip';
 import { Target } from 'react-popper';
 
-interface ITooltipProps {
+interface TooltipProps {
   tooltipSetState: (prevState: object) => void;
 }
 
-class Tooltip extends React.Component<ITooltipProps, any> {
+class Tooltip extends React.Component<TooltipProps, any> {
   constructor(props) {
     super(props);
     this.showTooltip = this.showTooltip.bind(this);

public/app/core/components/code_editor/code_editor.ts

@@ -53,23 +53,23 @@ const DEFAULT_TAB_SIZE = 2;
 const DEFAULT_BEHAVIOURS = true;
 const DEFAULT_SNIPPETS = true;
 
-let editorTemplate = `<div></div>`;
+const editorTemplate = `<div></div>`;
 
 function link(scope, elem, attrs) {
   // Options
-  let langMode = attrs.mode || DEFAULT_MODE;
-  let maxLines = attrs.maxLines || DEFAULT_MAX_LINES;
-  let showGutter = attrs.showGutter !== undefined;
-  let tabSize = attrs.tabSize || DEFAULT_TAB_SIZE;
-  let behavioursEnabled = attrs.behavioursEnabled ? attrs.behavioursEnabled === 'true' : DEFAULT_BEHAVIOURS;
-  let snippetsEnabled = attrs.snippetsEnabled ? attrs.snippetsEnabled === 'true' : DEFAULT_SNIPPETS;
+  const langMode = attrs.mode || DEFAULT_MODE;
+  const maxLines = attrs.maxLines || DEFAULT_MAX_LINES;
+  const showGutter = attrs.showGutter !== undefined;
+  const tabSize = attrs.tabSize || DEFAULT_TAB_SIZE;
+  const behavioursEnabled = attrs.behavioursEnabled ? attrs.behavioursEnabled === 'true' : DEFAULT_BEHAVIOURS;
+  const snippetsEnabled = attrs.snippetsEnabled ? attrs.snippetsEnabled === 'true' : DEFAULT_SNIPPETS;
 
   // Initialize editor
-  let aceElem = elem.get(0);
-  let codeEditor = ace.edit(aceElem);
-  let editorSession = codeEditor.getSession();
+  const aceElem = elem.get(0);
+  const codeEditor = ace.edit(aceElem);
+  const editorSession = codeEditor.getSession();
 
-  let editorOptions = {
+  const editorOptions = {
     maxLines: maxLines,
     showGutter: showGutter,
     tabSize: tabSize,
@@ -93,7 +93,7 @@ function link(scope, elem, attrs) {
 
   // Add classes
   elem.addClass('gf-code-editor');
-  let textarea = elem.find('textarea');
+  const textarea = elem.find('textarea');
   textarea.addClass('gf-form-input');
 
   if (scope.codeEditorFocus) {
@@ -110,14 +110,14 @@ function link(scope, elem, attrs) {
   // Event handlers
   editorSession.on('change', e => {
     scope.$apply(() => {
-      let newValue = codeEditor.getValue();
+      const newValue = codeEditor.getValue();
       scope.content = newValue;
     });
   });
 
   // Sync with outer scope - update editor content if model has been changed from outside of directive.
   scope.$watch('content', (newValue, oldValue) => {
-    let editorValue = codeEditor.getValue();
+    const editorValue = codeEditor.getValue();
     if (newValue !== editorValue && newValue !== oldValue) {
       scope.$$postDigest(function() {
         setEditorContent(newValue);
@@ -157,7 +157,7 @@ function link(scope, elem, attrs) {
       anyEditor.completers.push(scope.getCompleter());
     }
 
-    let aceModeName = `ace/mode/${lang}`;
+    const aceModeName = `ace/mode/${lang}`;
     editorSession.setMode(aceModeName);
   }
 

public/app/core/components/colorpicker/ColorPalette.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { sortedColors } from 'app/core/utils/colors';
 
-export interface IProps {
+export interface Props {
   color: string;
   onColorSelect: (c: string) => void;
 }
 
-export class ColorPalette extends React.Component<IProps, any> {
+export class ColorPalette extends React.Component<Props, any> {
   paletteColors: string[];
 
   constructor(props) {
@@ -29,7 +29,8 @@ export class ColorPalette extends React.Component<IProps, any> {
           key={paletteColor}
           className={'pointer fa ' + cssClass}
           style={{ color: paletteColor }}
-          onClick={this.onColorSelect(paletteColor)}>
+          onClick={this.onColorSelect(paletteColor)}
+        >
           &nbsp;
         </i>
       );
@@ -41,4 +42,3 @@ export class ColorPalette extends React.Component<IProps, any> {
     );
   }
 }
-

public/app/core/components/colorpicker/ColorPicker.tsx

@@ -5,12 +5,12 @@ import Drop from 'tether-drop';
 import { ColorPickerPopover } from './ColorPickerPopover';
 import { react2AngularDirective } from 'app/core/utils/react2angular';
 
-export interface IProps {
+export interface Props {
   color: string;
   onChange: (c: string) => void;
 }
 
-export class ColorPicker extends React.Component<IProps, any> {
+export class ColorPicker extends React.Component<Props, any> {
   pickerElem: any;
   colorPickerDrop: any;
 
@@ -29,10 +29,10 @@ export class ColorPicker extends React.Component<IProps, any> {
   openColorPicker() {
     const dropContent = <ColorPickerPopover color={this.props.color} onColorSelect={this.onColorSelect} />;
 
-    let dropContentElem = document.createElement('div');
+    const dropContentElem = document.createElement('div');
     ReactDOM.render(dropContent, dropContentElem);
 
-    let drop = new Drop({
+    const drop = new Drop({
       target: this.pickerElem[0],
       content: dropContentElem,
       position: 'top center',

public/app/core/components/colorpicker/ColorPickerPopover.tsx

@@ -6,12 +6,12 @@ import { SpectrumPicker } from './SpectrumPicker';
 
 const DEFAULT_COLOR = '#000000';
 
-export interface IProps {
+export interface Props {
   color: string;
   onColorSelect: (c: string) => void;
 }
 
-export class ColorPickerPopover extends React.Component<IProps, any> {
+export class ColorPickerPopover extends React.Component<Props, any> {
   pickerNavElem: any;
 
   constructor(props) {
@@ -19,7 +19,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
     this.state = {
       tab: 'palette',
       color: this.props.color || DEFAULT_COLOR,
-      colorString: this.props.color || DEFAULT_COLOR
+      colorString: this.props.color || DEFAULT_COLOR,
     };
   }
 
@@ -28,11 +28,11 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
   }
 
   setColor(color) {
-    let newColor = tinycolor(color);
+    const newColor = tinycolor(color);
     if (newColor.isValid()) {
       this.setState({
         color: newColor.toString(),
-        colorString: newColor.toString()
+        colorString: newColor.toString(),
       });
       this.props.onColorSelect(color);
     }
@@ -43,20 +43,20 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
   }
 
   spectrumColorSelected(color) {
-    let rgbColor = color.toRgbString();
+    const rgbColor = color.toRgbString();
     this.setColor(rgbColor);
   }
 
   onColorStringChange(e) {
-    let colorString = e.target.value;
+    const colorString = e.target.value;
     this.setState({
-      colorString: colorString
+      colorString: colorString,
     });
 
-    let newColor = tinycolor(colorString);
+    const newColor = tinycolor(colorString);
     if (newColor.isValid()) {
       // Update only color state
-      let newColorString = newColor.toString();
+      const newColorString = newColor.toString();
       this.setState({
         color: newColorString,
       });
@@ -65,17 +65,17 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
   }
 
   onColorStringBlur(e) {
-    let colorString = e.target.value;
+    const colorString = e.target.value;
     this.setColor(colorString);
   }
 
   componentDidMount() {
     this.pickerNavElem.find('li:first').addClass('active');
-    this.pickerNavElem.on('show', (e) => {
+    this.pickerNavElem.on('show', e => {
       // use href attr (#name => name)
-      let tab = e.target.hash.slice(1);
+      const tab = e.target.hash.slice(1);
       this.setState({
-        tab: tab
+        tab: tab,
       });
     });
   }
@@ -97,19 +97,24 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
       <div className="gf-color-picker">
         <ul className="nav nav-tabs" id="colorpickernav" ref={this.setPickerNavElem.bind(this)}>
           <li className="gf-tabs-item-colorpicker">
-            <a href="#palette" data-toggle="tab">Colors</a>
+            <a href="#palette" data-toggle="tab">
+              Colors
+            </a>
           </li>
           <li className="gf-tabs-item-colorpicker">
-            <a href="#spectrum" data-toggle="tab">Custom</a>
+            <a href="#spectrum" data-toggle="tab">
+              Custom
+            </a>
           </li>
         </ul>
-        <div className="gf-color-picker__body">
-          {currentTab}
-        </div>
+        <div className="gf-color-picker__body">{currentTab}</div>
         <div>
-          <input className="gf-form-input gf-form-input--small" value={this.state.colorString}
-            onChange={this.onColorStringChange.bind(this)} onBlur={this.onColorStringBlur.bind(this)}>
-          </input>
+          <input
+            className="gf-form-input gf-form-input--small"
+            value={this.state.colorString}
+            onChange={this.onColorStringChange.bind(this)}
+            onBlur={this.onColorStringBlur.bind(this)}
+          />
         </div>
       </div>
     );

public/app/core/components/colorpicker/SeriesColorPicker.tsx

@@ -2,13 +2,13 @@ import React from 'react';
 import { ColorPickerPopover } from './ColorPickerPopover';
 import { react2AngularDirective } from 'app/core/utils/react2angular';
 
-export interface IProps {
+export interface Props {
   series: any;
   onColorChange: (color: string) => void;
   onToggleAxis: () => void;
 }
 
-export class SeriesColorPicker extends React.Component<IProps, any> {
+export class SeriesColorPicker extends React.Component<Props, any> {
   constructor(props) {
     super(props);
     this.onColorChange = this.onColorChange.bind(this);

public/app/core/components/colorpicker/SpectrumPicker.tsx

@@ -3,13 +3,13 @@ import _ from 'lodash';
 import $ from 'jquery';
 import 'vendor/spectrum';
 
-export interface IProps {
+export interface Props {
   color: string;
   options: object;
   onColorSelect: (c: string) => void;
 }
 
-export class SpectrumPicker extends React.Component<IProps, any> {
+export class SpectrumPicker extends React.Component<Props, any> {
   elem: any;
   isMoving: boolean;
 
@@ -29,14 +29,17 @@ export class SpectrumPicker extends React.Component<IProps, any> {
   }
 
   componentDidMount() {
-    let spectrumOptions = _.assignIn({
-      flat: true,
-      showAlpha: true,
-      showButtons: false,
-      color: this.props.color,
-      appendTo: this.elem,
-      move: this.onSpectrumMove,
-    }, this.props.options);
+    const spectrumOptions = _.assignIn(
+      {
+        flat: true,
+        showAlpha: true,
+        showButtons: false,
+        color: this.props.color,
+        appendTo: this.elem,
+        move: this.onSpectrumMove,
+      },
+      this.props.options
+    );
 
     this.elem.spectrum(spectrumOptions);
     this.elem.spectrum('show');
@@ -64,9 +67,6 @@ export class SpectrumPicker extends React.Component<IProps, any> {
   }
 
   render() {
-    return (
-      <div className="spectrum-container" ref={this.setComponentElem}></div>
-    );
+    return <div className="spectrum-container" ref={this.setComponentElem} />;
   }
 }
-

public/app/core/components/form_dropdown/form_dropdown.ts

@@ -67,7 +67,7 @@ export class FormDropdownCtrl {
 
     // modify typeahead lookup
     // this = typeahead
-    var typeahead = this.inputElement.data('typeahead');
+    const typeahead = this.inputElement.data('typeahead');
     typeahead.lookup = function() {
       this.query = this.$element.val() || '';
       this.source(this.query, this.process.bind(this));
@@ -100,7 +100,7 @@ export class FormDropdownCtrl {
   }
 
   getOptionsInternal(query) {
-    var result = this.getOptions({ $query: query });
+    const result = this.getOptions({ $query: query });
     if (this.isPromiseLike(result)) {
       return result;
     }
@@ -118,7 +118,7 @@ export class FormDropdownCtrl {
       // if we have text use it
       if (this.lookupText) {
         this.getOptionsInternal('').then(options => {
-          var item = _.find(options, { value: this.model });
+          const item = _.find(options, { value: this.model });
           this.updateDisplay(item ? item.text : this.model);
         });
       } else {
@@ -132,7 +132,7 @@ export class FormDropdownCtrl {
       this.optionCache = options;
 
       // extract texts
-      let optionTexts = _.map(options, op => {
+      const optionTexts = _.map(options, op => {
         return _.escape(op.text);
       });
 
@@ -186,7 +186,7 @@ export class FormDropdownCtrl {
     }
 
     this.$scope.$apply(() => {
-      var option = _.find(this.optionCache, { text: text });
+      const option = _.find(this.optionCache, { text: text });
 
       if (option) {
         if (_.isObject(this.model)) {
@@ -228,7 +228,7 @@ export class FormDropdownCtrl {
     this.linkElement.hide();
     this.linkMode = false;
 
-    var typeahead = this.inputElement.data('typeahead');
+    const typeahead = this.inputElement.data('typeahead');
     if (typeahead) {
       this.inputElement.val('');
       typeahead.lookup();

public/app/core/components/grafana_app.ts

@@ -140,7 +140,7 @@ export function grafanaAppDirective(playlistSrv, contextSrv, $timeout, $rootScop
         }
 
         // close all drops
-        for (let drop of Drop.drops) {
+        for (const drop of Drop.drops) {
           drop.destroy();
         }
       });

public/app/core/components/info_popover.ts

@@ -8,10 +8,10 @@ export function infoPopover() {
     template: '<i class="fa fa-info-circle"></i>',
     transclude: true,
     link: function(scope, elem, attrs, ctrl, transclude) {
-      let offset = attrs.offset || '0 -10px';
-      let position = attrs.position || 'right middle';
+      const offset = attrs.offset || '0 -10px';
+      const position = attrs.position || 'right middle';
       let classes = 'drop-help drop-hide-out-of-bounds';
-      let openOn = 'hover';
+      const openOn = 'hover';
 
       elem.addClass('gf-form-help-icon');
 
@@ -24,14 +24,14 @@ export function infoPopover() {
       }
 
       transclude(function(clone, newScope) {
-        let content = document.createElement('div');
+        const content = document.createElement('div');
         content.className = 'markdown-html';
 
         _.each(clone, node => {
           content.appendChild(node);
         });
 
-        let dropOptions = {
+        const dropOptions = {
           target: elem[0],
           content: content,
           position: position,
@@ -52,9 +52,9 @@ export function infoPopover() {
 
         // Create drop in next digest after directive content is rendered.
         scope.$applyAsync(() => {
-          let drop = new Drop(dropOptions);
+          const drop = new Drop(dropOptions);
 
-          let unbind = scope.$on('$destroy', function() {
+          const unbind = scope.$on('$destroy', function() {
             drop.destroy();
             unbind();
           });

public/app/core/components/manage_dashboards/manage_dashboards.ts

@@ -103,10 +103,10 @@ export class ManageDashboardsCtrl {
 
     this.sections = result;
 
-    for (let section of this.sections) {
+    for (const section of this.sections) {
       section.checked = false;
 
-      for (let dashboard of section.items) {
+      for (const dashboard of section.items) {
         dashboard.checked = false;
       }
     }
@@ -119,7 +119,7 @@ export class ManageDashboardsCtrl {
   selectionChanged() {
     let selectedDashboards = 0;
 
-    for (let section of this.sections) {
+    for (const section of this.sections) {
       selectedDashboards += _.filter(section.items, { checked: true }).length;
     }
 
@@ -129,7 +129,7 @@ export class ManageDashboardsCtrl {
   }
 
   getFoldersAndDashboardsToDelete() {
-    let selectedDashboards = {
+    const selectedDashboards = {
       folders: [],
       dashboards: [],
     };
@@ -148,7 +148,7 @@ export class ManageDashboardsCtrl {
 
   getFolderIds(sections) {
     const ids = [];
-    for (let s of sections) {
+    for (const s of sections) {
       if (s.checked) {
         ids.push(s.id);
       }
@@ -191,7 +191,7 @@ export class ManageDashboardsCtrl {
   }
 
   getDashboardsToMove() {
-    let selectedDashboards = [];
+    const selectedDashboards = [];
 
     for (const section of this.sections) {
       const selected = _.filter(section.items, { checked: true });
@@ -238,7 +238,7 @@ export class ManageDashboardsCtrl {
   }
 
   onTagFilterChange() {
-    var res = this.filterByTag(this.selectedTagFilter.term);
+    const res = this.filterByTag(this.selectedTagFilter.term);
     this.selectedTagFilter = this.tagFilterOptions[0];
     return res;
   }
@@ -264,7 +264,7 @@ export class ManageDashboardsCtrl {
   }
 
   onSelectAllChanged() {
-    for (let section of this.sections) {
+    for (const section of this.sections) {
       if (!section.hideHeader) {
         section.checked = this.selectAllChecked;
       }

public/app/core/components/scroll/scroll.ts

@@ -17,7 +17,7 @@ export function geminiScrollbar() {
     restrict: 'A',
     link: function(scope, elem, attrs) {
       let scrollRoot = elem.parent();
-      let scroller = elem;
+      const scroller = elem;
 
       if (attrs.grafanaScrollbar && attrs.grafanaScrollbar === 'scrollonroot') {
         scrollRoot = scroller;
@@ -27,7 +27,7 @@ export function geminiScrollbar() {
       $(scrollBarHTML).appendTo(scrollRoot);
       elem.addClass(scrollerClass);
 
-      let scrollParams = {
+      const scrollParams = {
         root: scrollRoot[0],
         scroller: scroller[0],
         bar: '.baron__bar',
@@ -37,7 +37,7 @@ export function geminiScrollbar() {
         direction: 'v',
       };
 
-      let scrollbar = baron(scrollParams);
+      const scrollbar = baron(scrollParams);
 
       let lastPos = 0;
 

public/app/core/components/search/SearchResult.tsx

@@ -54,7 +54,7 @@ export class SearchResultSection extends React.Component<SectionProps, any> {
   };
 
   render() {
-    let collapseClassNames = classNames({
+    const collapseClassNames = classNames({
       fa: true,
       'fa-plus': !this.props.section.expanded,
       'fa-minus': this.props.section.expanded,

public/app/core/components/sidemenu/sidemenu.ts

@@ -17,13 +17,13 @@ export class SideMenuCtrl {
     this.isSignedIn = contextSrv.isSignedIn;
     this.user = contextSrv.user;
 
-    let navTree = _.cloneDeep(config.bootData.navTree);
+    const navTree = _.cloneDeep(config.bootData.navTree);
     this.mainLinks = _.filter(navTree, item => !item.hideFromMenu);
     this.bottomNav = _.filter(navTree, item => item.hideFromMenu);
     this.loginUrl = 'login?redirect=' + encodeURIComponent(this.$location.path());
 
     if (contextSrv.user.orgCount > 1) {
-      let profileNode = _.find(this.bottomNav, { id: 'profile' });
+      const profileNode = _.find(this.bottomNav, { id: 'profile' });
       if (profileNode) {
         profileNode.showOrgSwitcher = true;
       }

public/app/core/config.ts

@@ -31,7 +31,7 @@ export class Settings {
   loginError: any;
 
   constructor(options) {
-    var defaults = {
+    const defaults = {
       datasources: {},
       window_title_prefix: 'Grafana - ',
       panels: {},
@@ -51,8 +51,8 @@ export class Settings {
   }
 }
 
-var bootData = (<any>window).grafanaBootData || { settings: {} };
-var options = bootData.settings;
+const bootData = (<any>window).grafanaBootData || { settings: {} };
+const options = bootData.settings;
 options.bootData = bootData;
 
 const config = new Settings(options);

public/app/core/controllers/inspect_ctrl.ts

@@ -6,7 +6,7 @@ import coreModule from '../core_module';
 export class InspectCtrl {
   /** @ngInject */
   constructor($scope, $sanitize) {
-    var model = $scope.inspector;
+    const model = $scope.inspector;
 
     $scope.init = function() {
       $scope.editor = { index: 0 };
@@ -53,10 +53,10 @@ export class InspectCtrl {
     };
   }
   getParametersFromQueryString(queryString) {
-    var result = [];
-    var parameters = queryString.split('&');
-    for (var i = 0; i < parameters.length; i++) {
-      var keyValue = parameters[i].split('=');
+    const result = [];
+    const parameters = queryString.split('&');
+    for (let i = 0; i < parameters.length; i++) {
+      const keyValue = parameters[i].split('=');
       if (keyValue[1].length > 0) {
         result.push({
           key: keyValue[0],

public/app/core/controllers/json_editor_ctrl.ts

@@ -9,7 +9,7 @@ export class JsonEditorCtrl {
     $scope.canCopy = $scope.enableCopy;
 
     $scope.update = function() {
-      var newObject = angular.fromJson($scope.json);
+      const newObject = angular.fromJson($scope.json);
       $scope.updateHandler(newObject, $scope.object);
     };
 

public/app/core/controllers/login_ctrl.ts

@@ -45,8 +45,8 @@ export class LoginCtrl {
     };
 
     $scope.changeView = function() {
-      let loginView = document.querySelector('#login-view');
-      let changePasswordView = document.querySelector('#change-password-view');
+      const loginView = document.querySelector('#login-view');
+      const changePasswordView = document.querySelector('#change-password-view');
 
       loginView.className += ' add';
       setTimeout(() => {
@@ -118,7 +118,7 @@ export class LoginCtrl {
     };
 
     $scope.toGrafana = function() {
-      var params = $location.search();
+      const params = $location.search();
 
       if (params.redirect && params.redirect[0] === '/') {
         window.location.href = config.appSubUrl + params.redirect;

public/app/core/controllers/reset_password_ctrl.ts

@@ -7,7 +7,7 @@ export class ResetPasswordCtrl {
     $scope.formModel = {};
     $scope.mode = 'send';
 
-    var params = $location.search();
+    const params = $location.search();
     if (params.code) {
       $scope.mode = 'reset';
       $scope.formModel.code = params.code;

public/app/core/controllers/signup_ctrl.ts

@@ -9,7 +9,7 @@ export class SignUpCtrl {
 
     $scope.formModel = {};
 
-    var params = $location.search();
+    const params = $location.search();
 
     // validate email is semi ok
     if (params.email && !params.email.match(/^\S+@\S+$/)) {

public/app/core/directives/dropdown_typeahead.ts

@@ -4,12 +4,12 @@ import coreModule from '../core_module';
 
 /** @ngInject */
 export function dropdownTypeahead($compile) {
-  let inputTemplate =
+  const inputTemplate =
     '<input type="text"' +
     ' class="gf-form-input input-medium tight-form-input"' +
     ' spellcheck="false" style="display:none"></input>';
 
-  let buttonTemplate =
+  const buttonTemplate =
     '<a class="gf-form-label tight-form-func dropdown-toggle"' +
     ' tabindex="1" gf-dropdown="menuItems" data-toggle="dropdown"' +
     ' data-placement="top"><i class="fa fa-plus"></i></a>';
@@ -21,8 +21,8 @@ export function dropdownTypeahead($compile) {
       model: '=ngModel',
     },
     link: function($scope, elem, attrs) {
-      let $input = $(inputTemplate);
-      let $button = $(buttonTemplate);
+      const $input = $(inputTemplate);
+      const $button = $(buttonTemplate);
       $input.appendTo(elem);
       $button.appendTo(elem);
 
@@ -42,7 +42,7 @@ export function dropdownTypeahead($compile) {
         });
       }
 
-      let typeaheadValues = _.reduce(
+      const typeaheadValues = _.reduce(
         $scope.menuItems,
         function(memo, value, index) {
           if (!value.submenu) {
@@ -60,8 +60,8 @@ export function dropdownTypeahead($compile) {
       );
 
       $scope.menuItemSelected = function(index, subIndex) {
-        let menuItem = $scope.menuItems[index];
-        let payload: any = { $item: menuItem };
+        const menuItem = $scope.menuItems[index];
+        const payload: any = { $item: menuItem };
         if (menuItem.submenu && subIndex !== void 0) {
           payload.$subItem = menuItem.submenu[subIndex];
         }
@@ -74,7 +74,7 @@ export function dropdownTypeahead($compile) {
         minLength: 1,
         items: 10,
         updater: function(value) {
-          let result: any = {};
+          const result: any = {};
           _.each($scope.menuItems, function(menuItem) {
             _.each(menuItem.submenu, function(submenuItem) {
               if (value === menuItem.text + ' ' + submenuItem.text) {
@@ -124,10 +124,10 @@ export function dropdownTypeahead($compile) {
 
 /** @ngInject */
 export function dropdownTypeahead2($compile) {
-  let inputTemplate =
+  const inputTemplate =
     '<input type="text"' + ' class="gf-form-input"' + ' spellcheck="false" style="display:none"></input>';
 
-  let buttonTemplate =
+  const buttonTemplate =
     '<a class="gf-form-input dropdown-toggle"' +
     ' tabindex="1" gf-dropdown="menuItems" data-toggle="dropdown"' +
     ' data-placement="top"><i class="fa fa-plus"></i></a>';
@@ -139,8 +139,8 @@ export function dropdownTypeahead2($compile) {
       model: '=ngModel',
     },
     link: function($scope, elem, attrs) {
-      let $input = $(inputTemplate);
-      let $button = $(buttonTemplate);
+      const $input = $(inputTemplate);
+      const $button = $(buttonTemplate);
       $input.appendTo(elem);
       $button.appendTo(elem);
 
@@ -160,7 +160,7 @@ export function dropdownTypeahead2($compile) {
         });
       }
 
-      let typeaheadValues = _.reduce(
+      const typeaheadValues = _.reduce(
         $scope.menuItems,
         function(memo, value, index) {
           if (!value.submenu) {
@@ -178,8 +178,8 @@ export function dropdownTypeahead2($compile) {
       );
 
       $scope.menuItemSelected = function(index, subIndex) {
-        let menuItem = $scope.menuItems[index];
-        let payload: any = { $item: menuItem };
+        const menuItem = $scope.menuItems[index];
+        const payload: any = { $item: menuItem };
         if (menuItem.submenu && subIndex !== void 0) {
           payload.$subItem = menuItem.submenu[subIndex];
         }
@@ -192,7 +192,7 @@ export function dropdownTypeahead2($compile) {
         minLength: 1,
         items: 10,
         updater: function(value) {
-          let result: any = {};
+          const result: any = {};
           _.each($scope.menuItems, function(menuItem) {
             _.each(menuItem.submenu, function(submenuItem) {
               if (value === menuItem.text + ' ' + submenuItem.text) {

public/app/core/directives/metric_segment.ts

@@ -4,16 +4,16 @@ import coreModule from '../core_module';
 
 /** @ngInject */
 export function metricSegment($compile, $sce) {
-  let inputTemplate =
+  const inputTemplate =
     '<input type="text" data-provide="typeahead" ' +
     ' class="gf-form-input input-medium"' +
     ' spellcheck="false" style="display:none"></input>';
 
-  let linkTemplate =
+  const linkTemplate =
     '<a class="gf-form-label" ng-class="segment.cssClass" ' +
     'tabindex="1" give-focus="segment.focus" ng-bind-html="segment.html"></a>';
 
-  let selectTemplate =
+  const selectTemplate =
     '<a class="gf-form-input gf-form-input--dropdown" ng-class="segment.cssClass" ' +
     'tabindex="1" give-focus="segment.focus" ng-bind-html="segment.html"></a>';
 
@@ -25,13 +25,13 @@ export function metricSegment($compile, $sce) {
       debounce: '@',
     },
     link: function($scope, elem) {
-      let $input = $(inputTemplate);
-      let segment = $scope.segment;
-      let $button = $(segment.selectMode ? selectTemplate : linkTemplate);
+      const $input = $(inputTemplate);
+      const segment = $scope.segment;
+      const $button = $(segment.selectMode ? selectTemplate : linkTemplate);
       let options = null;
       let cancelBlur = null;
       let linkMode = true;
-      let debounceLookup = $scope.debounce;
+      const debounceLookup = $scope.debounce;
 
       $input.appendTo(elem);
       $button.appendTo(elem);
@@ -44,7 +44,7 @@ export function metricSegment($compile, $sce) {
         value = _.unescape(value);
 
         $scope.$apply(function() {
-          let selected = _.find($scope.altSegments, { value: value });
+          const selected = _.find($scope.altSegments, { value: value });
           if (selected) {
             segment.value = selected.value;
             segment.html = selected.html || selected.value;
@@ -141,10 +141,10 @@ export function metricSegment($compile, $sce) {
         matcher: $scope.matcher,
       });
 
-      let typeahead = $input.data('typeahead');
+      const typeahead = $input.data('typeahead');
       typeahead.lookup = function() {
         this.query = this.$element.val() || '';
-        let items = this.source(this.query, $.proxy(this.process, this));
+        const items = this.source(this.query, $.proxy(this.process, this));
         return items ? this.process(items) : items;
       };
 
@@ -169,7 +169,7 @@ export function metricSegment($compile, $sce) {
 
         linkMode = false;
 
-        let typeahead = $input.data('typeahead');
+        const typeahead = $input.data('typeahead');
         if (typeahead) {
           $input.val('');
           typeahead.lookup();
@@ -200,8 +200,8 @@ export function metricSegmentModel(uiSegmentSrv, $q) {
         let cachedOptions;
 
         $scope.valueToSegment = function(value) {
-          let option = _.find($scope.options, { value: value });
-          let segment = {
+          const option = _.find($scope.options, { value: value });
+          const segment = {
             cssClass: attrs.cssClass,
             custom: attrs.custom,
             value: option ? option.text : value,
@@ -234,7 +234,7 @@ export function metricSegmentModel(uiSegmentSrv, $q) {
 
         $scope.onSegmentChange = function() {
           if (cachedOptions) {
-            let option = _.find(cachedOptions, { text: $scope.segment.value });
+            const option = _.find(cachedOptions, { text: $scope.segment.value });
             if (option && option.value !== $scope.property) {
               $scope.property = option.value;
             } else if (attrs.custom !== 'false') {

public/app/core/directives/misc.ts

@@ -156,7 +156,7 @@ function gfDropdown($parse, $compile, $timeout) {
     var ul = ['<ul class="dropdown-menu ' + upclass + '" role="menu" aria-labelledby="drop1">', '</ul>'];
 
     for (let index = 0; index < items.length; index++) {
-      let item = items[index];
+      const item = items[index];
 
       if (item.divider) {
         ul.splice(index + 1, 0, '<li class="divider"></li>');

public/app/core/directives/value_select_dropdown.ts

@@ -46,16 +46,16 @@ export class ValueSelectDropdownCtrl {
   }
 
   updateLinkText() {
-    let current = this.variable.current;
+    const current = this.variable.current;
 
     if (current.tags && current.tags.length) {
       // filer out values that are in selected tags
-      let selectedAndNotInTag = _.filter(this.variable.options, option => {
+      const selectedAndNotInTag = _.filter(this.variable.options, option => {
         if (!option.selected) {
           return false;
         }
         for (let i = 0; i < current.tags.length; i++) {
-          let tag = current.tags[i];
+          const tag = current.tags[i];
           if (_.indexOf(tag.values, option.value) !== -1) {
             return false;
           }
@@ -64,7 +64,7 @@ export class ValueSelectDropdownCtrl {
       });
 
       // convert values to text
-      let currentTexts = _.map(selectedAndNotInTag, 'text');
+      const currentTexts = _.map(selectedAndNotInTag, 'text');
 
       // join texts
       this.linkText = currentTexts.join(' + ');
@@ -142,7 +142,7 @@ export class ValueSelectDropdownCtrl {
     commitChange = commitChange || false;
     excludeOthers = excludeOthers || false;
 
-    let setAllExceptCurrentTo = newValue => {
+    const setAllExceptCurrentTo = newValue => {
       _.each(this.options, other => {
         if (option !== other) {
           other.selected = newValue;
@@ -246,9 +246,9 @@ export function valueSelectDropdown($compile, $window, $timeout, $rootScope) {
     controllerAs: 'vm',
     bindToController: true,
     link: function(scope, elem) {
-      let bodyEl = angular.element($window.document.body);
-      let linkEl = elem.find('.variable-value-link');
-      let inputEl = elem.find('input');
+      const bodyEl = angular.element($window.document.body);
+      const linkEl = elem.find('.variable-value-link');
+      const inputEl = elem.find('input');
 
       function openDropdown() {
         inputEl.css('width', Math.max(linkEl.width(), 80) + 'px');
@@ -288,7 +288,7 @@ export function valueSelectDropdown($compile, $window, $timeout, $rootScope) {
         }
       });
 
-      let cleanUp = $rootScope.$on('template-variable-value-updated', () => {
+      const cleanUp = $rootScope.$on('template-variable-value-updated', () => {
         scope.vm.updateLinkText();
       });
 

public/app/core/filters/filters.ts

@@ -38,7 +38,7 @@ coreModule.filter('moment', function() {
 });
 
 coreModule.filter('noXml', function() {
-  var noXml = function(text) {
+  const noXml = function(text) {
     return _.isString(text)
       ? text
           .replace(/&/g, '&')
@@ -55,7 +55,7 @@ coreModule.filter('noXml', function() {
 
 /** @ngInject */
 function interpolateTemplateVars(templateSrv) {
-  var filterFunc: any = function(text, scope) {
+  const filterFunc: any = function(text, scope) {
     var scopedVars;
     if (scope.ctrl) {
       scopedVars = (scope.ctrl.panel || scope.ctrl.row).scopedVars;

public/app/core/nav_model_srv.ts

@@ -41,14 +41,14 @@ export class NavModelSrv {
     var children = this.navItems;
     var nav = new NavModel();
 
-    for (let id of args) {
+    for (const id of args) {
       // if its a number then it's the index to use for main
       if (_.isNumber(id)) {
         nav.main = nav.breadcrumbs[id];
         break;
       }
 
-      let node = _.find(children, { id: id });
+      const node = _.find(children, { id: id });
       nav.breadcrumbs.push(node);
       nav.node = node;
       nav.main = node;
@@ -56,7 +56,7 @@ export class NavModelSrv {
     }
 
     if (nav.main.children) {
-      for (let item of nav.main.children) {
+      for (const item of nav.main.children) {
         item.active = false;
 
         if (item.url === nav.node.url) {

public/app/core/services/alert_srv.ts

@@ -60,14 +60,14 @@ export class AlertSrv {
       }
     }
 
-    var newAlert = {
+    const newAlert = {
       title: title || '',
       text: text || '',
       severity: severity || 'info',
       icon: this.getIconForSeverity(severity),
     };
 
-    var newAlertJson = angular.toJson(newAlert);
+    const newAlertJson = angular.toJson(newAlert);
 
     // remove same alert if it already exists
     _.remove(this.list, function(value) {

public/app/core/services/analytics.ts

@@ -12,7 +12,7 @@ export class Analytics {
       dataType: 'script',
       cache: true,
     });
-    var ga = ((<any>window).ga =
+    const ga = ((<any>window).ga =
       (<any>window).ga ||
       function() {
         (ga.q = ga.q || []).push(arguments);
@@ -25,8 +25,8 @@ export class Analytics {
 
   init() {
     this.$rootScope.$on('$viewContentLoaded', () => {
-      var track = { page: this.$location.url() };
-      var ga = (<any>window).ga || this.gaInit();
+      const track = { page: this.$location.url() };
+      const ga = (<any>window).ga || this.gaInit();
       ga('set', track);
       ga('send', 'pageview');
     });

public/app/core/services/backend_srv.ts

@@ -276,11 +276,11 @@ export class BackendSrv {
   deleteFoldersAndDashboards(folderUids, dashboardUids) {
     const tasks = [];
 
-    for (let folderUid of folderUids) {
+    for (const folderUid of folderUids) {
       tasks.push(this.createTask(this.deleteFolder.bind(this), true, folderUid, true));
     }
 
-    for (let dashboardUid of dashboardUids) {
+    for (const dashboardUid of dashboardUids) {
       tasks.push(this.createTask(this.deleteDashboard.bind(this), true, dashboardUid, true));
     }
 
@@ -290,7 +290,7 @@ export class BackendSrv {
   moveDashboards(dashboardUids, toFolder) {
     const tasks = [];
 
-    for (let uid of dashboardUids) {
+    for (const uid of dashboardUids) {
       tasks.push(this.createTask(this.moveDashboard.bind(this), true, uid, toFolder));
     }
 
@@ -304,7 +304,7 @@ export class BackendSrv {
   }
 
   private moveDashboard(uid, toFolder) {
-    let deferred = this.$q.defer();
+    const deferred = this.$q.defer();
 
     this.getDashboardByUid(uid).then(fullDash => {
       const model = new DashboardModel(fullDash.dashboard, fullDash.meta);
@@ -315,7 +315,7 @@ export class BackendSrv {
       }
 
       const clone = model.getSaveModelClone();
-      let options = {
+      const options = {
         folderId: toFolder.id,
         overwrite: false,
       };

public/app/core/services/bridge_srv.ts

@@ -15,7 +15,7 @@ export class BridgeSrv {
 
   init() {
     this.$rootScope.$on('$routeUpdate', (evt, data) => {
-      let angularUrl = this.$location.url();
+      const angularUrl = this.$location.url();
       if (store.view.currentUrl !== angularUrl) {
         store.view.updatePathAndQuery(this.$location.path(), this.$location.search(), this.$route.current.params);
       }
@@ -28,7 +28,7 @@ export class BridgeSrv {
     reaction(
       () => store.view.currentUrl,
       currentUrl => {
-        let angularUrl = this.$location.url();
+        const angularUrl = this.$location.url();
         const url = locationUtil.stripBaseFromUrl(currentUrl);
         if (angularUrl !== url) {
           this.$timeout(() => {

public/app/core/services/dynamic_directive_srv.ts

@@ -6,7 +6,7 @@ class DynamicDirectiveSrv {
   constructor(private $compile, private $rootScope) {}
 
   addDirective(element, name, scope) {
-    var child = angular.element(document.createElement(name));
+    const child = angular.element(document.createElement(name));
     this.$compile(child)(scope);
 
     element.empty();
@@ -36,7 +36,7 @@ class DynamicDirectiveSrv {
   }
 
   create(options) {
-    let directiveDef = {
+    const directiveDef = {
       restrict: 'E',
       scope: options.scope,
       link: (scope, elem, attrs) => {

public/app/core/services/keybindingSrv.ts

@@ -70,7 +70,7 @@ export class KeybindingSrv {
   }
 
   exit() {
-    var popups = $('.popover.in');
+    const popups = $('.popover.in');
     if (popups.length > 0) {
       return;
     }
@@ -89,7 +89,7 @@ export class KeybindingSrv {
     }
 
     // close settings view
-    var search = this.$location.search();
+    const search = this.$location.search();
     if (search.editview) {
       delete search.editview;
       this.$location.search(search);
@@ -123,7 +123,7 @@ export class KeybindingSrv {
   }
 
   showDashEditView() {
-    var search = _.extend(this.$location.search(), { editview: 'settings' });
+    const search = _.extend(this.$location.search(), { editview: 'settings' });
     this.$location.search(search);
   }
 
@@ -210,7 +210,7 @@ export class KeybindingSrv {
     // duplicate panel
     this.bind('p d', () => {
       if (dashboard.meta.focusPanelId && dashboard.meta.canEdit) {
-        let panelIndex = dashboard.getPanelInfoById(dashboard.meta.focusPanelId).index;
+        const panelIndex = dashboard.getPanelInfoById(dashboard.meta.focusPanelId).index;
         dashboard.duplicatePanel(dashboard.panels[panelIndex]);
       }
     });
@@ -218,8 +218,8 @@ export class KeybindingSrv {
     // share panel
     this.bind('p s', () => {
       if (dashboard.meta.focusPanelId) {
-        var shareScope = scope.$new();
-        var panelInfo = dashboard.getPanelInfoById(dashboard.meta.focusPanelId);
+        const shareScope = scope.$new();
+        const panelInfo = dashboard.getPanelInfoById(dashboard.meta.focusPanelId);
         shareScope.panel = panelInfo.panel;
         shareScope.dashboard = dashboard;
 

public/app/core/services/ng_react.ts

@@ -295,6 +295,6 @@ var reactDirective = function($injector) {
   };
 };
 
-let ngModule = angular.module('react', []);
+const ngModule = angular.module('react', []);
 ngModule.directive('reactComponent', ['$injector', reactComponent]);
 ngModule.factory('reactDirective', ['$injector', reactDirective]);

public/app/core/services/popover_srv.ts

@@ -18,10 +18,10 @@ function popoverSrv($compile, $rootScope, $timeout) {
       openDrop = null;
     }
 
-    var scope = _.extend($rootScope.$new(true), options.model);
-    var drop;
+    const scope = _.extend($rootScope.$new(true), options.model);
+    let drop;
 
-    var cleanUp = () => {
+    const cleanUp = () => {
       setTimeout(() => {
         scope.$destroy();
 
@@ -41,7 +41,7 @@ function popoverSrv($compile, $rootScope, $timeout) {
       drop.close();
     };
 
-    var contentElement = document.createElement('div');
+    const contentElement = document.createElement('div');
     contentElement.innerHTML = options.template;
 
     $compile(contentElement)(scope);

public/app/core/services/search_srv.ts

@@ -85,10 +85,10 @@ export class SearchSrv {
   }
 
   search(options) {
-    let sections: any = {};
-    let promises = [];
-    let query = _.clone(options);
-    let hasFilters =
+    const sections: any = {};
+    const promises = [];
+    const query = _.clone(options);
+    const hasFilters =
       options.query ||
       (options.tag && options.tag.length > 0) ||
       options.starred ||
@@ -124,7 +124,7 @@ export class SearchSrv {
     }
 
     // create folder index
-    for (let hit of results) {
+    for (const hit of results) {
       if (hit.type === 'dash-folder') {
         sections[hit.id] = {
           id: hit.id,
@@ -140,7 +140,7 @@ export class SearchSrv {
       }
     }
 
-    for (let hit of results) {
+    for (const hit of results) {
       if (hit.type === 'dash-folder') {
         continue;
       }
@@ -185,7 +185,7 @@ export class SearchSrv {
       return Promise.resolve(section);
     }
 
-    let query = {
+    const query = {
       folderIds: [section.id],
     };
 

public/app/core/services/segment_srv.ts

@@ -3,7 +3,7 @@ import coreModule from '../core_module';
 
 /** @ngInject */
 export function uiSegmentSrv($sce, templateSrv) {
-  let self = this;
+  const self = this;
 
   function MetricSegment(options) {
     if (options === '*' || options.value === '*') {
@@ -78,7 +78,7 @@ export function uiSegmentSrv($sce, templateSrv) {
 
   this.transformToSegments = function(addTemplateVars, variableTypeFilter) {
     return function(results) {
-      let segments = _.map(results, function(segment) {
+      const segments = _.map(results, function(segment) {
         return self.newSegment({ value: segment.text, expandable: segment.expandable });
       });
 

public/app/core/services/util_srv.ts

@@ -33,7 +33,7 @@ export class UtilSrv {
       this.modalScope = this.$rootScope.$new();
     }
 
-    var modal = this.$modal({
+    const modal = this.$modal({
       modalClass: options.modalClass,
       template: options.src,
       templateHtml: options.templateHtml,
@@ -50,7 +50,7 @@ export class UtilSrv {
   }
 
   showConfirmModal(payload) {
-    var scope = this.$rootScope.$new();
+    const scope = this.$rootScope.$new();
 
     scope.onConfirm = function() {
       payload.onConfirm();

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

@@ -2,14 +2,14 @@ import { BackendSrv } from 'app/core/services/backend_srv';
 jest.mock('app/core/store');
 
 describe('backend_srv', function() {
-  let _httpBackend = options => {
+  const _httpBackend = options => {
     if (options.url === 'gateway-error') {
       return Promise.reject({ status: 502 });
     }
     return Promise.resolve({});
   };
 
-  let _backendSrv = new BackendSrv(_httpBackend, {}, {}, {}, {});
+  const _backendSrv = new BackendSrv(_httpBackend, {}, {}, {}, {});
 
   describe('when handling errors', () => {
     it('should return the http status code', async () => {

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

@@ -5,11 +5,11 @@ import moment from 'moment';
 import _ from 'lodash';
 
 describe('DateMath', () => {
-  var spans = ['s', 'm', 'h', 'd', 'w', 'M', 'y'];
-  var anchor = '2014-01-01T06:06:06.666Z';
-  var unix = moment(anchor).valueOf();
-  var format = 'YYYY-MM-DDTHH:mm:ss.SSSZ';
-  var clock;
+  const spans = ['s', 'm', 'h', 'd', 'w', 'M', 'y'];
+  const anchor = '2014-01-01T06:06:06.666Z';
+  const unix = moment(anchor).valueOf();
+  const format = 'YYYY-MM-DDTHH:mm:ss.SSSZ';
+  let clock;
 
   describe('errors', () => {
     it('should return undefined if passed something falsy', () => {
@@ -36,21 +36,21 @@ describe('DateMath', () => {
   });
 
   it('now/d should set to start of current day', () => {
-    var expected = new Date();
+    const expected = new Date();
     expected.setHours(0);
     expected.setMinutes(0);
     expected.setSeconds(0);
     expected.setMilliseconds(0);
 
-    var startOfDay = dateMath.parse('now/d', false).valueOf();
+    const startOfDay = dateMath.parse('now/d', false).valueOf();
     expect(startOfDay).toBe(expected.getTime());
   });
 
   it('now/d on a utc dashboard should be start of the current day in UTC time', () => {
-    var today = new Date();
-    var expected = new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth(), today.getUTCDate(), 0, 0, 0, 0));
+    const today = new Date();
+    const expected = new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth(), today.getUTCDate(), 0, 0, 0, 0));
 
-    var startOfDay = dateMath.parse('now/d', false, 'utc').valueOf();
+    const startOfDay = dateMath.parse('now/d', false, 'utc').valueOf();
     expect(startOfDay).toBe(expected.getTime());
   });
 
@@ -65,8 +65,8 @@ describe('DateMath', () => {
     });
 
     _.each(spans, span => {
-      var nowEx = 'now-5' + span;
-      var thenEx = anchor + '||-5' + span;
+      const nowEx = 'now-5' + span;
+      const thenEx = anchor + '||-5' + span;
 
       it('should return 5' + span + ' ago', () => {
         expect(dateMath.parse(nowEx).format(format)).toEqual(now.subtract(5, span).format(format));
@@ -116,17 +116,17 @@ describe('DateMath', () => {
 
   describe('relative time to date parsing', function() {
     it('should handle negative time', function() {
-      var date = dateMath.parseDateMath('-2d', moment([2014, 1, 5]));
+      const date = dateMath.parseDateMath('-2d', moment([2014, 1, 5]));
       expect(date.valueOf()).toEqual(moment([2014, 1, 3]).valueOf());
     });
 
     it('should handle multiple math expressions', function() {
-      var date = dateMath.parseDateMath('-2d-6h', moment([2014, 1, 5]));
+      const date = dateMath.parseDateMath('-2d-6h', moment([2014, 1, 5]));
       expect(date.valueOf()).toEqual(moment([2014, 1, 2, 18]).valueOf());
     });
 
     it('should return false when invalid expression', function() {
-      var date = dateMath.parseDateMath('2', moment([2014, 1, 5]));
+      const date = dateMath.parseDateMath('2', moment([2014, 1, 5]));
       expect(date).toEqual(undefined);
     });
   });

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

@@ -3,9 +3,9 @@ import { Emitter } from '../utils/emitter';
 describe('Emitter', () => {
   describe('given 2 subscribers', () => {
     it('should notfiy subscribers', () => {
-      var events = new Emitter();
-      var sub1Called = false;
-      var sub2Called = false;
+      const events = new Emitter();
+      let sub1Called = false;
+      let sub2Called = false;
 
       events.on('test', () => {
         sub1Called = true;
@@ -21,8 +21,8 @@ describe('Emitter', () => {
     });
 
     it('when subscribing twice', () => {
-      var events = new Emitter();
-      var sub1Called = 0;
+      const events = new Emitter();
+      let sub1Called = 0;
 
       function handler() {
         sub1Called += 1;
@@ -37,9 +37,9 @@ describe('Emitter', () => {
     });
 
     it('should handle errors', () => {
-      var events = new Emitter();
-      var sub1Called = 0;
-      var sub2Called = 0;
+      const events = new Emitter();
+      let sub1Called = 0;
+      let sub2Called = 0;
 
       events.on('test', () => {
         sub1Called++;

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

@@ -2,7 +2,7 @@ import * as fileExport from '../utils/file_export';
 import { beforeEach, expect } from 'test/lib/common';
 
 describe('file_export', () => {
-  let ctx: any = {};
+  const ctx: any = {};
 
   beforeEach(() => {
     ctx.seriesList = [
@@ -28,7 +28,7 @@ describe('file_export', () => {
 
   describe('when exporting series as rows', () => {
     it('should export points in proper order', () => {
-      let text = fileExport.convertSeriesListToCsv(ctx.seriesList, ctx.timeFormat);
+      const text = fileExport.convertSeriesListToCsv(ctx.seriesList, ctx.timeFormat);
       const expectedText =
         '"Series";"Time";"Value"\r\n' +
         '"series_1";"1500026100";1\r\n' +
@@ -48,7 +48,7 @@ describe('file_export', () => {
 
   describe('when exporting series as columns', () => {
     it('should export points in proper order', () => {
-      let text = fileExport.convertSeriesListToCsvColumns(ctx.seriesList, ctx.timeFormat);
+      const text = fileExport.convertSeriesListToCsvColumns(ctx.seriesList, ctx.timeFormat);
       const expectedText =
         '"Time";"series_1";"series_2"\r\n' +
         '"1500026100";1;11\r\n' +

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

@@ -2,7 +2,7 @@ import flatten from 'app/core/utils/flatten';
 
 describe('flatten', () => {
   it('should return flatten object', () => {
-    var flattened = flatten(
+    const flattened = flatten(
       {
         level1: 'level1-value',
         deeper: {

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

@@ -3,7 +3,7 @@ import * as dateMath from '../utils/datemath';
 import moment from 'moment';
 
 describe('unit format menu', function() {
-  var menu = kbn.getUnitFormats();
+  const menu = kbn.getUnitFormats();
   menu.map(function(submenu) {
     describe('submenu ' + submenu.text, function() {
       it('should have a title', function() {
@@ -34,8 +34,8 @@ describe('unit format menu', function() {
 function describeValueFormat(desc, value, tickSize, tickDecimals, result) {
   describe('value format: ' + desc, function() {
     it('should translate ' + value + ' as ' + result, function() {
-      var scaledDecimals = tickDecimals - Math.floor(Math.log(tickSize) / Math.LN10);
-      var str = kbn.valueFormats[desc](value, tickDecimals, scaledDecimals);
+      const scaledDecimals = tickDecimals - Math.floor(Math.log(tickSize) / Math.LN10);
+      const str = kbn.valueFormats[desc](value, tickDecimals, scaledDecimals);
       expect(str).toBe(result);
     });
   });
@@ -106,177 +106,177 @@ describe('date time formats', function() {
   const browserTime = moment(epoch);
 
   it('should format as iso date', function() {
-    var expected = browserTime.format('YYYY-MM-DD HH:mm:ss');
-    var actual = kbn.valueFormats.dateTimeAsIso(epoch);
+    const expected = browserTime.format('YYYY-MM-DD HH:mm:ss');
+    const actual = kbn.valueFormats.dateTimeAsIso(epoch);
     expect(actual).toBe(expected);
   });
 
   it('should format as iso date (in UTC)', function() {
-    var expected = utcTime.format('YYYY-MM-DD HH:mm:ss');
-    var actual = kbn.valueFormats.dateTimeAsIso(epoch, true);
+    const expected = utcTime.format('YYYY-MM-DD HH:mm:ss');
+    const actual = kbn.valueFormats.dateTimeAsIso(epoch, true);
     expect(actual).toBe(expected);
   });
 
   it('should format as iso date and skip date when today', function() {
-    var now = moment();
-    var expected = now.format('HH:mm:ss');
-    var actual = kbn.valueFormats.dateTimeAsIso(now.valueOf(), false);
+    const now = moment();
+    const expected = now.format('HH:mm:ss');
+    const actual = kbn.valueFormats.dateTimeAsIso(now.valueOf(), false);
     expect(actual).toBe(expected);
   });
 
   it('should format as iso date (in UTC) and skip date when today', function() {
-    var now = moment.utc();
-    var expected = now.format('HH:mm:ss');
-    var actual = kbn.valueFormats.dateTimeAsIso(now.valueOf(), true);
+    const now = moment.utc();
+    const expected = now.format('HH:mm:ss');
+    const actual = kbn.valueFormats.dateTimeAsIso(now.valueOf(), true);
     expect(actual).toBe(expected);
   });
 
   it('should format as US date', function() {
-    var expected = browserTime.format('MM/DD/YYYY h:mm:ss a');
-    var actual = kbn.valueFormats.dateTimeAsUS(epoch, false);
+    const expected = browserTime.format('MM/DD/YYYY h:mm:ss a');
+    const actual = kbn.valueFormats.dateTimeAsUS(epoch, false);
     expect(actual).toBe(expected);
   });
 
   it('should format as US date (in UTC)', function() {
-    var expected = utcTime.format('MM/DD/YYYY h:mm:ss a');
-    var actual = kbn.valueFormats.dateTimeAsUS(epoch, true);
+    const expected = utcTime.format('MM/DD/YYYY h:mm:ss a');
+    const actual = kbn.valueFormats.dateTimeAsUS(epoch, true);
     expect(actual).toBe(expected);
   });
 
   it('should format as US date and skip date when today', function() {
-    var now = moment();
-    var expected = now.format('h:mm:ss a');
-    var actual = kbn.valueFormats.dateTimeAsUS(now.valueOf(), false);
+    const now = moment();
+    const expected = now.format('h:mm:ss a');
+    const actual = kbn.valueFormats.dateTimeAsUS(now.valueOf(), false);
     expect(actual).toBe(expected);
   });
 
   it('should format as US date (in UTC) and skip date when today', function() {
-    var now = moment.utc();
-    var expected = now.format('h:mm:ss a');
-    var actual = kbn.valueFormats.dateTimeAsUS(now.valueOf(), true);
+    const now = moment.utc();
+    const expected = now.format('h:mm:ss a');
+    const actual = kbn.valueFormats.dateTimeAsUS(now.valueOf(), true);
     expect(actual).toBe(expected);
   });
 
   it('should format as from now with days', function() {
-    var daysAgo = moment().add(-7, 'd');
-    var expected = '7 days ago';
-    var actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), false);
+    const daysAgo = moment().add(-7, 'd');
+    const expected = '7 days ago';
+    const actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), false);
     expect(actual).toBe(expected);
   });
 
   it('should format as from now with days (in UTC)', function() {
-    var daysAgo = moment.utc().add(-7, 'd');
-    var expected = '7 days ago';
-    var actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), true);
+    const daysAgo = moment.utc().add(-7, 'd');
+    const expected = '7 days ago';
+    const actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), true);
     expect(actual).toBe(expected);
   });
 
   it('should format as from now with minutes', function() {
-    var daysAgo = moment().add(-2, 'm');
-    var expected = '2 minutes ago';
-    var actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), false);
+    const daysAgo = moment().add(-2, 'm');
+    const expected = '2 minutes ago';
+    const actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), false);
     expect(actual).toBe(expected);
   });
 
   it('should format as from now with minutes (in UTC)', function() {
-    var daysAgo = moment.utc().add(-2, 'm');
-    var expected = '2 minutes ago';
-    var actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), true);
+    const daysAgo = moment.utc().add(-2, 'm');
+    const expected = '2 minutes ago';
+    const actual = kbn.valueFormats.dateTimeFromNow(daysAgo.valueOf(), true);
     expect(actual).toBe(expected);
   });
 });
 
 describe('kbn.toFixed and negative decimals', function() {
   it('should treat as zero decimals', function() {
-    var str = kbn.toFixed(186.123, -2);
+    const str = kbn.toFixed(186.123, -2);
     expect(str).toBe('186');
   });
 });
 
 describe('kbn ms format when scaled decimals is null do not use it', function() {
   it('should use specified decimals', function() {
-    var str = kbn.valueFormats['ms'](10000086.123, 1, null);
+    const str = kbn.valueFormats['ms'](10000086.123, 1, null);
     expect(str).toBe('2.8 hour');
   });
 });
 
 describe('kbn kbytes format when scaled decimals is null do not use it', function() {
   it('should use specified decimals', function() {
-    var str = kbn.valueFormats['kbytes'](10000000, 3, null);
+    const str = kbn.valueFormats['kbytes'](10000000, 3, null);
     expect(str).toBe('9.537 GiB');
   });
 });
 
 describe('kbn deckbytes format when scaled decimals is null do not use it', function() {
   it('should use specified decimals', function() {
-    var str = kbn.valueFormats['deckbytes'](10000000, 3, null);
+    const str = kbn.valueFormats['deckbytes'](10000000, 3, null);
     expect(str).toBe('10.000 GB');
   });
 });
 
 describe('kbn roundValue', function() {
   it('should should handle null value', function() {
-    var str = kbn.roundValue(null, 2);
+    const str = kbn.roundValue(null, 2);
     expect(str).toBe(null);
   });
   it('should round value', function() {
-    var str = kbn.roundValue(200.877, 2);
+    const str = kbn.roundValue(200.877, 2);
     expect(str).toBe(200.88);
   });
 });
 
 describe('calculateInterval', function() {
   it('1h 100 resultion', function() {
-    var range = { from: dateMath.parse('now-1h'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 100, null);
+    const range = { from: dateMath.parse('now-1h'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 100, null);
     expect(res.interval).toBe('30s');
   });
 
   it('10m 1600 resolution', function() {
-    var range = { from: dateMath.parse('now-10m'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 1600, null);
+    const range = { from: dateMath.parse('now-10m'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 1600, null);
     expect(res.interval).toBe('500ms');
     expect(res.intervalMs).toBe(500);
   });
 
   it('fixed user min interval', function() {
-    var range = { from: dateMath.parse('now-10m'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 1600, '10s');
+    const range = { from: dateMath.parse('now-10m'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 1600, '10s');
     expect(res.interval).toBe('10s');
     expect(res.intervalMs).toBe(10000);
   });
 
   it('short time range and user low limit', function() {
-    var range = { from: dateMath.parse('now-10m'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 1600, '>10s');
+    const range = { from: dateMath.parse('now-10m'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 1600, '>10s');
     expect(res.interval).toBe('10s');
   });
 
   it('large time range and user low limit', function() {
-    var range = { from: dateMath.parse('now-14d'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 1000, '>10s');
+    const range = { from: dateMath.parse('now-14d'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 1000, '>10s');
     expect(res.interval).toBe('20m');
   });
 
   it('10s 900 resolution and user low limit in ms', function() {
-    var range = { from: dateMath.parse('now-10s'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 900, '>15ms');
+    const range = { from: dateMath.parse('now-10s'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 900, '>15ms');
     expect(res.interval).toBe('15ms');
   });
 
   it('1d 1 resolution', function() {
-    var range = { from: dateMath.parse('now-1d'), to: dateMath.parse('now') };
-    var res = kbn.calculateInterval(range, 1, null);
+    const range = { from: dateMath.parse('now-1d'), to: dateMath.parse('now') };
+    const res = kbn.calculateInterval(range, 1, null);
     expect(res.interval).toBe('1d');
     expect(res.intervalMs).toBe(86400000);
   });
 
   it('86399s 1 resolution', function() {
-    var range = {
+    const range = {
       from: dateMath.parse('now-86390s'),
       to: dateMath.parse('now'),
     };
-    var res = kbn.calculateInterval(range, 1, null);
+    const res = kbn.calculateInterval(range, 1, null);
     expect(res.interval).toBe('12h');
     expect(res.intervalMs).toBe(43200000);
   });
@@ -284,139 +284,139 @@ describe('calculateInterval', function() {
 
 describe('hex', function() {
   it('positive integer', function() {
-    var str = kbn.valueFormats.hex(100, 0);
+    const str = kbn.valueFormats.hex(100, 0);
     expect(str).toBe('64');
   });
   it('negative integer', function() {
-    var str = kbn.valueFormats.hex(-100, 0);
+    const str = kbn.valueFormats.hex(-100, 0);
     expect(str).toBe('-64');
   });
   it('null', function() {
-    var str = kbn.valueFormats.hex(null, 0);
+    const str = kbn.valueFormats.hex(null, 0);
     expect(str).toBe('');
   });
   it('positive float', function() {
-    var str = kbn.valueFormats.hex(50.52, 1);
+    const str = kbn.valueFormats.hex(50.52, 1);
     expect(str).toBe('32.8');
   });
   it('negative float', function() {
-    var str = kbn.valueFormats.hex(-50.333, 2);
+    const str = kbn.valueFormats.hex(-50.333, 2);
     expect(str).toBe('-32.547AE147AE14');
   });
 });
 
 describe('hex 0x', function() {
   it('positive integeter', function() {
-    var str = kbn.valueFormats.hex0x(7999, 0);
+    const str = kbn.valueFormats.hex0x(7999, 0);
     expect(str).toBe('0x1F3F');
   });
   it('negative integer', function() {
-    var str = kbn.valueFormats.hex0x(-584, 0);
+    const str = kbn.valueFormats.hex0x(-584, 0);
     expect(str).toBe('-0x248');
   });
   it('null', function() {
-    var str = kbn.valueFormats.hex0x(null, 0);
+    const str = kbn.valueFormats.hex0x(null, 0);
     expect(str).toBe('');
   });
   it('positive float', function() {
-    var str = kbn.valueFormats.hex0x(74.443, 3);
+    const str = kbn.valueFormats.hex0x(74.443, 3);
     expect(str).toBe('0x4A.716872B020C4');
   });
   it('negative float', function() {
-    var str = kbn.valueFormats.hex0x(-65.458, 1);
+    const str = kbn.valueFormats.hex0x(-65.458, 1);
     expect(str).toBe('-0x41.8');
   });
 });
 
 describe('duration', function() {
   it('null', function() {
-    var str = kbn.toDuration(null, 0, 'millisecond');
+    const str = kbn.toDuration(null, 0, 'millisecond');
     expect(str).toBe('');
   });
   it('0 milliseconds', function() {
-    var str = kbn.toDuration(0, 0, 'millisecond');
+    const str = kbn.toDuration(0, 0, 'millisecond');
     expect(str).toBe('0 milliseconds');
   });
   it('1 millisecond', function() {
-    var str = kbn.toDuration(1, 0, 'millisecond');
+    const str = kbn.toDuration(1, 0, 'millisecond');
     expect(str).toBe('1 millisecond');
   });
   it('-1 millisecond', function() {
-    var str = kbn.toDuration(-1, 0, 'millisecond');
+    const str = kbn.toDuration(-1, 0, 'millisecond');
     expect(str).toBe('1 millisecond ago');
   });
   it('seconds', function() {
-    var str = kbn.toDuration(1, 0, 'second');
+    const str = kbn.toDuration(1, 0, 'second');
     expect(str).toBe('1 second');
   });
   it('minutes', function() {
-    var str = kbn.toDuration(1, 0, 'minute');
+    const str = kbn.toDuration(1, 0, 'minute');
     expect(str).toBe('1 minute');
   });
   it('hours', function() {
-    var str = kbn.toDuration(1, 0, 'hour');
+    const str = kbn.toDuration(1, 0, 'hour');
     expect(str).toBe('1 hour');
   });
   it('days', function() {
-    var str = kbn.toDuration(1, 0, 'day');
+    const str = kbn.toDuration(1, 0, 'day');
     expect(str).toBe('1 day');
   });
   it('weeks', function() {
-    var str = kbn.toDuration(1, 0, 'week');
+    const str = kbn.toDuration(1, 0, 'week');
     expect(str).toBe('1 week');
   });
   it('months', function() {
-    var str = kbn.toDuration(1, 0, 'month');
+    const str = kbn.toDuration(1, 0, 'month');
     expect(str).toBe('1 month');
   });
   it('years', function() {
-    var str = kbn.toDuration(1, 0, 'year');
+    const str = kbn.toDuration(1, 0, 'year');
     expect(str).toBe('1 year');
   });
   it('decimal days', function() {
-    var str = kbn.toDuration(1.5, 2, 'day');
+    const str = kbn.toDuration(1.5, 2, 'day');
     expect(str).toBe('1 day, 12 hours, 0 minutes');
   });
   it('decimal months', function() {
-    var str = kbn.toDuration(1.5, 3, 'month');
+    const str = kbn.toDuration(1.5, 3, 'month');
     expect(str).toBe('1 month, 2 weeks, 1 day, 0 hours');
   });
   it('no decimals', function() {
-    var str = kbn.toDuration(38898367008, 0, 'millisecond');
+    const str = kbn.toDuration(38898367008, 0, 'millisecond');
     expect(str).toBe('1 year');
   });
   it('1 decimal', function() {
-    var str = kbn.toDuration(38898367008, 1, 'millisecond');
+    const str = kbn.toDuration(38898367008, 1, 'millisecond');
     expect(str).toBe('1 year, 2 months');
   });
   it('too many decimals', function() {
-    var str = kbn.toDuration(38898367008, 20, 'millisecond');
+    const str = kbn.toDuration(38898367008, 20, 'millisecond');
     expect(str).toBe('1 year, 2 months, 3 weeks, 4 days, 5 hours, 6 minutes, 7 seconds, 8 milliseconds');
   });
   it('floating point error', function() {
-    var str = kbn.toDuration(36993906007, 8, 'millisecond');
+    const str = kbn.toDuration(36993906007, 8, 'millisecond');
     expect(str).toBe('1 year, 2 months, 0 weeks, 3 days, 4 hours, 5 minutes, 6 seconds, 7 milliseconds');
   });
 });
 
 describe('volume', function() {
   it('1000m3', function() {
-    var str = kbn.valueFormats['m3'](1000, 1, null);
+    const str = kbn.valueFormats['m3'](1000, 1, null);
     expect(str).toBe('1000.0 m³');
   });
 });
 
 describe('hh:mm:ss', function() {
   it('00:04:06', function() {
-    var str = kbn.valueFormats['dthms'](246, 1);
+    const str = kbn.valueFormats['dthms'](246, 1);
     expect(str).toBe('00:04:06');
   });
   it('24:00:00', function() {
-    var str = kbn.valueFormats['dthms'](86400, 1);
+    const str = kbn.valueFormats['dthms'](86400, 1);
     expect(str).toBe('24:00:00');
   });
   it('6824413:53:20', function() {
-    var str = kbn.valueFormats['dthms'](24567890000, 1);
+    const str = kbn.valueFormats['dthms'](24567890000, 1);
     expect(str).toBe('6824413:53:20');
   });
 });

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

@@ -5,7 +5,7 @@ import moment from 'moment';
 describe('rangeUtil', () => {
   describe('Can get range grouped list of ranges', () => {
     it('when custom settings should return default range list', () => {
-      var groups = rangeUtil.getRelativeTimesList({ time_options: [] }, 'Last 5 minutes');
+      const groups = rangeUtil.getRelativeTimesList({ time_options: [] }, 'Last 5 minutes');
       expect(_.keys(groups).length).toBe(4);
       expect(groups[3][0].active).toBe(true);
     });
@@ -13,62 +13,62 @@ describe('rangeUtil', () => {
 
   describe('Can get range text described', () => {
     it('should handle simple old expression with only amount and unit', () => {
-      var info = rangeUtil.describeTextRange('5m');
+      const info = rangeUtil.describeTextRange('5m');
       expect(info.display).toBe('Last 5 minutes');
     });
 
     it('should have singular when amount is 1', () => {
-      var info = rangeUtil.describeTextRange('1h');
+      const info = rangeUtil.describeTextRange('1h');
       expect(info.display).toBe('Last 1 hour');
     });
 
     it('should handle non default amount', () => {
-      var info = rangeUtil.describeTextRange('13h');
+      const info = rangeUtil.describeTextRange('13h');
       expect(info.display).toBe('Last 13 hours');
       expect(info.from).toBe('now-13h');
     });
 
     it('should handle non default future amount', () => {
-      var info = rangeUtil.describeTextRange('+3h');
+      const info = rangeUtil.describeTextRange('+3h');
       expect(info.display).toBe('Next 3 hours');
       expect(info.from).toBe('now');
       expect(info.to).toBe('now+3h');
     });
 
     it('should handle now/d', () => {
-      var info = rangeUtil.describeTextRange('now/d');
+      const info = rangeUtil.describeTextRange('now/d');
       expect(info.display).toBe('Today so far');
     });
 
     it('should handle now/w', () => {
-      var info = rangeUtil.describeTextRange('now/w');
+      const info = rangeUtil.describeTextRange('now/w');
       expect(info.display).toBe('This week so far');
     });
 
     it('should handle now/M', () => {
-      var info = rangeUtil.describeTextRange('now/M');
+      const info = rangeUtil.describeTextRange('now/M');
       expect(info.display).toBe('This month so far');
     });
 
     it('should handle now/y', () => {
-      var info = rangeUtil.describeTextRange('now/y');
+      const info = rangeUtil.describeTextRange('now/y');
       expect(info.display).toBe('This year so far');
     });
   });
 
   describe('Can get date range described', () => {
     it('Date range with simple ranges', () => {
-      var text = rangeUtil.describeTimeRange({ from: 'now-1h', to: 'now' });
+      const text = rangeUtil.describeTimeRange({ from: 'now-1h', to: 'now' });
       expect(text).toBe('Last 1 hour');
     });
 
     it('Date range with rounding ranges', () => {
-      var text = rangeUtil.describeTimeRange({ from: 'now/d+6h', to: 'now' });
+      const text = rangeUtil.describeTimeRange({ from: 'now/d+6h', to: 'now' });
       expect(text).toBe('now/d+6h to now');
     });
 
     it('Date range with absolute to now', () => {
-      var text = rangeUtil.describeTimeRange({
+      const text = rangeUtil.describeTimeRange({
         from: moment([2014, 10, 10, 2, 3, 4]),
         to: 'now',
       });
@@ -76,7 +76,7 @@ describe('rangeUtil', () => {
     });
 
     it('Date range with absolute to relative', () => {
-      var text = rangeUtil.describeTimeRange({
+      const text = rangeUtil.describeTimeRange({
         from: moment([2014, 10, 10, 2, 3, 4]),
         to: 'now-1d',
       });
@@ -84,7 +84,7 @@ describe('rangeUtil', () => {
     });
 
     it('Date range with relative to absolute', () => {
-      var text = rangeUtil.describeTimeRange({
+      const text = rangeUtil.describeTimeRange({
         from: 'now-7d',
         to: moment([2014, 10, 10, 2, 3, 4]),
       });
@@ -92,17 +92,17 @@ describe('rangeUtil', () => {
     });
 
     it('Date range with non matching default ranges', () => {
-      var text = rangeUtil.describeTimeRange({ from: 'now-13h', to: 'now' });
+      const text = rangeUtil.describeTimeRange({ from: 'now-13h', to: 'now' });
       expect(text).toBe('Last 13 hours');
     });
 
     it('Date range with from and to both are in now-* format', () => {
-      var text = rangeUtil.describeTimeRange({ from: 'now-6h', to: 'now-3h' });
+      const text = rangeUtil.describeTimeRange({ from: 'now-6h', to: 'now-3h' });
       expect(text).toBe('now-6h to now-3h');
     });
 
     it('Date range with from and to both are either in now-* or now/* format', () => {
-      var text = rangeUtil.describeTimeRange({
+      const text = rangeUtil.describeTimeRange({
         from: 'now/d+6h',
         to: 'now-3h',
       });
@@ -110,7 +110,7 @@ describe('rangeUtil', () => {
     });
 
     it('Date range with from and to both are either in now-* or now+* format', () => {
-      var text = rangeUtil.describeTimeRange({ from: 'now-6h', to: 'now+1h' });
+      const text = rangeUtil.describeTimeRange({ from: 'now-6h', to: 'now+1h' });
       expect(text).toBe('now-6h to now+1h');
     });
   });

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

@@ -12,7 +12,7 @@ describe('SearchCtrl', () => {
     search: (options: any) => {},
     getDashboardTags: () => {},
   };
-  let ctrl = new SearchCtrl({ $on: () => {} }, {}, {}, <SearchSrv>searchSrvStub);
+  const ctrl = new SearchCtrl({ $on: () => {} }, {}, {}, <SearchSrv>searchSrvStub);
 
   describe('Given an empty result', () => {
     beforeEach(() => {

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

@@ -12,7 +12,7 @@ describe('SearchResultsCtrl', () => {
   let ctrl;
 
   describe('when checking an item that is not checked', () => {
-    let item = { checked: false };
+    const item = { checked: false };
     let selectionChanged = false;
 
     beforeEach(() => {
@@ -31,7 +31,7 @@ describe('SearchResultsCtrl', () => {
   });
 
   describe('when checking an item that is checked', () => {
-    let item = { checked: true };
+    const item = { checked: true };
     let selectionChanged = false;
 
     beforeEach(() => {
@@ -72,7 +72,7 @@ describe('SearchResultsCtrl', () => {
         folderExpanded = true;
       };
 
-      let folder = {
+      const folder = {
         expanded: false,
         toggle: () => Promise.resolve(folder),
       };
@@ -94,7 +94,7 @@ describe('SearchResultsCtrl', () => {
         folderExpanded = true;
       };
 
-      let folder = {
+      const folder = {
         expanded: true,
         toggle: () => Promise.resolve(folder),
       };

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

@@ -1,8 +1,8 @@
 import TableModel from 'app/core/table_model';
 
 describe('when sorting table desc', () => {
-  var table;
-  var panel = {
+  let table;
+  const panel = {
     sort: { col: 0, desc: true },
   };
 
@@ -27,7 +27,7 @@ describe('when sorting table desc', () => {
 
 describe('when sorting table asc', () => {
   var table;
-  var panel = {
+  const panel = {
     sort: { col: 1, desc: false },
   };
 

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

@@ -2,7 +2,7 @@ import * as ticks from '../utils/ticks';
 
 describe('ticks', () => {
   describe('getFlotTickDecimals()', () => {
-    let ctx: any = {};
+    const ctx: any = {};
 
     beforeEach(() => {
       ctx.axis = {};

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

@@ -2,9 +2,9 @@ import TimeSeries from 'app/core/time_series2';
 import { updateLegendValues } from 'app/core/time_series2';
 
 describe('TimeSeries', function() {
-  var points, series;
-  var yAxisFormats = ['short', 'ms'];
-  var testData;
+  let points, series;
+  const yAxisFormats = ['short', 'ms'];
+  let testData;
 
   beforeEach(function() {
     testData = {
@@ -329,7 +329,7 @@ describe('TimeSeries', function() {
 
   describe('legend decimals', function() {
     let series, panel;
-    let height = 200;
+    const height = 200;
     beforeEach(function() {
       testData = {
         alias: 'test',
@@ -348,7 +348,7 @@ describe('TimeSeries', function() {
     });
 
     it('should set decimals based on Y axis (expect calculated decimals = 1)', function() {
-      let data = [series];
+      const data = [series];
       // Expect ticks with this data will have decimals = 1
       updateLegendValues(data, panel, height);
       expect(data[0].decimals).toBe(2);
@@ -358,21 +358,21 @@ describe('TimeSeries', function() {
       testData.datapoints = [[10, 2], [0, 3], [100, 4], [80, 5]];
       series = new TimeSeries(testData);
       series.getFlotPairs();
-      let data = [series];
+      const data = [series];
       updateLegendValues(data, panel, height);
       expect(data[0].decimals).toBe(0);
     });
 
     it('should set decimals to Y axis decimals + 1', function() {
       panel.yaxes[0].decimals = 2;
-      let data = [series];
+      const data = [series];
       updateLegendValues(data, panel, height);
       expect(data[0].decimals).toBe(3);
     });
 
     it('should set decimals to legend decimals value if it was set explicitly', function() {
       panel.decimals = 3;
-      let data = [series];
+      const data = [series];
       updateLegendValues(data, panel, height);
       expect(data[0].decimals).toBe(3);
     });

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

@@ -3,7 +3,7 @@ import { ValueSelectDropdownCtrl } from '../directives/value_select_dropdown';
 import q from 'q';
 
 describe('SelectDropdownCtrl', () => {
-  let tagValuesMap: any = {};
+  const tagValuesMap: any = {};
 
   ValueSelectDropdownCtrl.prototype.onUpdated = jest.fn();
   let ctrl;

public/app/core/time_series2.ts

@@ -27,11 +27,11 @@ function translateFillOption(fill) {
  */
 export function updateLegendValues(data: TimeSeries[], panel, height) {
   for (let i = 0; i < data.length; i++) {
-    let series = data[i];
+    const series = data[i];
     const yaxes = panel.yaxes;
     const seriesYAxis = series.yaxis || 1;
     const axis = yaxes[seriesYAxis - 1];
-    let formater = kbn.valueFormats[axis.format];
+    const formater = kbn.valueFormats[axis.format];
 
     // decimal override
     if (_.isNumber(panel.decimals)) {
@@ -54,7 +54,7 @@ export function getDataMinMax(data: TimeSeries[]) {
   let datamin = null;
   let datamax = null;
 
-  for (let series of data) {
+  for (const series of data) {
     if (datamax === null || datamax < series.stats.max) {
       datamax = series.stats.max;
     }
@@ -225,7 +225,7 @@ export default class TimeSeries {
       // Due to missing values we could have different timeStep all along the series
       // so we have to find the minimum one (could occur with aggregators such as ZimSum)
       if (previousTime !== undefined) {
-        let timeStep = currentTime - previousTime;
+        const timeStep = currentTime - previousTime;
         if (timeStep < this.stats.timeStep) {
           this.stats.timeStep = timeStep;
         }

public/app/core/utils/colors.ts

@@ -9,7 +9,7 @@ export const ALERTING_COLOR = 'rgba(237, 46, 24, 1)';
 export const NO_DATA_COLOR = 'rgba(150, 150, 150, 1)';
 export const REGION_FILL_ALPHA = 0.09;
 
-let colors = [
+const colors = [
   '#7EB26D',
   '#EAB839',
   '#6ED0E0',
@@ -69,7 +69,7 @@ let colors = [
 ];
 
 export function sortColorsByHue(hexColors) {
-  let hslColors = _.map(hexColors, hexToHsl);
+  const hslColors = _.map(hexColors, hexToHsl);
 
   let sortedHSLColors = _.sortBy(hslColors, ['h']);
   sortedHSLColors = _.chunk(sortedHSLColors, PALETTE_ROWS);

public/app/core/utils/css_loader.ts

@@ -1,18 +1,18 @@
-var waitSeconds = 100;
-var head = document.getElementsByTagName('head')[0];
+const waitSeconds = 100;
+const head = document.getElementsByTagName('head')[0];
 
 // get all link tags in the page
-var links = document.getElementsByTagName('link');
-var linkHrefs = [];
-for (var i = 0; i < links.length; i++) {
+const links = document.getElementsByTagName('link');
+const linkHrefs = [];
+for (let i = 0; i < links.length; i++) {
   linkHrefs.push(links[i].href);
 }
 
-var isWebkit = !!window.navigator.userAgent.match(/AppleWebKit\/([^ ;]*)/);
-var webkitLoadCheck = function(link, callback) {
+const isWebkit = !!window.navigator.userAgent.match(/AppleWebKit\/([^ ;]*)/);
+const webkitLoadCheck = function(link, callback) {
   setTimeout(function() {
     for (var i = 0; i < document.styleSheets.length; i++) {
-      var sheet = document.styleSheets[i];
+      const sheet = document.styleSheets[i];
       if (sheet.href === link.href) {
         return callback();
       }
@@ -21,16 +21,16 @@ var webkitLoadCheck = function(link, callback) {
   }, 10);
 };
 
-var noop = function() {};
+const noop = function() {};
 
-var loadCSS = function(url) {
+const loadCSS = function(url) {
   return new Promise(function(resolve, reject) {
-    var link = document.createElement('link');
-    var timeout = setTimeout(function() {
+    const link = document.createElement('link');
+    const timeout = setTimeout(function() {
       reject('Unable to load CSS');
     }, waitSeconds * 1000);
 
-    var _callback = function(error) {
+    const _callback = function(error) {
       clearTimeout(timeout);
       link.onload = link.onerror = noop;
       setTimeout(function() {

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

@@ -2,16 +2,16 @@ import { Graph } from './dag';
 
 describe('Directed acyclic graph', () => {
   describe('Given a graph with nodes with different links in between them', () => {
-    let dag = new Graph();
-    let nodeA = dag.createNode('A');
-    let nodeB = dag.createNode('B');
-    let nodeC = dag.createNode('C');
-    let nodeD = dag.createNode('D');
-    let nodeE = dag.createNode('E');
-    let nodeF = dag.createNode('F');
-    let nodeG = dag.createNode('G');
-    let nodeH = dag.createNode('H');
-    let nodeI = dag.createNode('I');
+    const dag = new Graph();
+    const nodeA = dag.createNode('A');
+    const nodeB = dag.createNode('B');
+    const nodeC = dag.createNode('C');
+    const nodeD = dag.createNode('D');
+    const nodeE = dag.createNode('E');
+    const nodeF = dag.createNode('F');
+    const nodeG = dag.createNode('G');
+    const nodeH = dag.createNode('H');
+    const nodeI = dag.createNode('I');
     dag.link([nodeB, nodeC, nodeD, nodeE, nodeF, nodeG, nodeH], nodeA);
     dag.link([nodeC, nodeD, nodeE, nodeF, nodeI], nodeB);
     dag.link([nodeD, nodeE, nodeF, nodeG], nodeC);

public/app/core/utils/dag.ts

@@ -26,8 +26,8 @@ export class Edge {
 
   unlink() {
     let pos;
-    let inode = this.inputNode;
-    let onode = this.outputNode;
+    const inode = this.inputNode;
+    const onode = this.outputNode;
 
     if (!(inode && onode)) {
       return;
@@ -96,12 +96,12 @@ export class Node {
   }
 
   getOptimizedInputEdges(): Edge[] {
-    let toBeRemoved = [];
+    const toBeRemoved = [];
     this.inputEdges.forEach(e => {
-      let inputEdgesNodes = e.inputNode.inputEdges.map(e => e.inputNode);
+      const inputEdgesNodes = e.inputNode.inputEdges.map(e => e.inputNode);
 
       inputEdgesNodes.forEach(n => {
-        let edgeToRemove = n.getEdgeTo(this.name);
+        const edgeToRemove = n.getEdgeTo(this.name);
         if (edgeToRemove) {
           toBeRemoved.push(edgeToRemove);
         }
@@ -124,7 +124,7 @@ export class Graph {
   }
 
   createNodes(names: string[]): Node[] {
-    let nodes = [];
+    const nodes = [];
     names.forEach(name => {
       nodes.push(this.createNode(name));
     });
@@ -134,8 +134,8 @@ export class Graph {
   link(input: string | string[] | Node | Node[], output: string | string[] | Node | Node[]): Edge[] {
     let inputArr = [];
     let outputArr = [];
-    let inputNodes = [];
-    let outputNodes = [];
+    const inputNodes = [];
+    const outputNodes = [];
 
     if (input instanceof Array) {
       inputArr = input;
@@ -167,7 +167,7 @@ export class Graph {
       }
     }
 
-    let edges = [];
+    const edges = [];
     inputNodes.forEach(input => {
       outputNodes.forEach(output => {
         edges.push(this.createEdge().link(input, output));

public/app/core/utils/file_export.ts

@@ -74,7 +74,7 @@ export function convertSeriesListToCsv(seriesList, dateTimeFormat = DEFAULT_DATE
 }
 
 export function exportSeriesListToCsv(seriesList, dateTimeFormat = DEFAULT_DATETIME_FORMAT, excel = false) {
-  let text = convertSeriesListToCsv(seriesList, dateTimeFormat, excel);
+  const text = convertSeriesListToCsv(seriesList, dateTimeFormat, excel);
   saveSaveBlob(text, EXPORT_FILENAME);
 }
 
@@ -115,7 +115,7 @@ export function convertSeriesListToCsvColumns(seriesList, dateTimeFormat = DEFAU
 function mergeSeriesByTime(seriesList) {
   let timestamps = [];
   for (let i = 0; i < seriesList.length; i++) {
-    let seriesPoints = seriesList[i].datapoints;
+    const seriesPoints = seriesList[i].datapoints;
     for (let j = 0; j < seriesPoints.length; j++) {
       timestamps.push(seriesPoints[j][POINT_TIME_INDEX]);
     }
@@ -123,9 +123,9 @@ function mergeSeriesByTime(seriesList) {
   timestamps = sortedUniq(timestamps.sort());
 
   for (let i = 0; i < seriesList.length; i++) {
-    let seriesPoints = seriesList[i].datapoints;
-    let seriesTimestamps = seriesPoints.map(p => p[POINT_TIME_INDEX]);
-    let extendedSeries = [];
+    const seriesPoints = seriesList[i].datapoints;
+    const seriesTimestamps = seriesPoints.map(p => p[POINT_TIME_INDEX]);
+    const extendedSeries = [];
     let pointIndex;
     for (let j = 0; j < timestamps.length; j++) {
       pointIndex = sortedIndexOf(seriesTimestamps, timestamps[j]);
@@ -141,7 +141,7 @@ function mergeSeriesByTime(seriesList) {
 }
 
 export function exportSeriesListToCsvColumns(seriesList, dateTimeFormat = DEFAULT_DATETIME_FORMAT, excel = false) {
-  let text = convertSeriesListToCsvColumns(seriesList, dateTimeFormat, excel);
+  const text = convertSeriesListToCsvColumns(seriesList, dateTimeFormat, excel);
   saveSaveBlob(text, EXPORT_FILENAME);
 }
 
@@ -157,11 +157,11 @@ export function convertTableDataToCsv(table, excel = false) {
 }
 
 export function exportTableDataToCsv(table, excel = false) {
-  let text = convertTableDataToCsv(table, excel);
+  const text = convertTableDataToCsv(table, excel);
   saveSaveBlob(text, EXPORT_FILENAME);
 }
 
 export function saveSaveBlob(payload, fname) {
-  let blob = new Blob([payload], { type: 'text/csv;charset=utf-8;header=present;' });
+  const blob = new Blob([payload], { type: 'text/csv;charset=utf-8;header=present;' });
   saveAs(blob, fname);
 }

public/app/core/utils/flatten.ts

@@ -4,19 +4,19 @@
 export default function flatten(target, opts): any {
   opts = opts || {};
 
-  var delimiter = opts.delimiter || '.';
-  var maxDepth = opts.maxDepth || 3;
-  var currentDepth = 1;
-  var output = {};
+  const delimiter = opts.delimiter || '.';
+  let maxDepth = opts.maxDepth || 3;
+  let currentDepth = 1;
+  const output = {};
 
   function step(object, prev) {
     Object.keys(object).forEach(function(key) {
-      var value = object[key];
-      var isarray = opts.safe && Array.isArray(value);
-      var type = Object.prototype.toString.call(value);
-      var isobject = type === '[object Object]';
+      const value = object[key];
+      const isarray = opts.safe && Array.isArray(value);
+      const type = Object.prototype.toString.call(value);
+      const isobject = type === '[object Object]';
 
-      var newKey = prev ? prev + delimiter + key : key;
+      const newKey = prev ? prev + delimiter + key : key;
 
       if (!opts.maxDepth) {
         maxDepth = currentDepth + 1;

public/app/core/utils/kbn.ts

@@ -1,7 +1,7 @@
 import _ from 'lodash';
 import moment from 'moment';
 
-var kbn: any = {};
+const kbn: any = {};
 
 kbn.valueFormats = {};
 
@@ -103,27 +103,27 @@ kbn.round_interval = function(interval) {
 };
 
 kbn.secondsToHms = function(seconds) {
-  var numyears = Math.floor(seconds / 31536000);
+  const numyears = Math.floor(seconds / 31536000);
   if (numyears) {
     return numyears + 'y';
   }
-  var numdays = Math.floor((seconds % 31536000) / 86400);
+  const numdays = Math.floor((seconds % 31536000) / 86400);
   if (numdays) {
     return numdays + 'd';
   }
-  var numhours = Math.floor(((seconds % 31536000) % 86400) / 3600);
+  const numhours = Math.floor(((seconds % 31536000) % 86400) / 3600);
   if (numhours) {
     return numhours + 'h';
   }
-  var numminutes = Math.floor((((seconds % 31536000) % 86400) % 3600) / 60);
+  const numminutes = Math.floor((((seconds % 31536000) % 86400) % 3600) / 60);
   if (numminutes) {
     return numminutes + 'm';
   }
-  var numseconds = Math.floor((((seconds % 31536000) % 86400) % 3600) % 60);
+  const numseconds = Math.floor((((seconds % 31536000) % 86400) % 3600) % 60);
   if (numseconds) {
     return numseconds + 's';
   }
-  var nummilliseconds = Math.floor(seconds * 1000.0);
+  const nummilliseconds = Math.floor(seconds * 1000.0);
   if (nummilliseconds) {
     return nummilliseconds + 'ms';
   }
@@ -132,10 +132,10 @@ kbn.secondsToHms = function(seconds) {
 };
 
 kbn.secondsToHhmmss = function(seconds) {
-  var strings = [];
-  var numhours = Math.floor(seconds / 3600);
-  var numminutes = Math.floor((seconds % 3600) / 60);
-  var numseconds = Math.floor((seconds % 3600) % 60);
+  const strings = [];
+  const numhours = Math.floor(seconds / 3600);
+  const numminutes = Math.floor((seconds % 3600) / 60);
+  const numseconds = Math.floor((seconds % 3600) % 60);
   numhours > 9 ? strings.push('' + numhours) : strings.push('0' + numhours);
   numminutes > 9 ? strings.push('' + numminutes) : strings.push('0' + numminutes);
   numseconds > 9 ? strings.push('' + numseconds) : strings.push('0' + numseconds);
@@ -191,7 +191,7 @@ kbn.calculateInterval = function(range, resolution, lowLimitInterval) {
 };
 
 kbn.describe_interval = function(str) {
-  var matches = str.match(kbn.interval_regex);
+  const matches = str.match(kbn.interval_regex);
   if (!matches || !_.has(kbn.intervals_in_seconds, matches[2])) {
     throw new Error('Invalid interval string, expecting a number followed by one of "Mwdhmsy"');
   } else {
@@ -204,12 +204,12 @@ kbn.describe_interval = function(str) {
 };
 
 kbn.interval_to_ms = function(str) {
-  var info = kbn.describe_interval(str);
+  const info = kbn.describe_interval(str);
   return info.sec * 1000 * info.count;
 };
 
 kbn.interval_to_seconds = function(str) {
-  var info = kbn.describe_interval(str);
+  const info = kbn.describe_interval(str);
   return info.sec * info.count;
 };
 
@@ -233,7 +233,7 @@ kbn.stringToJsRegex = function(str) {
     return new RegExp('^' + str + '$');
   }
 
-  var match = str.match(new RegExp('^/(.*?)/(g?i?m?y?)$'));
+  const match = str.match(new RegExp('^/(.*?)/(g?i?m?y?)$'));
   return new RegExp(match[1], match[2]);
 };
 
@@ -242,8 +242,8 @@ kbn.toFixed = function(value, decimals) {
     return '';
   }
 
-  var factor = decimals ? Math.pow(10, Math.max(0, decimals)) : 1;
-  var formatted = String(Math.round(value * factor) / factor);
+  const factor = decimals ? Math.pow(10, Math.max(0, decimals)) : 1;
+  const formatted = String(Math.round(value * factor) / factor);
 
   // if exponent return directly
   if (formatted.indexOf('e') !== -1 || value === 0) {
@@ -253,8 +253,8 @@ kbn.toFixed = function(value, decimals) {
   // If tickDecimals was specified, ensure that we have exactly that
   // much precision; otherwise default to the value's own precision.
   if (decimals != null) {
-    var decimalPos = formatted.indexOf('.');
-    var precision = decimalPos === -1 ? 0 : formatted.length - decimalPos - 1;
+    const decimalPos = formatted.indexOf('.');
+    const precision = decimalPos === -1 ? 0 : formatted.length - decimalPos - 1;
     if (precision < decimals) {
       return (precision ? formatted : formatted + '.') + String(factor).substr(1, decimals - precision);
     }
@@ -275,8 +275,8 @@ kbn.roundValue = function(num, decimals) {
   if (num === null) {
     return null;
   }
-  var n = Math.pow(10, decimals);
-  var formatted = (n * num).toFixed(decimals);
+  const n = Math.pow(10, decimals);
+  const formatted = (n * num).toFixed(decimals);
   return Math.round(parseFloat(formatted)) / n;
 };
 
@@ -305,7 +305,7 @@ kbn.formatBuilders.scaledUnits = function(factor, extArray) {
     }
 
     var steps = 0;
-    var limit = extArray.length;
+    const limit = extArray.length;
 
     while (Math.abs(size) >= factor) {
       steps++;
@@ -330,7 +330,7 @@ kbn.formatBuilders.scaledUnits = function(factor, extArray) {
 kbn.formatBuilders.decimalSIPrefix = function(unit, offset) {
   var prefixes = ['n', 'µ', 'm', '', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y'];
   prefixes = prefixes.slice(3 + (offset || 0));
-  var units = prefixes.map(function(p) {
+  const units = prefixes.map(function(p) {
     return ' ' + p + unit;
   });
   return kbn.formatBuilders.scaledUnits(1000, units);
@@ -340,8 +340,8 @@ kbn.formatBuilders.decimalSIPrefix = function(unit, offset) {
 // offset is given, it starts the units at the given prefix; otherwise, the
 // offset defaults to zero and the initial unit is not prefixed.
 kbn.formatBuilders.binarySIPrefix = function(unit, offset) {
-  var prefixes = ['', 'Ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi'].slice(offset);
-  var units = prefixes.map(function(p) {
+  const prefixes = ['', 'Ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi'].slice(offset);
+  const units = prefixes.map(function(p) {
     return ' ' + p + unit;
   });
   return kbn.formatBuilders.scaledUnits(1024, units);
@@ -350,25 +350,25 @@ kbn.formatBuilders.binarySIPrefix = function(unit, offset) {
 // Currency formatter for prefixing a symbol onto a number. Supports scaling
 // up to the trillions.
 kbn.formatBuilders.currency = function(symbol) {
-  var units = ['', 'K', 'M', 'B', 'T'];
-  var scaler = kbn.formatBuilders.scaledUnits(1000, units);
+  const units = ['', 'K', 'M', 'B', 'T'];
+  const scaler = kbn.formatBuilders.scaledUnits(1000, units);
   return function(size, decimals, scaledDecimals) {
     if (size === null) {
       return '';
     }
-    var scaled = scaler(size, decimals, scaledDecimals);
+    const scaled = scaler(size, decimals, scaledDecimals);
     return symbol + scaled;
   };
 };
 
 kbn.formatBuilders.simpleCountUnit = function(symbol) {
-  var units = ['', 'K', 'M', 'B', 'T'];
-  var scaler = kbn.formatBuilders.scaledUnits(1000, units);
+  const units = ['', 'K', 'M', 'B', 'T'];
+  const scaler = kbn.formatBuilders.scaledUnits(1000, units);
   return function(size, decimals, scaledDecimals) {
     if (size === null) {
       return '';
     }
-    var scaled = scaler(size, decimals, scaledDecimals);
+    const scaled = scaler(size, decimals, scaledDecimals);
     return scaled + ' ' + symbol;
   };
 };
@@ -420,7 +420,7 @@ kbn.valueFormats.hex0x = function(value, decimals) {
   if (value == null) {
     return '';
   }
-  var hexString = kbn.valueFormats.hex(value, decimals);
+  const hexString = kbn.valueFormats.hex(value, decimals);
   if (hexString.substring(0, 1) === '-') {
     return '-0x' + hexString.substring(1);
   }
@@ -769,7 +769,7 @@ kbn.toDuration = function(size, decimals, timeScale) {
     return kbn.toDuration(-size, decimals, timeScale) + ' ago';
   }
 
-  var units = [
+  const units = [
     { short: 'y', long: 'year' },
     { short: 'M', long: 'month' },
     { short: 'w', long: 'week' },
@@ -788,16 +788,16 @@ kbn.toDuration = function(size, decimals, timeScale) {
       }).short
     ] * 1000;
 
-  var strings = [];
+  const strings = [];
   // after first value >= 1 print only $decimals more
   var decrementDecimals = false;
   for (var i = 0; i < units.length && decimals >= 0; i++) {
-    var interval = kbn.intervals_in_seconds[units[i].short] * 1000;
-    var value = size / interval;
+    const interval = kbn.intervals_in_seconds[units[i].short] * 1000;
+    const value = size / interval;
     if (value >= 1 || decrementDecimals) {
       decrementDecimals = true;
-      var floor = Math.floor(value);
-      var unit = units[i].long + (floor !== 1 ? 's' : '');
+      const floor = Math.floor(value);
+      const unit = units[i].long + (floor !== 1 ? 's' : '');
       strings.push(floor + ' ' + unit);
       size = size % interval;
       decimals--;
@@ -824,7 +824,7 @@ kbn.valueFormats.timeticks = function(size, decimals, scaledDecimals) {
 };
 
 kbn.valueFormats.dateTimeAsIso = function(epoch, isUtc) {
-  var time = isUtc ? moment.utc(epoch) : moment(epoch);
+  const time = isUtc ? moment.utc(epoch) : moment(epoch);
 
   if (moment().isSame(epoch, 'day')) {
     return time.format('HH:mm:ss');
@@ -833,7 +833,7 @@ kbn.valueFormats.dateTimeAsIso = function(epoch, isUtc) {
 };
 
 kbn.valueFormats.dateTimeAsUS = function(epoch, isUtc) {
-  var time = isUtc ? moment.utc(epoch) : moment(epoch);
+  const time = isUtc ? moment.utc(epoch) : moment(epoch);
 
   if (moment().isSame(epoch, 'day')) {
     return time.format('h:mm:ss a');
@@ -842,7 +842,7 @@ kbn.valueFormats.dateTimeAsUS = function(epoch, isUtc) {
 };
 
 kbn.valueFormats.dateTimeFromNow = function(epoch, isUtc) {
-  var time = isUtc ? moment.utc(epoch) : moment(epoch);
+  const time = isUtc ? moment.utc(epoch) : moment(epoch);
   return time.fromNow();
 };
 

public/app/core/utils/outline.ts

@@ -1,6 +1,6 @@
 // based on http://www.paciellogroup.com/blog/2012/04/how-to-remove-css-outlines-in-an-accessible-manner/
 function outlineFixer() {
-  let d: any = document;
+  const d: any = document;
 
   var style_element = d.createElement('STYLE');
   var dom_events = 'addEventListener' in d;

public/app/core/utils/rangeutil.ts

@@ -2,7 +2,7 @@ import _ from 'lodash';
 import moment from 'moment';
 import * as dateMath from './datemath';
 
-var spans = {
+const spans = {
   s: { display: 'second' },
   m: { display: 'minute' },
   h: { display: 'hour' },
@@ -12,7 +12,7 @@ var spans = {
   y: { display: 'year' },
 };
 
-var rangeOptions = [
+const rangeOptions = [
   { from: 'now/d', to: 'now/d', display: 'Today', section: 2 },
   { from: 'now/d', to: 'now', display: 'Today so far', section: 2 },
   { from: 'now/w', to: 'now/w', display: 'This week', section: 2 },
@@ -58,15 +58,15 @@ var rangeOptions = [
   { from: 'now-5y', to: 'now', display: 'Last 5 years', section: 0 },
 ];
 
-var absoluteFormat = 'MMM D, YYYY HH:mm:ss';
+const absoluteFormat = 'MMM D, YYYY HH:mm:ss';
 
-var rangeIndex = {};
+const rangeIndex = {};
 _.each(rangeOptions, function(frame) {
   rangeIndex[frame.from + ' to ' + frame.to] = frame;
 });
 
 export function getRelativeTimesList(timepickerSettings, currentDisplay) {
-  var groups = _.groupBy(rangeOptions, (option: any) => {
+  const groups = _.groupBy(rangeOptions, (option: any) => {
     option.active = option.display === currentDisplay;
     return option.section;
   });
@@ -92,7 +92,7 @@ function formatDate(date) {
 // now/d
 // if no to <expr> then to now is assumed
 export function describeTextRange(expr: any) {
-  let isLast = expr.indexOf('+') !== 0;
+  const isLast = expr.indexOf('+') !== 0;
   if (expr.indexOf('now') === -1) {
     expr = (isLast ? 'now-' : 'now') + expr;
   }
@@ -108,11 +108,11 @@ export function describeTextRange(expr: any) {
     opt = { from: 'now', to: expr };
   }
 
-  let parts = /^now([-+])(\d+)(\w)/.exec(expr);
+  const parts = /^now([-+])(\d+)(\w)/.exec(expr);
   if (parts) {
-    let unit = parts[3];
-    let amount = parseInt(parts[2]);
-    let span = spans[unit];
+    const unit = parts[3];
+    const amount = parseInt(parts[2]);
+    const span = spans[unit];
     if (span) {
       opt.display = isLast ? 'Last ' : 'Next ';
       opt.display += amount + ' ' + span.display;
@@ -130,7 +130,7 @@ export function describeTextRange(expr: any) {
 }
 
 export function describeTimeRange(range) {
-  var option = rangeIndex[range.from.toString() + ' to ' + range.to.toString()];
+  const option = rangeIndex[range.from.toString() + ' to ' + range.to.toString()];
   if (option) {
     return option.display;
   }
@@ -140,17 +140,17 @@ export function describeTimeRange(range) {
   }
 
   if (moment.isMoment(range.from)) {
-    var toMoment = dateMath.parse(range.to, true);
+    const toMoment = dateMath.parse(range.to, true);
     return formatDate(range.from) + ' to ' + toMoment.fromNow();
   }
 
   if (moment.isMoment(range.to)) {
-    var from = dateMath.parse(range.from, false);
+    const from = dateMath.parse(range.from, false);
     return from.fromNow() + ' to ' + formatDate(range.to);
   }
 
   if (range.to.toString() === 'now') {
-    var res = describeTextRange(range.from);
+    const res = describeTextRange(range.from);
     return res.display;
   }
 

public/app/core/utils/sort_by_keys.ts

@@ -7,7 +7,7 @@ export default function sortByKeys(input) {
 
   if (_.isPlainObject(input)) {
     var sortedObject = {};
-    for (let key of _.keys(input).sort()) {
+    for (const key of _.keys(input).sort()) {
       sortedObject[key] = sortByKeys(input[key]);
     }
     return sortedObject;

public/app/core/utils/tags.ts

@@ -67,9 +67,9 @@ const TAG_BORDER_COLORS = [
  * @param name tag name
  */
 export function getTagColorsFromName(name: string): { color: string; borderColor: string } {
-  let hash = djb2(name.toLowerCase());
-  let color = TAG_COLORS[Math.abs(hash % TAG_COLORS.length)];
-  let borderColor = TAG_BORDER_COLORS[Math.abs(hash % TAG_BORDER_COLORS.length)];
+  const hash = djb2(name.toLowerCase());
+  const color = TAG_COLORS[Math.abs(hash % TAG_COLORS.length)];
+  const borderColor = TAG_BORDER_COLORS[Math.abs(hash % TAG_BORDER_COLORS.length)];
   return { color, borderColor };
 }
 

public/app/core/utils/ticks.ts

@@ -7,7 +7,7 @@
  * @param count Ticks count
  */
 export function tickStep(start: number, stop: number, count: number): number {
-  let e10 = Math.sqrt(50),
+  const e10 = Math.sqrt(50),
     e5 = Math.sqrt(10),
     e2 = Math.sqrt(2);
 
@@ -76,7 +76,7 @@ export function getFlotRange(panelMin, panelMax, datamin, datamax) {
 
   let min = +(panelMin != null ? panelMin : datamin);
   let max = +(panelMax != null ? panelMax : datamax);
-  let delta = max - min;
+  const delta = max - min;
 
   if (delta === 0.0) {
     // Grafana fix: wide Y min and max using increased wideFactor
@@ -123,11 +123,11 @@ export function getFlotTickDecimals(datamin, datamax, axis, height) {
   const { min, max } = getFlotRange(axis.min, axis.max, datamin, datamax);
   const noTicks = 0.3 * Math.sqrt(height);
   const delta = (max - min) / noTicks;
-  let dec = -Math.floor(Math.log(delta) / Math.LN10);
+  const dec = -Math.floor(Math.log(delta) / Math.LN10);
 
-  let magn = Math.pow(10, -dec);
+  const magn = Math.pow(10, -dec);
   // norm is between 1.0 and 10.0
-  let norm = delta / magn;
+  const norm = delta / magn;
   let size;
 
   if (norm < 1.5) {
@@ -159,10 +159,10 @@ export function getFlotTickDecimals(datamin, datamax, axis, height) {
  */
 export function grafanaTimeFormat(ticks, min, max) {
   if (min && max && ticks) {
-    let range = max - min;
-    let secPerTick = range / ticks / 1000;
-    let oneDay = 86400000;
-    let oneYear = 31536000000;
+    const range = max - min;
+    const secPerTick = range / ticks / 1000;
+    const oneDay = 86400000;
+    const oneYear = 31536000000;
 
     if (secPerTick <= 45) {
       return '%H:%M:%S';
@@ -193,7 +193,7 @@ export function logp(value, base) {
  * Get decimal precision of number (3.14 => 2)
  */
 export function getPrecision(num: number): number {
-  let str = num.toString();
+  const str = num.toString();
   return getStringPrecision(str);
 }
 
@@ -201,7 +201,7 @@ export function getPrecision(num: number): number {
  * Get decimal precision of number stored as a string ("3.14" => 2)
  */
 export function getStringPrecision(num: string): number {
-  let dot_index = num.indexOf('.');
+  const dot_index = num.indexOf('.');
   if (dot_index === -1) {
     return 0;
   } else {

public/app/core/utils/url.ts

@@ -3,14 +3,14 @@
  */
 
 export function toUrlParams(a) {
-  let s = [];
-  let rbracket = /\[\]$/;
+  const s = [];
+  const rbracket = /\[\]$/;
 
-  let isArray = function(obj) {
+  const isArray = function(obj) {
     return Object.prototype.toString.call(obj) === '[object Array]';
   };
 
-  let add = function(k, v) {
+  const add = function(k, v) {
     v = typeof v === 'function' ? v() : v === null ? '' : v === undefined ? '' : v;
     if (typeof v !== 'boolean') {
       s[s.length] = encodeURIComponent(k) + '=' + encodeURIComponent(v);
@@ -19,7 +19,7 @@ export function toUrlParams(a) {
     }
   };
 
-  let buildParams = function(prefix, obj) {
+  const buildParams = function(prefix, obj) {
     var i, len, key;
 
     if (prefix) {

public/app/core/utils/version.ts

@@ -9,7 +9,7 @@ export class SemVersion {
   meta: string;
 
   constructor(version: string) {
-    let match = versionPattern.exec(version);
+    const match = versionPattern.exec(version);
     if (match) {
       this.major = Number(match[1]);
       this.minor = Number(match[2] || 0);
@@ -19,7 +19,7 @@ export class SemVersion {
   }
 
   isGtOrEq(version: string): boolean {
-    let compared = new SemVersion(version);
+    const compared = new SemVersion(version);
     return !(this.major < compared.major || this.minor < compared.minor || this.patch < compared.patch);
   }
 
@@ -29,6 +29,6 @@ export class SemVersion {
 }
 
 export function isVersionGtOrEq(a: string, b: string): boolean {
-  let a_semver = new SemVersion(a);
+  const a_semver = new SemVersion(a);
   return a_semver.isGtOrEq(b);
 }

public/app/features/admin/admin_edit_user_ctrl.ts

@@ -29,14 +29,14 @@ export class AdminEditUserCtrl {
         return;
       }
 
-      var payload = { password: $scope.password };
+      const payload = { password: $scope.password };
       backendSrv.put('/api/admin/users/' + $scope.user_id + '/password', payload).then(function() {
         $location.path('/admin/users');
       });
     };
 
     $scope.updatePermissions = function() {
-      var payload = $scope.permissions;
+      const payload = $scope.permissions;
 
       backendSrv.put('/api/admin/users/' + $scope.user_id + '/permissions', payload).then(function() {
         $location.path('/admin/users');
@@ -99,7 +99,7 @@ export class AdminEditUserCtrl {
         return;
       }
 
-      var orgInfo = _.find($scope.orgsSearchCache, {
+      const orgInfo = _.find($scope.orgsSearchCache, {
         name: $scope.newOrg.name,
       });
       if (!orgInfo) {

public/app/features/alerting/alert_tab_ctrl.ts

@@ -184,7 +184,7 @@ export class AlertTabCtrl {
 
     ThresholdMapper.alertToGraphThresholds(this.panel);
 
-    for (let addedNotification of alert.notifications) {
+    for (const addedNotification of alert.notifications) {
       var model = _.find(this.notifications, { id: addedNotification.id });
       if (model && model.isDefault === false) {
         model.iconClass = this.getNotificationIcon(model.type);
@@ -192,7 +192,7 @@ export class AlertTabCtrl {
       }
     }
 
-    for (let notification of this.notifications) {
+    for (const notification of this.notifications) {
       if (notification.isDefault) {
         notification.iconClass = this.getNotificationIcon(notification.type);
         notification.bgColor = '#00678b';