github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Synthetics] Hide location and enabled toggle on MonitorDetailsPanel for test run details (#152373)

Browse source 
Co-authored-by: Shahzad <shahzad31comp@gmail.com>
This commit is contained in:
Justin Kambic 2023-03-01 09:38:42 -05:00 • committed by GitHub
parent f6a0b886b1
commit f23346e4a6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 40 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

40
x-pack/plugins/synthetics/public/apps/synthetics/components/common/components/monitor_details_panel.tsx
View file

@ -40,19 +40,25 @@ const DescriptionLabel = euiStyled(EuiDescriptionListDescription)`
width: 60%;
`;
export interface MonitorDetailsPanelProps {
latestPing?: Ping;
loading: boolean;
configId: string;
monitor: EncryptedSyntheticsSavedMonitor | null;
hideEnabled?: boolean;
hideLocations?: boolean;
hasBorder?: boolean;
}
export const MonitorDetailsPanel = ({
monitor,
latestPing,
loading,
configId,
hideEnabled = false,
}: {
latestPing?: Ping;
loading: boolean;
configId: string;
monitor: EncryptedSyntheticsSavedMonitor | null;
hideEnabled?: boolean;
}) => {
hideLocations = false,
hasBorder = true,
}: MonitorDetailsPanelProps) => {
const dispatch = useDispatch();
if (!monitor) {
@ -60,7 +66,12 @@ export const MonitorDetailsPanel = ({
}
return (
<PanelWithTitle paddingSize="m" title={MONITOR_DETAILS_LABEL} titleLeftAlign>
<PanelWithTitle
paddingSize="m"
title={MONITOR_DETAILS_LABEL}
titleLeftAlign
hasBorder={hasBorder}
>
<WrapperStyle>
<EuiSpacer size="s" />
<EuiDescriptionList type="column" compressed align="left">
@ -116,10 +127,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>

4
x-pack/plugins/synthetics/public/apps/synthetics/components/error_details/error_details_page.tsx
View file

@ -21,7 +21,7 @@ import { FailedTestsList } from './components/failed_tests_list';
import { ErrorTimeline } from './components/error_timeline';
import { useErrorDetailsBreadcrumbs } from './hooks/use_error_details_breadcrumbs';
import { StepImage } from '../step_details_page/step_screenshot/step_image';
import { MonitorDetailsPanelContainer } from '../monitor_details/monitor_summary/monitor_details_panel';
import { MonitorDetailsPanelContainer } from '../monitor_details/monitor_summary/monitor_details_panel_container';
export function ErrorDetailsPage() {
const { failedTests, loading } = useErrorFailedTests();
@ -80,7 +80,7 @@ export function ErrorDetailsPage() {
<EuiSpacer size="m" />
<StepDurationPanel doBreakdown={false} />
<EuiSpacer size="m" />
<MonitorDetailsPanelContainer />
<MonitorDetailsPanelContainer hideLocations />
</EuiFlexItem>
</EuiFlexGroup>
</div>

8
x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_details_panel.tsx → x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_details_panel_container.tsx
View file

@ -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}
/>
);
};

2
x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/monitor_summary/monitor_summary.tsx
View file

@ -21,7 +21,7 @@ import { MonitorDurationTrend } from './duration_trend';
import { StepDurationPanel } from './step_duration_panel';
import { AvailabilityPanel } from './availability_panel';
import { DurationPanel } from './duration_panel';
import { MonitorDetailsPanelContainer } from './monitor_details_panel';
import { MonitorDetailsPanelContainer } from './monitor_details_panel_container';
import { AvailabilitySparklines } from './availability_sparklines';
import { LastTestRun } from './last_test_run';
import { LAST_10_TEST_RUNS, TestRunsTable } from './test_runs_table';

1
x-pack/plugins/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/monitor_detail_flyout.tsx
View file

@ -325,6 +325,7 @@ export function MonitorDetailFlyout(props: Props) {
<EuiFlyoutBody>
<DetailFlyoutDurationChart {...props} location={props.location} />
<MonitorDetailsPanel
hasBorder={false}
hideEnabled
latestPing={monitorDetail.data}
configId={configId}

4
x-pack/plugins/synthetics/public/apps/synthetics/components/test_run_details/test_run_details.tsx
View file

@ -11,7 +11,7 @@ import moment from 'moment';
import { FormattedMessage } from '@kbn/i18n-react';
import { useParams } from 'react-router-dom';
import { TestRunErrorInfo } from './components/test_run_error_info';
import { MonitorDetailsPanelContainer } from '../monitor_details/monitor_summary/monitor_details_panel';
import { MonitorDetailsPanelContainer } from '../monitor_details/monitor_summary/monitor_details_panel_container';
import { useSelectedLocation } from '../monitor_details/hooks/use_selected_location';
import { MonitorDetailsLinkPortal } from '../monitor_add_edit/monitor_details_portal';
import { StepNumberNav } from './components/step_number_nav';
@ -89,7 +89,7 @@ export const TestRunDetails = () => {
<EuiFlexItem grow={1}>
<StepDurationPanel legendPosition="bottom" />
<EuiSpacer size="m" />
<MonitorDetailsPanelContainer />
<MonitorDetailsPanelContainer hideEnabled hideLocations />
</EuiFlexItem>
</EuiFlexGroup>
)}