empty action cell text added

cerner · Feb 14, 2024 · 91d9d1e · 91d9d1e
1 parent 6ba44dd
commit 91d9d1e
Show file tree

Hide file tree

Showing 4 changed files with 45 additions and 25 deletions.
diff --git a/packages/terra-table/src/subcomponents/ColumnHeaderCell.jsx b/packages/terra-table/src/subcomponents/ColumnHeaderCell.jsx
@@ -337,10 +337,47 @@ const ColumnHeaderCell = (props) => {
   };
 
   const isPinnedColumn = columnIndex < columnContext.pinnedColumnOffsets.length;
+  const CellTag = !isActionCell ? 'th' : 'td';
+
+  // Create cell content
+  let cellContent;
+  if (isActionCell) {
+    if (action) {
+      cellContent = (
+        <Button
+          variant="de-emphasis"
+          ref={columnHeaderCellRef}
+          isCompact
+          onClick={action.onClick}
+          onKeyDown={(event) => handleKeyDown(event, action?.onClick)}
+          text={action.label}
+        />
+      );
+    } else {
+      cellContent = (
+        <span aria-hidden className={cx('display-text', 'hidden')}>
+          {intl.formatMessage({ id: 'Terra.table.noAction' })}
+        </span>
+      );
+    }
+  } else {
+    cellContent = (
+      <div
+        className={cx('header-container')}
+        {...hasButtonElement && { ref: columnHeaderCellRef, role: 'button' }}
+        tabIndex={buttonTabIndex}
+      >
+        {errorIcon}
+        <span aria-hidden className={cx('display-text', { hidden: !isDisplayVisible })}>{displayName}</span>
+        {sortIndicatorIcon}
+        <VisuallyHiddenText text={headerDescription} />
+      </div>
+    );
+  }
 
   return (
   /* eslint-disable react/forbid-dom-props */
-    <th
+    <CellTag
       ref={!hasButtonElement ? columnHeaderCellRef : undefined}
       id={`${tableId}-${id}`}
       key={id}
@@ -356,31 +393,11 @@ const ColumnHeaderCell = (props) => {
       title={displayName}
       onMouseDown={isSelectable && onColumnSelect ? handleMouseDown : undefined}
       onKeyDown={(isSelectable || isResizable) ? handleKeyDown : undefined}
-      style={{ width: `${width}px`, height: isActionCell ? 'auto' : headerHeight, left: cellLeftEdge }} // eslint-disable-line react/forbid-dom-props
+      // eslint-disable-next-line react/forbid-component-props
+      style={{ width: `${width}px`, height: isActionCell ? 'auto' : headerHeight, left: cellLeftEdge }}
       onFocus={isActionCell ? distributeFocusWithinActionCell : undefined}
     >
-      {isActionCell && action
-        ? (
-          <Button
-            variant="de-emphasis"
-            ref={columnHeaderCellRef}
-            isCompact
-            onClick={action.onClick}
-            onKeyDown={(event) => handleKeyDown(event, action?.onClick)}
-            text={action.label}
-          />
-        ) : (
-          <div
-            className={cx('header-container')}
-            {...hasButtonElement && { ref: columnHeaderCellRef, role: 'button' }}
-            tabIndex={buttonTabIndex}
-          >
-            {errorIcon}
-            <span aria-hidden className={cx('display-text', { hidden: !isDisplayVisible })}>{displayName}</span>
-            {sortIndicatorIcon}
-            <VisuallyHiddenText text={headerDescription} />
-          </div>
-        )}
+      {cellContent}
       { isResizable && !isActionCell && (
       <ColumnResizeHandle
         columnIndex={columnIndex}
@@ -398,7 +415,7 @@ const ColumnHeaderCell = (props) => {
         onResizeHandleChange={onResizeHandleChange}
       />
       )}
-    </th>
+    </CellTag>
   );
 };
 

diff --git a/packages/terra-table/translations/en-GB.json b/packages/terra-table/translations/en-GB.json
@@ -1,5 +1,6 @@
 {
   "Terra.table.blank": "Blank",
+  "Terra.table.noAction": "No column action",
   "Terra.table.maskedCell": "Masked data",
   "Terra.table.cell-focus-trapped": "Focus contained in cell. Press Escape to resume grid navigation.",
   "Terra.table.cell-interactable": "Cell contains interactable elements. Press Enter to move focus inside the cell.",

diff --git a/packages/terra-table/translations/en-US.json b/packages/terra-table/translations/en-US.json
@@ -1,5 +1,6 @@
 {
   "Terra.table.blank": "Blank",
+  "Terra.table.noAction": "No column action",
   "Terra.table.maskedCell": "Masked data",
   "Terra.table.cell-focus-trapped": "Focus contained in cell. Press Escape to resume table navigation.",
   "Terra.table.cell-interactable": "Cell contains interactable elements. Press Enter to move focus inside the cell.",

diff --git a/packages/terra-table/translations/en.json b/packages/terra-table/translations/en.json
@@ -1,5 +1,6 @@
 {
   "Terra.table.blank": "Blank",
+  "Terra.table.noAction": "No column action",
   "Terra.table.maskedCell": "Masked data",
   "Terra.table.cell-focus-trapped": "Focus contained in cell. Press Escape to resume table navigation.",
   "Terra.table.cell-interactable": "Cell contains interactable elements. Press Enter to move focus inside the cell.",