From 093f7ed551d68fd06fd911240ee6c85d643f4f7a Mon Sep 17 00:00:00 2001
From: nevermore <kl.nevermore@gmail.com>
Date: Fri, 31 May 2024 10:38:42 +0800
Subject: [PATCH] fix:DataTable: Tabulation is not working propertly. Also
 editorCallback does not reflect the new value in some cases

---
 components/lib/datatable/BodyCell.js | 26 ++++++++++----------------
 1 file changed, 10 insertions(+), 16 deletions(-)

diff --git a/components/lib/datatable/BodyCell.js b/components/lib/datatable/BodyCell.js
index 3a841ca4cc..dfb419ba1a 100644
--- a/components/lib/datatable/BodyCell.js
+++ b/components/lib/datatable/BodyCell.js
@@ -23,7 +23,6 @@ export const BodyCell = React.memo((props) => {
     const keyHelperRef = React.useRef(null);
     const overlayEventListener = React.useRef(null);
     const selfClick = React.useRef(false);
-    const tabindexTimeout = React.useRef(null);
     const initFocusTimeout = React.useRef(null);
     const editingRowDataStateRef = React.useRef(null);
     const { ptm, ptmo, cx } = props.ptCallbacks;
@@ -229,16 +228,13 @@ export const BodyCell = React.memo((props) => {
     };
 
     const focusOnElement = () => {
-        clearTimeout(tabindexTimeout.current);
-        tabindexTimeout.current = setTimeout(() => {
-            if (editingState) {
-                const focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');
+        if (editingState) {
+            const focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');
 
-                focusableEl && focusableEl.focus();
-            }
+            focusableEl && focusableEl.focus();
+        }
 
-            keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
-        }, 1);
+        keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
     };
 
     const focusOnInit = () => {
@@ -520,15 +516,13 @@ export const BodyCell = React.memo((props) => {
 
     useUpdateEffect(() => {
         if (props.editMode === 'cell' || props.editMode === 'row') {
-            setEditingRowDataState(getEditingRowData());
-        }
-    }, [props.editingMeta]);
+            const editingRowData = getEditingRowData();
 
-    React.useEffect(() => {
-        if (editingRowDataState) {
-            editingRowDataStateRef.current = editingRowDataState;
+            setEditingRowDataState(editingRowData);
+
+            editingRowDataStateRef.current = editingRowData;
         }
-    }, [editingRowDataState]);
+    }, [props.editingMeta]);
 
     React.useEffect(() => {
         if (props.editMode === 'cell' || props.editMode === 'row') {