From 1969ad41e82447f480a7b4bb5cf8d41b04b84dbe Mon Sep 17 00:00:00 2001
From: Erik Sundell <erik.sundell87@gmail.com>
Date: Thu, 25 Oct 2018 13:53:02 +0200
Subject: [PATCH] stackdriver: refactor stackdriver query ctrl

---
 .../pluginTemplateQueryComponentLoader.tsx    |  4 +--
 .../stackdriver/templateQueryCtrl.tsx         | 28 ++++++++++++++-----
 2 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/public/app/features/plugins/pluginTemplateQueryComponentLoader.tsx b/public/app/features/plugins/pluginTemplateQueryComponentLoader.tsx
index ac7d94a3f15..9a27643ace5 100644
--- a/public/app/features/plugins/pluginTemplateQueryComponentLoader.tsx
+++ b/public/app/features/plugins/pluginTemplateQueryComponentLoader.tsx
@@ -14,13 +14,13 @@ async function loadComponent(module) {
 }
 
 /** @ngInject */
-function pluginTemplateQueryComponentLoader(datasourceSrv) {
+function pluginTemplateQueryComponentLoader() {
   return {
     restrict: 'E',
     link: async (scope, elem) => {
       const Component = await loadComponent(scope.currentDatasource.meta.module);
       const props = {
-        datasourceSrv,
+        datasource: scope.currentDatasource,
         query: scope.current.query,
         onChange: scope.onQueryChange,
       };
diff --git a/public/app/plugins/datasource/stackdriver/templateQueryCtrl.tsx b/public/app/plugins/datasource/stackdriver/templateQueryCtrl.tsx
index 62f98625981..4900c4b15da 100644
--- a/public/app/plugins/datasource/stackdriver/templateQueryCtrl.tsx
+++ b/public/app/plugins/datasource/stackdriver/templateQueryCtrl.tsx
@@ -1,22 +1,36 @@
 import React, { PureComponent } from 'react';
-import DatasourceSrv from 'app/features/plugins/datasource_srv';
+import StackdriverDatasource from './datasource';
 
 interface Props {
+  datasource: StackdriverDatasource;
   query: string;
-  datasourceSrv: DatasourceSrv;
-  isValid: any;
+  onChange: (c: string) => void;
 }
 
-export class StackdriverTemplateQueryCtrl extends PureComponent<Props> {
+export class StackdriverTemplateQueryCtrl extends PureComponent<Props, any> {
   constructor(props) {
     super(props);
   }
 
-  componentDidMount() {
-    console.log('componentDidMount');
+  async componentDidMount() {
+    const metricDescriptors = await this.props.datasource.getMetricTypes(this.props.datasource.projectName);
+    console.log(metricDescriptors);
   }
 
   render() {
-    return <h1>Hello Stackdriver Template Query</h1>;
+    return (
+      <div className="gf-form">
+        <span className="gf-form-label width-7">Query</span>
+        <input
+          type="text"
+          className="gf-form-input"
+          // value={this.state.value}
+          // onChange={this.handleChange}
+          // onBlur={this.handleBlur}
+          placeholder="metric name or tags query"
+          required
+        />
+      </div>
+    );
   }
 }