fix(datasource query editors): fixed issue with duplicate query and the query letter (refId)

CHANGELOG.md

@@ -23,6 +23,7 @@ it allows you to add queries of differnet data source types & instances to the s
 - Notice to makers/users of custom data sources, there is a minor breaking change in 2.2 that
 require an update to custom data sources for them to work in 2.2. [Read this doc](https://github.com/grafana/grafana/tree/master/docs/sources/datasources/plugin_api.md) for more on the
 data source api change.
+- The duplicate query function used in data source editors is changed, and moveMetricQuery function was renamed
 
  2.1.3 (2015-08-24)
 

public/app/features/dashboard/dashboardSrv.js

@@ -184,12 +184,48 @@ function (angular, $, kbn, _, moment) {
       return newPanel;
     };
 
+    p.getNextQueryLetter = function(panel) {
+      var letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+
+      return _.find(letters, function(refId) {
+        return _.every(panel.targets, function(other) {
+          return other.refId !== refId;
+        });
+      });
+    };
+
+    p.addDataQueryTo = function(panel, datasource) {
+      var target = {
+        refId: this.getNextQueryLetter(panel)
+      };
+
+      if (datasource) {
+        target.datasource = datasource.name;
+      }
+
+      panel.targets.push(target);
+    };
+
+    p.removeDataQuery = function (panel, query) {
+      panel.targets = _.without(panel.targets, query);
+    };
+
+    p.duplicateDataQuery = function(panel, query) {
+      var clone = angular.copy(query);
+      clone.refId = this.getNextQueryLetter(panel);
+      panel.targets.push(clone);
+    };
+
+    p.moveDataQuery = function(panel, fromIndex, toIndex) {
+      _.move(panel.targets, fromIndex, toIndex);
+    };
+
     p.formatDate = function(date, format) {
       format = format || 'YYYY-MM-DD HH:mm:ss';
 
       return this.timezone === 'browser' ?
-              moment(date).format(format) :
-              moment.utc(date).format(format);
+        moment(date).format(format) :
+        moment.utc(date).format(format);
     };
 
     p._updateSchema = function(old) {

public/app/features/panel/panelSrv.js

@@ -44,27 +44,22 @@ function (angular, _, config) {
       };
 
       $scope.addDataQuery = function(datasource) {
-        var letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
-        var target = {};
-
-        if (datasource) {
-          target.datasource = datasource.name;
-        }
-
-        target.refId = _.find(letters, function(refId) {
-          return _.every($scope.panel.targets, function(other) {
-            return other.refId !== refId;
-          });
-        });
-
-        $scope.panel.targets.push(target);
+        $scope.dashboard.addDataQueryTo($scope.panel, datasource);
       };
 
       $scope.removeDataQuery = function (query) {
-        $scope.panel.targets = _.without($scope.panel.targets, query);
+        $scope.dashboard.removeDataQuery($scope.panel, query);
         $scope.get_data();
       };
 
+      $scope.duplicateDataQuery = function(query) {
+        $scope.dashboard.duplicateDataQuery($scope.panel, query);
+      };
+
+      $scope.moveDataQuery = function(fromIndex, toIndex) {
+        $scope.dashboard.moveDataQuery($scope.panel, fromIndex, toIndex);
+      };
+
       $scope.setDatasource = function(datasource) {
         // switching to mixed
         if (datasource.meta.mixed) {

public/app/plugins/datasource/graphite/partials/query.editor.html

@@ -20,13 +20,13 @@
 						</a>
 					</li>
 					<li role="menuitem">
-						<a tabindex="1" ng-click="duplicate()">Duplicate</a>
+						<a tabindex="1" ng-click="duplicateDataQuery(target)">Duplicate</a>
 					</li>
 					<li role="menuitem">
-						<a tabindex="1" ng-click="moveMetricQuery($index, $index-1)">Move up</a>
+						<a tabindex="1" ng-click="moveDataQuery($index, $index-1)">Move up</a>
 					</li>
 					<li role="menuitem">
-						<a tabindex="1" ng-click="moveMetricQuery($index, $index+1)">Move down</a>
+						<a tabindex="1" ng-click="moveDataQuery($index, $index+1)">Move down</a>
 					</li>
 				</ul>
 			</div>

public/app/plugins/datasource/graphite/queryCtrl.js

@@ -284,15 +284,6 @@ function (angular, _, config, gfunc, Parser) {
       }
     };
 
-    $scope.moveMetricQuery = function(fromIndex, toIndex) {
-      _.move($scope.panel.targets, fromIndex, toIndex);
-    };
-
-    $scope.duplicate = function() {
-      var clone = angular.copy($scope.target);
-      $scope.panel.targets.push(clone);
-    };
-
     function MetricSegment(options) {
       if (options === '*' || options.value === '*') {
         this.value = '*';

public/app/plugins/datasource/influxdb/partials/query.editor.html

@@ -16,9 +16,9 @@
 					</a>
 					<ul class="dropdown-menu pull-right" role="menu">
 						<li role="menuitem"><a tabindex="1" ng-click="toggleQueryMode()">Switch editor mode</a></li>
-						<li role="menuitem"><a tabindex="1" ng-click="duplicate()">Duplicate</a></li>
-						<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index-1)">Move up</a></li>
-						<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index+1)">Move down</a></li>
+						<li role="menuitem"><a tabindex="1" ng-click="duplicateDataQuery(target)">Duplicate</a></li>
+						<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index-1)">Move up</a></li>
+						<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index+1)">Move down</a></li>
 					</ul>
 				</div>
 			</li>

public/app/plugins/datasource/influxdb/queryCtrl.js

@@ -116,15 +116,6 @@ function (angular, _, InfluxQueryBuilder) {
       $scope.target.rawQuery = !$scope.target.rawQuery;
     };
 
-    $scope.moveMetricQuery = function(fromIndex, toIndex) {
-      _.move($scope.panel.targets, fromIndex, toIndex);
-    };
-
-    $scope.duplicate = function() {
-      var clone = angular.copy($scope.target);
-      $scope.panel.targets.push(clone);
-    };
-
     $scope.getMeasurements = function () {
       var query = $scope.queryBuilder.buildExploreQuery('MEASUREMENTS');
       return $scope.datasource.metricFindQuery(query)

public/app/plugins/datasource/influxdb_08/partials/query.editor.html

@@ -10,9 +10,9 @@
 				</a>
 				<ul class="dropdown-menu pull-right" role="menu">
 					<li role="menuitem"><a tabindex="1" ng-click="toggleQueryMode()">Switch editor mode</a></li>
-					<li role="menuitem"><a tabindex="1" ng-click="duplicate()">Duplicate</a></li>
-					<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index-1)">Move up </a></li>
-					<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index+1)">Move down</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="duplicateDataQuery(target)">Duplicate</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index-1)">Move up </a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index+1)">Move down</a></li>
 				</ul>
 			</div>
 		</li>

public/app/plugins/datasource/influxdb_08/queryCtrl.js

@@ -1,8 +1,7 @@
 define([
   'angular',
-  'lodash'
 ],
-function (angular, _) {
+function (angular) {
   'use strict';
 
   var module = angular.module('grafana.controllers');
@@ -90,15 +89,6 @@ function (angular, _) {
       }
     };
 
-    $scope.moveMetricQuery = function(fromIndex, toIndex) {
-      _.move($scope.panel.targets, fromIndex, toIndex);
-    };
-
-    $scope.duplicate = function() {
-      var clone = angular.copy($scope.target);
-      $scope.panel.targets.push(clone);
-    };
-
   });
 
 });

public/app/plugins/datasource/kairosdb/partials/query.editor.html

@@ -9,9 +9,9 @@
 					<i class="fa fa-bars"></i>
 				</a>
 				<ul class="dropdown-menu pull-right" role="menu">
-					<li role="menuitem"><a tabindex="1" ng-click="duplicate()">Duplicate</a></li>
-					<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index-1)">Move up</a></li>
-					<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index+1)">Move down</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="duplicateDataQuery(target)">Duplicate</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index-1)">Move up</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index+1)">Move down</a></li>
 				</ul>
 			</div>
 		</li>

public/app/plugins/datasource/kairosdb/queryCtrl.js

@@ -37,15 +37,6 @@ function (angular, _) {
       $scope.get_data();
     };
 
-    $scope.duplicate = function() {
-      var clone = angular.copy($scope.target);
-      $scope.panel.targets.push(clone);
-    };
-
-    $scope.moveMetricQuery = function(fromIndex, toIndex) {
-      _.move($scope.panel.targets, fromIndex, toIndex);
-    };
-
     $scope.getTextValues = function(metricFindResult) {
       return _.map(metricFindResult, function(value) { return value.text; });
     };

public/app/plugins/datasource/opentsdb/partials/query.editor.html

@@ -9,11 +9,10 @@
 					<i class="fa fa-bars"></i>
 				</a>
 				<ul class="dropdown-menu pull-right" role="menu">
-					<li role="menuitem">
-						<a tabindex="1" ng-click="duplicate()">
-							Duplicate
-						</a>
-					</li>
+					<li role="menuitem"><a tabindex="1" ng-click="toggleQueryMode()">Switch editor mode</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="duplicateDataQuery(target)">Duplicate</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index-1)">Move up</a></li>
+					<li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index+1)">Move down</a></li>
 				</ul>
 			</div>
 		</li>

public/app/plugins/datasource/opentsdb/queryCtrl.js

@@ -33,11 +33,6 @@ function (angular, _, kbn) {
       }
     };
 
-    $scope.duplicate = function() {
-      var clone = angular.copy($scope.target);
-      $scope.panel.targets.push(clone);
-    };
-
     $scope.getTextValues = function(metricFindResult) {
       return _.map(metricFindResult, function(value) { return value.text; });
     };

public/test/specs/dashboardSrv-specs.js

@@ -49,6 +49,39 @@ define([
       });
     });
 
+    describe('addDataQueryTo', function() {
+      var dashboard, panel;
+
+      beforeEach(function() {
+        panel = {targets:[]};
+        dashboard = _dashboardSrv.create({});
+        dashboard.rows.push({panels: [panel]});
+      });
+
+      it('should add target', function() {
+        dashboard.addDataQueryTo(panel);
+        expect(panel.targets.length).to.be(1);
+      });
+
+      it('should set refId', function() {
+        dashboard.addDataQueryTo(panel);
+        expect(panel.targets[0].refId).to.be('A');
+      });
+
+      it('should set refId to first available letter', function() {
+        panel.targets = [{refId: 'A'}];
+        dashboard.addDataQueryTo(panel);
+        expect(panel.targets[1].refId).to.be('B');
+      });
+
+      it('duplicate should get unique refId', function() {
+        panel.targets = [{refId: 'A'}];
+        dashboard.duplicateDataQuery(panel, panel.targets[0]);
+        expect(panel.targets[1].refId).to.be('B');
+      });
+
+    });
+
     describe('row and panel manipulation', function() {
       var dashboard;
 

public/test/specs/panelSrv-specs.js

@@ -33,24 +33,6 @@ define([
         _panelSrv.init(_panelScope);
       });
 
-      describe('addDataQuery', function() {
-        it('should add target', function() {
-          _panelScope.addDataQuery();
-          expect(_panelScope.panel.targets.length).to.be(1);
-        });
-
-        it('should set refId', function() {
-          _panelScope.addDataQuery();
-          expect(_panelScope.panel.targets[0].refId).to.be('A');
-        });
-
-        it('should set refId to first available letter', function() {
-          _panelScope.panel.targets = [{refId: 'A'}];
-          _panelScope.addDataQuery();
-          expect(_panelScope.panel.targets[1].refId).to.be('B');
-        });
-      });
-
     });
   });