enable loading on cert list

elastic · May 7, 2020 · 9c76182 · 9c76182
1 parent 9b09009
commit 9c76182
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 3 deletions.
diff --git a/...time/public/components/certificates/__tests__/__snapshots__/fingerprint_col.test.tsx.snap b/...time/public/components/certificates/__tests__/__snapshots__/fingerprint_col.test.tsx.snap
diff --git a/x-pack/plugins/uptime/public/components/certificates/certificates_list.tsx b/x-pack/plugins/uptime/public/components/certificates/certificates_list.tsx
@@ -41,7 +41,7 @@ interface Props {
 }
 
 export const CertificateList: React.FC<Props> = ({ page, sort, onChange }) => {
-  const certificates = useSelector(certificatesSelector);
+  const { data: certificates, loading } = useSelector(certificatesSelector);
 
   const onTableChange = (newVal: Partial<Props>) => {
     onChange(newVal.page as Page, newVal.sort as CertSort);
@@ -98,6 +98,7 @@ export const CertificateList: React.FC<Props> = ({ page, sort, onChange }) => {
 
   return (
     <EuiBasicTable
+      loading={loading}
       columns={columns}
       items={certificates?.certs ?? []}
       pagination={pagination}

diff --git a/x-pack/plugins/uptime/public/components/certificates/fingerprint_col.tsx b/x-pack/plugins/uptime/public/components/certificates/fingerprint_col.tsx
@@ -32,7 +32,14 @@ export const FingerprintCol: React.FC<Props> = ({ cert }) => {
           <EmptyButton>{text} </EmptyButton>
         </EuiToolTip>
         <EuiCopy textToCopy={val ?? ''}>
-          {copy => <EuiButtonIcon onClick={copy} iconType="copy" title={COPY_FINGERPRINT} />}
+          {copy => (
+            <EuiButtonIcon
+              aria-label={COPY_FINGERPRINT}
+              onClick={copy}
+              iconType="copy"
+              title={COPY_FINGERPRINT}
+            />
+          )}
         </EuiCopy>
       </Span>
     );

diff --git a/x-pack/plugins/uptime/public/state/certificates/certificates.ts b/x-pack/plugins/uptime/public/state/certificates/certificates.ts
@@ -40,4 +40,4 @@ export function* fetchCertificatesEffect() {
   );
 }
 
-export const certificatesSelector = ({ certificates }: AppState) => certificates.certs.data;
+export const certificatesSelector = ({ certificates }: AppState) => certificates.certs;