From 517ef53b63f0fcf26c6ee65d53780b801bf10d8e Mon Sep 17 00:00:00 2001
From: Allen Wight <awight@redhat.com>
Date: Wed, 2 Oct 2019 10:39:16 -0400
Subject: [PATCH] fix(table): dataLabel prop allows for customized data-label
 on header

fixes #2941
---
 .../react-table/src/components/Table/HeaderCell.tsx    |  2 ++
 .../react-table/src/components/Table/Table.tsx         |  1 +
 .../src/components/Table/utils/headerUtils.test.tsx    | 10 ++++++++++
 .../src/components/Table/utils/headerUtils.tsx         |  5 +++--
 4 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/packages/patternfly-4/react-table/src/components/Table/HeaderCell.tsx b/packages/patternfly-4/react-table/src/components/Table/HeaderCell.tsx
index 7b112a6508b..43329c67958 100644
--- a/packages/patternfly-4/react-table/src/components/Table/HeaderCell.tsx
+++ b/packages/patternfly-4/react-table/src/components/Table/HeaderCell.tsx
@@ -9,6 +9,7 @@ export interface HeaderCellProps {
   isVisible?: boolean;
   scope?: string;
   textCenter?: boolean;
+  dataLabel?: string;
 }
 
 export const HeaderCell: React.FunctionComponent<HeaderCellProps> = ({
@@ -17,6 +18,7 @@ export const HeaderCell: React.FunctionComponent<HeaderCellProps> = ({
   isVisible,
   scope = '',
   textCenter = false,
+  dataLabel = '',
   ...props
 }: HeaderCellProps ) => {
   const Component = component as any;
diff --git a/packages/patternfly-4/react-table/src/components/Table/Table.tsx b/packages/patternfly-4/react-table/src/components/Table/Table.tsx
index 681b8d32a38..e58ddfdafa0 100644
--- a/packages/patternfly-4/react-table/src/components/Table/Table.tsx
+++ b/packages/patternfly-4/react-table/src/components/Table/Table.tsx
@@ -135,6 +135,7 @@ export interface ICell {
   data?: any;
   header?: any;
   cell?: any;
+  dataLabel?: string;
 }
 
 export interface IRowCell {
diff --git a/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.test.tsx b/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.test.tsx
index e6c51e4e4be..83f748faa27 100644
--- a/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.test.tsx
+++ b/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.test.tsx
@@ -171,6 +171,16 @@ describe('headerUtils', () => {
         expect(result[0].cell.formatters.find((formatter) => formatter.name === 'testFunc')).toBeDefined();
         expect(result[0].cell.transforms.find((transform) => transform.name === 'testFunc')).toBeDefined();
       });
+
+      describe('custom dataLabel', () => {
+        const cells = [{ title: 'expanded first', dataLabel: 'compact first' }, { title: 'expanded second'}] as ICell[];
+        const mixed = calculateColumns(cells, {});
+        cells.forEach((oneCell: ICell, key) => {
+          test(`${oneCell}`, () => {
+            expect(mixed[key].props['data-label']).toBe(oneCell.dataLabel ||oneCell.title);
+          });
+        });
+      });
     });
   });
 
diff --git a/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.tsx b/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.tsx
index 259c510652b..36640775364 100644
--- a/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.tsx
+++ b/packages/patternfly-4/react-table/src/components/Table/utils/headerUtils.tsx
@@ -59,7 +59,7 @@ const generateCell = ({ cellFormatters, cellTransforms, columnTransforms, cell }
 /**
  * Function to map custom simple object properties to expected format with property, header, cell, extra params
  * and props.
- * @param {*} column to be shown in header - either string or object with title, transformers and formatters (for cels as well).
+ * @param {*} column to be shown in header - either string or object with title, transformers and formatters (for cells as well).
  * @param {*} extra additional object with callbacks for specific formatters.
  * @param {*} key cell key to be shown in data-key.
  * @param {*} props additional props for each cell.
@@ -67,6 +67,7 @@ const generateCell = ({ cellFormatters, cellTransforms, columnTransforms, cell }
  */
 const mapHeader = (column: ICell, extra: any, key: number, ...props: any) => {
   const title = (column.hasOwnProperty('title') ? column.title : column) as string | ICell;
+  const dataLabel = (column.hasOwnProperty('dataLabel') ? column.dataLabel : typeof title === 'string' ? title : `column-${key}`) as string | ICell;
   return {
     property:
       (typeof title === 'string' &&
@@ -80,7 +81,7 @@ const mapHeader = (column: ICell, extra: any, key: number, ...props: any) => {
     header: generateHeader(column, title),
     cell: generateCell(column, extra),
     props: {
-      'data-label': typeof title === 'string' ? title : `column-${key}`,
+      'data-label': dataLabel,
       'data-key': key,
       ...(column.hasOwnProperty('props') ? column.props : {}),
       ...props