@linzjs/step-ag-grid 28.1.0 → 28.1.2

package/package.json

@@ -2,7 +2,7 @@
   "name": "@linzjs/step-ag-grid",
   "repository": "github:linz/step-ag-grid.git",
   "license": "MIT",
-  "version": "28.1.0",
+  "version": "28.1.2",
   "keywords": [
     "aggrid",
     "ag-grid",

package/src/components/Grid.tsx

@@ -36,6 +36,36 @@ import { usePostSortRowsHook } from './PostSortRowsHook';
 
 ModuleRegistry.registerModules([AllCommunityModule]);
 
+let timeOfLastSingleClick = 0;
+let lastClickColId: unknown;
+let lastClickRowIndex: unknown;
+
+const resetClickDebounce = () => {
+  timeOfLastSingleClick = 0;
+  lastClickColId = '';
+  lastClickRowIndex = -1;
+};
+
+/**
+ * If click is more than 200ms since last click return true.
+ */
+const clickDebounceSkipClick = (colId: unknown, rowIndex: unknown): boolean => {
+  const doubleClickMs = 200;
+
+  if (
+    Date.now() - timeOfLastSingleClick < doubleClickMs &&
+    lastClickColId === colId &&
+    lastClickRowIndex === rowIndex
+  ) {
+    // Skipping double click due to single click edit
+    return true;
+  }
+  timeOfLastSingleClick = Date.now();
+  lastClickColId = colId;
+  lastClickRowIndex = rowIndex;
+  return false;
+};
+
 export interface GridBaseRow {
   id: string | number;
 }
@@ -425,6 +455,11 @@ export const Grid = <TData extends GridBaseRow = GridBaseRow>({
    */
   const onCellDoubleClick = useCallback(
     (event: CellDoubleClickedEvent) => {
+      if (clickDebounceSkipClick(event.colDef.colId, event.rowIndex)) {
+        // the next click will be a single click, we want it to pass
+        resetClickDebounce();
+        return;
+      }
       const editable = fnOrVar(event.colDef?.editable, event);
       if (editable && !invokeEditAction(event)) {
         void startCellEditing({ rowId: event.data.id, colId: event.column.getColId() });
@@ -440,6 +475,9 @@ export const Grid = <TData extends GridBaseRow = GridBaseRow>({
     (event: CellClickedEvent) => {
       const editable = fnOrVar(event.colDef?.editable, event);
       if ((editable && event.colDef.singleClickEdit) ?? singleClickEdit) {
+        if (clickDebounceSkipClick(event.colDef.colId, event.rowIndex)) {
+          return;
+        }
         void startCellEditing({ rowId: event.data.id, colId: event.column.getColId() });
       }
     },

package/src/utils/__tests__/testUtil.ts

@@ -135,8 +135,13 @@ export const findCellContains = async (
 };
 
 export const selectCell = async (rowId: string | number, colId: string, within?: HTMLElement): Promise<void> => {
-  const cell = await findCell(rowId, colId, within);
-  await user.click(cell);
+  await waitFor(
+    async () => {
+      const cell = await findCell(rowId, colId, within);
+      await user.click(cell);
+    },
+    { timeout: 10000 },
+  );
 };
 
 export const editCell = async (rowId: number | string, colId: string, within?: HTMLElement): Promise<void> => {
@@ -200,7 +205,7 @@ export const openAndClickMenuOption = async (
   menuOptionText: string | RegExp,
   within?: HTMLElement,
 ): Promise<void> => {
-  await editCell(rowId, colId, within);
+  await selectCell(rowId, colId, within);
   await clickMenuOption(menuOptionText);
 };