From 588c5c045a044f1ea8b87cdde0b9b4d0d1f77dd7 Mon Sep 17 00:00:00 2001
From: Erik Sundell <erik.sundell87@gmail.com>
Date: Fri, 2 Nov 2018 11:58:50 +0100
Subject: [PATCH] stackdriver: pass query definition from react, making it
 possible to use another definition than the query string only

---
 .../features/templating/DefaultTemplateQueryComponent.tsx    | 2 +-
 public/app/features/templating/editor_ctrl.ts                | 5 +++--
 public/app/features/templating/partials/editor.html          | 2 +-
 .../stackdriver/components/TemplateQueryComponent.tsx        | 3 ++-
 public/app/types/plugins.ts                                  | 4 ++--
 5 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/public/app/features/templating/DefaultTemplateQueryComponent.tsx b/public/app/features/templating/DefaultTemplateQueryComponent.tsx
index 6d470e8d538..26c5db54d7c 100644
--- a/public/app/features/templating/DefaultTemplateQueryComponent.tsx
+++ b/public/app/features/templating/DefaultTemplateQueryComponent.tsx
@@ -14,7 +14,7 @@ export default class DefaultTemplateQueryComponent extends PureComponent<Templat
   }
 
   handleBlur(event) {
-    this.props.onChange(event.target.value);
+    this.props.onChange(event.target.value, event.target.value);
   }
 
   render() {
diff --git a/public/app/features/templating/editor_ctrl.ts b/public/app/features/templating/editor_ctrl.ts
index 09648acc942..fdab5587b42 100644
--- a/public/app/features/templating/editor_ctrl.ts
+++ b/public/app/features/templating/editor_ctrl.ts
@@ -107,8 +107,9 @@ export class VariableEditorCtrl {
       });
     };
 
-    $scope.onQueryChange = value => {
-      $scope.current.query = value;
+    $scope.onQueryChange = (query, definition) => {
+      $scope.current.query = query;
+      $scope.current.definition = definition;
       $scope.runQuery();
     };
 
diff --git a/public/app/features/templating/partials/editor.html b/public/app/features/templating/partials/editor.html
index d6aabd37225..58a12ba872e 100644
--- a/public/app/features/templating/partials/editor.html
+++ b/public/app/features/templating/partials/editor.html
@@ -53,7 +53,7 @@
 							</span>
 						</td>
 						<td style="max-width: 200px;" ng-click="edit(variable)" class="pointer max-width">
-							{{variable.query}}
+							{{variable.definition ? variable.definition : variable.query}}
 						</td>
 						<td style="width: 1%"><i ng-click="_.move(variables,$index,$index-1)" ng-hide="$first" class="pointer fa fa-arrow-up"></i></td>
 						<td style="width: 1%"><i ng-click="_.move(variables,$index,$index+1)" ng-hide="$last" class="pointer fa fa-arrow-down"></i></td>
diff --git a/public/app/plugins/datasource/stackdriver/components/TemplateQueryComponent.tsx b/public/app/plugins/datasource/stackdriver/components/TemplateQueryComponent.tsx
index 8c8c89f9197..7b59d50a0fb 100644
--- a/public/app/plugins/datasource/stackdriver/components/TemplateQueryComponent.tsx
+++ b/public/app/plugins/datasource/stackdriver/components/TemplateQueryComponent.tsx
@@ -96,7 +96,8 @@ export class StackdriverTemplateQueryComponent extends PureComponent<TemplateQue
 
   componentDidUpdate() {
     const { metricDescriptors, labels, metricTypes, services, ...queryModel } = this.state;
-    this.props.onChange(queryModel);
+    const queryName = this.queryTypes.find(q => q.value === this.state.selectedQueryType);
+    this.props.onChange(queryModel, `Stackdriver - ${queryName.name}`);
   }
 
   isLabelQuery(queryType) {
diff --git a/public/app/types/plugins.ts b/public/app/types/plugins.ts
index eb8ff5dcaf2..f365e254736 100644
--- a/public/app/types/plugins.ts
+++ b/public/app/types/plugins.ts
@@ -102,7 +102,7 @@ export interface PluginsState {
 
 export interface TemplateQueryProps {
   query: any;
-  onChange: (c: any) => void;
+  onChange: (c: any, definition: string) => void;
   datasource: any;
-  // datasource: StackdriverDatasource;
+  definition: string;
 }