fix(Dataspreadsheet): Reduce duplication with isHoldingCommandKey car…

…bon-design-system#4188 (carbon-design-system#4227)
paul-balchin-ibm · Feb 26, 2024 · ef93720 · ef93720
1 parent 47be3ea
commit ef93720
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 5 deletions.
diff --git a/packages/ibm-products/src/components/DataSpreadsheet/DataSpreadsheetBody.js b/packages/ibm-products/src/components/DataSpreadsheet/DataSpreadsheetBody.js
@@ -30,6 +30,7 @@ import { handleHeaderCellSelection } from './utils/handleHeaderCellSelection';
 import { getSpreadsheetWidth } from './utils/getSpreadsheetWidth';
 
 import { useSpreadsheetMouseUp } from './hooks';
+import { checkForHoldingKey } from './utils/checkForHoldingKey';
 
 const blockClass = `${pkg.prefix}--data-spreadsheet`;
 
@@ -277,8 +278,8 @@ export const DataSpreadsheetBody = forwardRef(
             `${blockClass}__body--td`
           );
           setValidStartingPoint(isValidSelectionAreaStart);
-          const isHoldingCommandKey = event.metaKey || event.ctrlKey;
-          const isHoldingShiftKey = event.shiftKey;
+          const isHoldingCommandKey = checkForHoldingKey(event, 'cmd');
+          const isHoldingShiftKey = checkForHoldingKey(event, 'shiftKey');
           setContainerHasFocus(true);
           const activeCoordinates = {
             row: cell.row.index,
@@ -407,7 +408,7 @@ export const DataSpreadsheetBody = forwardRef(
     const handleRowHeaderClick = useCallback(
       (index) => {
         return (event) => {
-          const isHoldingCommandKey = event.metaKey || event.ctrlKey;
+          const isHoldingCommandKey = checkForHoldingKey(event, 'cmd');
           handleHeaderCellSelection({
             type: 'row',
             activeCellCoordinates,

diff --git a/packages/ibm-products/src/components/DataSpreadsheet/DataSpreadsheetHeader.js b/packages/ibm-products/src/components/DataSpreadsheet/DataSpreadsheetHeader.js
@@ -17,6 +17,7 @@ import { handleHeaderCellSelection } from './utils/handleHeaderCellSelection';
 import { selectAllCells } from './utils/selectAllCells';
 import { getSpreadsheetWidth } from './utils/getSpreadsheetWidth';
 import { useSpreadsheetMouseMove } from './hooks';
+import { checkForHoldingKey } from './utils/checkForHoldingKey';
 
 const blockClass = `${pkg.prefix}--data-spreadsheet`;
 
@@ -63,8 +64,8 @@ export const DataSpreadsheetHeader = forwardRef(
 
     const handleColumnHeaderClick = (index) => {
       return (event) => {
-        const isHoldingCommandKey = event.metaKey || event.ctrlKey;
-        const isHoldingShiftKey = event.shiftKey;
+        const isHoldingCommandKey = checkForHoldingKey(event, 'cmd');
+        const isHoldingShiftKey = checkForHoldingKey(event, 'shiftKey');
         handleHeaderCellSelection({
           type: 'column',
           activeCellCoordinates,

diff --git a/packages/ibm-products/src/components/DataSpreadsheet/utils/checkForHoldingKey.js b/packages/ibm-products/src/components/DataSpreadsheet/utils/checkForHoldingKey.js
@@ -0,0 +1,15 @@
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export const checkForHoldingKey = (event, key) => {
+  // possible key inputs: altKey,ctrlKey,metaKey,shiftKey
+  if (key == 'cmd') {
+    return event.metaKey || event.ctrlKey;
+  } else {
+    return event[key];
+  }
+};