Stackdriver: Fix GCE auth bug when creating new data source (#22836)

* Fix test datasource for gce auth

* Cache gce default project locally

* Await gce default project call

* Remove reload functionality

* Fix build problem

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

 import DatasourceSrv from 'app/features/plugins/datasource_srv';
 import DatasourceSrv from 'app/features/plugins/datasource_srv';
-import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
-import StackdriverDatasource from './datasource';
 import { AuthType, authTypes } from './types';
 import { AuthType, authTypes } from './types';
 
 
 export interface JWT {
 export interface JWT {
@@ -21,10 +19,9 @@ export class StackdriverConfigCtrl {
   authenticationTypes: Array<{ key: AuthType; value: string }>;
   authenticationTypes: Array<{ key: AuthType; value: string }>;
   defaultAuthenticationType: string;
   defaultAuthenticationType: string;
   name: string;
   name: string;
-  gceError: string;
 
 
   /** @ngInject */
   /** @ngInject */
-  constructor(datasourceSrv: DatasourceSrv, private $scope: any) {
+  constructor(datasourceSrv: DatasourceSrv) {
     this.defaultAuthenticationType = AuthType.JWT;
     this.defaultAuthenticationType = AuthType.JWT;
     this.datasourceSrv = datasourceSrv;
     this.datasourceSrv = datasourceSrv;
     this.name = this.meta.name;
     this.name = this.meta.name;
@@ -98,19 +95,4 @@ export class StackdriverConfigCtrl {
     this.current.secureJsonData = {};
     this.current.secureJsonData = {};
     this.current.secureJsonFields = {};
     this.current.secureJsonFields = {};
   }
   }
-
-  async loadGCEDefaultAccount() {
-    this.gceError = '';
-    const ds = (await getDatasourceSrv().loadDatasource(this.name)) as StackdriverDatasource;
-    try {
-      const defaultProject = await ds.getGCEDefaultProject();
-      this.$scope.$apply(() => {
-        this.current.jsonData.gceDefaultProject = defaultProject;
-      });
-    } catch (error) {
-      this.$scope.$apply(() => {
-        this.gceError = error;
-      });
-    }
-  }
 }
 }

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

@@ -22,6 +22,7 @@ export default class StackdriverDatasource extends DataSourceApi<StackdriverQuer
   authenticationType: string;
   authenticationType: string;
   queryPromise: Promise<any>;
   queryPromise: Promise<any>;
   metricTypesCache: { [key: string]: MetricDescriptor[] };
   metricTypesCache: { [key: string]: MetricDescriptor[] };
+  gceDefaultProject: string;
 
 
   /** @ngInject */
   /** @ngInject */
   constructor(
   constructor(
@@ -229,6 +230,7 @@ export default class StackdriverDatasource extends DataSourceApi<StackdriverQuer
     let status, message;
     let status, message;
     const defaultErrorMessage = 'Cannot connect to Stackdriver API';
     const defaultErrorMessage = 'Cannot connect to Stackdriver API';
     try {
     try {
+      await this.ensureGCEDefaultProject();
       const path = `v3/projects/${this.getDefaultProject()}/metricDescriptors`;
       const path = `v3/projects/${this.getDefaultProject()}/metricDescriptors`;
       const response = await this.doRequest(`${this.baseUrl}${path}`);
       const response = await this.doRequest(`${this.baseUrl}${path}`);
       if (response.status === 200) {
       if (response.status === 200) {

public/app/plugins/datasource/stackdriver/partials/config.html

@@ -64,19 +64,6 @@
     </div>
     </div>
   </div>
   </div>
 
 
-  <div class="gf-form-inline" ng-if="ctrl.current.jsonData.authenticationType !== ctrl.defaultAuthenticationType">
-    <div class="gf-form">
-      <span class="gf-form-label width-10">Project</span>
-      <input class="gf-form-input width-40" disabled type="text" ng-model="ctrl.current.jsonData.gceDefaultProject" />
-    </div>
-
-    <div class="gf-form width-18">
-      <a class="btn btn-secondary gf-form-btn" style="margin-top: 2px;" href="#" ng-click="ctrl.loadGCEDefaultAccount()"
-        >{{ctrl.current.jsonData.gceDefaultProject ? 'Reload project name' : 'Load project name'}}
-      </a>
-    </div>
-  </div>
-
   <div
   <div
     ng-if="ctrl.current.jsonData.authenticationType === ctrl.defaultAuthenticationType && !ctrl.current.jsonData.clientEmail && !ctrl.inputDataValid"
     ng-if="ctrl.current.jsonData.authenticationType === ctrl.defaultAuthenticationType && !ctrl.current.jsonData.clientEmail && !ctrl.inputDataValid"
   >
   >
@@ -146,20 +133,10 @@
   <i class="fa fa-save"></i> Do not forget to save your changes after uploading a file.
   <i class="fa fa-save"></i> Do not forget to save your changes after uploading a file.
 </p>
 </p>
 
 
-<p
-  class="gf-form-label"
-  ng-show="ctrl.current.jsonData.authenticationType !== ctrl.defaultAuthenticationType && !ctrl.current.jsonData.gceDefaultProject"
->
-  <i class="fa fa-warning"></i> Before saving, load the Project name that is associated with the default service account
-</p>
-
 <div class="gf-form" ng-if="ctrl.gceError">
 <div class="gf-form" ng-if="ctrl.gceError">
   <pre class="gf-form-pre alert alert-error">{{ctrl.gceError}}</pre>
   <pre class="gf-form-pre alert alert-error">{{ctrl.gceError}}</pre>
 </div>
 </div>
 
 
-<p
-  class="gf-form-label"
-  ng-show="ctrl.current.jsonData.authenticationType !== ctrl.defaultAuthenticationType && ctrl.current.jsonData.gceDefaultProject"
->
+<p class="gf-form-label" ng-show="ctrl.current.jsonData.authenticationType !== ctrl.defaultAuthenticationType">
   <i class="fa fa-save"></i> Verify GCE default service account by clicking Save & Test
   <i class="fa fa-save"></i> Verify GCE default service account by clicking Save & Test
 </p>
 </p>