From 4f306f8955f982709c0013837697a4a8bca2cb41 Mon Sep 17 00:00:00 2001
From: Charles Bochet <charlesBochet@users.noreply.github.com>
Date: Fri, 12 Jan 2024 16:30:32 +0100
Subject: [PATCH] Fix bug hover on table (#3404)

---
 .../hooks/internal/useGetIsSomeCellInEditMode.ts           | 6 +++---
 .../object-record/record-table/hooks/useRecordTable.ts     | 7 ++++---
 .../components/RecordTableCellContainer.tsx                | 6 +++---
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/record-table/hooks/internal/useGetIsSomeCellInEditMode.ts b/packages/twenty-front/src/modules/object-record/record-table/hooks/internal/useGetIsSomeCellInEditMode.ts
index d2375672a..0049296be 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/hooks/internal/useGetIsSomeCellInEditMode.ts
+++ b/packages/twenty-front/src/modules/object-record/record-table/hooks/internal/useGetIsSomeCellInEditMode.ts
@@ -3,7 +3,7 @@ import { useRecoilCallback } from 'recoil';
 import { useRecordTableStates } from '@/object-record/record-table/hooks/internal/useRecordTableStates';
 import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
 
-export const useGetIsSomeCellInEditMode = (recordTableId?: string) => {
+export const useGetIsSomeCellInEditModeState = (recordTableId?: string) => {
   const {
     currentTableCellInEditModePositionState,
     isTableCellInEditModeFamilyState,
@@ -17,11 +17,11 @@ export const useGetIsSomeCellInEditMode = (recordTableId?: string) => {
           currentTableCellInEditModePositionState(),
         );
 
-        const isSomeCellInEditMode = isTableCellInEditModeFamilyState(
+        const isSomeCellInEditModeState = isTableCellInEditModeFamilyState(
           currentTableCellInEditModePosition,
         );
 
-        return isSomeCellInEditMode;
+        return isSomeCellInEditModeState;
       },
     [currentTableCellInEditModePositionState, isTableCellInEditModeFamilyState],
   );
diff --git a/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts b/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts
index 9b4f8358a..07b1490c0 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts
+++ b/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts
@@ -1,7 +1,7 @@
 import { useRecoilCallback, useSetRecoilState } from 'recoil';
 import { Key } from 'ts-key-enum';
 
-import { useGetIsSomeCellInEditMode } from '@/object-record/record-table/hooks/internal/useGetIsSomeCellInEditMode';
+import { useGetIsSomeCellInEditModeState } from '@/object-record/record-table/hooks/internal/useGetIsSomeCellInEditMode';
 import { useRecordTableStates } from '@/object-record/record-table/hooks/internal/useRecordTableStates';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
@@ -318,7 +318,8 @@ export const useRecordTable = (props?: useRecordTableProps) => {
 
   const { selectAllRows } = useSelectAllRows(recordTableId);
 
-  const getIsSomeCellInEditMode = useGetIsSomeCellInEditMode(recordTableId);
+  const isSomeCellInEditModeState =
+    useGetIsSomeCellInEditModeState(recordTableId);
 
   return {
     scopeId,
@@ -344,7 +345,7 @@ export const useRecordTable = (props?: useRecordTableProps) => {
     setIsRecordTableInitialLoading,
     setRecordTableLastRowVisible,
     setSoftFocusPosition,
-    getIsSomeCellInEditMode,
+    isSomeCellInEditModeState,
     selectedRowIdsSelector,
   };
 };
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellContainer.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellContainer.tsx
index a76f8bf12..7a51ab4cf 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellContainer.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellContainer.tsx
@@ -1,5 +1,6 @@
 import { ReactElement, useContext, useState } from 'react';
 import styled from '@emotion/styled';
+import { useRecoilValue } from 'recoil';
 
 import { useGetButtonIcon } from '@/object-record/field/hooks/useGetButtonIcon';
 import { useIsFieldEmpty } from '@/object-record/field/hooks/useIsFieldEmpty';
@@ -57,7 +58,8 @@ export const TableCellContainer = ({
 }: TableCellContainerProps) => {
   const { isCurrentTableCellInEditMode } = useCurrentTableCellEditMode();
 
-  const { getIsSomeCellInEditMode } = useRecordTable();
+  const { isSomeCellInEditModeState } = useRecordTable();
+  const isSomeCellInEditMode = useRecoilValue(isSomeCellInEditModeState());
 
   const [isHovered, setIsHovered] = useState(false);
 
@@ -76,8 +78,6 @@ export const TableCellContainer = ({
   };
 
   const handleContainerMouseEnter = () => {
-    const isSomeCellInEditMode = getIsSomeCellInEditMode();
-
     if (!isHovered && !isSomeCellInEditMode) {
       setIsHovered(true);
       moveSoftFocusToCurrentCellOnHover();