Various fixes (#11108)

Fixes many bug regarding TableCell and InlineCells

packages/twenty-front/src/modules/activities/inline-cell/components/ActivityTargetsInlineCell.tsx

@@ -1,23 +1,21 @@
 import { useContext } from 'react';
-import { Key } from 'ts-key-enum';
 import { IconArrowUpRight, IconPencil } from 'twenty-ui';
 
 import { ActivityTargetChips } from '@/activities/components/ActivityTargetChips';
 import { useActivityTargetObjectRecords } from '@/activities/hooks/useActivityTargetObjectRecords';
 import { useOpenActivityTargetInlineCellEditMode } from '@/activities/inline-cell/hooks/useOpenActivityTargetInlineCellEditMode';
 import { useUpdateActivityTargetFromInlineCell } from '@/activities/inline-cell/hooks/useUpdateActivityTargetFromInlineCell';
-import { ActivityEditorHotkeyScope } from '@/activities/types/ActivityEditorHotkeyScope';
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useFieldContext } from '@/object-record/hooks/useFieldContext';
 import { FieldContext } from '@/object-record/record-field/contexts/FieldContext';
 import { FieldFocusContextProvider } from '@/object-record/record-field/contexts/FieldFocusContextProvider';
 import { useIsFieldValueReadOnly } from '@/object-record/record-field/hooks/useIsFieldValueReadOnly';
-import { RecordFieldInputScope } from '@/object-record/record-field/scopes/RecordFieldInputScope';
+import { RecordFieldComponentInstanceContext } from '@/object-record/record-field/states/contexts/RecordFieldComponentInstanceContext';
 import { RecordInlineCellContainer } from '@/object-record/record-inline-cell/components/RecordInlineCellContainer';
 import { RecordInlineCellContext } from '@/object-record/record-inline-cell/components/RecordInlineCellContext';
 import { useInlineCell } from '@/object-record/record-inline-cell/hooks/useInlineCell';
 import { MultipleRecordPicker } from '@/object-record/record-picker/multiple-record-picker/components/MultipleRecordPicker';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { MultipleRecordPickerHotkeyScope } from '@/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope';
 
 type ActivityTargetsInlineCellProps = {
   activityRecordId: string;
@@ -26,6 +24,7 @@ type ActivityTargetsInlineCellProps = {
   activityObjectNameSingular:
     | CoreObjectNameSingular.Note
     | CoreObjectNameSingular.Task;
+  componentInstanceId: string;
 };
 
 export const ActivityTargetsInlineCell = ({
@@ -33,26 +32,17 @@ export const ActivityTargetsInlineCell = ({
   showLabel = true,
   maxWidth,
   activityObjectNameSingular,
+  componentInstanceId,
 }: ActivityTargetsInlineCellProps) => {
   const { activityTargetObjectRecords } =
     useActivityTargetObjectRecords(activityRecordId);
 
-  const multipleRecordPickerInstanceId = `multiple-record-picker-target-${activityRecordId}`;
-
-  const { closeInlineCell } = useInlineCell();
+  const { closeInlineCell } = useInlineCell(componentInstanceId);
 
   const { fieldDefinition } = useContext(FieldContext);
 
   const isFieldReadOnly = useIsFieldValueReadOnly();
 
-  useScopedHotkeys(
-    Key.Escape,
-    () => {
-      closeInlineCell();
-    },
-    ActivityEditorHotkeyScope.ActivityTargets,
-  );
-
   const { FieldContextProvider: ActivityTargetsContextProvider } =
     useFieldContext({
       objectNameSingular: activityObjectNameSingular,
@@ -72,7 +62,11 @@ export const ActivityTargetsInlineCell = ({
     });
 
   return (
-    <RecordFieldInputScope recordFieldInputScopeId={activityRecordId}>
+    <RecordFieldComponentInstanceContext.Provider
+      value={{
+        instanceId: componentInstanceId,
+      }}
+    >
       <FieldFocusContextProvider>
         {ActivityTargetsContextProvider && (
           <ActivityTargetsContextProvider>
@@ -80,20 +74,20 @@ export const ActivityTargetsInlineCell = ({
               value={{
                 buttonIcon: IconPencil,
                 customEditHotkeyScope:
-                  ActivityEditorHotkeyScope.ActivityTargets,
+                  MultipleRecordPickerHotkeyScope.MultipleRecordPicker,
                 IconLabel: showLabel ? IconArrowUpRight : undefined,
                 showLabel: showLabel,
                 readonly: isFieldReadOnly,
                 labelWidth: fieldDefinition?.labelWidth,
                 editModeContent: (
                   <MultipleRecordPicker
-                    componentInstanceId={multipleRecordPickerInstanceId}
+                    componentInstanceId={componentInstanceId}
                     onClickOutside={() => {
                       closeInlineCell();
                     }}
                     onChange={(morphItem) => {
                       updateActivityTargetFromInlineCell({
-                        recordPickerInstanceId: multipleRecordPickerInstanceId,
+                        recordPickerInstanceId: componentInstanceId,
                         morphItem,
                         activityTargetWithTargetRecords:
                           activityTargetObjectRecords,
@@ -113,7 +107,7 @@ export const ActivityTargetsInlineCell = ({
                 ),
                 onOpenEditMode: () => {
                   openActivityTargetInlineCellEditMode({
-                    recordPickerInstanceId: multipleRecordPickerInstanceId,
+                    recordPickerInstanceId: componentInstanceId,
                     activityTargetObjectRecords,
                   });
                 },
@@ -124,6 +118,6 @@ export const ActivityTargetsInlineCell = ({
           </ActivityTargetsContextProvider>
         )}
       </FieldFocusContextProvider>
-    </RecordFieldInputScope>
+    </RecordFieldComponentInstanceContext.Provider>
   );
 };