Two cells can be focused at the same time in the tables Fixes #1826 (#1866)

Co-authored-by: kramer <david.kramer@gmail.com>
Co-authored-by: Ayush Agrawal <54364088+AyushAgrawal-A2@users.noreply.github.com>
Co-authored-by: AyushAgrawal-A2 <ayushagl06@gmail.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

front/src/modules/ui/data-table/table-cell/components/TableCellContainer.tsx

@@ -8,6 +8,8 @@ import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
 
 import { CellHotkeyScopeContext } from '../../contexts/CellHotkeyScopeContext';
 import { ColumnIndexContext } from '../../contexts/ColumnIndexContext';
+import { useGetIsSomeCellInEditMode } from '../../hooks/useGetIsSomeCellInEditMode';
+import { useMoveSoftFocusToCurrentCellOnHover } from '../../hooks/useMoveSoftFocusToCurrentCellOnHover';
 import { TableHotkeyScope } from '../../types/TableHotkeyScope';
 import { useCurrentTableCellEditMode } from '../hooks/useCurrentTableCellEditMode';
 import { useIsSoftFocusOnCurrentTableCell } from '../hooks/useIsSoftFocusOnCurrentTableCell';
@@ -58,8 +60,15 @@ export const TableCellContainer = ({
 }: TableCellContainerProps) => {
   const { isCurrentTableCellInEditMode } = useCurrentTableCellEditMode();
 
+  const getIsSomeCellInEditMode = useGetIsSomeCellInEditMode();
+
   const [isHovered, setIsHovered] = useState(false);
 
+  const moveSoftFocusToCurrentCellOnHover =
+    useMoveSoftFocusToCurrentCellOnHover();
+
+  const hasSoftFocus = useIsSoftFocusOnCurrentTableCell();
+
   const setSoftFocusOnCurrentTableCell = useSetSoftFocusOnCurrentTableCell();
 
   const { openTableCell } = useTableCell();
@@ -70,7 +79,12 @@ export const TableCellContainer = ({
   };
 
   const handleContainerMouseEnter = () => {
-    setIsHovered(true);
+    const isSomeCellInEditMode = getIsSomeCellInEditMode();
+
+    if (!isHovered && !isSomeCellInEditMode) {
+      setIsHovered(true);
+      moveSoftFocusToCurrentCellOnHover();
+    }
   };
 
   const handleContainerMouseLeave = () => {
@@ -84,14 +98,12 @@ export const TableCellContainer = ({
   const isEmpty = useIsFieldEmpty();
 
   const showButton =
-    buttonIcon &&
-    isHovered &&
+    !!buttonIcon &&
+    hasSoftFocus &&
     !isCurrentTableCellInEditMode &&
     !editModeContentOnly &&
     (!isFirstColumnCell || !isEmpty);
 
-  const hasSoftFocus = useIsSoftFocusOnCurrentTableCell();
-
   return (
     <CellHotkeyScopeContext.Provider
       value={editHotkeyScope ?? DEFAULT_CELL_SCOPE}
@@ -123,7 +135,7 @@ export const TableCellContainer = ({
             {showButton && (
               <TableCellButton onClick={handleButtonClick} Icon={buttonIcon} />
             )}
-            <TableCellDisplayMode isHovered={isHovered}>
+            <TableCellDisplayMode>
               {editModeContentOnly ? editModeContent : nonEditModeContent}
             </TableCellDisplayMode>
           </>