From dfb0460e95f3d9564f1a3164aa951e6d03dcd567 Mon Sep 17 00:00:00 2001
From: CD Cabrera <cabrera.code@gmail.com>
Date: Thu, 21 Sep 2023 15:11:03 -0400
Subject: [PATCH] fix(tableEmpty): sw-1537 aria-label attribute format (#1196)

---
 src/components/README.md                              |  2 ++
 .../__tests__/__snapshots__/tableEmpty.test.js.snap   |  8 ++++++--
 src/components/table/tableEmpty.js                    | 11 +++++++----
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/components/README.md b/src/components/README.md
index 1a73408fd..e52af1d44 100644
--- a/src/components/README.md
+++ b/src/components/README.md
@@ -5748,6 +5748,8 @@ Render an empty table.
 <tr>
     <td>props</td><td><code>object</code></td>
     </tr><tr>
+    <td>props.ariaLabel</td><td><code>string</code></td>
+    </tr><tr>
     <td>props.icon</td><td><code>React.ReactNode</code> | <code>function</code></td>
     </tr><tr>
     <td>props.message</td><td><code>React.ReactNode</code></td>
diff --git a/src/components/table/__tests__/__snapshots__/tableEmpty.test.js.snap b/src/components/table/__tests__/__snapshots__/tableEmpty.test.js.snap
index 2015b0e84..f93b485eb 100644
--- a/src/components/table/__tests__/__snapshots__/tableEmpty.test.js.snap
+++ b/src/components/table/__tests__/__snapshots__/tableEmpty.test.js.snap
@@ -2,7 +2,9 @@
 
 exports[`TableEmpty Component should have fallback checks for certain props: fallback display 1`] = `
 <EmptyTable>
-  <table />
+  <table
+    aria-label={null}
+  />
   <EmptyState
     variant="small"
   >
@@ -24,7 +26,9 @@ exports[`TableEmpty Component should have fallback checks for certain props: fal
 
 exports[`TableEmpty Component should render a basic component: basic 1`] = `
 <EmptyTable>
-  <table />
+  <table
+    aria-label={null}
+  />
   <EmptyState
     variant="small"
   >
diff --git a/src/components/table/tableEmpty.js b/src/components/table/tableEmpty.js
index c2d318d41..a7e50735d 100644
--- a/src/components/table/tableEmpty.js
+++ b/src/components/table/tableEmpty.js
@@ -13,6 +13,7 @@ import { EmptyTable as PlatformEmptyTableWrapper } from '@redhat-cloud-services/
  * Render an empty table.
  *
  * @param {object} props
+ * @param {string} props.ariaLabel
  * @param {React.ReactNode|Function} props.icon
  * @param {React.ReactNode} props.message
  * @param {string} props.tableHeading
@@ -20,9 +21,9 @@ import { EmptyTable as PlatformEmptyTableWrapper } from '@redhat-cloud-services/
  * @param {string} props.variant
  * @returns {React.ReactNode}
  */
-const TableEmpty = ({ icon, message, tableHeading, title, variant, ...props }) => (
+const TableEmpty = ({ ariaLabel, icon, message, tableHeading, title, variant, ...props }) => (
   <PlatformEmptyTableWrapper>
-    <table {...props} />
+    <table aria-label={ariaLabel} {...props} />
     <EmptyState variant={variant}>
       {icon && <EmptyStateIcon icon={icon} />}
       <Title headingLevel={tableHeading} size="lg">
@@ -37,9 +38,10 @@ const TableEmpty = ({ icon, message, tableHeading, title, variant, ...props }) =
  * Prop types.
  *
  * @type {{icon: React.ReactNode|Function, variant: string, message: React.ReactNode, title: React.ReactNode,
- *     tableHeading: string}}
+ *     tableHeading: string, ariaLabel: string}}
  */
 TableEmpty.propTypes = {
+  ariaLabel: PropTypes.string,
   icon: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
   message: PropTypes.node.isRequired,
   tableHeading: PropTypes.string,
@@ -50,9 +52,10 @@ TableEmpty.propTypes = {
 /**
  * Default props.
  *
- * @type {{icon: null, variant: EmptyStateVariant.small, tableHeading: string}}
+ * @type {{icon: null, variant: EmptyStateVariant.small, tableHeading: string, ariaLabel: null}}
  */
 TableEmpty.defaultProps = {
+  ariaLabel: null,
   icon: SearchIcon,
   tableHeading: 'h2',
   variant: EmptyStateVariant.small