From 71b7a4c82278cf64c3d2dacf8335da2bb2985523 Mon Sep 17 00:00:00 2001
From: Isaiah Thiessen <isaiah.thiessen@telus.com>
Date: Thu, 21 Jul 2022 15:22:15 -0700
Subject: [PATCH] feat: support multiple synthetic ids

Signed-off-by: Isaiah Thiessen <isaiah.thiessen@telus.com>
---
 .../components/DynatraceTab/DynatraceTab.tsx  | 23 +++++++++++--------
 .../SyntheticsCard/SyntheticsCard.tsx         |  3 ++-
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/plugins/dynatrace/src/components/DynatraceTab/DynatraceTab.tsx b/plugins/dynatrace/src/components/DynatraceTab/DynatraceTab.tsx
index 1be005908f..3e137f4109 100644
--- a/plugins/dynatrace/src/components/DynatraceTab/DynatraceTab.tsx
+++ b/plugins/dynatrace/src/components/DynatraceTab/DynatraceTab.tsx
@@ -56,16 +56,19 @@ export const DynatraceTab = () => {
               dynatraceBaseUrl={dynatraceBaseUrl}
             />
           </Grid>
-          {syntheticsIds ? (
-            <Grid item xs={12} lg={12}>
-              <SyntheticsCard
-                syntheticsId={syntheticsIds}
-                dynatraceBaseUrl={dynatraceBaseUrl}
-              />
-            </Grid>
-          ) : (
-            <></>
-          )}
+          {syntheticsIds
+            .replace(' ', '')
+            .split(',')
+            .map(id => {
+              return (
+                <Grid item xs={12} lg={12}>
+                  <SyntheticsCard
+                    syntheticsId={id}
+                    dynatraceBaseUrl={dynatraceBaseUrl}
+                  />
+                </Grid>
+              );
+            })}
         </Grid>
       </Content>
     </Page>
diff --git a/plugins/dynatrace/src/components/Synthetics/SyntheticsCard/SyntheticsCard.tsx b/plugins/dynatrace/src/components/Synthetics/SyntheticsCard/SyntheticsCard.tsx
index 3a77db3d50..1b73e51313 100644
--- a/plugins/dynatrace/src/components/Synthetics/SyntheticsCard/SyntheticsCard.tsx
+++ b/plugins/dynatrace/src/components/Synthetics/SyntheticsCard/SyntheticsCard.tsx
@@ -56,6 +56,7 @@ export const SyntheticsCard = (props: SyntheticsCardProps) => {
   const deepLinkPrefix = dynatraceMonitorPrefixes(
     `${syntheticsId.match(/(.+)-/)![1]}`,
   );
+
   const lastFailed = value?.locationsExecutionResults.map(l => {
     return {
       timestamp: l.requestResults[0].startTimestamp,
@@ -68,7 +69,7 @@ export const SyntheticsCard = (props: SyntheticsCardProps) => {
       title="Synthetics"
       subheader={`Recent Activity for Monitor ${syntheticsId}`}
       deepLink={{
-        title: 'View Synthetics in Dynatrace',
+        title: 'View this Synthetic in Dynatrace',
         link: `${dynatraceBaseUrl}/${deepLinkPrefix}/${syntheticsId}`,
       }}
     >