From 33afdfd843a7305e6b9e456359e8fabf2d101478 Mon Sep 17 00:00:00 2001
From: Eric Olkowski <thatblindgeye@gmail.com>
Date: Wed, 27 Mar 2024 09:17:29 -0400
Subject: [PATCH] chore(Table): added more arialabeling for empty/nontext Table
 headers

---
 .../Table/examples/TableDraggable.tsx         | 31 ++++++++++---------
 .../Table/examples/TableSelectable.tsx        |  1 +
 packages/react-table/src/demos/Table.md       |  2 +-
 .../demos/examples/TableExpandCollapseAll.tsx |  3 +-
 4 files changed, 21 insertions(+), 16 deletions(-)

diff --git a/packages/react-table/src/components/Table/examples/TableDraggable.tsx b/packages/react-table/src/components/Table/examples/TableDraggable.tsx
index 7abcf7b7640..a837cd00970 100644
--- a/packages/react-table/src/components/Table/examples/TableDraggable.tsx
+++ b/packages/react-table/src/components/Table/examples/TableDraggable.tsx
@@ -150,20 +150,23 @@ export const TableDraggable: React.FunctionComponent = () => {
         </Tr>
       </Thead>
       <Tbody ref={bodyRef} onDragOver={onDragOver} onDrop={onDragOver} onDragLeave={onDragLeave}>
-        {rows.map((row, rowIndex) => (
-          <Tr key={rowIndex} id={row.id} draggable onDrop={onDrop} onDragEnd={onDragEnd} onDragStart={onDragStart}>
-            <Td
-              draggableRow={{
-                id: `draggable-row-${row.id}`
-              }}
-            />
-            {Object.keys(row).map((key, keyIndex) => (
-              <Td key={`${rowIndex}_${keyIndex}`} dataLabel={columns[keyIndex]}>
-                {row[key]}
-              </Td>
-            ))}
-          </Tr>
-        ))}
+        {rows.map((row, rowIndex) => {
+          const rowCellsToBuild = Object.keys(row).filter((rowCell) => rowCell !== 'id');
+          return (
+            <Tr key={rowIndex} id={row.id} draggable onDrop={onDrop} onDragEnd={onDragEnd} onDragStart={onDragStart}>
+              <Td
+                draggableRow={{
+                  id: `draggable-row-${row.id}`
+                }}
+              />
+              {rowCellsToBuild.map((key, keyIndex) => (
+                <Td key={`${rowIndex}_${keyIndex}`} dataLabel={columns[keyIndex]}>
+                  {row[key]}
+                </Td>
+              ))}
+            </Tr>
+          );
+        })}
       </Tbody>
     </Table>
   );
diff --git a/packages/react-table/src/components/Table/examples/TableSelectable.tsx b/packages/react-table/src/components/Table/examples/TableSelectable.tsx
index 5811846fb93..6c6db8b6203 100644
--- a/packages/react-table/src/components/Table/examples/TableSelectable.tsx
+++ b/packages/react-table/src/components/Table/examples/TableSelectable.tsx
@@ -93,6 +93,7 @@ export const TableSelectable: React.FunctionComponent = () => {
               onSelect: (_event, isSelecting) => selectAllRepos(isSelecting),
               isSelected: areAllReposSelected
             }}
+            aria-label="Row select"
           />
           <Th>{columnNames.name}</Th>
           <Th>{columnNames.branches}</Th>
diff --git a/packages/react-table/src/demos/Table.md b/packages/react-table/src/demos/Table.md
index acddd88eec3..9bba7e6e7bb 100644
--- a/packages/react-table/src/demos/Table.md
+++ b/packages/react-table/src/demos/Table.md
@@ -103,7 +103,7 @@ import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
 
 ### Column management with draggable
 
-```js isFullscreen file="./examples/TableColumnManagementWithDraggable.tsx"
+```js isDeprecated isFullscreen file="./examples/TableColumnManagementWithDraggable.tsx"
 
 ```
 
diff --git a/packages/react-table/src/demos/examples/TableExpandCollapseAll.tsx b/packages/react-table/src/demos/examples/TableExpandCollapseAll.tsx
index 840bab1c616..987dd21671f 100644
--- a/packages/react-table/src/demos/examples/TableExpandCollapseAll.tsx
+++ b/packages/react-table/src/demos/examples/TableExpandCollapseAll.tsx
@@ -164,7 +164,8 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
                       collapseAllAriaLabel,
                       onToggle: onCollapseAll
                     }}
-                  ></Th>
+                    aria-label="Row expansion"
+                  />
                   {expandableColumns.map((column) => (
                     <Th key={column}>{column}</Th>
                   ))}