From 9b468caea43b1557180ee632c8ab2116fc995851 Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <dehrax@users.noreply.github.com>
Date: Fri, 5 Jul 2019 16:46:46 +0200
Subject: [PATCH] noImplicitAny: Datasource files, under 2500 (#17959)

* noImplicitAny on Graphite

* More noImplicitAny
---
 .../plugins/datasource/grafana/datasource.ts  | 17 +++--
 .../grafana/specs/datasource.test.ts          | 13 ++--
 .../datasource/graphite/FunctionEditor.tsx    |  3 +-
 .../datasource/graphite/add_graphite_func.ts  | 17 +++--
 .../datasource/graphite/config_ctrl.ts        |  8 +-
 .../plugins/datasource/graphite/datasource.ts | 16 ++--
 .../datasource/graphite/func_editor.ts        | 27 +++----
 .../app/plugins/datasource/graphite/gfunc.ts  | 41 ++++++----
 .../datasource/graphite/graphite_query.ts     | 36 ++++-----
 .../plugins/datasource/graphite/query_ctrl.ts | 76 +++++++++++--------
 .../graphite/specs/datasource.test.ts         | 55 ++++++++------
 .../graphite/specs/query_ctrl.test.ts         |  2 +-
 12 files changed, 175 insertions(+), 136 deletions(-)

diff --git a/public/app/plugins/datasource/grafana/datasource.ts b/public/app/plugins/datasource/grafana/datasource.ts
index 0e779b234eb..099dd58615f 100644
--- a/public/app/plugins/datasource/grafana/datasource.ts
+++ b/public/app/plugins/datasource/grafana/datasource.ts
@@ -1,10 +1,13 @@
 import _ from 'lodash';
+import { BackendSrv } from 'app/core/services/backend_srv';
+import { IQService } from 'angular';
+import { TemplateSrv } from 'app/features/templating/template_srv';
 
 class GrafanaDatasource {
   /** @ngInject */
-  constructor(private backendSrv, private $q, private templateSrv) {}
+  constructor(private backendSrv: BackendSrv, private $q: IQService, private templateSrv: TemplateSrv) {}
 
-  query(options) {
+  query(options: any) {
     return this.backendSrv
       .get('/api/tsdb/testdata/random-walk', {
         from: options.range.from.valueOf(),
@@ -12,8 +15,8 @@ class GrafanaDatasource {
         intervalMs: options.intervalMs,
         maxDataPoints: options.maxDataPoints,
       })
-      .then(res => {
-        const data = [];
+      .then((res: any) => {
+        const data: any[] = [];
 
         if (res.results) {
           _.forEach(res.results, queryRes => {
@@ -30,11 +33,11 @@ class GrafanaDatasource {
       });
   }
 
-  metricFindQuery(options) {
+  metricFindQuery(options: any) {
     return this.$q.when({ data: [] });
   }
 
-  annotationQuery(options) {
+  annotationQuery(options: any) {
     const params: any = {
       from: options.range.from.valueOf(),
       to: options.range.to.valueOf(),
@@ -60,7 +63,7 @@ class GrafanaDatasource {
       const delimiter = '__delimiter__';
       const tags = [];
       for (const t of params.tags) {
-        const renderedValues = this.templateSrv.replace(t, {}, value => {
+        const renderedValues = this.templateSrv.replace(t, {}, (value: any) => {
           if (typeof value === 'string') {
             return value;
           }
diff --git a/public/app/plugins/datasource/grafana/specs/datasource.test.ts b/public/app/plugins/datasource/grafana/specs/datasource.test.ts
index 47202c428cc..c1ee1bb65a3 100644
--- a/public/app/plugins/datasource/grafana/specs/datasource.test.ts
+++ b/public/app/plugins/datasource/grafana/specs/datasource.test.ts
@@ -1,12 +1,13 @@
 import { GrafanaDatasource } from '../datasource';
+// @ts-ignore
 import q from 'q';
 import { dateTime } from '@grafana/ui/src/utils/moment_wrapper';
 
 describe('grafana data source', () => {
   describe('when executing an annotations query', () => {
-    let calledBackendSrvParams;
+    let calledBackendSrvParams: any;
     const backendSrvStub = {
-      get: (url: string, options) => {
+      get: (url: string, options: any) => {
         calledBackendSrvParams = options;
         return q.resolve([]);
       },
@@ -18,7 +19,7 @@ describe('grafana data source', () => {
       },
     };
 
-    const ds = new GrafanaDatasource(backendSrvStub, q, templateSrvStub);
+    const ds = new GrafanaDatasource(backendSrvStub as any, q, templateSrvStub as any);
 
     describe('with tags that have template variables', () => {
       const options = setupAnnotationQueryOptions({ tags: ['tag1:$var'] });
@@ -65,10 +66,10 @@ describe('grafana data source', () => {
   });
 });
 
-function setupAnnotationQueryOptions(annotation, dashboard?) {
+function setupAnnotationQueryOptions(annotation: { tags: string[]; type?: string }, dashboard?: { id: number }) {
   return {
-    annotation: annotation,
-    dashboard: dashboard,
+    annotation,
+    dashboard,
     range: {
       from: dateTime(1432288354),
       to: dateTime(1432288401),
diff --git a/public/app/plugins/datasource/graphite/FunctionEditor.tsx b/public/app/plugins/datasource/graphite/FunctionEditor.tsx
index f8a684529c6..412dc31155c 100644
--- a/public/app/plugins/datasource/graphite/FunctionEditor.tsx
+++ b/public/app/plugins/datasource/graphite/FunctionEditor.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import { PopperController, Popper } from '@grafana/ui';
+// @ts-ignore
 import rst2html from 'rst2html';
 import { FunctionDescriptor, FunctionEditorControlsProps, FunctionEditorControls } from './FunctionEditorControls';
 
@@ -22,7 +23,7 @@ class FunctionEditor extends React.PureComponent<FunctionEditorProps, FunctionEd
     };
   }
 
-  renderContent = ({ updatePopperPosition }) => {
+  renderContent = ({ updatePopperPosition }: any) => {
     const {
       onMoveLeft,
       onMoveRight,
diff --git a/public/app/plugins/datasource/graphite/add_graphite_func.ts b/public/app/plugins/datasource/graphite/add_graphite_func.ts
index 8a7b49b01c6..be025126c64 100644
--- a/public/app/plugins/datasource/graphite/add_graphite_func.ts
+++ b/public/app/plugins/datasource/graphite/add_graphite_func.ts
@@ -1,11 +1,14 @@
 import _ from 'lodash';
 import $ from 'jquery';
+// @ts-ignore
 import rst2html from 'rst2html';
+// @ts-ignore
 import Drop from 'tether-drop';
 import coreModule from 'app/core/core_module';
+import { FuncDef } from './gfunc';
 
 /** @ngInject */
-export function graphiteAddFunc($compile) {
+export function graphiteAddFunc($compile: any) {
   const inputTemplate =
     '<input type="text"' + ' class="gf-form-input"' + ' spellcheck="false" style="display:none"></input>';
 
@@ -15,7 +18,7 @@ export function graphiteAddFunc($compile) {
     '<i class="fa fa-plus"></i></a>';
 
   return {
-    link: function($scope, elem) {
+    link: function($scope: any, elem: JQuery) {
       const ctrl = $scope.ctrl;
 
       const $input = $(inputTemplate);
@@ -24,7 +27,7 @@ export function graphiteAddFunc($compile) {
       $input.appendTo(elem);
       $button.appendTo(elem);
 
-      ctrl.datasource.getFuncDefs().then(funcDefs => {
+      ctrl.datasource.getFuncDefs().then((funcDefs: FuncDef[]) => {
         const allFunctions = _.map(funcDefs, 'name').sort();
 
         $scope.functionMenu = createFunctionDropDownMenu(funcDefs);
@@ -34,7 +37,7 @@ export function graphiteAddFunc($compile) {
           source: allFunctions,
           minLength: 1,
           items: 10,
-          updater: value => {
+          updater: (value: any) => {
             let funcDef: any = ctrl.datasource.getFuncDef(value);
             if (!funcDef) {
               // try find close match
@@ -81,7 +84,7 @@ export function graphiteAddFunc($compile) {
         $compile(elem.contents())($scope);
       });
 
-      let drop;
+      let drop: any;
       const cleanUpDrop = () => {
         if (drop) {
           drop.destroy();
@@ -132,8 +135,8 @@ export function graphiteAddFunc($compile) {
 
 coreModule.directive('graphiteAddFunc', graphiteAddFunc);
 
-function createFunctionDropDownMenu(funcDefs) {
-  const categories = {};
+function createFunctionDropDownMenu(funcDefs: FuncDef[]) {
+  const categories: any = {};
 
   _.forEach(funcDefs, funcDef => {
     if (!funcDef.category) {
diff --git a/public/app/plugins/datasource/graphite/config_ctrl.ts b/public/app/plugins/datasource/graphite/config_ctrl.ts
index b22a860315c..194860656b4 100644
--- a/public/app/plugins/datasource/graphite/config_ctrl.ts
+++ b/public/app/plugins/datasource/graphite/config_ctrl.ts
@@ -1,10 +1,12 @@
+import DatasourceSrv from 'app/features/plugins/datasource_srv';
+
 export class GraphiteConfigCtrl {
   static templateUrl = 'public/app/plugins/datasource/graphite/partials/config.html';
   datasourceSrv: any;
   current: any;
 
   /** @ngInject */
-  constructor($scope, datasourceSrv) {
+  constructor($scope: any, datasourceSrv: DatasourceSrv) {
     this.datasourceSrv = datasourceSrv;
     this.current.jsonData = this.current.jsonData || {};
     this.current.jsonData.graphiteVersion = this.current.jsonData.graphiteVersion || '0.9';
@@ -18,10 +20,10 @@ export class GraphiteConfigCtrl {
 
     this.datasourceSrv
       .loadDatasource(this.current.name)
-      .then(ds => {
+      .then((ds: any) => {
         return ds.getVersion();
       })
-      .then(version => {
+      .then((version: any) => {
         this.graphiteVersions.push({ name: version, value: version });
         this.current.jsonData.graphiteVersion = version;
       });
diff --git a/public/app/plugins/datasource/graphite/datasource.ts b/public/app/plugins/datasource/graphite/datasource.ts
index bc97ab57430..c0f924649f5 100644
--- a/public/app/plugins/datasource/graphite/datasource.ts
+++ b/public/app/plugins/datasource/graphite/datasource.ts
@@ -15,8 +15,8 @@ export class GraphiteDatasource {
   supportsTags: boolean;
   cacheTimeout: any;
   withCredentials: boolean;
-  funcDefs = null;
-  funcDefsPromise = null;
+  funcDefs: any = null;
+  funcDefsPromise: Promise<any> = null;
   _seriesRefLetters: string;
 
   /** @ngInject */
@@ -107,7 +107,7 @@ export class GraphiteDatasource {
   }
 
   parseTags(tagString: string) {
-    let tags = [];
+    let tags: string[] = [];
     tags = tagString.split(',');
     if (tags.length === 1) {
       tags = tagString.split(' ');
@@ -154,7 +154,7 @@ export class GraphiteDatasource {
     } else {
       // Graphite event as annotation
       const tags = this.templateSrv.replace(options.annotation.tags);
-      return this.events({ range: options.rangeRaw, tags: tags }).then(results => {
+      return this.events({ range: options.rangeRaw, tags: tags }).then((results: any) => {
         const list = [];
         for (let i = 0; i < results.data.length; i++) {
           const e = results.data[i];
@@ -309,7 +309,7 @@ export class GraphiteDatasource {
       httpOptions.params.until = this.translateTime(options.range.to, true, options.timezone);
     }
 
-    return this.doGraphiteRequest(httpOptions).then(results => {
+    return this.doGraphiteRequest(httpOptions).then((results: any) => {
       return _.map(results.data, tag => {
         return {
           text: tag.tag,
@@ -372,7 +372,7 @@ export class GraphiteDatasource {
       httpOptions.params.until = this.translateTime(options.range.to, true, options.timezone);
     }
 
-    return this.doGraphiteRequest(httpOptions).then(results => {
+    return this.doGraphiteRequest(httpOptions).then((results: any) => {
       if (results.data) {
         return _.map(results.data, tag => {
           return { text: tag };
@@ -478,7 +478,7 @@ export class GraphiteDatasource {
         }
         return this.funcDefs;
       })
-      .catch(err => {
+      .catch((err: any) => {
         console.log('Fetching graphite functions error', err);
         this.funcDefs = gfunc.getFuncDefs(this.graphiteVersion);
         return this.funcDefs;
@@ -524,7 +524,7 @@ export class GraphiteDatasource {
   buildGraphiteParams(options: any, scopedVars: ScopedVars) {
     const graphiteOptions = ['from', 'until', 'rawData', 'format', 'maxDataPoints', 'cacheTimeout'];
     const cleanOptions = [],
-      targets = {};
+      targets: any = {};
     let target, targetValue, i;
     const regex = /\#([A-Z])/g;
     const intervalFormatFixRegex = /'(\d+)m'/gi;
diff --git a/public/app/plugins/datasource/graphite/func_editor.ts b/public/app/plugins/datasource/graphite/func_editor.ts
index 6f2b23a7389..2b681ebe00f 100644
--- a/public/app/plugins/datasource/graphite/func_editor.ts
+++ b/public/app/plugins/datasource/graphite/func_editor.ts
@@ -1,9 +1,10 @@
 import _ from 'lodash';
 import $ from 'jquery';
 import coreModule from 'app/core/core_module';
+import { TemplateSrv } from 'app/features/templating/template_srv';
 
 /** @ngInject */
-export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
+export function graphiteFuncEditor($compile: any, templateSrv: TemplateSrv) {
   const funcSpanTemplate = `
     <function-editor
       func="func"
@@ -17,27 +18,27 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
 
   return {
     restrict: 'A',
-    link: function postLink($scope, elem) {
+    link: function postLink($scope: any, elem: JQuery) {
       const $funcLink = $(funcSpanTemplate);
       const ctrl = $scope.ctrl;
       const func = $scope.func;
       let scheduledRelink = false;
       let paramCountAtLink = 0;
-      let cancelBlur = null;
+      let cancelBlur: any = null;
 
-      ctrl.handleRemoveFunction = func => {
+      ctrl.handleRemoveFunction = (func: any) => {
         ctrl.removeFunction(func);
       };
 
-      ctrl.handleMoveLeft = func => {
+      ctrl.handleMoveLeft = (func: any) => {
         ctrl.moveFunction(func, -1);
       };
 
-      ctrl.handleMoveRight = func => {
+      ctrl.handleMoveRight = (func: any) => {
         ctrl.moveFunction(func, 1);
       };
 
-      function clickFuncParam(this: any, paramIndex) {
+      function clickFuncParam(this: any, paramIndex: any) {
         /*jshint validthis:true */
 
         const $link = $(this);
@@ -73,7 +74,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
         }
       }
 
-      function paramDef(index) {
+      function paramDef(index: number) {
         if (index < func.def.params.length) {
           return func.def.params[index];
         }
@@ -83,7 +84,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
         return {};
       }
 
-      function switchToLink(inputElem, paramIndex) {
+      function switchToLink(inputElem: HTMLElement, paramIndex: any) {
         /*jshint validthis:true */
         const $input = $(inputElem);
 
@@ -117,7 +118,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
       }
 
       // this = input element
-      function inputBlur(this: any, paramIndex) {
+      function inputBlur(this: any, paramIndex: any) {
         /*jshint validthis:true */
         const inputElem = this;
         // happens long before the click event on the typeahead options
@@ -127,7 +128,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
         }, 200);
       }
 
-      function inputKeyPress(this: any, paramIndex, e) {
+      function inputKeyPress(this: any, paramIndex: any, e: any) {
         /*jshint validthis:true */
         if (e.which === 13) {
           $(this).blur();
@@ -139,7 +140,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
         this.style.width = (3 + this.value.length) * 8 + 'px';
       }
 
-      function addTypeahead($input, paramIndex) {
+      function addTypeahead($input: any, paramIndex: any) {
         $input.attr('data-provide', 'typeahead');
 
         let options = paramDef(paramIndex).options;
@@ -153,7 +154,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
           source: options,
           minLength: 0,
           items: 20,
-          updater: value => {
+          updater: (value: any) => {
             $input.val(value);
             switchToLink($input[0], paramIndex);
             return value;
diff --git a/public/app/plugins/datasource/graphite/gfunc.ts b/public/app/plugins/datasource/graphite/gfunc.ts
index 3fe341deaaf..b1b23f03e24 100644
--- a/public/app/plugins/datasource/graphite/gfunc.ts
+++ b/public/app/plugins/datasource/graphite/gfunc.ts
@@ -2,9 +2,20 @@ import _ from 'lodash';
 import { isVersionGtOrEq } from 'app/core/utils/version';
 import { InterpolateFunction } from '@grafana/ui';
 
-const index = {};
+const index: any = {};
 
-function addFuncDef(funcDef) {
+export interface FuncDef {
+  name: any;
+  category?: string;
+  params?: any;
+  defaultParams?: any;
+  shortName?: any;
+  fake?: boolean;
+  version?: string;
+  description?: string;
+}
+
+function addFuncDef(funcDef: FuncDef) {
   funcDef.params = funcDef.params || [];
   funcDef.defaultParams = funcDef.defaultParams || [];
 
@@ -941,7 +952,7 @@ addFuncDef({
   version: '1.1',
 });
 
-function isVersionRelatedFunction(obj, graphiteVersion) {
+function isVersionRelatedFunction(obj: { version: string }, graphiteVersion: string) {
   return !obj.version || isVersionGtOrEq(graphiteVersion, obj.version);
 }
 
@@ -951,7 +962,7 @@ export class FuncInstance {
   text: any;
   added: boolean;
 
-  constructor(funcDef, options) {
+  constructor(funcDef: any, options: { withDefaultParams: any }) {
     this.def = funcDef;
     this.params = [];
 
@@ -1002,7 +1013,7 @@ export class FuncInstance {
     return str + parameters.join(', ') + ')';
   }
 
-  _hasMultipleParamsInString(strValue, index) {
+  _hasMultipleParamsInString(strValue: any, index: number) {
     if (strValue.indexOf(',') === -1) {
       return false;
     }
@@ -1018,7 +1029,7 @@ export class FuncInstance {
     return false;
   }
 
-  updateParam(strValue, index) {
+  updateParam(strValue: any, index: any) {
     // handle optional parameters
     // if string contains ',' and next param is optional, split and update both
     if (this._hasMultipleParamsInString(strValue, index)) {
@@ -1050,22 +1061,22 @@ export class FuncInstance {
   }
 }
 
-function createFuncInstance(funcDef, options?, idx?) {
+function createFuncInstance(funcDef: any, options?: { withDefaultParams: any }, idx?: any) {
   if (_.isString(funcDef)) {
     funcDef = getFuncDef(funcDef, idx);
   }
   return new FuncInstance(funcDef, options);
 }
 
-function getFuncDef(name, idx?) {
+function getFuncDef(name: string, idx?: any) {
   if (!(idx || index)[name]) {
     throw { message: 'Method not found ' + name };
   }
   return (idx || index)[name];
 }
 
-function getFuncDefs(graphiteVersion, idx?) {
-  const funcs = {};
+function getFuncDefs(graphiteVersion: string, idx?: any) {
+  const funcs: any = {};
   _.forEach(idx || index, funcDef => {
     if (isVersionRelatedFunction(funcDef, graphiteVersion)) {
       funcs[funcDef.name] = _.assign({}, funcDef, {
@@ -1079,8 +1090,8 @@ function getFuncDefs(graphiteVersion, idx?) {
 }
 
 // parse response from graphite /functions endpoint into internal format
-function parseFuncDefs(rawDefs) {
-  const funcDefs = {};
+function parseFuncDefs(rawDefs: any) {
+  const funcDefs: any = {};
 
   _.forEach(rawDefs || {}, (funcDef, funcName) => {
     // skip graphite graph functions
@@ -1097,9 +1108,9 @@ function parseFuncDefs(rawDefs) {
         .replace(/.. code-block *:: *none/g, '.. code-block::');
     }
 
-    const func = {
+    const func: FuncDef = {
       name: funcDef.name,
-      description: description,
+      description,
       category: funcDef.group,
       params: [],
       defaultParams: [],
@@ -1122,7 +1133,7 @@ function parseFuncDefs(rawDefs) {
     }
 
     _.forEach(funcDef.params, rawParam => {
-      const param = {
+      const param: any = {
         name: rawParam.name,
         type: 'string',
         optional: !rawParam.required,
diff --git a/public/app/plugins/datasource/graphite/graphite_query.ts b/public/app/plugins/datasource/graphite/graphite_query.ts
index 1780ce23832..a149bbbd62a 100644
--- a/public/app/plugins/datasource/graphite/graphite_query.ts
+++ b/public/app/plugins/datasource/graphite/graphite_query.ts
@@ -1,5 +1,7 @@
 import _ from 'lodash';
 import { Parser } from './parser';
+import { TemplateSrv } from 'app/features/templating/template_srv';
+import { ScopedVars } from '@grafana/ui';
 
 export default class GraphiteQuery {
   datasource: any;
@@ -15,7 +17,7 @@ export default class GraphiteQuery {
   scopedVars: any;
 
   /** @ngInject */
-  constructor(datasource, target, templateSrv?, scopedVars?) {
+  constructor(datasource: any, target: any, templateSrv?: TemplateSrv, scopedVars?: ScopedVars) {
     this.datasource = datasource;
     this.target = target;
     this.templateSrv = templateSrv;
@@ -60,7 +62,7 @@ export default class GraphiteQuery {
     this.checkOtherSegmentsIndex = this.segments.length - 1;
   }
 
-  getSegmentPathUpTo(index) {
+  getSegmentPathUpTo(index: number) {
     const arr = this.segments.slice(0, index);
 
     return _.reduce(
@@ -72,7 +74,7 @@ export default class GraphiteQuery {
     );
   }
 
-  parseTargetRecursive(astNode, func) {
+  parseTargetRecursive(astNode: any, func: any): any {
     if (astNode === null) {
       return null;
     }
@@ -119,7 +121,7 @@ export default class GraphiteQuery {
     }
   }
 
-  updateSegmentValue(segment, index) {
+  updateSegmentValue(segment: any, index: number) {
     this.segments[index].value = segment.value;
   }
 
@@ -127,28 +129,28 @@ export default class GraphiteQuery {
     this.segments.push({ value: 'select metric' });
   }
 
-  addFunction(newFunc) {
+  addFunction(newFunc: any) {
     this.functions.push(newFunc);
   }
 
-  addFunctionParameter(func, value) {
+  addFunctionParameter(func: any, value: string) {
     if (func.params.length >= func.def.params.length && !_.get(_.last(func.def.params), 'multiple', false)) {
       throw { message: 'too many parameters for function ' + func.def.name };
     }
     func.params.push(value);
   }
 
-  removeFunction(func) {
+  removeFunction(func: any) {
     this.functions = _.without(this.functions, func);
   }
 
-  moveFunction(func, offset) {
+  moveFunction(func: any, offset: number) {
     const index = this.functions.indexOf(func);
     // @ts-ignore
     _.move(this.functions, index, index + offset);
   }
 
-  updateModelTarget(targets) {
+  updateModelTarget(targets: any) {
     const wrapFunction = (target: string, func: any) => {
       return func.render(target, (value: string) => {
         return this.templateSrv.replace(value, this.scopedVars);
@@ -170,7 +172,7 @@ export default class GraphiteQuery {
     }
   }
 
-  updateRenderedTarget(target, targets) {
+  updateRenderedTarget(target: { refId: string | number; target: any; targetFull: any }, targets: any) {
     // render nested query
     const targetsByRefId = _.keyBy(targets, 'refId');
 
@@ -181,7 +183,7 @@ export default class GraphiteQuery {
     let targetWithNestedQueries = target.target;
 
     // Use ref count to track circular references
-    function countTargetRefs(targetsByRefId, refId) {
+    function countTargetRefs(targetsByRefId: any, refId: string) {
       let refCount = 0;
       _.each(targetsByRefId, (t, id) => {
         if (id !== refId) {
@@ -199,7 +201,7 @@ export default class GraphiteQuery {
     // Keep interpolating until there are no query references
     // The reason for the loop is that the referenced query might contain another reference to another query
     while (targetWithNestedQueries.match(nestedSeriesRefRegex)) {
-      const updated = targetWithNestedQueries.replace(nestedSeriesRefRegex, (match, g1) => {
+      const updated = targetWithNestedQueries.replace(nestedSeriesRefRegex, (match: string, g1: string) => {
         const t = targetsByRefId[g1];
         if (!t) {
           return match;
@@ -227,7 +229,7 @@ export default class GraphiteQuery {
     }
   }
 
-  splitSeriesByTagParams(func) {
+  splitSeriesByTagParams(func: { params: any }) {
     const tagPattern = /([^\!=~]+)(\!?=~?)(.*)/;
     return _.flatten(
       _.map(func.params, (param: string) => {
@@ -260,18 +262,18 @@ export default class GraphiteQuery {
     }
   }
 
-  addTag(tag) {
+  addTag(tag: { key: any; operator: string; value: string }) {
     const newTagParam = renderTagString(tag);
     this.getSeriesByTagFunc().params.push(newTagParam);
     this.tags.push(tag);
   }
 
-  removeTag(index) {
+  removeTag(index: number) {
     this.getSeriesByTagFunc().params.splice(index, 1);
     this.tags.splice(index, 1);
   }
 
-  updateTag(tag, tagIndex) {
+  updateTag(tag: { key: string }, tagIndex: number) {
     this.error = null;
 
     if (tag.key === this.removeTagValue) {
@@ -296,6 +298,6 @@ export default class GraphiteQuery {
   }
 }
 
-function renderTagString(tag) {
+function renderTagString(tag: { key: any; operator?: any; value?: any }) {
   return tag.key + tag.operator + tag.value;
 }
diff --git a/public/app/plugins/datasource/graphite/query_ctrl.ts b/public/app/plugins/datasource/graphite/query_ctrl.ts
index 90c2c248297..f2b2e88a35b 100644
--- a/public/app/plugins/datasource/graphite/query_ctrl.ts
+++ b/public/app/plugins/datasource/graphite/query_ctrl.ts
@@ -5,6 +5,8 @@ import _ from 'lodash';
 import GraphiteQuery from './graphite_query';
 import { QueryCtrl } from 'app/plugins/sdk';
 import appEvents from 'app/core/app_events';
+import { auto } from 'angular';
+import { TemplateSrv } from 'app/features/templating/template_srv';
 
 const GRAPHITE_TAG_OPERATORS = ['=', '!=', '=~', '!=~'];
 const TAG_PREFIX = 'tag: ';
@@ -20,7 +22,13 @@ export class GraphiteQueryCtrl extends QueryCtrl {
   paused: boolean;
 
   /** @ngInject */
-  constructor($scope, $injector, private uiSegmentSrv, private templateSrv, $timeout) {
+  constructor(
+    $scope: any,
+    $injector: auto.IInjectorService,
+    private uiSegmentSrv: any,
+    private templateSrv: TemplateSrv,
+    $timeout: any
+  ) {
     super($scope, $injector);
     this.supportsTags = this.datasource.supportsTags;
     this.paused = false;
@@ -62,7 +70,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     this.segments.push(this.uiSegmentSrv.newSelectMetric());
   }
 
-  checkOtherSegments(fromIndex) {
+  checkOtherSegments(fromIndex: number) {
     if (this.queryModel.segments.length === 1 && this.queryModel.segments[0].type === 'series-ref') {
       return;
     }
@@ -79,7 +87,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
 
     return this.datasource
       .metricFindQuery(path)
-      .then(segments => {
+      .then((segments: any) => {
         if (segments.length === 0) {
           if (path !== '') {
             this.queryModel.segments = this.queryModel.segments.splice(0, fromIndex);
@@ -94,18 +102,18 @@ export class GraphiteQueryCtrl extends QueryCtrl {
           }
         }
       })
-      .catch(err => {
+      .catch((err: any) => {
         appEvents.emit('alert-error', ['Error', err]);
       });
   }
 
-  setSegmentFocus(segmentIndex) {
+  setSegmentFocus(segmentIndex: any) {
     _.each(this.segments, (segment, index) => {
       segment.focus = segmentIndex === index;
     });
   }
 
-  getAltSegments(index, prefix) {
+  getAltSegments(index: number, prefix: string) {
     let query = prefix && prefix.length > 0 ? '*' + prefix + '*' : '*';
     if (index > 0) {
       query = this.queryModel.getSegmentPathUpTo(index) + '.' + query;
@@ -117,7 +125,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
 
     return this.datasource
       .metricFindQuery(query, options)
-      .then(segments => {
+      .then((segments: any[]) => {
         const altSegments = _.map(segments, segment => {
           return this.uiSegmentSrv.newSegment({
             value: segment.text,
@@ -167,13 +175,15 @@ export class GraphiteQueryCtrl extends QueryCtrl {
           return altSegments;
         }
       })
-      .catch(err => {
-        return [];
-      });
+      .catch(
+        (err: any): any[] => {
+          return [];
+        }
+      );
   }
 
-  addAltTagSegments(prefix, altSegments) {
-    return this.getTagsAsSegments(prefix).then(tagSegments => {
+  addAltTagSegments(prefix: string, altSegments: any[]) {
+    return this.getTagsAsSegments(prefix).then((tagSegments: any[]) => {
       tagSegments = _.map(tagSegments, segment => {
         segment.value = TAG_PREFIX + segment.value;
         return segment;
@@ -186,7 +196,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     altSegments = _.remove(altSegments, s => s.value === '_tagged');
   }
 
-  segmentValueChanged(segment, segmentIndex) {
+  segmentValueChanged(segment: { type: string; value: string; expandable: any }, segmentIndex: number) {
     this.error = null;
     this.queryModel.updateSegmentValue(segment, segmentIndex);
 
@@ -214,7 +224,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     this.targetChanged();
   }
 
-  spliceSegments(index) {
+  spliceSegments(index: any) {
     this.segments = this.segments.splice(0, index);
     this.queryModel.segments = this.queryModel.segments.splice(0, index);
   }
@@ -246,7 +256,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     }
   }
 
-  addFunction(funcDef) {
+  addFunction(funcDef: any) {
     const newFunc = this.datasource.createFuncInstance(funcDef, {
       withDefaultParams: true,
     });
@@ -267,17 +277,17 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     }
   }
 
-  removeFunction(func) {
+  removeFunction(func: any) {
     this.queryModel.removeFunction(func);
     this.targetChanged();
   }
 
-  moveFunction(func, offset) {
+  moveFunction(func: any, offset: any) {
     this.queryModel.moveFunction(func, offset);
     this.targetChanged();
   }
 
-  addSeriesByTagFunc(tag) {
+  addSeriesByTagFunc(tag: string) {
     const newFunc = this.datasource.createFuncInstance('seriesByTag', {
       withDefaultParams: false,
     });
@@ -291,7 +301,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     this.parseTarget();
   }
 
-  smartlyHandleNewAliasByNode(func) {
+  smartlyHandleNewAliasByNode(func: { def: { name: string }; params: number[]; added: boolean }) {
     if (func.def.name !== 'aliasByNode') {
       return;
     }
@@ -307,25 +317,25 @@ export class GraphiteQueryCtrl extends QueryCtrl {
   }
 
   getAllTags() {
-    return this.datasource.getTags().then(values => {
+    return this.datasource.getTags().then((values: any[]) => {
       const altTags = _.map(values, 'text');
       altTags.splice(0, 0, this.removeTagValue);
       return mapToDropdownOptions(altTags);
     });
   }
 
-  getTags(index, tagPrefix) {
+  getTags(index: number, tagPrefix: any) {
     const tagExpressions = this.queryModel.renderTagExpressions(index);
-    return this.datasource.getTagsAutoComplete(tagExpressions, tagPrefix).then(values => {
+    return this.datasource.getTagsAutoComplete(tagExpressions, tagPrefix).then((values: any) => {
       const altTags = _.map(values, 'text');
       altTags.splice(0, 0, this.removeTagValue);
       return mapToDropdownOptions(altTags);
     });
   }
 
-  getTagsAsSegments(tagPrefix) {
+  getTagsAsSegments(tagPrefix: string) {
     const tagExpressions = this.queryModel.renderTagExpressions();
-    return this.datasource.getTagsAutoComplete(tagExpressions, tagPrefix).then(values => {
+    return this.datasource.getTagsAutoComplete(tagExpressions, tagPrefix).then((values: any) => {
       return _.map(values, val => {
         return this.uiSegmentSrv.newSegment({
           value: val.text,
@@ -340,18 +350,18 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     return mapToDropdownOptions(GRAPHITE_TAG_OPERATORS);
   }
 
-  getAllTagValues(tag) {
+  getAllTagValues(tag: { key: any }) {
     const tagKey = tag.key;
-    return this.datasource.getTagValues(tagKey).then(values => {
+    return this.datasource.getTagValues(tagKey).then((values: any[]) => {
       const altValues = _.map(values, 'text');
       return mapToDropdownOptions(altValues);
     });
   }
 
-  getTagValues(tag, index, valuePrefix) {
+  getTagValues(tag: { key: any }, index: number, valuePrefix: any) {
     const tagExpressions = this.queryModel.renderTagExpressions(index);
     const tagKey = tag.key;
-    return this.datasource.getTagValuesAutoComplete(tagExpressions, tagKey, valuePrefix).then(values => {
+    return this.datasource.getTagValuesAutoComplete(tagExpressions, tagKey, valuePrefix).then((values: any[]) => {
       const altValues = _.map(values, 'text');
       // Add template variables as additional values
       _.eachRight(this.templateSrv.variables, variable => {
@@ -361,12 +371,12 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     });
   }
 
-  tagChanged(tag, tagIndex) {
+  tagChanged(tag: any, tagIndex: any) {
     this.queryModel.updateTag(tag, tagIndex);
     this.targetChanged();
   }
 
-  addNewTag(segment) {
+  addNewTag(segment: { value: any }) {
     const newTagKey = segment.value;
     const newTag = { key: newTagKey, operator: '=', value: '' };
     this.queryModel.addTag(newTag);
@@ -374,7 +384,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     this.fixTagSegments();
   }
 
-  removeTag(index) {
+  removeTag(index: any) {
     this.queryModel.removeTag(index);
     this.targetChanged();
   }
@@ -384,7 +394,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     this.addTagSegments = [this.uiSegmentSrv.newPlusButton()];
   }
 
-  showDelimiter(index) {
+  showDelimiter(index: number) {
     return index !== this.queryModel.tags.length - 1;
   }
 
@@ -402,7 +412,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
   }
 }
 
-function mapToDropdownOptions(results) {
+function mapToDropdownOptions(results: any[]) {
   return _.map(results, value => {
     return { text: value, value: value };
   });
diff --git a/public/app/plugins/datasource/graphite/specs/datasource.test.ts b/public/app/plugins/datasource/graphite/specs/datasource.test.ts
index d0f83ab2717..ef5b8a55bb6 100644
--- a/public/app/plugins/datasource/graphite/specs/datasource.test.ts
+++ b/public/app/plugins/datasource/graphite/specs/datasource.test.ts
@@ -1,5 +1,6 @@
 import { GraphiteDatasource } from '../datasource';
 import _ from 'lodash';
+// @ts-ignore
 import $q from 'q';
 import { TemplateSrvStub } from 'test/specs/helpers';
 import { dateTime } from '@grafana/ui/src/utils/moment_wrapper';
@@ -7,13 +8,15 @@ import { dateTime } from '@grafana/ui/src/utils/moment_wrapper';
 describe('graphiteDatasource', () => {
   const ctx: any = {
     backendSrv: {},
-    $q: $q,
+    $q,
+    // @ts-ignore
     templateSrv: new TemplateSrvStub(),
     instanceSettings: { url: 'url', name: 'graphiteProd', jsonData: {} },
   };
 
   beforeEach(() => {
     ctx.instanceSettings.url = '/api/datasources/proxy/1';
+    // @ts-ignore
     ctx.ds = new GraphiteDatasource(ctx.instanceSettings, ctx.$q, ctx.backendSrv, ctx.templateSrv);
   });
 
@@ -26,18 +29,18 @@ describe('graphiteDatasource', () => {
       maxDataPoints: 500,
     };
 
-    let results;
-    let requestOptions;
+    let results: any;
+    let requestOptions: any;
 
     beforeEach(async () => {
-      ctx.backendSrv.datasourceRequest = options => {
+      ctx.backendSrv.datasourceRequest = (options: any) => {
         requestOptions = options;
         return ctx.$q.when({
           data: [{ target: 'prod1.count', datapoints: [[10, 1], [12, 1]] }],
         });
       };
 
-      await ctx.ds.query(query).then(data => {
+      await ctx.ds.query(query).then((data: any) => {
         results = data;
       });
     });
@@ -79,7 +82,7 @@ describe('graphiteDatasource', () => {
   });
 
   describe('when fetching Graphite Events as annotations', () => {
-    let results;
+    let results: any;
 
     const options = {
       annotation: {
@@ -106,11 +109,11 @@ describe('graphiteDatasource', () => {
       };
 
       beforeEach(async () => {
-        ctx.backendSrv.datasourceRequest = options => {
+        ctx.backendSrv.datasourceRequest = (options: any) => {
           return ctx.$q.when(response);
         };
 
-        await ctx.ds.annotationQuery(options).then(data => {
+        await ctx.ds.annotationQuery(options).then((data: any) => {
           results = data;
         });
       });
@@ -136,11 +139,11 @@ describe('graphiteDatasource', () => {
         ],
       };
       beforeEach(() => {
-        ctx.backendSrv.datasourceRequest = options => {
+        ctx.backendSrv.datasourceRequest = (options: any) => {
           return ctx.$q.when(response);
         };
 
-        ctx.ds.annotationQuery(options).then(data => {
+        ctx.ds.annotationQuery(options).then((data: any) => {
           results = data;
         });
         // ctx.$rootScope.$apply();
@@ -218,11 +221,11 @@ describe('graphiteDatasource', () => {
   });
 
   describe('querying for template variables', () => {
-    let results;
-    let requestOptions;
+    let results: any;
+    let requestOptions: any;
 
     beforeEach(() => {
-      ctx.backendSrv.datasourceRequest = options => {
+      ctx.backendSrv.datasourceRequest = (options: any) => {
         requestOptions = options;
         return ctx.$q.when({
           data: ['backend_01', 'backend_02'],
@@ -231,7 +234,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tags query', () => {
-      ctx.ds.metricFindQuery('tags()').then(data => {
+      ctx.ds.metricFindQuery('tags()').then((data: any) => {
         results = data;
       });
 
@@ -241,7 +244,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tags query with a filter expression', () => {
-      ctx.ds.metricFindQuery('tags(server=backend_01)').then(data => {
+      ctx.ds.metricFindQuery('tags(server=backend_01)').then((data: any) => {
         results = data;
       });
 
@@ -251,7 +254,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tags query for an expression with whitespace after', () => {
-      ctx.ds.metricFindQuery('tags(server=backend_01 )').then(data => {
+      ctx.ds.metricFindQuery('tags(server=backend_01 )').then((data: any) => {
         results = data;
       });
 
@@ -261,7 +264,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tag values query for one tag', () => {
-      ctx.ds.metricFindQuery('tag_values(server)').then(data => {
+      ctx.ds.metricFindQuery('tag_values(server)').then((data: any) => {
         results = data;
       });
 
@@ -272,7 +275,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tag values query for a tag and expression', () => {
-      ctx.ds.metricFindQuery('tag_values(server,server=~backend*)').then(data => {
+      ctx.ds.metricFindQuery('tag_values(server,server=~backend*)').then((data: any) => {
         results = data;
       });
 
@@ -283,7 +286,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tag values query for a tag with whitespace after', () => {
-      ctx.ds.metricFindQuery('tag_values(server )').then(data => {
+      ctx.ds.metricFindQuery('tag_values(server )').then((data: any) => {
         results = data;
       });
 
@@ -294,7 +297,7 @@ describe('graphiteDatasource', () => {
     });
 
     it('should generate tag values query for a tag and expression with whitespace after', () => {
-      ctx.ds.metricFindQuery('tag_values(server , server=~backend* )').then(data => {
+      ctx.ds.metricFindQuery('tag_values(server , server=~backend* )').then((data: any) => {
         results = data;
       });
 
@@ -306,7 +309,7 @@ describe('graphiteDatasource', () => {
 
     it('/metrics/find should be POST', () => {
       ctx.templateSrv.setGrafanaVariable('foo', 'bar');
-      ctx.ds.metricFindQuery('[[foo]]').then(data => {
+      ctx.ds.metricFindQuery('[[foo]]').then((data: any) => {
         results = data;
       });
       expect(requestOptions.url).toBe('/api/datasources/proxy/1/metrics/find');
@@ -318,11 +321,12 @@ describe('graphiteDatasource', () => {
   });
 });
 
-function accessScenario(name, url, fn) {
+function accessScenario(name: string, url: string, fn: any) {
   describe('access scenario ' + name, () => {
     const ctx: any = {
       backendSrv: {},
-      $q: $q,
+      $q,
+      // @ts-ignore
       templateSrv: new TemplateSrvStub(),
       instanceSettings: { url: 'url', name: 'graphiteProd', jsonData: {} },
     };
@@ -336,6 +340,7 @@ function accessScenario(name, url, fn) {
 
       it('tracing headers should be added', () => {
         ctx.instanceSettings.url = url;
+        // @ts-ignore
         const ds = new GraphiteDatasource(ctx.instanceSettings, ctx.$q, ctx.backendSrv, ctx.templateSrv);
         ds.addTracingHeaders(httpOptions, options);
         fn(httpOptions);
@@ -344,12 +349,12 @@ function accessScenario(name, url, fn) {
   });
 }
 
-accessScenario('with proxy access', '/api/datasources/proxy/1', httpOptions => {
+accessScenario('with proxy access', '/api/datasources/proxy/1', (httpOptions: any) => {
   expect(httpOptions.headers['X-Dashboard-Id']).toBe(1);
   expect(httpOptions.headers['X-Panel-Id']).toBe(2);
 });
 
-accessScenario('with direct access', 'http://localhost:8080', httpOptions => {
+accessScenario('with direct access', 'http://localhost:8080', (httpOptions: any) => {
   expect(httpOptions.headers['X-Dashboard-Id']).toBe(undefined);
   expect(httpOptions.headers['X-Panel-Id']).toBe(undefined);
 });
diff --git a/public/app/plugins/datasource/graphite/specs/query_ctrl.test.ts b/public/app/plugins/datasource/graphite/specs/query_ctrl.test.ts
index de0b271f2ed..e31335fab3e 100644
--- a/public/app/plugins/datasource/graphite/specs/query_ctrl.test.ts
+++ b/public/app/plugins/datasource/graphite/specs/query_ctrl.test.ts
@@ -29,7 +29,7 @@ describe('GraphiteQueryCtrl', () => {
 
     ctx.ctrl = new GraphiteQueryCtrl(
       {},
-      {},
+      {} as any,
       //@ts-ignore
       new uiSegmentSrv({ trustAsHtml: html => html }, { highlightVariablesAsHtml: () => {} }),
       //@ts-ignore