From 4dcbc475a85faaed8d07c9662eb92f6125cad79f Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Thu, 2 Dec 2021 10:29:29 -0500
Subject: [PATCH] CloudWatch: fix duplicated IDs (#42658) (#42662)

(cherry picked from commit e061cbd25bd126aef9df593e8fc2c1b051a9eab9)

Co-authored-by: Andres Martinez Gotor <andres.martinez@grafana.com>
---
 .../components/MetricStatEditor/MetricStatEditor.tsx        | 4 ++--
 .../components/SQLBuilderEditor/SQLBuilderSelectRow.tsx     | 6 +++---
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/public/app/plugins/datasource/cloudwatch/components/MetricStatEditor/MetricStatEditor.tsx b/public/app/plugins/datasource/cloudwatch/components/MetricStatEditor/MetricStatEditor.tsx
index 67d80da3449..473bd960b09 100644
--- a/public/app/plugins/datasource/cloudwatch/components/MetricStatEditor/MetricStatEditor.tsx
+++ b/public/app/plugins/datasource/cloudwatch/components/MetricStatEditor/MetricStatEditor.tsx
@@ -66,7 +66,7 @@ export function MetricStatEditor({
 
           <EditorField label="Statistic" width={16}>
             <Select
-              inputId="metric-stat-editor-select-statistic"
+              inputId={`${query.refId}-metric-stat-editor-select-statistic`}
               allowCustomValue
               value={toOption(query.statistic ?? datasource.standardStatistics[0])}
               options={appendTemplateVariables(
@@ -109,7 +109,7 @@ export function MetricStatEditor({
             tooltip="Only show metrics that exactly match all defined dimension names."
           >
             <Switch
-              id="cloudwatch-match-exact"
+              id={`${query.refId}-cloudwatch-match-exact`}
               value={!!query.matchExact}
               onChange={(e) => {
                 onQueryChange({
diff --git a/public/app/plugins/datasource/cloudwatch/components/SQLBuilderEditor/SQLBuilderSelectRow.tsx b/public/app/plugins/datasource/cloudwatch/components/SQLBuilderEditor/SQLBuilderSelectRow.tsx
index d8bc77adc62..4fbf15a1906 100644
--- a/public/app/plugins/datasource/cloudwatch/components/SQLBuilderEditor/SQLBuilderSelectRow.tsx
+++ b/public/app/plugins/datasource/cloudwatch/components/SQLBuilderEditor/SQLBuilderSelectRow.tsx
@@ -59,7 +59,7 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
         <EditorField label="Namespace" width={16}>
           <Select
             value={namespace ? toOption(namespace) : null}
-            inputId="cloudwatch-sql-namespace"
+            inputId={`${query.refId}-cloudwatch-sql-namespace`}
             options={namespaceOptions}
             allowCustomValue
             onChange={({ value }) => value && onQueryChange(setNamespace(query, value))}
@@ -69,7 +69,7 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
 
         <EditorField label="With schema">
           <Switch
-            id="cloudwatch-sql-withSchema"
+            id={`${query.refId}-cloudwatch-sql-withSchema`}
             value={withSchemaEnabled}
             onChange={(ev) =>
               ev.target instanceof HTMLInputElement && onQueryChange(setWithSchema(query, ev.target.checked))
@@ -80,7 +80,7 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
         {withSchemaEnabled && (
           <EditorField label="Schema labels">
             <Select
-              id="cloudwatch-sql-schema-label-keys"
+              id={`${query.refId}-cloudwatch-sql-schema-label-keys`}
               width="auto"
               isMulti={true}
               disabled={!namespace}