Add tests for renderMonitorType.

x-pack/plugins/uptime/public/components/monitor/status_details/status_bar/status_bar.test.ts

@@ -0,0 +1,32 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { renderMonitorType } from './status_bar';
+
+describe('StatusBar component', () => {
+  describe('renderMonitorType', () => {
+    it('handles http type', () => {
+      expect(renderMonitorType('http')).toBe('HTTP');
+    });
+
+    it('handles tcp type', () => {
+      expect(renderMonitorType('tcp')).toBe('TCP');
+    });
+
+    it('handles icmp type', () => {
+      expect(renderMonitorType('icmp')).toBe('ICMP');
+    });
+
+    it('handles browser type', () => {
+      expect(renderMonitorType('browser')).toBe('Browser');
+    });
+
+    it('returns empty string for `undefined`', () => {
+      expect(renderMonitorType(undefined)).toBe('');
+    });
+  });
+});

x-pack/plugins/uptime/public/components/monitor/status_details/status_bar/status_bar.tsx

@@ -15,6 +15,7 @@ import {
   EuiDescriptionListDescription,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
+import { i18n } from '@kbn/i18n';
 import { MonitorSSLCertificate } from './ssl_certificate';
 import * as labels from '../translations';
 import { StatusByLocations } from './status_by_location';
@@ -40,36 +41,24 @@ export const MonListDescription = styled(EuiDescriptionListDescription)`
   }
 `;
 
-const renderMonitorType = (type: string) => {
+export const renderMonitorType = (type: string | undefined) => {
   switch (type) {
     case 'http':
-      return (
-        <FormattedMessage
-          id="xpack.uptime.monitorDetails.statusBar.pingType.http"
-          defaultMessage="HTTP"
-        />
-      );
+      return i18n.translate('xpack.uptime.monitorDetails.statusBar.pingType.http', {
+        defaultMessage: 'HTTP',
+      });
     case 'tcp':
-      return (
-        <FormattedMessage
-          id="xpack.uptime.monitorDetails.statusBar.pingType.tcp"
-          defaultMessage="TCP"
-        />
-      );
+      return i18n.translate('xpack.uptime.monitorDetails.statusBar.pingType.tcp', {
+        defaultMessage: 'TCP',
+      });
     case 'icmp':
-      return (
-        <FormattedMessage
-          id="xpack.uptime.monitorDetails.statusBar.pingType.icmp"
-          defaultMessage="ICMP"
-        />
-      );
+      return i18n.translate('xpack.uptime.monitorDetails.statusBar.pingType.icmp', {
+        defaultMessage: 'ICMP',
+      });
     case 'browser':
-      return (
-        <FormattedMessage
-          id="xpack.uptime.monitorDetails.statusBar.pingType.browser"
-          defaultMessage="Browser"
-        />
-      );
+      return i18n.translate('xpack.uptime.monitorDetails.statusBar.pingType.browser', {
+        defaultMessage: 'Browser',
+      });
     default:
       return '';
   }