fix(datagrid): selectall selects disabled rows (carbon-design-system#…

…6008)

* fix(datagrid): selectall selects disabled rows

* fix(datagrid): cspell update

* fix(datagrid): story updated to Row action buttons

* fix(datagrid): optimise nons electable row calculation

* fix(datagrid): optimise

* fix(datagrid): nonselectablerows logic update

* fix(datagrid): optimize select all logic

* fix(datagrid): disable check logic update

* fix(datagrid): update test cases

* fix(datagrid): update testcase remove unwanted comments

cspell.json

@@ -120,6 +120,7 @@
     "namor",
     "nodataemptystate",
     "nonlinearreading",
+    "nonselectablerows",
     "noreply",
     "overridable",
     "overscan",

packages/ibm-products/src/components/Datagrid/Datagrid.test.js

@@ -1715,8 +1715,7 @@ describe(componentName, () => {
         .getElementsByTagName('div')[0]
         .getElementsByTagName('p')[0]
         .getElementsByTagName('span')[0].textContent
-    ).toEqual('99 items selected');
-    // ).toEqual('93 items selected'); (7 rows are disabled in entire table) switch to this after #5972 issue fixes
+    ).toEqual('93 items selected');
 
     // check for cancel button in batch actions and click
     expect(

packages/ibm-products/src/components/Datagrid/Datagrid/addons/stateReducer.js

@@ -130,9 +130,14 @@ export const stateReducer = (newState, action) => {
       const newSelectedRowIds = {};
       if (rows) {
         const newSelectedRowData = {};
+        const nonSelectableRows =
+          rows.find((row) => row.getRowProps)?.getRowProps?.()
+            ?.nonselectablerows || [];
         rows.forEach((row) => {
-          const props = row.getRowProps?.();
-          if (props && props.disabled) {
+          if (
+            nonSelectableRows.length > 0 &&
+            nonSelectableRows.includes(row.id)
+          ) {
             return;
           }
           newSelectedRowIds[getRowId(row.original, row.index)] = true;

packages/ibm-products/src/components/Datagrid/Extensions/RowActionButtons/RowActionButtons.stories.jsx

@@ -14,6 +14,7 @@ import {
   useDatagrid,
   useStickyColumn,
   useActionsColumn,
+  useDisableSelectRows,
   useSelectRows,
 } from '../../index';
 import styles from '../../_storybook-styles.scss?inline';
@@ -280,7 +281,7 @@ const RowActionButtonsBatchActions = ({ ...args }) => {
     ],
     []
   );
-  const [data] = useState(makeData(10));
+  const [data] = useState(makeData(50));
   const rows = React.useMemo(() => data, [data]);
 
   const datagridState = useDatagrid(
@@ -293,6 +294,8 @@ const RowActionButtonsBatchActions = ({ ...args }) => {
       },
       DatagridActions,
       DatagridPagination,
+      endPlugins: [useDisableSelectRows],
+      shouldDisableSelectRow: (row) => row.id % 5 === 0,
       ...args.defaultGridProps,
     },
     useStickyColumn,

packages/ibm-products/src/components/Datagrid/useDisableSelectRows.ts

@@ -4,25 +4,43 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import { Hooks, Row, RowPropGetter, TableRowProps } from 'react-table';
 import { DatagridRow, PropGetterMeta } from './types';
 
+const nonselectablerowsList = (instance) => {
+  const nonselectablerows: number[] =
+    instance?.rows
+      ?.filter(
+        (row) =>
+          instance.shouldDisableSelectRow &&
+          instance.shouldDisableSelectRow(row)
+      )
+      .map((row) => row.id) || [];
+  return nonselectablerows;
+};
+
 const useDisableSelectRows = (hooks: Hooks) => {
   updateSelectAll(hooks);
   updatePageSelectAll(hooks);
 
+  let nonselectablerows: number[] = [];
+  const useInstance = (instance) => {
+    nonselectablerows = nonselectablerowsList(instance);
+  };
+  hooks.useInstance.push(useInstance);
+
   const getRowProps: RowPropGetter<any> = (
     props: Partial<TableRowProps>,
     { row, instance }: PropGetterMeta
-  ) =>
-    [
+  ) => {
+    return [
       props,
       {
         disabled: instance?.shouldDisableSelectRow?.(row),
+        nonselectablerows,
       },
     ] as Partial<TableRowProps>[];
-
+  };
   hooks.getRowProps.push(getRowProps);
 };