[Uptime] Fixes monitor details overview (elastic#166736)

x-pack/plugins/uptime/public/legacy_uptime/components/monitor/monitor_title.test.tsx

@@ -13,7 +13,7 @@ import { render } from '../../lib/helper/rtl_helpers';
 import * as reactRouterDom from 'react-router-dom';
 
 import { Ping } from '../../../../common/runtime_types';
-import { MonitorPageTitle, MonitorPageTitleContent } from './monitor_title';
+import { MonitorPageTitle } from './monitor_title';
 
 jest.mock('react-router-dom', () => {
   const originalModule = jest.requireActual('react-router-dom');
@@ -51,23 +51,6 @@ describe('MonitorTitle component', () => {
     },
   };
 
-  const defaultBrowserMonitorStatus: Ping = {
-    docId: 'few213kl',
-    timestamp: moment(new Date()).subtract(15, 'm').toString(),
-    monitor: {
-      duration: {
-        us: 1234567,
-      },
-      id: 'browser',
-      status: 'up',
-      type: 'browser',
-      check_group: 'test-group',
-    },
-    url: {
-      full: 'https://www.elastic.co/',
-    },
-  };
-
   const monitorStatusWithName: Ping = {
     ...defaultMonitorStatus,
     monitor: {
@@ -84,14 +67,12 @@ describe('MonitorTitle component', () => {
     render(
       <>
         <MonitorPageTitle />
-        <MonitorPageTitleContent />
       </>,
       {
         state: { monitorStatus: { status: monitorStatusWithName, loading: false } },
       }
     );
     expect(screen.getByText(monitorName));
-    expect(screen.getByRole('switch')).toBeInTheDocument();
   });
 
   it('renders the user provided monitorId when the name is not present', () => {
@@ -114,16 +95,4 @@ describe('MonitorTitle component', () => {
     );
     expect(screen.getByText(defaultMonitorStatus!.url!.full!));
   });
-
-  it('renders beta disclaimer for synthetics monitors', () => {
-    render(<MonitorPageTitleContent />, {
-      state: { monitorStatus: { status: defaultBrowserMonitorStatus, loading: false } },
-    });
-    const betaLink = screen.getByRole('link', {
-      name: 'See more External link (opens in a new tab or window)',
-    }) as HTMLAnchorElement;
-    expect(betaLink).toBeInTheDocument();
-    expect(betaLink.href).toBe('https://www.elastic.co/what-is/synthetic-monitoring');
-    expect(screen.getByText('Browser (BETA)')).toBeInTheDocument();
-  });
 });

x-pack/plugins/uptime/public/legacy_uptime/components/monitor/monitor_title.tsx

@@ -5,13 +5,10 @@
  * 2.0.
  */
 
-import { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiLink, EuiText } from '@elastic/eui';
-import { FormattedMessage } from '@kbn/i18n-react';
 import React from 'react';
 import { useSelector } from 'react-redux';
 import { useMonitorId } from '../../hooks';
 import { monitorStatusSelector } from '../../state/selectors';
-import { EnableMonitorAlert } from '../overview/monitor_list/columns/enable_alert';
 import { Ping } from '../../../../common/runtime_types/ping';
 import { useBreadcrumbs } from '../../hooks/use_breadcrumbs';
 
@@ -32,86 +29,6 @@ const getPageTitle = (monitorId: string, selectedMonitor: Ping | null) => {
   return monitorId;
 };
 
-export const MonitorPageTitleContent: React.FC = () => {
-  const monitorId = useMonitorId();
-  const selectedMonitor = useSelector(monitorStatusSelector);
-  const type = selectedMonitor?.monitor?.type;
-  const isBrowser = type === 'browser';
-  const renderMonitorType = (monitorType: string) => {
-    switch (monitorType) {
-      case 'http':
-        return (
-          <FormattedMessage
-            id="xpack.uptime.monitorDetails.title.pingType.http"
-            defaultMessage="HTTP ping"
-          />
-        );
-      case 'tcp':
-        return (
-          <FormattedMessage
-            id="xpack.uptime.monitorDetails.title.pingType.tcp"
-            defaultMessage="TCP ping"
-          />
-        );
-      case 'icmp':
-        return (
-          <FormattedMessage
-            id="xpack.uptime.monitorDetails.title.pingType.icmp"
-            defaultMessage="ICMP ping"
-          />
-        );
-      case 'browser':
-        return (
-          <FormattedMessage
-            id="xpack.uptime.monitorDetails.title.pingType.browser"
-            defaultMessage="Browser"
-          />
-        );
-      default:
-        return '';
-    }
-  };
-  return (
-    <>
-      <EuiFlexGroup wrap={false} data-test-subj="monitorTitle">
-        <EuiFlexItem grow={false} style={{ justifyContent: 'center' }}>
-          <EnableMonitorAlert monitorId={monitorId} selectedMonitor={selectedMonitor!} />
-        </EuiFlexItem>
-      </EuiFlexGroup>
-      <EuiSpacer size="s" />
-      <EuiFlexGroup wrap={false} gutterSize="s" alignItems="center">
-        <EuiFlexItem grow={false}>
-          {isBrowser && type && (
-            <EuiBadge color="hollow">
-              {renderMonitorType(type)}{' '}
-              <FormattedMessage
-                id="xpack.uptime.monitorDetails.title.disclaimer.description"
-                defaultMessage="(BETA)"
-              />
-            </EuiBadge>
-          )}
-        </EuiFlexItem>
-        {isBrowser && (
-          <EuiFlexItem grow={false}>
-            <EuiText>
-              <EuiLink
-                data-test-subj="syntheticsMonitorPageTitleContentSeeMoreLink"
-                href="https://www.elastic.co/what-is/synthetic-monitoring"
-                target="_blank"
-              >
-                <FormattedMessage
-                  id="xpack.uptime.monitorDetails.title.disclaimer.link"
-                  defaultMessage="See more"
-                />
-              </EuiLink>
-            </EuiText>
-          </EuiFlexItem>
-        )}
-      </EuiFlexGroup>
-    </>
-  );
-};
-
 export const MonitorPageTitle: React.FC = () => {
   const monitorId = useMonitorId();