remove redundant default value

public/app/plugins/datasource/stackdriver/datasource.ts

@@ -274,6 +274,7 @@ export default class StackdriverDatasource {
           m.service = service;
           m.serviceShortName = serviceShortName;
           m.displayName = m.displayName || m.type;
+
           return m;
         });
       }

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

 <query-editor-row query-ctrl="ctrl" has-text-edit-mode="false">
-  <stackdriver-filter target="ctrl.target" refresh="ctrl.refresh()" datasource="ctrl.datasource" default-dropdown-value="ctrl.defaultDropdownValue"
-    default-service-value="ctrl.defaultServiceValue"></stackdriver-filter>
+  <stackdriver-filter target="ctrl.target" refresh="ctrl.refresh()" datasource="ctrl.datasource"></stackdriver-filter>
   <stackdriver-aggregation target="ctrl.target" alignment-period="ctrl.lastQueryMeta.alignmentPeriod" refresh="ctrl.refresh()"></stackdriver-aggregation>
   <div class="gf-form-inline">
     <div class="gf-form">

public/app/plugins/datasource/stackdriver/partials/query.filter.html

@@ -6,8 +6,8 @@
       selected="ctrl.service"
       options="ctrl.services"
       searchable="false"
-      placeholder="ctrl.defaultServiceValue"
-      className=""width-15""
+      placeholder="'Select Services'"
+      className="'width-15'"
     ></option-picker>
   </div>
   <div class="gf-form gf-form--grow"><div class="gf-form-label gf-form-label--grow"></div></div>
@@ -17,11 +17,11 @@
     <span class="gf-form-label width-9 query-keyword">Metric</span>
     <option-group-picker
       onChange="ctrl.handleMetricTypeChange"
-      selected="ctrl.metricType"
-      groups="ctrl.insertTemplateVariables(ctrl.defaultServiceValue !== ctrl.service ? ctrl.metrics : ctrl.metricGroups)"
+      selected="ctrl.target.metricType"
+      groups="ctrl.getMetricGroups()"
       searchable="true"
-      placeholder="ctrl.defaultDropdownValue"
-      className="&quot;width-15&quot;"
+      placeholder="'Select Metric'"
+      className="'width-15'"
     ></option-group-picker>
   </div>
   <div class="gf-form gf-form--grow"><div class="gf-form-label gf-form-label--grow"></div></div>

public/app/plugins/datasource/stackdriver/query_ctrl.ts

@@ -34,13 +34,10 @@ export class StackdriverQueryCtrl extends QueryCtrl {
     valueType: any;
   };
 
-  defaultDropdownValue = 'Select Metric';
-  defaultServiceValue = 'All Services';
-
   defaults = {
     defaultProject: 'loading project...',
-    metricType: this.defaultDropdownValue,
-    service: this.defaultServiceValue,
+    metricType: '',
+    service: '',
     metric: '',
     unit: '',
     aggregation: {

public/app/plugins/datasource/stackdriver/query_filter_ctrl.ts

@@ -15,8 +15,6 @@ export class StackdriverFilter {
         target: '=',
         datasource: '=',
         refresh: '&',
-        defaultDropdownValue: '<',
-        defaultServiceValue: '<',
         hideGroupBys: '<',
       },
     };
@@ -48,9 +46,6 @@ export class StackdriverFilterCtrl {
   constructor(private $scope, private uiSegmentSrv, private templateSrv, private $rootScope) {
     this.datasource = $scope.datasource;
     this.target = $scope.target;
-    this.metricType = $scope.defaultDropdownValue;
-    this.service = $scope.defaultServiceValue;
-
     this.metricDescriptors = [];
     this.metrics = [];
     this.metricGroups = [];
@@ -66,7 +61,7 @@ export class StackdriverFilterCtrl {
   }
 
   handleMetricTypeChange(value) {
-    this.metricType = value;
+    this.target.metricType = value;
     this.onMetricTypeChange();
   }
 
@@ -116,7 +111,6 @@ export class StackdriverFilterCtrl {
   }
 
   getServicesList() {
-    const defaultValue = { value: this.$scope.defaultServiceValue, label: this.$scope.defaultServiceValue };
     const services = this.metricDescriptors.map(m => {
       return {
         value: m.service,
@@ -128,10 +122,10 @@ export class StackdriverFilterCtrl {
       this.service = this.target.service;
     }
 
-    return services.length > 0 ? [defaultValue, ..._.uniqBy(services, 'value')] : [];
+    return services.length > 0 ? _.uniqBy(services, 'value') : [];
   }
 
-  getMetricGroups() {
+  getMetricGroupsOld() {
     return this.metrics.reduce((acc, curr) => {
       const group = acc.find(group => group.service === curr.service);
       if (group) {
@@ -150,6 +144,27 @@ export class StackdriverFilterCtrl {
     }, []);
   }
 
+  getMetricGroups() {
+    return [
+      this.getTemplateVariablesGroup(),
+      {
+        label: 'Metrics',
+        options: this.metrics,
+      },
+    ];
+  }
+
+  getTemplateVariablesGroup() {
+    return {
+      label: 'Template Variables',
+      options: this.templateSrv.variables.map(v => ({
+        label: `$${v.name}`,
+        value: `$${v.name}`,
+        description: `$${v.definition}`,
+      })),
+    };
+  }
+
   insertTemplateVariables(options) {
     const templateVariables = {
       label: 'Template Variables',
@@ -174,29 +189,28 @@ export class StackdriverFilterCtrl {
       };
     });
 
-    let result;
-    if (this.target.service === this.$scope.defaultServiceValue) {
-      result = metrics.map(m => ({ ...m, text: `${m.service} - ${m.text}` }));
-    } else {
-      result = metrics.filter(m => m.service === this.target.service);
-    }
-
-    if (result.find(m => m.value === this.templateSrv.replace(this.target.metricType))) {
-      this.metricType = this.target.metricType;
-    } else if (result.length > 0) {
-      this.metricType = this.target.metricType = result[0].value;
+    const metricsByService = metrics.filter(m => m.service === this.target.service);
+    if (
+      metricsByService.length > 0 &&
+      !metricsByService.some(m => m.value === this.templateSrv.replace(this.target.metricType))
+    ) {
+      this.target.metricType = metricsByService[0].value;
     }
-    return result;
+    return metricsByService;
   }
 
   async getLabels() {
     this.loadLabelsPromise = new Promise(async resolve => {
       try {
+        if (this.target.metricType) {
           const { meta } = await this.datasource.getLabels(this.target.metricType, this.target.refId);
           this.metricLabels = meta.metricLabels;
           this.resourceLabels = meta.resourceLabels;
           this.resourceTypes = meta.resourceTypes;
           resolve();
+        } else {
+          resolve();
+        }
       } catch (error) {
         if (error.data && error.data.message) {
           console.log(error.data.message);
@@ -216,7 +230,7 @@ export class StackdriverFilterCtrl {
     this.setMetricType();
     this.getLabels();
     if (!this.metrics.find(m => m.value === this.target.metricType)) {
-      this.target.metricType = this.$scope.defaultDropdownValue;
+      this.target.metricType = '';
     } else {
       this.$scope.refresh();
     }
@@ -229,9 +243,9 @@ export class StackdriverFilterCtrl {
   }
 
   setMetricType() {
-    this.target.metricType = this.metricType;
+    // this.target.metricType = this.metricType;
     const { valueType, metricKind, unit } = this.metricDescriptors.find(
-      m => m.type === this.templateSrv.replace(this.metricType)
+      m => m.type === this.templateSrv.replace(this.target.metricType)
     );
     this.target.unit = unit;
     this.target.valueType = valueType;

public/app/plugins/datasource/stackdriver/specs/query_filter_ctrl.test.ts

@@ -409,8 +409,6 @@ function createCtrlWithFakes(existingFilters?: string[]) {
         return 'project';
       },
     },
-    defaultDropdownValue: 'Select Metric',
-    defaultServiceValue: 'All Services',
     refresh: () => {},
   };