Enable pass-through props for component wrapper, hide location and en…

…abled for test run details.
elastic · Feb 28, 2023 · 04f5701 · 04f5701
1 parent b7d96fb
commit 04f5701
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 14 deletions.
diff --git a/.../synthetics/public/apps/synthetics/components/common/components/monitor_details_panel.tsx b/.../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/...synthetics/components/monitor_details/monitor_summary/monitor_details_panel_container.tsx b/...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/...lugins/synthetics/public/apps/synthetics/components/test_run_details/test_run_details.tsx b/...lugins/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>
       )}