working with recent toolkit

package.json

@@ -4,6 +4,7 @@
   "description": "Kubernetes App",
   "scripts": {
     "build": "grafana-toolkit plugin:build",
+    "dev": "grafana-toolkit plugin:dev",
     "test": "grafana-toolkit plugin:test",
     "test:coverage": "yarn test --coverage",
     "test:badges": "yarn test:coverage && jest-coverage-badges",
@@ -23,11 +24,8 @@
     "@grafana/toolkit": "next",
     "@grafana/ui": "next",
     "@types/jest": "^24.0.13",
-    "@types/jsonata": "^1.3.1",
     "@types/lodash": "^4.14.134",
-    "enzyme": "^3.9.0",
-    "enzyme-adapter-react-16": "^1.13.1",
-    "enzyme-to-json": "^3.3.5",
+    "grafana-sdk-mocks": "grafana/grafana-sdk-mocks",
     "jest": "^24.8.0",
     "jest-coverage-badges": "^1.1.2",
     "jquery": "^3.4.1",

src/components/clusters/clusterConfig.ts

@@ -2,10 +2,10 @@ import _ from 'lodash';
 import appEvents from 'app/core/app_events';
 import angular from 'angular';
 
-const nodeExporterImage='quay.io/prometheus/node-exporter:v0.15.0';
+const nodeExporterImage = 'quay.io/prometheus/node-exporter:v0.15.0';
 const kubestateImage = 'quay.io/coreos/kube-state-metrics:v1.1.0';
 
-let kubestateDeployment = {
+const kubestateDeployment = {
   "apiVersion": "apps/v1beta1",
   "kind": "Deployment",
   "metadata": {
@@ -127,12 +127,12 @@ export class ClusterConfigCtrl {
   showHelp: boolean;
   showPrometheusExample: boolean;
   datasources: [any];
-  
+
   static templateUrl = 'components/clusters/partials/cluster_config.html';
 
   /** @ngInject */
   constructor($scope, $injector, private backendSrv, private $q, private contextSrv, private $location, private $window, private alertSrv) {
-    var self = this;
+    const self = this;
     this.isOrgEditor = contextSrv.hasRole('Editor') || contextSrv.hasRole('Admin');
     this.cluster = {
       type: 'grafana-kubernetes-datasource'
@@ -157,8 +157,8 @@ export class ClusterConfigCtrl {
   }
 
   getDatasources() {
-    var self = this;
-    var promises = [];
+    const self = this;
+    const promises = [];
     if ("cluster" in self.$location.search()) {
       promises.push(self.getCluster(this.$location.search().cluster).then(() => {
         return self.getDeployments().then(ds => {
@@ -177,7 +177,7 @@ export class ClusterConfigCtrl {
   }
 
   getCluster(id) {
-    var self = this;
+    const self = this;
     return this.backendSrv.get('/api/datasources/' + id)
       .then((ds) => {
         if (!(ds.jsonData.ds)) {
@@ -188,7 +188,7 @@ export class ClusterConfigCtrl {
   }
 
   getPrometheusDatasources() {
-    var self = this;
+    const self = this;
     return this.backendSrv.get('/api/datasources')
     .then((result) => {
       // self.hostedMetricsDS = _.filter(result, obj =>
@@ -201,7 +201,7 @@ export class ClusterConfigCtrl {
   }
 
   getDeployments() {
-    var self = this;
+    const self = this;
     return this.backendSrv.request({
       url: 'api/datasources/proxy/' + self.cluster.id + '/apis/apps/v1beta1/namespaces/kube-system/deployments',
       method: 'GET',
@@ -225,30 +225,30 @@ export class ClusterConfigCtrl {
   }
 
   savePrometheusConfigToFile() {
-    let blob = new Blob([this.generatePrometheusConfig()], {
+    const blob = new Blob([this.generatePrometheusConfig()], {
       type: "application/yaml"
     });
     this.saveToFile('prometheus.yml', blob);
   }
 
   saveNodeExporterDSToFile() {
-    let blob = new Blob([angular.toJson(nodeExporterDaemonSet, true)], {
+    const blob = new Blob([angular.toJson(nodeExporterDaemonSet, true)], {
       type: "application/json"
     });
     this.saveToFile('grafanak8s-node-exporter-ds.json', blob);
   }
 
   saveKubeStateDeployToFile() {
-    let blob = new Blob([angular.toJson(kubestateDeployment, true)], {
+    const blob = new Blob([angular.toJson(kubestateDeployment, true)], {
       type: "application/json"
     });
     this.saveToFile('grafanak8s-kubestate-deploy.json', blob);
   }
 
   saveToFile(filename, blob) {
-    let blobUrl = window.URL.createObjectURL(blob);
+    const blobUrl = window.URL.createObjectURL(blob);
 
-    let element = document.createElement('a');
+    const element = document.createElement('a');
     element.setAttribute('href', blobUrl);
     element.setAttribute('download', filename);
     element.style.display = 'none';
@@ -258,7 +258,7 @@ export class ClusterConfigCtrl {
   }
 
   deploy() {
-    var question = !this.prometheusDeployed ?
+    const question = !this.prometheusDeployed ?
       'This action will deploy Prometheus exporters to your Kubernetes cluster.' +
       'Are you sure you want to deploy?' :
       'This action will update the Prometheus exporters on your Kubernetes cluster. ' +
@@ -275,7 +275,7 @@ export class ClusterConfigCtrl {
   }
 
   undeploy() {
-    var question = 'This action will remove the DaemonSet on your Kubernetes cluster that collects health metrics. ' +
+    const question = 'This action will remove the DaemonSet on your Kubernetes cluster that collects health metrics. ' +
       'Are you sure you want to remove it?';
 
     appEvents.emit('confirm-modal', {
@@ -313,8 +313,8 @@ export class ClusterConfigCtrl {
       }
     }).then(result => {
       if (!result.resources || result.resources.length === 0) {
-        throw "This Kubernetes cluster does not support v1beta1 of the API which is needed to deploy automatically. " +
-          "You can install manually using the instructions at the bottom of the page.";
+        throw new Error("This Kubernetes cluster does not support v1beta1 of the API which is needed to deploy automatically. " +
+          "You can install manually using the instructions at the bottom of the page.");
       }
     });
   }
@@ -380,7 +380,7 @@ export class ClusterConfigCtrl {
   }
 
   deletePods() {
-    var self = this;
+    const self = this;
     return this.backendSrv.request({
       url: 'api/datasources/proxy/' + self.cluster.id +
         '/api/v1/namespaces/kube-system/pods?labelSelector=grafanak8sapp%3Dtrue',
@@ -390,10 +390,10 @@ export class ClusterConfigCtrl {
       }
     }).then(pods => {
       if (!pods || pods.items.length === 0) {
-        throw "No pods found to update.";
+        throw new Error("No pods found to update.");
       }
 
-      var promises = [];
+      const promises = [];
 
       _.forEach(pods.items, pod => {
         promises.push(this.backendSrv.request({
@@ -411,7 +411,7 @@ export class ClusterConfigCtrl {
   }
 
   deployPrometheus() {
-    let self = this;
+    const self = this;
     if (!this.cluster || !this.cluster.id) {
       this.alertSrv.set("Error", "Could not connect to cluster.", 'error');
       return;
@@ -436,7 +436,7 @@ export class ClusterConfigCtrl {
   }
 
   undeployPrometheus() {
-    var self = this;
+    const self = this;
     return this.checkApiVersion(self.cluster.id)
       .then(() => {
         return this.deleteDeployment(self.cluster.id, 'kube-state-metrics');

src/components/clusters/clusterInfo.ts

@@ -12,7 +12,7 @@ export class ClusterInfoCtrl {
   clusterDS: any;
 
   static templateUrl = 'components/clusters/partials/cluster_info.html';
-  
+
   /** @ngInject */
   constructor($scope, $injector, private backendSrv, private datasourceSrv, private $q, private $location, private alertSrv) {
     this.$q = $q;
@@ -83,7 +83,7 @@ export class ClusterInfoCtrl {
   }
 
   goToNodeDashboard(node, evt) {
-    var clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
+    const clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
     if (clickTargetIsLinkOrHasLinkParents === false) {
       this.$location.path("dashboard/db/k8s-node")
       .search({
@@ -95,7 +95,7 @@ export class ClusterInfoCtrl {
   }
 
   goToWorkloads(ns, evt) {
-    var clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
+    const clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
     if (clickTargetIsLinkOrHasLinkParents === false) {
       this.$location.path("plugins/grafana-kubernetes-app/page/cluster-workloads")
       .search({
@@ -106,11 +106,11 @@ export class ClusterInfoCtrl {
   }
 
   goToNodeInfo(node, evt) {
-    var clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
+    const clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
 
-    var closestElm = _.head($(evt.target).closest('div'));
-    var clickTargetClickAttr = _.find(closestElm.attributes, {name: "ng-click"});
-    var clickTargetIsNodeDashboard = clickTargetClickAttr ? clickTargetClickAttr.value === "ctrl.goToNodeDashboard(node, $event)" : false;
+    const closestElm = _.head($(evt.target).closest('div'));
+    const clickTargetClickAttr = _.find(closestElm.attributes, {name: "ng-click"});
+    const clickTargetIsNodeDashboard = clickTargetClickAttr ? clickTargetClickAttr.value === "ctrl.goToNodeDashboard(node, $event)" : false;
     if (clickTargetIsLinkOrHasLinkParents === false &&
         clickTargetIsNodeDashboard === false) {
       this.$location.path("plugins/grafana-kubernetes-app/page/node-info")

src/components/clusters/clusterWorkloads.ts

@@ -52,7 +52,7 @@ export class ClusterWorkloadsCtrl {
   }
 
   getWorkloads() {
-    let namespace = this.namespace;
+    const namespace = this.namespace;
     this.clusterDS.getNamespaces().then(namespaces => {
       this.namespaces = namespaces;
     });
@@ -71,7 +71,7 @@ export class ClusterWorkloadsCtrl {
   }
 
   componentHealth(component) {
-    var health = "unhealthy";
+    let health = "unhealthy";
     _.forEach(component.conditions, function(condition) {
       if ((condition.type === "Healthy") && (condition.status === "True")) {
         health = "healthy";
@@ -106,11 +106,11 @@ export class ClusterWorkloadsCtrl {
   }
 
   goToPodInfo(pod, evt) {
-    var clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
+    const clickTargetIsLinkOrHasLinkParents = $(evt.target).closest('a').length > 0;
 
-    var closestElm = _.head($(evt.target).closest('div'));
-    var clickTargetClickAttr = _.find(closestElm.attributes, {name: "ng-click"});
-    var clickTargetIsNodeDashboard = clickTargetClickAttr ? clickTargetClickAttr.value === "ctrl.goToPodDashboard(pod, $event)" : false;
+    const closestElm = _.head($(evt.target).closest('div'));
+    const clickTargetClickAttr = _.find(closestElm.attributes, {name: "ng-click"});
+    const clickTargetIsNodeDashboard = clickTargetClickAttr ? clickTargetClickAttr.value === "ctrl.goToPodDashboard(pod, $event)" : false;
     if (clickTargetIsLinkOrHasLinkParents === false &&
         clickTargetIsNodeDashboard === false) {
       this.$location.path("plugins/grafana-kubernetes-app/page/pod-info")

src/components/clusters/clusters.ts

@@ -12,7 +12,7 @@ export class ClustersCtrl {
 
   /** @ngInject */
   constructor($scope, $injector, private backendSrv, private contextSrv, private $location) {
-    var self = this;
+    const self = this;
     this.isOrgEditor = contextSrv.hasRole('Editor') || contextSrv.hasRole('Admin');
     document.title = 'Grafana Kubernetes App';
     this.clusters = {};
@@ -23,7 +23,7 @@ export class ClustersCtrl {
   }
 
   getClusters() {
-    var self = this;
+    const self = this;
     return this.backendSrv.get('/api/datasources')
     .then((result) => {
       self.clusters = _.filter(result, {"type": "grafana-kubernetes-datasource"});

src/components/clusters/nodeInfo.ts

@@ -21,8 +21,8 @@ export class NodeInfoCtrl {
       alertSrv.set("no cluster specified.", "no cluster specified in url", 'error');
       return;
     } else {
-      let cluster_id = $location.search().cluster;
-      let node_name  = $location.search().node;
+      const cluster_id = $location.search().cluster;
+      const node_name  = $location.search().node;
 
       this.loadDatasource(cluster_id).then(() => {
         this.clusterDS.getNode(node_name).then(node => {
@@ -54,7 +54,7 @@ export class NodeInfoCtrl {
   }
 
   conditionStatus(condition) {
-    var status;
+    let status;
     if (condition.type === "Ready") {
       status = condition.status === "True";
     } else {

src/components/clusters/podInfo.ts

@@ -8,7 +8,7 @@ export class PodInfoCtrl {
   datasource: any;
 
   static templateUrl = 'components/clusters/partials/pod_info.html';
-  
+
   /** @ngInject */
   constructor($scope, $injector, private backendSrv, private datasourceSrv, private $q, private $location, private alertSrv) {
     document.title = 'Grafana Kubernetes App';
@@ -20,7 +20,7 @@ export class PodInfoCtrl {
       return;
     } else {
       this.cluster_id = $location.search().cluster;
-      let pod_name    = $location.search().pod;
+      const pod_name    = $location.search().pod;
 
       this.loadDatasource(this.cluster_id).then(() => {
         this.clusterDS.getPod(pod_name).then(pod => {
@@ -43,7 +43,7 @@ export class PodInfoCtrl {
   }
 
   conditionStatus(condition) {
-    var status;
+    let status;
     if (condition.type === "Ready") {
       status = condition.status === "True";
     } else {