From 20591cc42bf1f34113a8beebe192907e8f3efd88 Mon Sep 17 00:00:00 2001
From: Andreas Christou <andreas.christou@grafana.com>
Date: Tue, 21 Feb 2023 16:21:20 +0000
Subject: [PATCH] CloudMonitor: Fix query migration (#63491)

* Update query and set required fields for explore queries

* Update test case

- Validate onChange is called with the new query
---
 .../cloud-monitoring/components/QueryEditor.test.tsx       | 5 ++++-
 .../datasource/cloud-monitoring/components/QueryEditor.tsx | 7 +++++--
 .../app/plugins/datasource/cloud-monitoring/datasource.ts  | 4 +++-
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.test.tsx b/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.test.tsx
index 92f7877a13a..6b5f666fe12 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.test.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.test.tsx
@@ -27,10 +27,13 @@ const defaultProps = {
 describe('QueryEditor', () => {
   it('should migrate the given query', async () => {
     const datasource = createMockDatasource();
+    const onChange = jest.fn();
     datasource.migrateQuery = jest.fn().mockReturnValue(defaultProps.query);
 
-    render(<QueryEditor {...defaultProps} datasource={datasource} />);
+    render(<QueryEditor {...defaultProps} datasource={datasource} onChange={onChange} />);
     await waitFor(() => expect(datasource.migrateQuery).toHaveBeenCalledTimes(1));
+    await waitFor(() => expect(onChange).toHaveBeenCalledTimes(1));
+    await waitFor(() => expect(onChange).toHaveBeenCalledWith(defaultProps.query));
   });
 
   it('should set a known query type', async () => {
diff --git a/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.tsx b/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.tsx
index 817ff119bd6..d513a9d1c3b 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/QueryEditor.tsx
@@ -20,10 +20,13 @@ export const QueryEditor = (props: Props) => {
   const query = useMemo(() => {
     if (!migrated) {
       setMigrated(true);
-      return datasource.migrateQuery(oldQ);
+      const migratedQuery = datasource.migrateQuery(oldQ);
+      // Update the query once the migrations have been completed.
+      onChange({ ...migratedQuery });
+      return migratedQuery;
     }
     return oldQ;
-  }, [oldQ, datasource, migrated]);
+  }, [oldQ, datasource, onChange, migrated]);
 
   const sloQuery = { ...defaultSLOQuery(datasource), ...query.sloQuery };
   const onSLOQueryChange = (q: SLOQuery) => {
diff --git a/public/app/plugins/datasource/cloud-monitoring/datasource.ts b/public/app/plugins/datasource/cloud-monitoring/datasource.ts
index 60df2221082..0c5a9c70af1 100644
--- a/public/app/plugins/datasource/cloud-monitoring/datasource.ts
+++ b/public/app/plugins/datasource/cloud-monitoring/datasource.ts
@@ -223,14 +223,16 @@ export default class CloudMonitoringDatasource extends DataSourceWithBackend<
   // This is a manual port of the migration code in cloudmonitoring.go
   // DO NOT UPDATE THIS CODE WITHOUT UPDATING THE BACKEND CODE
   migrateQuery(query: CloudMonitoringQuery): CloudMonitoringQuery {
+    const { hide, refId, datasource, key, queryType, maxLines, metric, intervalMs, type, ...rest } = query as any;
     if (
       !query.hasOwnProperty('metricQuery') &&
       !query.hasOwnProperty('sloQuery') &&
       !query.hasOwnProperty('timeSeriesQuery') &&
       !query.hasOwnProperty('timeSeriesList')
     ) {
-      const { hide, refId, datasource, key, queryType, maxLines, metric, intervalMs, type, ...rest } = query as any;
       return {
+        datasource,
+        key,
         refId,
         intervalMs,
         hide,