From 04f5701443fc70d4a458d3c8efcd01fc66d59d3e Mon Sep 17 00:00:00 2001
From: Justin Kambic <jk@elastic.co>
Date: Tue, 28 Feb 2023 12:24:03 -0500
Subject: [PATCH] Enable pass-through props for component wrapper, hide
 location and enabled for test run details.

---
 .../components/monitor_details_panel.tsx      | 31 ++++++++++++-------
 .../monitor_details_panel_container.tsx       |  8 +++--
 .../test_run_details/test_run_details.tsx     |  2 +-
 3 files changed, 27 insertions(+), 14 deletions(-)

diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/common/components/monitor_details_panel.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/common/components/monitor_details_panel.tsx
index 2bfd04fa26d57..4f07b97662e5d 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/common/components/monitor_details_panel.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/common/components/monitor_details_panel.tsx
@@ -40,19 +40,23 @@ const DescriptionLabel = euiStyled(EuiDescriptionListDescription)`
   width: 60%;
 `;
 
+export interface MonitorDetailsPanelProps {
+  latestPing?: Ping;
+  loading: boolean;
+  configId: string;
+  monitor: EncryptedSyntheticsSavedMonitor | null;
+  hideEnabled?: boolean;
+  hideLocations?: boolean;
+}
+
 export const MonitorDetailsPanel = ({
   monitor,
   latestPing,
   loading,
   configId,
   hideEnabled = false,
-}: {
-  latestPing?: Ping;
-  loading: boolean;
-  configId: string;
-  monitor: EncryptedSyntheticsSavedMonitor | null;
-  hideEnabled?: boolean;
-}) => {
+  hideLocations = false,
+}: MonitorDetailsPanelProps) => {
   const dispatch = useDispatch();
 
   if (!monitor) {
@@ -116,10 +120,15 @@ export const MonitorDetailsPanel = ({
           </DescriptionLabel>
           <TitleLabel>{FREQUENCY_LABEL}</TitleLabel>
           <DescriptionLabel>{frequencyStr(monitor[ConfigKey.SCHEDULE])}</DescriptionLabel>
-          <TitleLabel>{LOCATIONS_LABEL}</TitleLabel>
-          <DescriptionLabel>
-            <LocationsStatus configId={configId} monitorLocations={monitor.locations} />
-          </DescriptionLabel>
+
+          {!hideLocations && (
+            <>
+              <TitleLabel>{LOCATIONS_LABEL}</TitleLabel>
+              <DescriptionLabel>
+                <LocationsStatus configId={configId} monitorLocations={monitor.locations} />
+              </DescriptionLabel>
+            </>
+          )}
 
           <TitleLabel>{TAGS_LABEL}</TitleLabel>
           <DescriptionLabel>
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_details_panel_container.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_details_panel_container.tsx
index c2a26f5242f0f..99885ac30fb87 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_details_panel_container.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_details_panel_container.tsx
@@ -9,12 +9,15 @@ import React from 'react';
 import { EuiLoadingContent } from '@elastic/eui';
 import { useParams } from 'react-router-dom';
 import { euiStyled } from '@kbn/kibana-react-plugin/common';
-import { MonitorDetailsPanel } from '../../common/components/monitor_details_panel';
+import {
+  MonitorDetailsPanelProps,
+  MonitorDetailsPanel,
+} from '../../common/components/monitor_details_panel';
 import { useSelectedMonitor } from '../hooks/use_selected_monitor';
 import { ConfigKey } from '../../../../../../common/runtime_types';
 import { useMonitorLatestPing } from '../hooks/use_monitor_latest_ping';
 
-export const MonitorDetailsPanelContainer = () => {
+export const MonitorDetailsPanelContainer = (props: Partial<MonitorDetailsPanelProps>) => {
   const { latestPing } = useMonitorLatestPing();
 
   const { monitorId: configId } = useParams<{ monitorId: string }>();
@@ -34,6 +37,7 @@ export const MonitorDetailsPanelContainer = () => {
       monitor={monitor}
       loading={loading}
       configId={configId}
+      {...props}
     />
   );
 };
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/test_run_details/test_run_details.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/test_run_details/test_run_details.tsx
index 3c1ed90e27059..a063c5bbabe98 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/test_run_details/test_run_details.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/test_run_details/test_run_details.tsx
@@ -89,7 +89,7 @@ export const TestRunDetails = () => {
           <EuiFlexItem grow={1}>
             <StepDurationPanel legendPosition="bottom" />
             <EuiSpacer size="m" />
-            <MonitorDetailsPanelContainer />
+            <MonitorDetailsPanelContainer hideEnabled hideLocations />
           </EuiFlexItem>
         </EuiFlexGroup>
       )}