feat: support multiple synthetic ids

Signed-off-by: Isaiah Thiessen <isaiah.thiessen@telus.com>

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>

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}`,
       }}
     >