[Uptime ]Update empty message for certs list (#78575)

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

Author: shahzad31

x-pack/plugins/uptime/public/components/certificates/certificates_list.tsx

@@ -14,6 +14,7 @@ import { CertMonitors } from './cert_monitors';
 import * as labels from './translations';
 import { Cert, CertMonitor } from '../../../common/runtime_types';
 import { FingerprintCol } from './fingerprint_col';
+import { NO_CERTS_AVAILABLE } from './translations';
 
 interface Page {
   index: number;
@@ -109,6 +110,7 @@ export const CertificateList: React.FC<Props> = ({ page, sort, onChange }) => {
           direction: sort.direction,
         },
       }}
+      noItemsMessage={<span data-test-subj="uptimeCertsEmptyMessage">{NO_CERTS_AVAILABLE}</span>}
     />
   );
 };

x-pack/plugins/uptime/public/components/certificates/translations.ts

@@ -65,3 +65,7 @@ export const FINGERPRINTS_COL = i18n.translate('xpack.uptime.certs.list.expirati
 export const COPY_FINGERPRINT = i18n.translate('xpack.uptime.certs.list.copyFingerprint', {
   defaultMessage: 'Click to copy fingerprint value',
 });
+
+export const NO_CERTS_AVAILABLE = i18n.translate('xpack.uptime.certs.list.empty', {
+  defaultMessage: 'No Certificates found. Note: Certificates are only visible for Heartbeat 7.8+',
+});

x-pack/test/functional/apps/uptime/certificates.ts

@@ -15,63 +15,81 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => {
   const es = getService('es');
 
   describe('certificates', function () {
-    before(async () => {
-      await makeCheck({ es, tls: true });
-      await uptime.goToRoot(true);
-    });
+    describe('empty certificates', function () {
+      before(async () => {
+        await makeCheck({ es });
+        await uptime.goToRoot(true);
+      });
 
-    beforeEach(async () => {
-      await makeCheck({ es, tls: true });
+      it('go to certs page', async () => {
+        await uptimeService.common.waitUntilDataIsLoaded();
+        await uptimeService.cert.hasViewCertButton();
+        await uptimeService.navigation.goToCertificates();
+      });
+      it('displays empty message', async () => {
+        await uptimeService.cert.displaysEmptyMessage();
+      });
     });
 
-    it('can navigate to cert page', async () => {
-      await uptimeService.common.waitUntilDataIsLoaded();
-      await uptimeService.cert.hasViewCertButton();
-      await uptimeService.navigation.goToCertificates();
-    });
+    describe('with certs', function () {
+      before(async () => {
+        await makeCheck({ es, tls: true });
+        await uptime.goToRoot(true);
+      });
 
-    describe('page', () => {
       beforeEach(async () => {
-        await uptimeService.navigation.goToCertificates();
-        await uptimeService.navigation.refreshApp();
+        await makeCheck({ es, tls: true });
       });
 
-      it('displays certificates', async () => {
-        await uptimeService.cert.hasCertificates();
+      it('can navigate to cert page', async () => {
+        await uptimeService.common.waitUntilDataIsLoaded();
+        await uptimeService.cert.hasViewCertButton();
+        await uptimeService.navigation.goToCertificates();
       });
 
-      it('displays specific certificates', async () => {
-        const certId = getSha256();
-        const { monitorId } = await makeCheck({
-          es,
-          tls: {
-            sha256: certId,
-          },
+      describe('page', () => {
+        beforeEach(async () => {
+          await uptimeService.navigation.goToCertificates();
+          await uptimeService.navigation.refreshApp();
         });
 
-        await uptimeService.navigation.refreshApp();
-        await uptimeService.cert.certificateExists({ certId, monitorId });
-      });
+        it('displays certificates', async () => {
+          await uptimeService.cert.hasCertificates();
+        });
+
+        it('displays specific certificates', async () => {
+          const certId = getSha256();
+          const { monitorId } = await makeCheck({
+            es,
+            tls: {
+              sha256: certId,
+            },
+          });
+
+          await uptimeService.navigation.refreshApp();
+          await uptimeService.cert.certificateExists({ certId, monitorId });
+        });
 
-      it('performs search against monitor id', async () => {
-        const certId = getSha256();
-        const { monitorId } = await makeCheck({
-          es,
-          monitorId: 'cert-test-check-id',
-          fields: {
-            monitor: {
-              name: 'Cert Test Check',
+        it('performs search against monitor id', async () => {
+          const certId = getSha256();
+          const { monitorId } = await makeCheck({
+            es,
+            monitorId: 'cert-test-check-id',
+            fields: {
+              monitor: {
+                name: 'Cert Test Check',
+              },
+              url: {
+                full: 'https://site-to-check.com/',
+              },
             },
-            url: {
-              full: 'https://site-to-check.com/',
+            tls: {
+              sha256: certId,
             },
-          },
-          tls: {
-            sha256: certId,
-          },
+          });
+          await uptimeService.navigation.refreshApp();
+          await uptimeService.cert.searchIsWorking(monitorId);
         });
-        await uptimeService.navigation.refreshApp();
-        await uptimeService.cert.searchIsWorking(monitorId);
       });
     });
   });

x-pack/test/functional/services/uptime/certificates.ts

@@ -59,5 +59,12 @@ export function UptimeCertProvider({ getService, getPageObjects }: FtrProviderCo
         await self.hasCertificates(1);
       });
     },
+    async displaysEmptyMessage() {
+      await testSubjects.existOrFail('uptimeCertsEmptyMessage');
+      const emptyText = await testSubjects.getVisibleText('uptimeCertsEmptyMessage');
+      expect(emptyText).to.eql(
+        'No Certificates found. Note: Certificates are only visible for Heartbeat 7.8+'
+      );
+    },
   };
 }