From 81cb84d098098a76318ad4e0f760b1b2e7ebb506 Mon Sep 17 00:00:00 2001
From: Alyssa Bull <58453566+alyssabull@users.noreply.github.com>
Date: Mon, 3 Apr 2023 08:32:37 -0600
Subject: [PATCH] CloudMonitoring: Add project selector for MQL editor[fix]
 (#65567)

---
 .../components/MetricQueryEditor.test.tsx                | 9 +++++++++
 .../cloud-monitoring/components/MetricQueryEditor.tsx    | 8 ++++++++
 .../datasource/cloud-monitoring/components/Project.tsx   | 1 -
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.test.tsx b/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.test.tsx
index b8f2396ab2b..f40397cb19f 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.test.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.test.tsx
@@ -55,4 +55,13 @@ describe('MetricQueryEditor', () => {
     const l = await screen.findByLabelText('Project');
     expect(l).toBeInTheDocument();
   });
+
+  it('renders a Project dropdown', async () => {
+    const query = createMockQuery();
+    query.queryType = QueryType.TIME_SERIES_QUERY;
+
+    render(<MetricQueryEditor {...defaultProps} />);
+    const projectDropdown = await screen.findByLabelText('Project');
+    expect(projectDropdown).toBeInTheDocument();
+  });
 });
diff --git a/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.tsx b/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.tsx
index 6da65007a55..3375a3dd17d 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/MetricQueryEditor.tsx
@@ -15,6 +15,7 @@ import {
 
 import { GraphPeriod } from './GraphPeriod';
 import { MQLQueryEditor } from './MQLQueryEditor';
+import { Project } from './Project';
 import { VisualMetricQueryEditor } from './VisualMetricQueryEditor';
 
 export interface Props {
@@ -99,6 +100,13 @@ function Editor({
 
       {query.queryType === QueryType.TIME_SERIES_QUERY && query.timeSeriesQuery && (
         <>
+          <Project
+            refId={refId}
+            datasource={datasource}
+            onChange={(projectName) => onChangeTimeSeriesQuery({ ...query.timeSeriesQuery!, projectName: projectName })}
+            templateVariableOptions={variableOptionGroup.options}
+            projectName={query.timeSeriesQuery.projectName!}
+          />
           <MQLQueryEditor
             onChange={(q: string) => onChangeTimeSeriesQuery({ ...query.timeSeriesQuery!, query: q })}
             onRunQuery={onRunQuery}
diff --git a/public/app/plugins/datasource/cloud-monitoring/components/Project.tsx b/public/app/plugins/datasource/cloud-monitoring/components/Project.tsx
index 59f8038c6df..a36b41f2cd2 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/Project.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/Project.tsx
@@ -22,7 +22,6 @@ export function Project({ refId, projectName, datasource, onChange, templateVari
 
   const projectsWithTemplateVariables = useMemo(
     () => [
-      projects,
       {
         label: 'Template Variables',
         options: templateVariableOptions,