From b3cdfc95704f20dae89fadd7a2d50acd75869b6a Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Fri, 12 Aug 2022 10:25:26 -0400
Subject: [PATCH] Set projectName in componentDidMount to ensure GCE project is
 set (#53652) (#53670)

- Update componentDidMount to call ensureGCEDefaultProject to correctly set project name for GCE Service Account auth
- Set state appropriately
- Update test

(cherry picked from commit d6a0a5c9ede126c8854951b5672dc832778718ac)

Co-authored-by: Andreas Christou <andreas.christou@grafana.com>
---
 .../components/VariableQueryEditor.test.tsx         |  1 +
 .../components/VariableQueryEditor.tsx              | 13 ++++++-------
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.test.tsx b/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.test.tsx
index 8b4bd47c29a..9df2d6178f6 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.test.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.test.tsx
@@ -34,6 +34,7 @@ const props: Props = {
     getMetricTypes: async (projectName: string) => Promise.resolve([]),
     getSLOServices: async (projectName: string) => Promise.resolve([]),
     getServiceLevelObjectives: (projectName: string, serviceId: string) => Promise.resolve([]),
+    ensureGCEDefaultProject: async () => Promise.resolve(''),
   } as unknown as CloudMonitoringDatasource,
   onRunQuery: () => {},
 };
diff --git a/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx b/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx
index 2c7458c149e..9a7c3ac571c 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx
@@ -57,14 +57,12 @@ export class CloudMonitoringVariableQueryEditor extends PureComponent<Props, Var
 
   constructor(props: Props) {
     super(props);
-    this.state = Object.assign(
-      this.defaults,
-      { projectName: this.props.datasource.getDefaultProject() },
-      this.props.query
-    );
+    this.state = Object.assign(this.defaults, this.props.query);
   }
 
   async componentDidMount() {
+    await this.props.datasource.ensureGCEDefaultProject();
+    const projectName = this.props.datasource.getDefaultProject();
     const projects = (await this.props.datasource.getProjects()) as MetricDescriptor[];
     const metricDescriptors = await this.props.datasource.getMetricTypes(
       this.props.query.projectName || this.props.datasource.getDefaultProject()
@@ -88,7 +86,7 @@ export class CloudMonitoringVariableQueryEditor extends PureComponent<Props, Var
       getTemplateSrv().replace(selectedService)
     );
 
-    const sloServices = await this.props.datasource.getSLOServices(this.state.projectName);
+    const sloServices = await this.props.datasource.getSLOServices(projectName);
 
     const state: any = {
       services,
@@ -97,9 +95,10 @@ export class CloudMonitoringVariableQueryEditor extends PureComponent<Props, Var
       selectedMetricType,
       metricDescriptors,
       projects,
-      ...(await this.getLabels(selectedMetricType, this.state.projectName)),
+      ...(await this.getLabels(selectedMetricType, projectName)),
       sloServices,
       loading: false,
+      projectName,
     };
     this.setState(state, () => this.onPropsChange());
   }