Rework atom naming (#18240)

## Summary - **Enhanced the `matching-state-variable` ESLint rule** to enforce consistent naming for `ComponentState`, `FamilyState`, and `ComponentFamilyState` hooks — previously it only covered `useAtomState` and `useAtomStateValue` - **The rule now checks 12 hooks** across three categories: value hooks (`useAtomComponentStateValue`, `useAtomFamilyStateValue`, etc.), state hooks (`useAtomComponentState`, `useAtomComponentFamilyState`), and setter hooks (`useSetAtomState`, `useSetAtomComponentState`, `useSetAtomFamilyState`, `useSetAtomComponentFamilyState`) - **Fixed all 225 resulting lint violations** across 151 files, renaming variables to match their state atom names (e.g. `currentViewId` → `contextStoreCurrentViewId`, `selectedRecord` → `recordStore`). Cases where the same state is accessed with different family keys/instance IDs are suppressed with `eslint-disable-next-line`. ## Naming convention | Hook | State argument | Valid | Invalid | |------|---------------|-------|---------| | `useAtomStateValue` | `fooState` | `const foo = ...` | `const bar = ...` | | `useAtomComponentStateValue` | `fooComponentState` | `const foo = ...` | `const bar = ...` | | `useAtomFamilyStateValue` | `fooFamilyState` | `const foo = ...` | `const bar = ...` | | `useAtomComponentFamilyStateValue` | `fooComponentFamilyState` | `const foo = ...` | `const bar = ...` | | `useAtomState` | `fooState` | `const [foo, setFoo] = ...` | `const [bar, setBar] = ...` | | `useAtomComponentState` | `fooComponentState` | `const [foo, setFoo] = ...` | `const [bar, setBar] = ...` | | `useAtomComponentFamilyState` | `fooComponentFamilyState` | `const [foo, setFoo] = ...` | `const [bar, setBar] = ...` | | `useSetAtomState` | `fooState` | `const setFoo = ...` | `const setBar = ...` | | `useSetAtomComponentState` | `fooComponentState` | `const setFoo = ...` | `const setBar = ...` | | `useSetAtomFamilyState` | `fooFamilyState` | `const setFoo = ...` | `const setBar = ...` | | `useSetAtomComponentFamilyState` | `fooComponentFamilyState` | `const setFoo = ...` | `const setBar = ...` |
2026-02-25 22:28:25 +01:00
parent 1b805a36f3
commit bc4ae35bc4
321 changed files with 1824 additions and 1518 deletions
@@ -94,7 +94,7 @@ export const useFetchMoreRecordsWithPagination = <
    queryIdentifier,
  );

-  const setIsFetchingMoreObjects = useSetAtomFamilyState(
+  const setIsFetchingMoreRecords = useSetAtomFamilyState(
    isFetchingMoreRecordsFamilyState,
    queryIdentifier,
  );
@@ -119,7 +119,7 @@ export const useFetchMoreRecordsWithPagination = <
      hasNextPageLocal ||
      (!isAggregationEnabled(objectMetadataItem) && !error)
    ) {
-      setIsFetchingMoreObjects(true);
+      setIsFetchingMoreRecords(true);

      try {
        const { data: fetchMoreDataResult } = await fetchMore({
@@ -193,13 +193,13 @@ export const useFetchMoreRecordsWithPagination = <
        handleFindManyRecordsError(error as ApolloError);
        return { error: error as ApolloError };
      } finally {
-        setIsFetchingMoreObjects(false);
+        setIsFetchingMoreRecords(false);
      }
    }
  }, [
    objectMetadataItem,
    error,
-    setIsFetchingMoreObjects,
+    setIsFetchingMoreRecords,
    fetchMore,
    filter,
    orderBy,
@@ -6,20 +6,21 @@ import { useLingui } from '@lingui/react/macro';
 export const ObjectFilterDropdownAnyFieldSearchInput = () => {
  const { t } = useLingui();

-  const [anyFieldFilterSearchValue, setAnyFieldFilterSearchValue] =
-    useAtomComponentState(anyFieldFilterValueComponentState);
+  const [anyFieldFilterValue, setAnyFieldFilterValue] = useAtomComponentState(
+    anyFieldFilterValueComponentState,
+  );

  const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {
    const inputValue = event.target.value;

-    setAnyFieldFilterSearchValue(inputValue);
+    setAnyFieldFilterValue(inputValue);
  };

  return (
    <DropdownMenuSearchInput
      autoFocus
      type="text"
-      value={anyFieldFilterSearchValue}
+      value={anyFieldFilterValue}
      placeholder={t`Search any field`}
      onChange={handleSearchChange}
    />
@@ -18,7 +18,7 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({
 }: ObjectFilterDropdownFilterSelectMenuItemProps) => {
  const { resetSelectedItem } = useSelectableList(FILTER_FIELD_LIST_ID);

-  const isSelectedItem = useAtomComponentFamilyStateValue(
+  const isSelectedItemId = useAtomComponentFamilyStateValue(
    isSelectedItemIdComponentFamilyState,
    fieldMetadataItemToSelect.id,
  );
@@ -39,7 +39,7 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({

  return (
    <MenuItem
-      focused={isSelectedItem}
+      focused={isSelectedItemId}
      onClick={handleClick}
      LeftIcon={Icon}
      text={fieldMetadataItemToSelect.label}
@@ -2,11 +2,12 @@ import { objectFilterDropdownCurrentRecordFilterComponentState } from '@/object-
 import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue';

 export const useObjectFilterDropdownFilterValue = () => {
-  const currentRecordFilter = useAtomComponentStateValue(
+  const objectFilterDropdownCurrentRecordFilter = useAtomComponentStateValue(
    objectFilterDropdownCurrentRecordFilterComponentState,
  );

-  const objectFilterDropdownFilterValue = currentRecordFilter?.value;
+  const objectFilterDropdownFilterValue =
+    objectFilterDropdownCurrentRecordFilter?.value;

  return { objectFilterDropdownFilterValue };
 };
@@ -54,7 +54,7 @@ export const ObjectOptionsDropdownCustomView = ({
      }
    : null;

-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -224,7 +224,7 @@ export const ObjectOptionsDropdownCustomView = ({
              <SelectableListItem
                itemId="Group"
                onEnter={() =>
-                  isDefined(recordGroupFieldMetadata)
+                  isDefined(recordIndexGroupFieldMetadataItem)
                    ? onContentChange('recordGroups')
                    : onContentChange('recordGroupFields')
                }
@@ -232,7 +232,7 @@ export const ObjectOptionsDropdownCustomView = ({
                <MenuItem
                  focused={selectedItemId === 'Group'}
                  onClick={() =>
-                    isDefined(recordGroupFieldMetadata)
+                    isDefined(recordIndexGroupFieldMetadataItem)
                      ? onContentChange('recordGroups')
                      : onContentChange('recordGroupFields')
                  }
@@ -241,7 +241,7 @@ export const ObjectOptionsDropdownCustomView = ({
                  contextualText={
                    isDefaultView
                      ? t`Not available on Default View`
-                      : recordGroupFieldMetadata?.label
+                      : recordIndexGroupFieldMetadataItem?.label
                  }
                  contextualTextPosition="right"
                  hasSubMenu
@@ -36,7 +36,7 @@ export const ObjectOptionsDropdownHiddenRecordGroupsContent = () => {
    viewType,
  } = useObjectOptionsDropdown();

-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -61,7 +61,7 @@ export const ObjectOptionsDropdownHiddenRecordGroupsContent = () => {

  const viewGroupSettingsUrl = getSettingsPath(SettingsPath.ObjectFieldEdit, {
    objectNamePlural,
-    fieldName: recordGroupFieldMetadata?.name ?? '',
+    fieldName: recordIndexGroupFieldMetadataItem?.name ?? '',
  });

  const location = useLocation();
@@ -88,10 +88,10 @@ export const ObjectOptionsDropdownHiddenRecordGroupsContent = () => {
          />
        }
      >
-        {t`Hidden`} {recordGroupFieldMetadata?.label}
+        {t`Hidden`} {recordIndexGroupFieldMetadataItem?.label}
      </DropdownMenuHeader>
      <RecordGroupsVisibilityDropdownSection
-        title={`${t`Hidden`} ${recordGroupFieldMetadata?.label}`}
+        title={`${t`Hidden`} ${recordIndexGroupFieldMetadataItem?.label}`}
        recordGroupIds={hiddenRecordGroupIds}
        onVisibilityChange={handleRecordGroupVisibilityChange}
        isDraggable={false}
@@ -66,7 +66,7 @@ export const ObjectOptionsDropdownLayoutContent = () => {
  const recordIndexCalendarLayout = useAtomStateValue(
    recordIndexCalendarLayoutState,
  );
-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -282,7 +282,7 @@ export const ObjectOptionsDropdownLayoutContent = () => {
              <SelectableListItem
                itemId="Group"
                onEnter={() => {
-                  isDefined(recordGroupFieldMetadata)
+                  isDefined(recordIndexGroupFieldMetadataItem)
                    ? onContentChange('recordGroups')
                    : onContentChange('recordGroupFields');
                }}
@@ -290,13 +290,13 @@ export const ObjectOptionsDropdownLayoutContent = () => {
                <MenuItem
                  focused={selectedItemId === 'Group'}
                  onClick={() =>
-                    isDefined(recordGroupFieldMetadata)
+                    isDefined(recordIndexGroupFieldMetadataItem)
                      ? onContentChange('recordGroups')
                      : onContentChange('recordGroupFields')
                  }
                  LeftIcon={IconLayoutList}
                  text={t`Group`}
-                  contextualText={recordGroupFieldMetadata?.label}
+                  contextualText={recordIndexGroupFieldMetadataItem?.label}
                  contextualTextPosition="right"
                  hasSubMenu
                />
@@ -52,7 +52,7 @@ export const ObjectOptionsDropdownRecordGroupFieldsContent = () => {
    hiddenRecordGroupIdsComponentSelector,
  );

-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -109,7 +109,7 @@ export const ObjectOptionsDropdownRecordGroupFieldsContent = () => {
        StartComponent={
          <DropdownMenuHeaderLeftComponent
            onClick={() =>
-              isDefined(recordGroupFieldMetadata)
+              isDefined(recordIndexGroupFieldMetadataItem)
                ? onContentChange('recordGroups')
                : resetContent()
            }
@@ -130,14 +130,16 @@ export const ObjectOptionsDropdownRecordGroupFieldsContent = () => {
        {viewType === ViewType.Table && (
          <MenuItemSelect
            text={t`None`}
-            selected={!isDefined(recordGroupFieldMetadata)}
+            selected={!isDefined(recordIndexGroupFieldMetadataItem)}
            onClick={handleResetRecordGroupField}
          />
        )}
        {filteredRecordGroupFieldMetadataItems.map((fieldMetadataItem) => (
          <MenuItemSelect
            key={fieldMetadataItem.id}
-            selected={fieldMetadataItem.id === recordGroupFieldMetadata?.id}
+            selected={
+              fieldMetadataItem.id === recordIndexGroupFieldMetadataItem?.id
+            }
            onClick={() => handleRecordGroupFieldChange(fieldMetadataItem)}
            LeftIcon={getIcon(fieldMetadataItem.icon)}
            text={fieldMetadataItem.label}
@@ -31,12 +31,11 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
    hiddenRecordGroupIdsComponentSelector,
  );

-  const [recordGroupSort, setRecordGroupSort] = useAtomComponentState(
-    recordIndexRecordGroupSortComponentState,
-  );
+  const [recordIndexRecordGroupSort, setRecordIndexRecordGroupSort] =
+    useAtomComponentState(recordIndexRecordGroupSortComponentState);

  const handleRecordGroupSortChange = (sort: RecordGroupSort) => {
-    setRecordGroupSort(sort);
+    setRecordIndexRecordGroupSort(sort);
  };

  const selectedItemId = useAtomComponentStateValue(
@@ -87,7 +86,7 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
              }
              LeftIcon={IconHandMove}
              text={RecordGroupSort.Manual}
-              selected={recordGroupSort === RecordGroupSort.Manual}
+              selected={recordIndexRecordGroupSort === RecordGroupSort.Manual}
              focused={selectedItemId === RecordGroupSort.Manual}
            />
          </SelectableListItem>
@@ -103,7 +102,9 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
              }
              LeftIcon={IconSortAZ}
              text={RecordGroupSort.Alphabetical}
-              selected={recordGroupSort === RecordGroupSort.Alphabetical}
+              selected={
+                recordIndexRecordGroupSort === RecordGroupSort.Alphabetical
+              }
              focused={selectedItemId === RecordGroupSort.Alphabetical}
            />
          </SelectableListItem>
@@ -119,7 +120,10 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
              }
              LeftIcon={IconSortZA}
              text={RecordGroupSort.ReverseAlphabetical}
-              selected={recordGroupSort === RecordGroupSort.ReverseAlphabetical}
+              selected={
+                recordIndexRecordGroupSort ===
+                RecordGroupSort.ReverseAlphabetical
+              }
              focused={selectedItemId === RecordGroupSort.ReverseAlphabetical}
            />
          </SelectableListItem>
@@ -48,7 +48,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {

  const { currentView } = useGetCurrentViewOnly();

-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -61,14 +61,16 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
    hiddenRecordGroupIdsComponentSelector,
  );

-  const hideEmptyRecordGroup = useAtomComponentStateValue(
+  const recordIndexShouldHideEmptyRecordGroups = useAtomComponentStateValue(
    recordIndexShouldHideEmptyRecordGroupsComponentState,
  );

  const shouldHideEmptyGroups =
-    hideEmptyRecordGroup ?? currentView?.shouldHideEmptyGroups ?? false;
+    recordIndexShouldHideEmptyRecordGroups ??
+    currentView?.shouldHideEmptyGroups ??
+    false;

-  const recordGroupSort = useAtomComponentStateValue(
+  const recordIndexRecordGroupSort = useAtomComponentStateValue(
    recordIndexRecordGroupSortComponentState,
  );

@@ -136,7 +138,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
                  onClick={() => onContentChange('recordGroupFields')}
                  LeftIcon={IconLayoutList}
                  text={t`Group by`}
-                  contextualText={recordGroupFieldMetadata?.label}
+                  contextualText={recordIndexGroupFieldMetadataItem?.label}
                  contextualTextPosition="right"
                  hasSubMenu
                />
@@ -150,7 +152,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
                  onClick={() => onContentChange('recordGroupSort')}
                  LeftIcon={IconSortDescending}
                  text={t`Sort`}
-                  contextualText={recordGroupSort}
+                  contextualText={recordIndexRecordGroupSort}
                  contextualTextPosition="right"
                  hasSubMenu
                />
@@ -201,7 +203,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
                <MenuItemNavigate
                  onClick={() => onContentChange('hiddenRecordGroups')}
                  LeftIcon={IconEyeOff}
-                  text={`${t`Hidden`} ${recordGroupFieldMetadata?.label ?? ''}`}
+                  text={`${t`Hidden`} ${recordIndexGroupFieldMetadataItem?.label ?? ''}`}
                />
              </SelectableListItem>
            </SelectableList>
@@ -7,12 +7,14 @@ import { FieldMetadataType } from '~/generated-metadata/graphql';
 export const useSearchRecordGroupField = () => {
  const { objectMetadataItem } = useRecordIndexContextOrThrow();

-  const [recordGroupFieldSearchInput, setRecordGroupFieldSearchInput] =
-    useAtomComponentState(objectOptionsDropdownSearchInputComponentState);
+  const [
+    objectOptionsDropdownSearchInput,
+    setObjectOptionsDropdownSearchInput,
+  ] = useAtomComponentState(objectOptionsDropdownSearchInputComponentState);

  const filteredRecordGroupFieldMetadataItems = useMemo(() => {
    const searchInputLowerCase =
-      recordGroupFieldSearchInput.toLocaleLowerCase();
+      objectOptionsDropdownSearchInput.toLocaleLowerCase();

    return objectMetadataItem.readableFields.filter(
      (field) =>
@@ -20,11 +22,11 @@ export const useSearchRecordGroupField = () => {
        field.isActive &&
        field.label.toLocaleLowerCase().includes(searchInputLowerCase),
    );
-  }, [objectMetadataItem.readableFields, recordGroupFieldSearchInput]);
+  }, [objectMetadataItem.readableFields, objectOptionsDropdownSearchInput]);

  return {
-    recordGroupFieldSearchInput,
-    setRecordGroupFieldSearchInput,
+    recordGroupFieldSearchInput: objectOptionsDropdownSearchInput,
+    setRecordGroupFieldSearchInput: setObjectOptionsDropdownSearchInput,
    filteredRecordGroupFieldMetadataItems,
  };
 };
@@ -16,11 +16,11 @@ export const useUpdateObjectViewOptions = () => {
    recordIndexOpenRecordInState,
  );

-  const setRecordIndexViewName = useSetAtomComponentState(
+  const setViewPickerInputName = useSetAtomComponentState(
    viewPickerInputNameComponentState,
  );

-  const setRecordIndexViewIcon = useSetAtomComponentState(
+  const setViewPickerSelectedIcon = useSetAtomComponentState(
    viewPickerSelectedIconComponentState,
  );

@@ -41,23 +41,23 @@ export const useUpdateObjectViewOptions = () => {
  const setAndPersistViewName = useCallback(
    (viewName: string, view: GraphQLView | undefined) => {
      if (!view) return;
-      setRecordIndexViewName(viewName);
+      setViewPickerInputName(viewName);
      updateCurrentView({
        name: viewName,
      });
    },
-    [setRecordIndexViewName, updateCurrentView],
+    [setViewPickerInputName, updateCurrentView],
  );

  const setAndPersistViewIcon = useCallback(
    (viewIcon: string, view: GraphQLView | undefined) => {
      if (!view) return;
-      setRecordIndexViewIcon(viewIcon);
+      setViewPickerSelectedIcon(viewIcon);
      updateCurrentView({
        icon: viewIcon,
      });
    },
-    [setRecordIndexViewIcon, updateCurrentView],
+    [setViewPickerSelectedIcon, updateCurrentView],
  );

  return {
@@ -131,13 +131,13 @@ export const ObjectSortDropdownButton = () => {
  const [selectedRecordSortDirection, setSelectedRecordSortDirection] =
    useAtomComponentState(selectedRecordSortDirectionComponentState);

-  const setIsRecordSortDirectionMenuUnfolded = useSetAtomComponentState(
+  const setIsRecordSortDirectionDropdownMenuUnfolded = useSetAtomComponentState(
    isRecordSortDirectionDropdownMenuUnfoldedComponentState,
  );

  const handleSortDirectionClick = (sortDirection: ViewSortDirection) => {
    setSelectedRecordSortDirection(sortDirection);
-    setIsRecordSortDirectionMenuUnfolded(false);
+    setIsRecordSortDirectionDropdownMenuUnfolded(false);
  };

  const isDropdownOpen = useAtomComponentStateValue(
@@ -55,7 +55,7 @@ export const RecordBoardContainer = ({
      ...args,
    });

-  const isRecordIndexRemoveSortingModalOpened = useAtomComponentStateValue(
+  const isModalOpened = useAtomComponentStateValue(
    isModalOpenedComponentState,
    RECORD_INDEX_REMOVE_SORTING_MODAL_ID,
  );
@@ -80,9 +80,7 @@ export const RecordBoardContainer = ({
        value={{ instanceId: recordBoardId }}
      >
        <RecordBoard />
-        {isRecordIndexRemoveSortingModalOpened && (
-          <RecordIndexRemoveSortingModal />
-        )}
+        {isModalOpened && <RecordIndexRemoveSortingModal />}
        <RecordBoardHotkeyEffect />
        <RecordBoardBodyEscapeHotkeyEffect />
      </RecordBoardComponentInstanceContext.Provider>
@@ -21,15 +21,14 @@ const StyledFetchMoreTriggerDiv = styled.div<{ width: number }>`
 `;

 export const RecordBoardFetchMoreInViewTriggerComponent = () => {
-  const [shouldFetchMore, setShouldFetchMore] = useAtomComponentState(
-    recordBoardShouldFetchMoreComponentState,
-  );
+  const [recordBoardShouldFetchMore, setRecordBoardShouldFetchMore] =
+    useAtomComponentState(recordBoardShouldFetchMoreComponentState);

-  const isInitialLoading = useAtomComponentStateValue(
+  const recordIndexRecordGroupsAreInInitialLoading = useAtomComponentStateValue(
    recordIndexRecordGroupsAreInInitialLoadingComponentState,
  );

-  const isFetchingMore = useAtomComponentStateValue(
+  const recordBoardIsFetchingMore = useAtomComponentStateValue(
    recordBoardIsFetchingMoreComponentState,
  );

@@ -52,19 +51,22 @@ export const RecordBoardFetchMoreInViewTriggerComponent = () => {
    1;

  useEffect(() => {
-    if (!isInitialLoading && !isFetchingMore) {
+    if (
+      !recordIndexRecordGroupsAreInInitialLoading &&
+      !recordBoardIsFetchingMore
+    ) {
      const newShouldFetchMore = inView;

-      if (shouldFetchMore !== newShouldFetchMore) {
-        setShouldFetchMore(newShouldFetchMore);
+      if (recordBoardShouldFetchMore !== newShouldFetchMore) {
+        setRecordBoardShouldFetchMore(newShouldFetchMore);
      }
    }
  }, [
-    shouldFetchMore,
-    setShouldFetchMore,
+    recordBoardShouldFetchMore,
+    setRecordBoardShouldFetchMore,
    inView,
-    isInitialLoading,
-    isFetchingMore,
+    recordIndexRecordGroupsAreInInitialLoading,
+    recordBoardIsFetchingMore,
  ]);

  return (
@@ -51,7 +51,7 @@ export const RecordBoardQueryEffect = () => {

  const { scrollWrapperHTMLElement } = useScrollWrapperHTMLElement();

-  const [shouldFetchMore] = useAtomComponentState(
+  const [recordBoardShouldFetchMore] = useAtomComponentState(
    recordBoardShouldFetchMoreComponentState,
  );

@@ -64,11 +64,11 @@ export const RecordBoardQueryEffect = () => {
  const { triggerRecordBoardInitialQuery } =
    useTriggerRecordBoardInitialQuery();

-  const recordGroupdIds = useAtomComponentStateValue(
+  const recordGroupIds = useAtomComponentStateValue(
    recordGroupIdsComponentState,
  );
  const recordGroupIdsHaveChanged = !isDeeplyEqual(
-    [...recordGroupdIds].sort(),
+    [...recordGroupIds].sort(),
    [...lastRecordGroupIds].sort(),
  );

@@ -78,10 +78,10 @@ export const RecordBoardQueryEffect = () => {
      (queryIdentifierHasChanged || recordGroupIdsHaveChanged)
    ) {
      triggerRecordBoardInitialQuery();
-      setLastRecordGroupIds(recordGroupdIds);
+      setLastRecordGroupIds(recordGroupIds);
    } else if (
      !recordIndexRecordGroupsAreInInitialLoading &&
-      shouldFetchMore &&
+      recordBoardShouldFetchMore &&
      !queryIdentifierHasChanged &&
      !recordBoardIsFetchingMore
    ) {
@@ -95,11 +95,11 @@ export const RecordBoardQueryEffect = () => {
    setRecordBoardCurrentGroupByQueryOffset,
    scrollWrapperHTMLElement,
    recordIndexRecordGroupsAreInInitialLoading,
-    shouldFetchMore,
+    recordBoardShouldFetchMore,
    recordBoardIsFetchingMore,
    triggerRecordBoardFetchMore,
    setLastRecordGroupIds,
-    recordGroupdIds,
+    recordGroupIds,
    recordGroupIdsHaveChanged,
  ]);

@@ -8,22 +8,22 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use
 export const RecordBoardScrollToFocusedCardEffect = () => {
  const { recordBoardId } = useContext(RecordBoardContext);

-  const focusedCardIndexes = useAtomComponentStateValue(
+  const focusedRecordBoardCardIndexes = useAtomComponentStateValue(
    focusedRecordBoardCardIndexesComponentState,
    recordBoardId,
  );

-  const isFocusActive = useAtomComponentStateValue(
+  const isRecordBoardCardFocusActive = useAtomComponentStateValue(
    isRecordBoardCardFocusActiveComponentState,
    recordBoardId,
  );

  useEffect(() => {
-    if (!isFocusActive || !focusedCardIndexes) {
+    if (!isRecordBoardCardFocusActive || !focusedRecordBoardCardIndexes) {
      return;
    }

-    const { rowIndex, columnIndex } = focusedCardIndexes;
+    const { rowIndex, columnIndex } = focusedRecordBoardCardIndexes;

    const focusElement = document.getElementById(
      `record-board-card-${columnIndex}-${rowIndex}`,
@@ -36,7 +36,7 @@ export const RecordBoardScrollToFocusedCardEffect = () => {
    if (focusElement instanceof HTMLElement) {
      focusElement.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
    }
-  }, [focusedCardIndexes, isFocusActive]);
+  }, [focusedRecordBoardCardIndexes, isRecordBoardCardFocusActive]);

  return null;
 };
@@ -10,23 +10,23 @@ export const RecordBoardSelectRecordsEffect = () => {
    recordBoardSelectedRecordIdsComponentSelector,
  );

-  const setContextStoreTargetedRecords = useSetAtomComponentState(
+  const setContextStoreTargetedRecordsRule = useSetAtomComponentState(
    contextStoreTargetedRecordsRuleComponentState,
  );

  useEffect(() => {
-    setContextStoreTargetedRecords({
+    setContextStoreTargetedRecordsRule({
      mode: 'selection',
      selectedRecordIds: selectedRecordIds,
    });

    return () => {
-      setContextStoreTargetedRecords({
+      setContextStoreTargetedRecordsRule({
        mode: 'selection',
        selectedRecordIds: [],
      });
    };
-  }, [selectedRecordIds, setContextStoreTargetedRecords]);
+  }, [selectedRecordIds, setContextStoreTargetedRecordsRule]);

  return <></>;
 };
@@ -3,13 +3,13 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use
 import { useEffect } from 'react';

 export const RecordBoardStickyHeaderEffect = () => {
-  const scrollTop = useAtomComponentStateValue(
+  const scrollWrapperScrollTop = useAtomComponentStateValue(
    scrollWrapperScrollTopComponentState,
  );

  // TODO: move this outside because it might cause way too many re-renders for other hooks
  useEffect(() => {
-    if (scrollTop > 0) {
+    if (scrollWrapperScrollTop > 0) {
      document
        .getElementById('record-board-header')
        ?.classList.add('header-sticky');
@@ -18,7 +18,7 @@ export const RecordBoardStickyHeaderEffect = () => {
        .getElementById('record-board-header')
        ?.classList.remove('header-sticky');
    }
-  }, [scrollTop]);
+  }, [scrollWrapperScrollTop]);

  return <></>;
 };
@@ -21,7 +21,7 @@ export const useRemoveSelectedRecordsFromRecordBoard = (
    recordBoardIndexId,
  );

-  const groupByFieldMetadataItem = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
    recordBoardIndexId,
  );
@@ -46,7 +46,7 @@ export const useRemoveSelectedRecordsFromRecordBoard = (
    ) as string[];

    if (
-      !isDefined(groupByFieldMetadataItem) ||
+      !isDefined(recordIndexGroupFieldMetadataItem) ||
      !isNonEmptyArray(recordGroupDefinitions) ||
      !isNonEmptyArray(deletedRecordIds)
    ) {
@@ -86,7 +86,7 @@ export const useRemoveSelectedRecordsFromRecordBoard = (
    resetRecordBoardSelection();
  }, [
    store,
-    groupByFieldMetadataItem,
+    recordIndexGroupFieldMetadataItem,
    recordIndexRecordIdsByGroupCallbackState,
    recordGroupDefinitions,
    recordBoardSelectedRecordIds,
@@ -16,13 +16,16 @@ export const RecordBoardCardCellEditModePortal = () => {
  const { objectMetadataItem } = useContext(RecordBoardContext);
  const { recordId } = useContext(RecordBoardCardContext);

-  const editModePosition = useAtomComponentStateValue(
+  const recordBoardCardEditModePosition = useAtomComponentStateValue(
    recordBoardCardEditModePositionComponentState,
  );

  const { editedFieldMetadataItem } = useRecordBoardCardMetadataFromPosition();

-  if (!isDefined(editModePosition) || !isDefined(editedFieldMetadataItem)) {
+  if (
+    !isDefined(recordBoardCardEditModePosition) ||
+    !isDefined(editedFieldMetadataItem)
+  ) {
    return null;
  }

@@ -73,18 +73,19 @@ export const RecordBoardCard = () => {

  const isCompactModeActive = currentView?.isCompact ?? false;

-  const [isCardExpanded, setIsCardExpanded] = useAtomComponentState(
-    recordBoardCardIsExpandedComponentState,
-    `record-board-card-${recordId}`,
-  );
+  const [recordBoardCardIsExpanded, setRecordBoardCardIsExpanded] =
+    useAtomComponentState(
+      recordBoardCardIsExpandedComponentState,
+      `record-board-card-${recordId}`,
+    );

-  const [isCurrentCardSelected, setIsCurrentCardSelected] =
+  const [isRecordBoardCardSelected, setIsRecordBoardCardSelected] =
    useAtomComponentFamilyState(
      isRecordBoardCardSelectedComponentFamilyState,
      recordId,
    );

-  const isCurrentCardFocused = useAtomComponentFamilyStateValue(
+  const isRecordBoardCardFocused = useAtomComponentFamilyStateValue(
    isRecordBoardCardFocusedComponentFamilyState,
    {
      rowIndex,
@@ -92,7 +93,7 @@ export const RecordBoardCard = () => {
    },
  );

-  const isCurrentCardActive = useAtomComponentFamilyStateValue(
+  const isRecordBoardCardActive = useAtomComponentFamilyStateValue(
    isRecordBoardCardActiveComponentFamilyState,
    {
      rowIndex,
@@ -105,7 +106,7 @@ export const RecordBoardCard = () => {
  const actionMenuDropdownId =
    getActionMenuDropdownIdFromActionMenuId(actionMenuId);

-  const setActionMenuDropdownPosition = useSetAtomComponentState(
+  const setRecordIndexActionMenuDropdownPosition = useSetAtomComponentState(
    recordIndexActionMenuDropdownPositionComponentState,
    actionMenuDropdownId,
  );
@@ -118,8 +119,8 @@ export const RecordBoardCard = () => {

  const handleContextMenuOpen = (event: React.MouseEvent) => {
    event.preventDefault();
-    setIsCurrentCardSelected(true);
-    setActionMenuDropdownPosition({
+    setIsRecordBoardCardSelected(true);
+    setRecordIndexActionMenuDropdownPosition({
      x: event.clientX,
      y: event.clientY,
    });
@@ -139,8 +140,8 @@ export const RecordBoardCard = () => {
  };

  const onMouseLeaveBoard = useDebouncedCallback(() => {
-    if (isCompactModeActive && isCardExpanded) {
-      setIsCardExpanded(false);
+    if (isCompactModeActive && recordBoardCardIsExpanded) {
+      setRecordBoardCardIsExpanded(false);
    }
  }, 800);

@@ -165,9 +166,9 @@ export const RecordBoardCard = () => {
          >
            {isRecordIdPrimaryDragMultiple && <RecordBoardCardMultiDragStack />}
            <RecordCard
-              data-selected={isCurrentCardSelected}
-              data-focused={isCurrentCardFocused}
-              data-active={isCurrentCardActive}
+              data-selected={isRecordBoardCardSelected}
+              data-focused={isRecordBoardCardFocused}
+              data-active={isRecordBoardCardActive}
              onMouseLeave={onMouseLeaveBoard}
              onClick={handleCardClick}
              isPrimaryMultiDrag={isRecordIdPrimaryDragMultiple}
@@ -176,7 +177,7 @@ export const RecordBoardCard = () => {
            >
              <RecordBoardCardHeader />
              <AnimatedEaseInOut
-                isOpen={isCardExpanded || !isCompactModeActive}
+                isOpen={recordBoardCardIsExpanded || !isCompactModeActive}
                initial={false}
              >
                <RecordBoardCardBody />
@@ -36,7 +36,7 @@ export const RecordBoardCardDraggableContainer = ({

  const { columnIndex } = useContext(RecordBoardColumnContext);

-  const isRecordBoardCardFocusActive = useAtomComponentFamilyStateValue(
+  const isRecordBoardCardFocused = useAtomComponentFamilyStateValue(
    isRecordBoardCardFocusedComponentFamilyState,
    {
      rowIndex,
@@ -61,7 +61,7 @@ export const RecordBoardCardDraggableContainer = ({
            data-select-disable
          >
            <DragAndDropLibraryLegacyReRenderBreaker memoizationId={recordId}>
-              {isRecordBoardCardFocusActive && <RecordBoardCardHotkeysEffect />}
+              {isRecordBoardCardFocused && <RecordBoardCardHotkeysEffect />}
              <RecordBoardCard />
              <RecordBoardCardMultiDragPreview />
            </DragAndDropLibraryLegacyReRenderBreaker>
@@ -54,14 +54,13 @@ export const RecordBoardCardHeader = () => {

  const isCompactModeActive = currentView?.isCompact ?? false;

-  const [isCardExpanded, setIsCardExpanded] = useAtomComponentState(
-    recordBoardCardIsExpandedComponentState,
-  );
+  const [recordBoardCardIsExpanded, setRecordBoardCardIsExpanded] =
+    useAtomComponentState(recordBoardCardIsExpandedComponentState);

  const { checkIfLastUnselectAndCloseDropdown } =
    useRecordBoardSelection(recordBoardId);

-  const [isCurrentCardSelected, setIsCurrentCardSelected] =
+  const [isRecordBoardCardSelected, setIsRecordBoardCardSelected] =
    useAtomComponentFamilyState(
      isRecordBoardCardSelectedComponentFamilyState,
      recordId,
@@ -73,7 +72,7 @@ export const RecordBoardCardHeader = () => {
    recordIndexOpenRecordInState,
  );

-  const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId);
+  const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId);

  const triggerEvent =
    recordIndexOpenRecordIn === ViewOpenRecordInType.SIDE_PANEL
@@ -84,10 +83,10 @@ export const RecordBoardCardHeader = () => {
    <RecordCardHeaderContainer isCompact={isCompactModeActive}>
      <StyledRecordChipContainer>
        <StopPropagationContainer>
-          {isDefined(record) && (
+          {isDefined(recordStore) && (
            <RecordChip
              objectNameSingular={objectMetadataItem.nameSingular}
-              record={record}
+              record={recordStore}
              variant={ChipVariant.Transparent}
              onClick={() => {
                activateBoardCard({ rowIndex, columnIndex });
@@ -104,10 +103,10 @@ export const RecordBoardCardHeader = () => {
        <StyledCompactIconContainer className="compact-icon-container">
          <StopPropagationContainer>
            <LightIconButton
-              Icon={isCardExpanded ? IconEyeOff : IconEye}
+              Icon={recordBoardCardIsExpanded ? IconEyeOff : IconEye}
              accent="tertiary"
              onClick={() => {
-                setIsCardExpanded(!isCardExpanded);
+                setRecordBoardCardIsExpanded(!recordBoardCardIsExpanded);
              }}
            />
          </StopPropagationContainer>
@@ -117,9 +116,9 @@ export const RecordBoardCardHeader = () => {
        <StopPropagationContainer>
          <Checkbox
            hoverable
-            checked={isCurrentCardSelected}
+            checked={isRecordBoardCardSelected}
            onChange={(value) => {
-              setIsCurrentCardSelected(value.target.checked);
+              setIsRecordBoardCardSelected(value.target.checked);
              checkIfLastUnselectAndCloseDropdown();
            }}
            variant={CheckboxVariant.Secondary}
@@ -11,11 +11,11 @@ import { isDefined } from 'twenty-shared/utils';
 export const useRecordBoardCardMetadataFromPosition = () => {
  const { objectMetadataItem } = useContext(RecordBoardContext);

-  const hoverPosition = useAtomComponentStateValue(
+  const recordBoardCardHoverPosition = useAtomComponentStateValue(
    recordBoardCardHoverPositionComponentState,
  );

-  const editModePosition = useAtomComponentStateValue(
+  const recordBoardCardEditModePosition = useAtomComponentStateValue(
    recordBoardCardEditModePositionComponentState,
  );

@@ -30,12 +30,12 @@ export const useRecordBoardCardMetadataFromPosition = () => {
      labelIdentifierFieldMetadataItem?.id !== recordField.fieldMetadataItemId,
  );

-  const hoveredRecordField = isDefined(hoverPosition)
-    ? visibleRecordFieldsFiltered.at(hoverPosition)
+  const hoveredRecordField = isDefined(recordBoardCardHoverPosition)
+    ? visibleRecordFieldsFiltered.at(recordBoardCardHoverPosition)
    : undefined;

-  const editedRecordField = isDefined(editModePosition)
-    ? visibleRecordFieldsFiltered.at(editModePosition)
+  const editedRecordField = isDefined(recordBoardCardEditModePosition)
+    ? visibleRecordFieldsFiltered.at(recordBoardCardEditModePosition)
    : undefined;

  const hoveredFieldMetadataItem = isDefined(hoveredRecordField)
@@ -38,7 +38,7 @@ export const RecordBoardColumn = ({
    recordGroupDefinitionFamilyState,
    recordBoardColumnId,
  );
-  const recordIdsByGroup = useAtomComponentFamilyStateValue(
+  const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue(
    recordIndexRecordIdsByGroupComponentFamilyState,
    recordBoardColumnId,
  );
@@ -58,7 +58,7 @@ export const RecordBoardColumn = ({
      value={{
        columnDefinition: recordGroupDefinition,
        columnId: recordBoardColumnId,
-        recordIds: recordIdsByGroup,
+        recordIds: recordIndexRecordIdsByGroup,
        columnIndex: recordBoardColumnIndex,
      }}
    >
@@ -33,7 +33,7 @@ export const RecordBoardColumnCardsContainer = ({
 }: RecordBoardColumnCardsContainerProps) => {
  const { columnDefinition } = useContext(RecordBoardColumnContext);

-  const recordIds = useAtomComponentFamilyStateValue(
+  const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue(
    recordIndexRecordIdsByGroupComponentFamilyState,
    recordBoardColumnId,
  );
@@ -49,7 +49,7 @@ export const RecordBoardColumnCardsContainer = ({
      // eslint-disable-next-line react/jsx-props-no-spreading
      {...droppableProvided?.droppableProps}
    >
-      {recordIds.map((recordId, index) => (
+      {recordIndexRecordIdsByGroup.map((recordId, index) => (
        <RecordBoardCardDraggableContainer
          key={recordId}
          recordId={recordId}
@@ -61,7 +61,7 @@ export const RecordBoardColumnCardsContainer = ({
      ) : null}
      <Draggable
        draggableId={`new-${columnDefinition.id}-bottom`}
-        index={recordIds.length}
+        index={recordIndexRecordIdsByGroup.length}
        isDragDisabled={true}
      >
        {(draggableProvided) => (
@@ -39,7 +39,7 @@ export const RecordBoardColumnHeaderAggregateDropdownFieldsContent = () => {
    aggregateOperationComponentState,
  );

-  const availableFieldsIdsForAggregateOperation = useAtomComponentStateValue(
+  const availableFieldIdsForAggregateOperation = useAtomComponentStateValue(
    availableFieldIdsForAggregateOperationComponentState,
  );

@@ -72,7 +72,7 @@ export const RecordBoardColumnHeaderAggregateDropdownFieldsContent = () => {
        {getAggregateOperationLabel(aggregateOperation)}
      </DropdownMenuHeader>
      <DropdownMenuItemsContainer>
-        {availableFieldsIdsForAggregateOperation.map((fieldId) => {
+        {availableFieldIdsForAggregateOperation.map((fieldId) => {
          const fieldMetadata = objectMetadataItem.fields.find(
            (field) => field.id === fieldId,
          );
@@ -39,7 +39,7 @@ export const RecordBoardColumnHeaderAggregateDropdownOptionsContent = ({
    aggregateOperationComponentState,
  );

-  const setAvailableFieldsForAggregateOperation = useSetAtomComponentState(
+  const setAvailableFieldIdsForAggregateOperation = useSetAtomComponentState(
    availableFieldIdsForAggregateOperationComponentState,
  );

@@ -79,7 +79,7 @@ export const RecordBoardColumnHeaderAggregateDropdownOptionsContent = ({
                      availableAggregationOperation as ExtendedAggregateOperations,
                    );

-                    setAvailableFieldsForAggregateOperation(
+                    setAvailableFieldIdsForAggregateOperation(
                      availableAggregationFieldsIdsForOperation,
                    );
                    onContentChange('aggregateFields');
@@ -21,7 +21,7 @@ export const RecordBoardColumnHeaderWrapper = ({
    columnId,
  );

-  const recordIdsByGroup = useAtomComponentFamilyStateValue(
+  const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue(
    recordIndexRecordIdsByGroupComponentFamilyState,
    columnId,
  );
@@ -41,7 +41,7 @@ export const RecordBoardColumnHeaderWrapper = ({
      value={{
        columnId,
        columnDefinition: recordGroupDefinition,
-        recordIds: recordIdsByGroup,
+        recordIds: recordIndexRecordIdsByGroup,
        columnIndex,
      }}
    >
@@ -29,7 +29,7 @@ export const RecordIndexCalendarDataLoaderEffect = () => {

  const { upsertRecordsInStore } = useUpsertRecordsInStore();

-  const setContextStoreTargetedRecords = useSetAtomComponentState(
+  const setContextStoreTargetedRecordsRule = useSetAtomComponentState(
    contextStoreTargetedRecordsRuleComponentState,
    recordCalendarId,
  );
@@ -64,18 +64,18 @@ export const RecordIndexCalendarDataLoaderEffect = () => {
  ]);

  useEffect(() => {
-    setContextStoreTargetedRecords({
+    setContextStoreTargetedRecordsRule({
      mode: 'selection',
      selectedRecordIds,
    });

    return () => {
-      setContextStoreTargetedRecords({
+      setContextStoreTargetedRecordsRule({
        mode: 'selection',
        selectedRecordIds: [],
      });
    };
-  }, [selectedRecordIds, setContextStoreTargetedRecords]);
+  }, [selectedRecordIds, setContextStoreTargetedRecordsRule]);

  return <></>;
 };
@@ -48,7 +48,7 @@ const meta: Meta<typeof RecordCalendarMonth> = {

      const mockCoreView = mockedCoreViewsData[0];

-      const setCurrentViewId = useSetAtomComponentState(
+      const setContextStoreCurrentViewId = useSetAtomComponentState(
        contextStoreCurrentViewIdComponentState,
        MAIN_CONTEXT_STORE_INSTANCE_ID,
      );
@@ -72,12 +72,12 @@ const meta: Meta<typeof RecordCalendarMonth> = {

      useEffect(() => {
        setCoreViews([mockCoreView]);
-        setCurrentViewId(mockCoreView.id);
+        setContextStoreCurrentViewId(mockCoreView.id);
        setCurrentRecordFields(columns);
        setIsLoaded(true);
      }, [
        setCoreViews,
-        setCurrentViewId,
+        setContextStoreCurrentViewId,
        setCurrentRecordFields,
        mockCoreView,
        columns,
@@ -19,14 +19,17 @@ export const RecordCalendarCardCellEditModePortal = ({
 }: RecordCalendarCardCellEditModePortalProps) => {
  const { objectMetadataItem } = useRecordCalendarContextOrThrow();

-  const editModePosition = useAtomComponentStateValue(
+  const recordCalendarCardEditModePosition = useAtomComponentStateValue(
    recordCalendarCardEditModePositionComponentState,
  );

  const { editedFieldMetadataItem } =
    useRecordCalendarCardMetadataFromPosition();

-  if (!isDefined(editModePosition) || !isDefined(editedFieldMetadataItem)) {
+  if (
+    !isDefined(recordCalendarCardEditModePosition) ||
+    !isDefined(editedFieldMetadataItem)
+  ) {
    return null;
  }

@@ -18,14 +18,17 @@ export const RecordCalendarCardCellHoveredPortal = ({
 }: RecordCalendarCardCellHoveredPortalProps) => {
  const { objectMetadataItem } = useRecordCalendarContextOrThrow();

-  const hoverPosition = useAtomComponentStateValue(
+  const recordCalendarCardHoverPosition = useAtomComponentStateValue(
    recordCalendarCardHoverPositionComponentState,
  );

  const { hoveredFieldMetadataItem } =
    useRecordCalendarCardMetadataFromPosition();

-  if (!isDefined(hoverPosition) || !isDefined(hoveredFieldMetadataItem)) {
+  if (
+    !isDefined(recordCalendarCardHoverPosition) ||
+    !isDefined(hoveredFieldMetadataItem)
+  ) {
    return null;
  }

@@ -36,7 +36,7 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => {
  const { currentView } = useGetCurrentViewOnly();

  const isCompactModeActive = currentView?.isCompact ?? false;
-  const [isCurrentCardSelected, setIsCurrentCardSelected] =
+  const [isRecordCalendarCardSelected, setIsRecordCalendarCardSelected] =
    useAtomComponentFamilyState(
      isRecordCalendarCardSelectedComponentFamilyState,
      recordId,
@@ -51,7 +51,7 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => {
  const actionMenuDropdownId =
    getActionMenuDropdownIdFromActionMenuId(actionMenuId);

-  const setActionMenuDropdownPosition = useSetAtomComponentState(
+  const setRecordIndexActionMenuDropdownPosition = useSetAtomComponentState(
    recordIndexActionMenuDropdownPositionComponentState,
    actionMenuDropdownId,
  );
@@ -60,8 +60,8 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => {

  const handleContextMenuOpen = (event: React.MouseEvent) => {
    event.preventDefault();
-    setIsCurrentCardSelected(true);
-    setActionMenuDropdownPosition({
+    setIsRecordCalendarCardSelected(true);
+    setRecordIndexActionMenuDropdownPosition({
      x: event.clientX,
      y: event.clientY,
    });
@@ -85,7 +85,7 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => {
      >
        <StyledContainer onContextMenu={handleContextMenuOpen}>
          <StyledRecordCard
-            data-selected={isCurrentCardSelected}
+            data-selected={isRecordCalendarCardSelected}
            data-click-outside-id={RECORD_CALENDAR_CARD_CLICK_OUTSIDE_ID}
          >
            <RecordCalendarCardHeader recordId={recordId} />
@@ -38,7 +38,7 @@ export const RecordCalendarCardHeader = ({
  recordId,
 }: RecordCalendarCardHeaderProps) => {
  const { objectMetadataItem } = useRecordCalendarContextOrThrow();
-  const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId);
+  const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId);
  const { openRecordFromIndexView } = useOpenRecordFromIndexView();

  const { currentView } = useGetCurrentViewOnly();
@@ -49,7 +49,7 @@ export const RecordCalendarCardHeader = ({
    isDraggingRecordComponentState,
  );

-  const [isCurrentCardSelected, setIsCurrentCardSelected] =
+  const [isRecordCalendarCardSelected, setIsRecordCalendarCardSelected] =
    useAtomComponentFamilyState(
      isRecordCalendarCardSelectedComponentFamilyState,
      recordId,
@@ -62,7 +62,7 @@ export const RecordCalendarCardHeader = ({
    openRecordFromIndexView({ recordId });
  };

-  if (!isDefined(record)) {
+  if (!isDefined(recordStore)) {
    return null;
  }

@@ -72,7 +72,7 @@ export const RecordCalendarCardHeader = ({
        <StopPropagationContainer>
          <RecordChip
            objectNameSingular={objectMetadataItem.nameSingular}
-            record={record}
+            record={recordStore}
            variant={ChipVariant.Transparent}
            isIconHidden={true}
            onClick={handleChipClick}
@@ -84,9 +84,9 @@ export const RecordCalendarCardHeader = ({
        <StopPropagationContainer>
          <Checkbox
            hoverable
-            checked={isCurrentCardSelected}
+            checked={isRecordCalendarCardSelected}
            onChange={(value) => {
-              setIsCurrentCardSelected(value.target.checked);
+              setIsRecordCalendarCardSelected(value.target.checked);
            }}
            variant={CheckboxVariant.Secondary}
          />
@@ -10,11 +10,11 @@ import { isDefined } from 'twenty-shared/utils';
 export const useRecordCalendarCardMetadataFromPosition = () => {
  const { objectMetadataItem } = useRecordCalendarContextOrThrow();

-  const hoverPosition = useAtomComponentStateValue(
+  const recordCalendarCardHoverPosition = useAtomComponentStateValue(
    recordCalendarCardHoverPositionComponentState,
  );

-  const editModePosition = useAtomComponentStateValue(
+  const recordCalendarCardEditModePosition = useAtomComponentStateValue(
    recordCalendarCardEditModePositionComponentState,
  );

@@ -29,12 +29,12 @@ export const useRecordCalendarCardMetadataFromPosition = () => {
      labelIdentifierFieldMetadataItem?.id !== recordField.fieldMetadataItemId,
  );

-  const hoveredRecordField = isDefined(hoverPosition)
-    ? visibleRecordFieldsFiltered.at(hoverPosition)
+  const hoveredRecordField = isDefined(recordCalendarCardHoverPosition)
+    ? visibleRecordFieldsFiltered.at(recordCalendarCardHoverPosition)
    : undefined;

-  const editedRecordField = isDefined(editModePosition)
-    ? visibleRecordFieldsFiltered.at(editModePosition)
+  const editedRecordField = isDefined(recordCalendarCardEditModePosition)
+    ? visibleRecordFieldsFiltered.at(recordCalendarCardEditModePosition)
    : undefined;

  const hoveredFieldMetadataItem = isDefined(hoveredRecordField)
@@ -26,9 +26,8 @@ describe('useEndRecordDrag', () => {
        const [primaryDraggedRecordId, setPrimaryDraggedRecordId] =
          useAtomComponentState(primaryDraggedRecordIdComponentState);

-        const [originalSelection, setOriginalSelection] = useAtomComponentState(
-          originalDragSelectionComponentState,
-        );
+        const [originalDragSelection, setOriginalDragSelection] =
+          useAtomComponentState(originalDragSelectionComponentState);

        const { endRecordDrag } = useEndRecordDrag();

@@ -37,11 +36,11 @@ describe('useEndRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
          setIsMultiDragActive,
          setDraggedRecordIds,
          setPrimaryDraggedRecordId,
-          setOriginalSelection,
+          setOriginalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -51,13 +50,17 @@ describe('useEndRecordDrag', () => {
      result.current.setIsMultiDragActive(true);
      result.current.setDraggedRecordIds(['record-1', 'record-2']);
      result.current.setPrimaryDraggedRecordId('record-1');
-      result.current.setOriginalSelection(['record-1', 'record-2', 'record-3']);
+      result.current.setOriginalDragSelection([
+        'record-1',
+        'record-2',
+        'record-3',
+      ]);
    });

    expect(result.current.isMultiDragActive).toBe(true);
    expect(result.current.draggedRecordIds).toEqual(['record-1', 'record-2']);
    expect(result.current.primaryDraggedRecordId).toBe('record-1');
-    expect(result.current.originalSelection).toEqual([
+    expect(result.current.originalDragSelection).toEqual([
      'record-1',
      'record-2',
      'record-3',
@@ -70,6 +73,6 @@ describe('useEndRecordDrag', () => {
    expect(result.current.isMultiDragActive).toBe(false);
    expect(result.current.draggedRecordIds).toEqual([]);
    expect(result.current.primaryDraggedRecordId).toBeNull();
-    expect(result.current.originalSelection).toEqual([]);
+    expect(result.current.originalDragSelection).toEqual([]);
  });
 });
@@ -35,7 +35,7 @@ describe('useStartRecordDrag', () => {
        const primaryDraggedRecordId = useAtomComponentStateValue(
          primaryDraggedRecordIdComponentState,
        );
-        const originalSelection = useAtomComponentStateValue(
+        const originalDragSelection = useAtomComponentStateValue(
          originalDragSelectionComponentState,
        );

@@ -46,7 +46,7 @@ describe('useStartRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -62,7 +62,7 @@ describe('useStartRecordDrag', () => {
    expect(result.current.isMultiDragActive).toBe(true);
    expect(result.current.draggedRecordIds).toEqual(['record-1']);
    expect(result.current.primaryDraggedRecordId).toBe('record-1');
-    expect(result.current.originalSelection).toEqual(['record-1']);
+    expect(result.current.originalDragSelection).toEqual(['record-1']);
  });

  it('should set single drag state when only one record is selected', () => {
@@ -77,7 +77,7 @@ describe('useStartRecordDrag', () => {
        const primaryDraggedRecordId = useAtomComponentStateValue(
          primaryDraggedRecordIdComponentState,
        );
-        const originalSelection = useAtomComponentStateValue(
+        const originalDragSelection = useAtomComponentStateValue(
          originalDragSelectionComponentState,
        );

@@ -88,7 +88,7 @@ describe('useStartRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -104,7 +104,7 @@ describe('useStartRecordDrag', () => {
    expect(result.current.isMultiDragActive).toBe(true);
    expect(result.current.draggedRecordIds).toEqual(['record-1']);
    expect(result.current.primaryDraggedRecordId).toBe('record-1');
-    expect(result.current.originalSelection).toEqual(['record-1']);
+    expect(result.current.originalDragSelection).toEqual(['record-1']);
  });

  it('should set multi drag state when multiple records are selected', () => {
@@ -119,7 +119,7 @@ describe('useStartRecordDrag', () => {
        const primaryDraggedRecordId = useAtomComponentStateValue(
          primaryDraggedRecordIdComponentState,
        );
-        const originalSelection = useAtomComponentStateValue(
+        const originalDragSelection = useAtomComponentStateValue(
          originalDragSelectionComponentState,
        );

@@ -130,7 +130,7 @@ describe('useStartRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -150,7 +150,7 @@ describe('useStartRecordDrag', () => {
      'record-3',
    ]);
    expect(result.current.primaryDraggedRecordId).toBe('record-2');
-    expect(result.current.originalSelection).toEqual([
+    expect(result.current.originalDragSelection).toEqual([
      'record-1',
      'record-2',
      'record-3',
@@ -169,7 +169,7 @@ describe('useStartRecordDrag', () => {
        const primaryDraggedRecordId = useAtomComponentStateValue(
          primaryDraggedRecordIdComponentState,
        );
-        const originalSelection = useAtomComponentStateValue(
+        const originalDragSelection = useAtomComponentStateValue(
          originalDragSelectionComponentState,
        );

@@ -180,7 +180,7 @@ describe('useStartRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -196,7 +196,7 @@ describe('useStartRecordDrag', () => {
    expect(result.current.isMultiDragActive).toBe(true);
    expect(result.current.draggedRecordIds).toEqual(['record-1']);
    expect(result.current.primaryDraggedRecordId).toBe('record-1');
-    expect(result.current.originalSelection).toEqual(['record-1']);
+    expect(result.current.originalDragSelection).toEqual(['record-1']);
  });

  it('should set single drag state when dragged record is not in selection', () => {
@@ -211,7 +211,7 @@ describe('useStartRecordDrag', () => {
        const primaryDraggedRecordId = useAtomComponentStateValue(
          primaryDraggedRecordIdComponentState,
        );
-        const originalSelection = useAtomComponentStateValue(
+        const originalDragSelection = useAtomComponentStateValue(
          originalDragSelectionComponentState,
        );

@@ -222,7 +222,7 @@ describe('useStartRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -238,7 +238,7 @@ describe('useStartRecordDrag', () => {
    expect(result.current.isMultiDragActive).toBe(true);
    expect(result.current.draggedRecordIds).toEqual(['record-1']);
    expect(result.current.primaryDraggedRecordId).toBe('record-1');
-    expect(result.current.originalSelection).toEqual(['record-1']);
+    expect(result.current.originalDragSelection).toEqual(['record-1']);
  });

  it('should set multi drag state when multiple records are selected', () => {
@@ -253,7 +253,7 @@ describe('useStartRecordDrag', () => {
        const primaryDraggedRecordId = useAtomComponentStateValue(
          primaryDraggedRecordIdComponentState,
        );
-        const originalSelection = useAtomComponentStateValue(
+        const originalDragSelection = useAtomComponentStateValue(
          originalDragSelectionComponentState,
        );

@@ -264,7 +264,7 @@ describe('useStartRecordDrag', () => {
          isMultiDragActive,
          draggedRecordIds,
          primaryDraggedRecordId,
-          originalSelection,
+          originalDragSelection,
        };
      },
      { wrapper: Wrapper },
@@ -284,7 +284,7 @@ describe('useStartRecordDrag', () => {
      'record-3',
    ]);
    expect(result.current.primaryDraggedRecordId).toBe('record-2');
-    expect(result.current.originalSelection).toEqual([
+    expect(result.current.originalDragSelection).toEqual([
      'record-1',
      'record-2',
      'record-3',
@@ -55,7 +55,7 @@ export const useProcessTableWithGroupRecordDrop = () => {
    recordIndexId,
  );

-  const groupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -73,7 +73,7 @@ export const useProcessTableWithGroupRecordDrop = () => {
      }

      const fieldMetadata = objectMetadataItem.fields.find(
-        (field) => field.id === groupFieldMetadata?.id,
+        (field) => field.id === recordIndexGroupFieldMetadataItem?.id,
      );

      if (!isDefined(fieldMetadata)) {
@@ -121,7 +121,7 @@ export const useProcessTableWithGroupRecordDrop = () => {
      isDraggingRecord,
      selectedRowIds,
      recordIdsByGroupFamilyState,
-      groupFieldMetadata?.id,
+      recordIndexGroupFieldMetadataItem?.id,
      openModal,
      updateOneRecord,
    ],
@@ -24,7 +24,7 @@ export const RecordFieldListCellEditModePortal = ({
    RecordFieldListComponentInstanceContext,
  );

-  const editModePosition = useAtomComponentStateValue(
+  const recordFieldListCellEditModePosition = useAtomComponentStateValue(
    recordFieldListCellEditModePositionComponentState,
  );

@@ -32,7 +32,10 @@ export const RecordFieldListCellEditModePortal = ({
    objectNameSingular: objectMetadataItem.nameSingular,
  });

-  if (!isDefined(editModePosition) || !isDefined(editedFieldMetadataItem)) {
+  if (
+    !isDefined(recordFieldListCellEditModePosition) ||
+    !isDefined(editedFieldMetadataItem)
+  ) {
    return null;
  }

@@ -23,7 +23,7 @@ export const RecordFieldListCellHoveredPortal = ({
    RecordFieldListComponentInstanceContext,
  );

-  const hoverPosition = useAtomComponentStateValue(
+  const recordFieldListHoverPosition = useAtomComponentStateValue(
    recordFieldListHoverPositionComponentState,
  );

@@ -31,7 +31,10 @@ export const RecordFieldListCellHoveredPortal = ({
    objectNameSingular: objectMetadataItem.nameSingular,
  });

-  if (!isDefined(hoverPosition) || !isDefined(hoveredFieldMetadataItem)) {
+  if (
+    !isDefined(recordFieldListHoverPosition) ||
+    !isDefined(hoveredFieldMetadataItem)
+  ) {
    return null;
  }

@@ -11,11 +11,11 @@ type UseFieldListFieldMetadataFromPositionProps = {
 export const useFieldListFieldMetadataFromPosition = ({
  objectNameSingular,
 }: UseFieldListFieldMetadataFromPositionProps) => {
-  const hoverPosition = useAtomComponentStateValue(
+  const recordFieldListHoverPosition = useAtomComponentStateValue(
    recordFieldListHoverPositionComponentState,
  );

-  const editModePosition = useAtomComponentStateValue(
+  const recordFieldListCellEditModePosition = useAtomComponentStateValue(
    recordFieldListCellEditModePositionComponentState,
  );

@@ -33,12 +33,12 @@ export const useFieldListFieldMetadataFromPosition = ({
    ...boxedRelationFieldMetadataItems,
  ];

-  const hoveredFieldMetadataItem = isDefined(hoverPosition)
-    ? fieldMetadataItems.at(hoverPosition)
+  const hoveredFieldMetadataItem = isDefined(recordFieldListHoverPosition)
+    ? fieldMetadataItems.at(recordFieldListHoverPosition)
    : undefined;

-  const editedFieldMetadataItem = isDefined(editModePosition)
-    ? fieldMetadataItems.at(editModePosition)
+  const editedFieldMetadataItem = isDefined(recordFieldListCellEditModePosition)
+    ? fieldMetadataItems.at(recordFieldListCellEditModePosition)
    : undefined;

  return {
@@ -116,14 +116,14 @@ export const FormSingleRecordPicker = ({

  const { closeDropdown } = useCloseDropdown();

-  const setRecordPickerSearchFilter = useSetAtomComponentState(
+  const setSingleRecordPickerSearchFilter = useSetAtomComponentState(
    singleRecordPickerSearchFilterComponentState,
    dropdownId,
  );

  const handleCloseRelationPickerDropdown = useCallback(() => {
-    setRecordPickerSearchFilter('');
-  }, [setRecordPickerSearchFilter]);
+    setSingleRecordPickerSearchFilter('');
+  }, [setSingleRecordPickerSearchFilter]);

  const handleMorphItemSelected = (
    selectedMorphItem: RecordPickerPickableMorphItem | null | undefined,
@@ -148,7 +148,7 @@ export const FormSingleRecordPicker = ({
    onClear?.();
  };

-  const setRecordPickerSelectedId = useSetAtomComponentState(
+  const setSingleRecordPickerSelectedId = useSetAtomComponentState(
    singleRecordPickerSelectedIdComponentState,
    dropdownId,
  );
@@ -158,7 +158,7 @@ export const FormSingleRecordPicker = ({
      isDefined(draftValue?.value) &&
      !isStandaloneVariableString(draftValue.value)
    ) {
-      setRecordPickerSelectedId(draftValue.value);
+      setSingleRecordPickerSelectedId(draftValue.value);
    }
  };

@@ -30,12 +30,12 @@ describe('useIsFieldEmpty', () => {
  it('should work as expected', () => {
    const { result } = renderHook(
      () => {
-        const setFieldState = useSetAtomFamilyState(
+        const setRecordStore = useSetAtomFamilyState(
          recordStoreFamilyState,
          recordId,
        );
        return {
-          setFieldState,
+          setRecordStore,
          isFieldEditModeValueEmpty: useIsFieldEmpty(),
        };
      },
@@ -47,7 +47,7 @@ describe('useIsFieldEmpty', () => {
    expect(result.current.isFieldEditModeValueEmpty).toBe(true);

    act(() => {
-      result.current.setFieldState({
+      result.current.setRecordStore({
        id: 'id',
        phone: '+1 233223',
        __typename: 'Person',
@@ -5,7 +5,7 @@ import { ChipSize } from 'twenty-ui/components';

 export const ChipFieldDisplay = () => {
  const {
-    recordValue,
+    recordStore: recordValue,
    objectNameSingular,
    labelIdentifierLink,
    disableChipClick,
@@ -9,13 +9,13 @@ export const FilesFieldDisplay = () => {
  const { recordId, fieldDefinition } = useContext(FieldContext);
  const { fieldValue, disableChipClick } = useFilesFieldDisplay();

-  const uploadState = useAtomFamilyStateValue(filesFieldUploadState, {
+  const filesFieldUpload = useAtomFamilyStateValue(filesFieldUploadState, {
    recordId,
    fieldName: fieldDefinition.metadata.fieldName,
  });

-  const isUploadWindowOpen = uploadState === 'UPLOAD_WINDOW_OPEN';
-  const isFileUploading = uploadState === 'UPLOADING_FILE';
+  const isUploadWindowOpen = filesFieldUpload === 'UPLOAD_WINDOW_OPEN';
+  const isFileUploading = filesFieldUpload === 'UPLOADING_FILE';

  return (
    <FilesDisplay
@@ -19,18 +19,18 @@ import {
 } from './relationFromManyFieldDisplayMock';

 const RelationFieldValueSetterEffect = () => {
-  const setEntity = useSetAtomFamilyState(
+  const setRecordStore = useSetAtomFamilyState(
    recordStoreFamilyState,
    relationFromManyFieldDisplayMock.entityValue.id,
  );

  useEffect(() => {
-    setEntity({
+    setRecordStore({
      __typename: relationFromManyFieldDisplayMock.entityValue.__typename,
      id: relationFromManyFieldDisplayMock.entityValue.id,
      company: [relationFromManyFieldDisplayMock.entityValue],
    } satisfies ObjectRecord);
-  }, [setEntity]);
+  }, [setRecordStore]);

  return null;
 };
@@ -30,7 +30,7 @@ export const useAddressField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldAddressValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

@@ -38,7 +38,7 @@ export const useAddressField = () => {
    fieldDefinition,
    fieldValue,
    setFieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
  };
 };
@@ -24,14 +24,14 @@ export const useArrayField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldArrayValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
    fieldValue,
    fieldDefinition,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setFieldValue,
    setDraftValue,
  };
@@ -17,10 +17,10 @@ export const useChipField = () => {
      ? fieldDefinition.metadata.objectMetadataNameSingular
      : undefined;

-  const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId);
+  const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId);

  return {
    objectNameSingular,
-    record,
+    recordStore,
  };
 };
@@ -50,7 +50,7 @@ export const useChipFieldDisplay = () => {
      ? fieldDefinition.metadata.objectMetadataNameSingular
      : undefined;

-  const recordValue = useAtomFamilyStateValue(recordStoreFamilyState, recordId);
+  const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId);

  if (!isNonEmptyString(objectNameSingular)) {
    throw new Error('Object metadata name singular is not a non-empty string');
@@ -58,7 +58,7 @@ export const useChipFieldDisplay = () => {

  return {
    objectNameSingular,
-    recordValue,
+    recordStore,
    isLabelIdentifier,
    labelIdentifierLink,
    disableChipClick,
@@ -30,7 +30,7 @@ export const useCurrencyField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldCurrencyValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

@@ -42,7 +42,7 @@ export const useCurrencyField = () => {
  return {
    fieldDefinition,
    fieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
    defaultValue,
@@ -26,14 +26,14 @@ export const useEmailsField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldEmailsValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
    fieldDefinition,
    fieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -26,14 +26,14 @@ export const useFilesField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldFilesValue[]>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
    fieldDefinition,
    fieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -29,7 +29,7 @@ export const useFullNameField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldFullNameValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

@@ -37,7 +37,7 @@ export const useFullNameField = () => {
    fieldDefinition,
    fieldValue,
    setFieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
  };
 };
@@ -31,16 +31,16 @@ export const useJsonField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldJsonValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  const precomputedDraftValue = usePrecomputedJsonDraftValue({
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
  });

  return {
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    precomputedDraftValue,
    setDraftValue,
    maxWidth,
@@ -26,14 +26,14 @@ export const useLinksField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldLinksValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
    fieldDefinition,
    fieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -32,11 +32,11 @@ export const useMorphRelationField = <
    { recordId, fieldName },
  ) as [FieldRelationValue<T>, (value: FieldRelationValue<T>) => void];

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

-  const initialSearchValue = draftValue;
+  const initialSearchValue = recordFieldInputDraftValue;

  return {
    fieldDefinition,
@@ -34,7 +34,7 @@ export const useMultiSelectField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldMultiSelectValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

@@ -42,7 +42,7 @@ export const useMultiSelectField = () => {
    recordId,
    fieldDefinition,
    fieldValues: fieldMultiSelectValues,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -26,14 +26,14 @@ export const useNumberField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldNumberValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
    fieldDefinition,
    fieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -26,14 +26,14 @@ export const usePhonesField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldPhonesValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
    fieldDefinition,
    fieldValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -30,11 +30,11 @@ export const useRelationField = <T extends ObjectRecord | ObjectRecord[]>() => {
    { recordId, fieldName },
  ) as [FieldRelationValue<T>, (value: FieldRelationValue<T>) => void];

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

-  const initialSearchValue = draftValue;
+  const initialSearchValue = recordFieldInputDraftValue;

  return {
    fieldDefinition,
@@ -29,7 +29,7 @@ export const useSelectField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldSelectValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

@@ -37,7 +37,7 @@ export const useSelectField = () => {
    recordId,
    fieldDefinition,
    fieldValue: fieldSelectValue,
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    setFieldValue,
  };
@@ -27,12 +27,12 @@ export const useTextField = () => {

  const { setDraftValue } = useRecordFieldInput<FieldTextValue>();

-  const draftValue = useAtomComponentStateValue(
+  const recordFieldInputDraftValue = useAtomComponentStateValue(
    recordFieldInputDraftValueComponentState,
  );

  return {
-    draftValue,
+    draftValue: recordFieldInputDraftValue,
    setDraftValue,
    maxWidth,
    fieldDefinition,
@@ -68,12 +68,12 @@ export const EmailsFieldInput = () => {
    index === 0 && emails.length > 1;
  const getShowSetAsPrimaryButton = (index: number) => index > 0;

-  const setIsFieldInError = useSetAtomComponentState(
+  const setRecordFieldInputIsFieldInError = useSetAtomComponentState(
    recordFieldInputIsFieldInErrorComponentState,
  );

  const handleError = (hasError: boolean, values: any[]) => {
-    setIsFieldInError(hasError && values.length === 0);
+    setRecordFieldInputIsFieldInError(hasError && values.length === 0);
  };

  const handleCopy = (email: string) => {
@@ -122,12 +122,12 @@ export const FilesFieldInput = () => {
    fieldDefinition,
  ]);

-  const setIsFieldInError = useSetAtomComponentState(
+  const setRecordFieldInputIsFieldInError = useSetAtomComponentState(
    recordFieldInputIsFieldInErrorComponentState,
  );

  const handleError = (hasError: boolean, values: FieldFilesValue[]) => {
-    setIsFieldInError(hasError && values.length === 0);
+    setRecordFieldInputIsFieldInError(hasError && values.length === 0);
  };

  const handleClickOutside = (
@@ -57,12 +57,12 @@ export const LinksFieldInput = () => {
  const getShowPrimaryIcon = (index: number) => index === 0 && links.length > 1;
  const getShowSetAsPrimaryButton = (index: number) => index > 0;

-  const setIsFieldInError = useSetAtomComponentState(
+  const setRecordFieldInputIsFieldInError = useSetAtomComponentState(
    recordFieldInputIsFieldInErrorComponentState,
  );

  const handleError = (hasError: boolean, values: any[]) => {
-    setIsFieldInError(hasError && values.length === 0);
+    setRecordFieldInputIsFieldInError(hasError && values.length === 0);
  };

  const handleClickOutside = (
@@ -63,15 +63,15 @@ export const MorphRelationManyToOneFieldInput = () => {
    onCancel?.();
  };

-  const layoutDirection = useAtomComponentStateValue(
+  const recordFieldInputLayoutDirection = useAtomComponentStateValue(
    recordFieldInputLayoutDirectionComponentState,
  );

-  const isLoading = useAtomComponentStateValue(
+  const recordFieldInputLayoutDirectionLoading = useAtomComponentStateValue(
    recordFieldInputLayoutDirectionLoadingComponentState,
  );

-  if (isLoading) {
+  if (recordFieldInputLayoutDirectionLoading) {
    return <></>;
  }

@@ -95,7 +95,7 @@ export const MorphRelationManyToOneFieldInput = () => {
      objectNameSingulars={objectNameSingulars}
      recordPickerInstanceId={instanceId}
      layoutDirection={
-        layoutDirection === 'downward'
+        recordFieldInputLayoutDirection === 'downward'
          ? 'search-bar-on-top'
          : 'search-bar-on-bottom'
      }
@@ -23,7 +23,7 @@ export const MorphRelationOneToManyFieldInput = () => {
    onSubmit?.({ skipPersist: true });
  };

-  const layoutDirection = useAtomComponentStateValue(
+  const recordFieldInputLayoutDirection = useAtomComponentStateValue(
    recordFieldInputLayoutDirectionComponentState,
  );

@@ -37,7 +37,7 @@ export const MorphRelationOneToManyFieldInput = () => {
      }}
      onClickOutside={handleSubmit}
      layoutDirection={
-        layoutDirection === 'downward'
+        recordFieldInputLayoutDirection === 'downward'
          ? 'search-bar-on-top'
          : 'search-bar-on-bottom'
      }
@@ -128,12 +128,12 @@ export const PhonesFieldInput = () => {
    index === 0 && phones.length > 1;
  const getShowSetAsPrimaryButton = (index: number) => index > 0;

-  const setIsFieldInError = useSetAtomComponentState(
+  const setRecordFieldInputIsFieldInError = useSetAtomComponentState(
    recordFieldInputIsFieldInErrorComponentState,
  );

  const handleError = (hasError: boolean, values: any[]) => {
-    setIsFieldInError(hasError && values.length === 0);
+    setRecordFieldInputIsFieldInError(hasError && values.length === 0);
  };

  const handleClickOutside = (
@@ -77,11 +77,11 @@ export const RelationManyToOneFieldInput = () => {
      recordId,
    });

-  const layoutDirection = useAtomComponentStateValue(
+  const recordFieldInputLayoutDirection = useAtomComponentStateValue(
    recordFieldInputLayoutDirectionComponentState,
  );

-  const isLoading = useAtomComponentStateValue(
+  const recordFieldInputLayoutDirectionLoading = useAtomComponentStateValue(
    recordFieldInputLayoutDirectionLoadingComponentState,
    instanceId,
  );
@@ -99,7 +99,7 @@ export const RelationManyToOneFieldInput = () => {
    }
  };

-  if (isLoading) {
+  if (recordFieldInputLayoutDirectionLoading) {
    return <></>;
  }
  const fieldLabel = fieldDefinition.label;
@@ -122,7 +122,7 @@ export const RelationManyToOneFieldInput = () => {
      ]}
      recordPickerInstanceId={instanceId}
      layoutDirection={
-        layoutDirection === 'downward'
+        recordFieldInputLayoutDirection === 'downward'
          ? 'search-bar-on-top'
          : 'search-bar-on-bottom'
      }
@@ -158,7 +158,7 @@ export const RelationOneToManyFieldInput = () => {
      relationFieldDefinition.metadata.relationObjectMetadataNameSingular,
  });

-  const layoutDirection = useAtomComponentStateValue(
+  const recordFieldInputLayoutDirection = useAtomComponentStateValue(
    recordFieldInputLayoutDirectionComponentState,
  );

@@ -329,7 +329,7 @@ export const RelationOneToManyFieldInput = () => {
      objectMetadataItemIdForCreate={objectMetadataItemIdForCreate}
      onClickOutside={handleSubmit}
      layoutDirection={
-        layoutDirection === 'downward'
+        recordFieldInputLayoutDirection === 'downward'
          ? 'search-bar-on-top'
          : 'search-bar-on-bottom'
      }
@@ -23,11 +23,14 @@ const BooleanFieldValueSetterEffect = ({
  value: boolean;
  recordId: string;
 }) => {
-  const setField = useSetAtomFamilyState(recordStoreFamilyState, recordId);
+  const setRecordStore = useSetAtomFamilyState(
+    recordStoreFamilyState,
+    recordId,
+  );

  useEffect(() => {
-    setField({ id: recordId, Boolean: value, __typename: 'Person' });
-  }, [recordId, setField, value]);
+    setRecordStore({ id: recordId, Boolean: value, __typename: 'Person' });
+  }, [recordId, setRecordStore, value]);

  return <></>;
 };
@@ -14,7 +14,7 @@ type RecordGroupMenuItemDraggableProps = {
  recordGroupId: string;
  showDragGrip?: boolean;
  isDraggable?: boolean;
-  onVisibilityChange: (recordGroup: RecordGroupDefinition) => void;
+  onVisibilityChange: (recordGroupDefinition: RecordGroupDefinition) => void;
  isVisibleLimitReached?: boolean;
 };

@@ -25,37 +25,38 @@ export const RecordGroupMenuItemDraggable = ({
  onVisibilityChange,
  isVisibleLimitReached = false,
 }: RecordGroupMenuItemDraggableProps) => {
-  const recordGroup = useAtomFamilyStateValue(
+  const recordGroupDefinition = useAtomFamilyStateValue(
    recordGroupDefinitionFamilyState,
    recordGroupId,
  );

-  if (!isDefined(recordGroup)) {
+  if (!isDefined(recordGroupDefinition)) {
    return null;
  }

-  const isNoValue = recordGroup.type === RecordGroupDefinitionType.NoValue;
+  const isNoValue =
+    recordGroupDefinition.type === RecordGroupDefinitionType.NoValue;

-  const getIconButtons = (recordGroup: RecordGroupDefinition) => {
-    const groupValue = recordGroup.value;
+  const getIconButtons = (recordGroupDefinition: RecordGroupDefinition) => {
+    const groupValue = recordGroupDefinition.value;

-    if (!recordGroup.isVisible && isVisibleLimitReached) {
+    if (!recordGroupDefinition.isVisible && isVisibleLimitReached) {
      return undefined;
    }

    const iconButtons = [
      {
-        Icon: recordGroup.isVisible ? IconEyeOff : IconEye,
-        ariaLabel: recordGroup.isVisible
+        Icon: recordGroupDefinition.isVisible ? IconEyeOff : IconEye,
+        ariaLabel: recordGroupDefinition.isVisible
          ? t`Hide group ${groupValue}`
          : t`Show group ${groupValue}`,
-        dataTestId: recordGroup.isVisible
-          ? `hide-group-${recordGroup.value?.toLowerCase().replace(' ', '-') ?? ''}`
-          : `show-group-${recordGroup.value?.toLowerCase().replace(' ', '-') ?? ''}`,
+        dataTestId: recordGroupDefinition.isVisible
+          ? `hide-group-${recordGroupDefinition.value?.toLowerCase().replace(' ', '-') ?? ''}`
+          : `show-group-${recordGroupDefinition.value?.toLowerCase().replace(' ', '-') ?? ''}`,
        onClick: () =>
          onVisibilityChange({
-            ...recordGroup,
-            isVisible: !recordGroup.isVisible,
+            ...recordGroupDefinition,
+            isVisible: !recordGroupDefinition.isVisible,
          }),
      },
    ].filter(isDefined);
@@ -65,29 +66,29 @@ export const RecordGroupMenuItemDraggable = ({

  return (
    <MenuItemDraggable
-      key={recordGroup.id}
+      key={recordGroupDefinition.id}
      text={
        <Tag
          variant={
-            recordGroup.type !== RecordGroupDefinitionType.NoValue
+            recordGroupDefinition.type !== RecordGroupDefinitionType.NoValue
              ? 'solid'
              : 'outline'
          }
          color={
-            recordGroup.type !== RecordGroupDefinitionType.NoValue
-              ? recordGroup.color
+            recordGroupDefinition.type !== RecordGroupDefinitionType.NoValue
+              ? recordGroupDefinition.color
              : 'transparent'
          }
-          text={recordGroup.title}
+          text={recordGroupDefinition.title}
          weight={
-            recordGroup.type !== RecordGroupDefinitionType.NoValue
+            recordGroupDefinition.type !== RecordGroupDefinitionType.NoValue
              ? 'regular'
              : 'medium'
          }
        />
      }
      accent={isNoValue || showDragGrip ? 'placeholder' : 'default'}
-      iconButtons={getIconButtons(recordGroup)}
+      iconButtons={getIconButtons(recordGroupDefinition)}
      gripMode={isNoValue || showDragGrip ? 'always' : 'never'}
      isDragDisabled={!isDraggable}
    />
@@ -13,7 +13,7 @@ type RecordGroupReorderConfirmationModalProps = {
 export const RecordGroupReorderConfirmationModal = ({
  onConfirmClick,
 }: RecordGroupReorderConfirmationModalProps): ReactNode => {
-  const recordGroupSort = useAtomComponentStateValue(
+  const recordIndexRecordGroupSort = useAtomComponentStateValue(
    recordIndexRecordGroupSortComponentState,
  );

@@ -23,7 +23,7 @@ export const RecordGroupReorderConfirmationModal = ({
        <ConfirmationModal
          modalId={RECORD_GROUP_REORDER_CONFIRMATION_MODAL_ID}
          title={t`Group sorting`}
-          subtitle={t`Would you like to remove ${recordGroupSort} group sorting?`}
+          subtitle={t`Would you like to remove ${recordIndexRecordGroupSort} group sorting?`}
          onConfirmClick={onConfirmClick}
          confirmButtonText={t`Remove`}
        />,
@@ -7,19 +7,20 @@ import { isDefined } from 'twenty-shared/utils';

 export const useRecordGroupFilter = (fields: FieldMetadataItem[]) => {
  const currentRecordGroupDefinition = useCurrentRecordGroupDefinition();
-  const groupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

  const recordGroupFilter = useMemo(() => {
    if (isDefined(currentRecordGroupDefinition)) {
      const fieldMetadataItem = fields.find(
-        (fieldMetadataItem) => fieldMetadataItem.id === groupFieldMetadata?.id,
+        (fieldMetadataItem) =>
+          fieldMetadataItem.id === recordIndexGroupFieldMetadataItem?.id,
      );

      if (!fieldMetadataItem) {
        throw new Error(
-          `Field metadata item with id ${groupFieldMetadata?.id} not found`,
+          `Field metadata item with id ${recordIndexGroupFieldMetadataItem?.id} not found`,
        );
      }

@@ -35,7 +36,11 @@ export const useRecordGroupFilter = (fields: FieldMetadataItem[]) => {
    }

    return {};
-  }, [currentRecordGroupDefinition, fields, groupFieldMetadata?.id]);
+  }, [
+    currentRecordGroupDefinition,
+    fields,
+    recordIndexGroupFieldMetadataItem?.id,
+  ]);

  return { recordGroupFilter };
 };
@@ -52,7 +52,7 @@ export const useRecordGroupReorderConfirmationModal = ({
    recordIndexId,
  );

-  const [, setRecordGroupSort] = useAtomComponentState(
+  const [, setRecordIndexRecordGroupSort] = useAtomComponentState(
    recordIndexRecordGroupSortComponentState,
  );
  const { closeAnyOpenDropdown } = useCloseAnyOpenDropdown();
@@ -73,7 +73,7 @@ export const useRecordGroupReorderConfirmationModal = ({
      throw new Error('pendingDragEndReorder is not set');
    }

-    setRecordGroupSort(RecordGroupSort.Manual);
+    setRecordIndexRecordGroupSort(RecordGroupSort.Manual);
    setPendingDragEndHandlerParams(null);
    handleDragEnd(...pendingDragEndHandlerParams);
    goBackToPreviousDropdownFocusId();
@@ -42,7 +42,7 @@ export const useReorderRecordGroups = ({

  const { saveViewGroups } = useSaveCurrentViewGroups();

-  const groupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

@@ -86,12 +86,12 @@ export const useReorderRecordGroups = ({
        ];
      }, []);

-      if (!isDefined(groupFieldMetadata?.id)) {
+      if (!isDefined(recordIndexGroupFieldMetadataItem?.id)) {
        throw new Error('mainGroupByFieldMetadataId is required');
      }

      setRecordGroups({
-        mainGroupByFieldMetadataId: groupFieldMetadata?.id,
+        mainGroupByFieldMetadataId: recordIndexGroupFieldMetadataItem?.id,
        recordGroups: updatedRecordGroups,
        recordIndexId,
        objectMetadataItemId: objectMetadataItem.id,
@@ -102,7 +102,7 @@ export const useReorderRecordGroups = ({
    },
    [
      objectMetadataItem.id,
-      groupFieldMetadata?.id,
+      recordIndexGroupFieldMetadataItem?.id,
      recordIndexId,
      saveViewGroups,
      setRecordGroups,
@@ -4,14 +4,14 @@ import { useAtomComponentFamilyStateValue } from '@/ui/utilities/state/jotai/hoo
 import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue';

 export const useShouldHideRecordGroup = (recordGroupId: string): boolean => {
-  const shouldHideEmptyRecordGroups = useAtomComponentStateValue(
+  const recordIndexShouldHideEmptyRecordGroups = useAtomComponentStateValue(
    recordIndexShouldHideEmptyRecordGroupsComponentState,
  );

-  const isRecordGroupEmpty = useAtomComponentFamilyStateValue(
+  const emptyRecordGroupById = useAtomComponentFamilyStateValue(
    emptyRecordGroupByIdComponentFamilyState,
    recordGroupId,
  );

-  return shouldHideEmptyRecordGroups && isRecordGroupEmpty;
+  return recordIndexShouldHideEmptyRecordGroups && emptyRecordGroupById;
 };
@@ -27,12 +27,12 @@ export const RecordIndexFiltersToContextStoreEffect = () => {

  const store = useStore();

-  const recordIndexFilters = useAtomComponentStateValue(
+  const currentRecordFilters = useAtomComponentStateValue(
    currentRecordFiltersComponentState,
    recordIndexId,
  );

-  const recordIndexFilterGroups = useAtomComponentStateValue(
+  const currentRecordFilterGroups = useAtomComponentStateValue(
    currentRecordFilterGroupsComponentState,
    recordIndexId,
  );
@@ -173,8 +173,8 @@ export const RecordIndexFiltersToContextStoreEffect = () => {

  useEffect(() => {
    store.set(syncWriteAtom, {
-      filters: recordIndexFilters,
-      filterGroups: recordIndexFilterGroups,
+      filters: currentRecordFilters,
+      filterGroups: currentRecordFilterGroups,
      anyFieldFilterValue,
    });

@@ -182,8 +182,8 @@ export const RecordIndexFiltersToContextStoreEffect = () => {
      store.set(resetWriteAtom);
    };
  }, [
-    recordIndexFilters,
-    recordIndexFilterGroups,
+    currentRecordFilters,
+    currentRecordFilterGroups,
    anyFieldFilterValue,
    store,
    syncWriteAtom,
@@ -17,7 +17,7 @@ export const RecordIndexTableContainer = ({
  const { objectNameSingular, viewBarInstanceId } =
    useRecordIndexContextOrThrow();

-  const isRecordIndexRemoveSortingModalOpened = useAtomComponentStateValue(
+  const isModalOpened = useAtomComponentStateValue(
    isModalOpenedComponentState,
    RECORD_INDEX_REMOVE_SORTING_MODAL_ID,
  );
@@ -40,9 +40,7 @@ export const RecordIndexTableContainer = ({
        viewBarId={viewBarInstanceId}
        updateRecordMutation={updateEntity}
      />
-      {isRecordIndexRemoveSortingModalOpened && (
-        <RecordIndexRemoveSortingModal />
-      )}
+      {isModalOpened && <RecordIndexRemoveSortingModal />}
    </>
  );
 };
@@ -59,13 +59,14 @@ export const useRecordIndexLazyFetchRecords = ({
    viewBarId: recordIndexId,
  });

-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
    recordIndexId,
  );

  const hiddenKanbanFieldColumn = hiddenBoardFields.find(
-    (column) => column.metadata.fieldName === recordGroupFieldMetadata?.name,
+    (column) =>
+      column.metadata.fieldName === recordIndexGroupFieldMetadataItem?.name,
  );

  const contextStoreTargetedRecordsRule = useAtomComponentStateValue(
@@ -9,7 +9,7 @@ export const useHandleIndexIdentifierClick = ({
 }: {
  objectMetadataItem: ObjectMetadataItem;
 }) => {
-  const currentViewId = useAtomComponentStateValue(
+  const contextStoreCurrentViewId = useAtomComponentStateValue(
    contextStoreCurrentViewIdComponentState,
  );

@@ -21,7 +21,7 @@ export const useHandleIndexIdentifierClick = ({
        objectRecordId: recordId,
      },
      {
-        viewId: currentViewId,
+        viewId: contextStoreCurrentViewId,
      },
    );
  };
@@ -59,13 +59,13 @@ export const useRecordIndexGroupCommonQueryVariables = () => {
    objectMetadataItems,
  );

-  const recordGroupFieldMetadata = useAtomComponentStateValue(
+  const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue(
    recordIndexGroupFieldMetadataItemComponentState,
  );

  const recordGqlFields = useRecordsFieldVisibleGqlFields({
    objectMetadataItem,
-    additionalFieldMetadataId: recordGroupFieldMetadata?.id,
+    additionalFieldMetadataId: recordIndexGroupFieldMetadataItem?.id,
  });

  const recordGroupDefinitions = useAtomComponentSelectorValue(
@@ -81,7 +81,7 @@ export const useRecordIndexGroupCommonQueryVariables = () => {
  );

  const recordGroupOptionsFilter = computeRecordGroupOptionsFilter({
-    recordGroupFieldMetadata,
+    recordGroupFieldMetadata: recordIndexGroupFieldMetadataItem,
    recordGroupValues,
  });

@@ -42,12 +42,12 @@ export const RecordInlineCellEditMode = ({
    RecordFieldComponentInstanceContext,
  );

-  const setFieldInputLayoutDirection = useSetAtomComponentState(
+  const setRecordFieldInputLayoutDirection = useSetAtomComponentState(
    recordFieldInputLayoutDirectionComponentState,
    recordFieldComponentInstanceId,
  );

-  const setFieldInputLayoutDirectionLoading = useSetAtomComponentState(
+  const setRecordFieldInputLayoutDirectionLoading = useSetAtomComponentState(
    recordFieldInputLayoutDirectionLoadingComponentState,
    recordFieldComponentInstanceId,
  );
@@ -55,15 +55,15 @@ export const RecordInlineCellEditMode = ({
  const setFieldInputLayoutDirectionMiddleware = {
    name: 'middleware',
    fn: async (state: MiddlewareState) => {
-      setFieldInputLayoutDirection(
+      setRecordFieldInputLayoutDirection(
        state.placement.startsWith('bottom') ? 'downward' : 'upward',
      );
-      setFieldInputLayoutDirectionLoading(false);
+      setRecordFieldInputLayoutDirectionLoading(false);
      return {};
    },
  };

-  const isFieldInError = useAtomComponentStateValue(
+  const recordFieldInputIsFieldInError = useAtomComponentStateValue(
    recordFieldInputIsFieldInErrorComponentState,
  );

@@ -98,7 +98,7 @@ export const RecordInlineCellEditMode = ({
            ref={refs.setFloating}
            style={floatingStyles}
            borderRadius="sm"
-            hasDangerBorder={isFieldInError}
+            hasDangerBorder={recordFieldInputIsFieldInError}
          >
            {children}
          </OverlayContainer>,
@@ -26,7 +26,7 @@ export const useMergeRecordsActions = ({
    objectNameSingular,
  });

-  const setMergeInProgress = useSetAtomState(isMergeInProgressState);
+  const setIsMergeInProgress = useSetAtomState(isMergeInProgressState);

  const { t } = useLingui();
  const { enqueueSuccessSnackBar, enqueueErrorSnackBar } = useSnackBar();
@@ -34,7 +34,7 @@ export const useMergeRecordsActions = ({

  const navigate = useNavigateApp();
  const handleMergeRecords = async () => {
-    setMergeInProgress(true);
+    setIsMergeInProgress(true);
    try {
      const mergedRecord = await mergeManyRecords({
        recordIds: selectedRecords.map((record) => record.id),
@@ -65,7 +65,7 @@ export const useMergeRecordsActions = ({
            : t`Failed to merge records. Please try again.`,
      });
    } finally {
-      setMergeInProgress(false);
+      setIsMergeInProgress(false);
    }
  };

@@ -20,12 +20,12 @@ export const useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId =
      recordId,
    );

-    const searchRecord = useAtomFamilyStateValue(
+    const searchRecordStore = useAtomFamilyStateValue(
      searchRecordStoreFamilyState,
      recordId,
    );

-    if (!isDefined(pickableMorphItem) || !isDefined(searchRecord)) {
+    if (!isDefined(pickableMorphItem) || !isDefined(searchRecordStore)) {
      return { searchRecord: null, objectMetadataItem: null };
    }

@@ -38,5 +38,5 @@ export const useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId =
      return { searchRecord: null, objectMetadataItem: null };
    }

-    return { searchRecord, objectMetadataItem };
+    return { searchRecord: searchRecordStore, objectMetadataItem };
  };
@@ -49,12 +49,12 @@ export const MultipleRecordPickerFetchMoreLoader = () => {
    componentInstanceId,
  );

-  const isLoading = useAtomComponentStateValue(
+  const multipleRecordPickerIsLoading = useAtomComponentStateValue(
    multipleRecordPickerIsLoadingComponentState,
    componentInstanceId,
  );

-  const searchFilter = useAtomComponentStateValue(
+  const multipleRecordPickerSearchFilter = useAtomComponentStateValue(
    multipleRecordPickerSearchFilterComponentState,
    componentInstanceId,
  );
@@ -77,16 +77,22 @@ export const MultipleRecordPickerFetchMoreLoader = () => {
      }),
    );

-    if (isLoading || !currentPaginationState.hasNextPage) {
+    if (multipleRecordPickerIsLoading || !currentPaginationState.hasNextPage) {
      return;
    }

    await performSearch({
      multipleRecordPickerInstanceId: componentInstanceId,
-      forceSearchFilter: searchFilter,
+      forceSearchFilter: multipleRecordPickerSearchFilter,
      loadMore: true,
    });
-  }, [componentInstanceId, performSearch, searchFilter, isLoading, store]);
+  }, [
+    componentInstanceId,
+    performSearch,
+    multipleRecordPickerSearchFilter,
+    multipleRecordPickerIsLoading,
+    store,
+  ]);

  const { ref } = useInView({
    onChange: useCallback(
@@ -107,7 +113,7 @@ export const MultipleRecordPickerFetchMoreLoader = () => {
    !paginationState.hasNextPage ||
    multipleRecordPickerShouldShowInitialLoading ||
    multipleRecordPickerShouldShowSkeleton ||
-    (isLoading && !multipleRecordPickerIsFetchingMore)
+    (multipleRecordPickerIsLoading && !multipleRecordPickerIsFetchingMore)
  ) {
    return null;
  }
@@ -10,11 +10,11 @@ import { useDebouncedCallback } from 'use-debounce';
 export const MultipleRecordPickerLoadingEffect = () => {
  const [previousLoading, setPreviousLoading] = useState(false);

-  const loading = useAtomComponentStateValue(
+  const multipleRecordPickerIsLoading = useAtomComponentStateValue(
    multipleRecordPickerIsLoadingComponentState,
  );

-  const setMultipleRecordPickerShowSkeleton = useSetAtomComponentState(
+  const setMultipleRecordPickerShouldShowSkeleton = useSetAtomComponentState(
    multipleRecordPickerShouldShowSkeletonComponentState,
  );

@@ -23,27 +23,27 @@ export const MultipleRecordPickerLoadingEffect = () => {
  );

  const debouncedShowPickerSearchSkeleton = useDebouncedCallback(
-    () => setMultipleRecordPickerShowSkeleton(true),
+    () => setMultipleRecordPickerShouldShowSkeleton(true),
    350,
  );

  useEffect(() => {
-    if (previousLoading !== loading) {
-      setPreviousLoading(loading);
+    if (previousLoading !== multipleRecordPickerIsLoading) {
+      setPreviousLoading(multipleRecordPickerIsLoading);

-      if (loading) {
+      if (multipleRecordPickerIsLoading) {
        if (!multipleRecordPickerIsFetchingMore) {
          debouncedShowPickerSearchSkeleton();
        }
      } else {
        debouncedShowPickerSearchSkeleton.cancel();
-        setMultipleRecordPickerShowSkeleton(false);
+        setMultipleRecordPickerShouldShowSkeleton(false);
      }
    }
  }, [
-    loading,
+    multipleRecordPickerIsLoading,
    previousLoading,
-    setMultipleRecordPickerShowSkeleton,
+    setMultipleRecordPickerShouldShowSkeleton,
    multipleRecordPickerIsFetchingMore,
    debouncedShowPickerSearchSkeleton,
  ]);
@@ -43,7 +43,7 @@ export const MultipleRecordPickerMenuItemContent = ({
  const selectableListComponentInstanceId =
    getMultipleRecordPickerSelectableListId(componentInstanceId);

-  const isSelectedByKeyboard = useAtomComponentFamilyStateValue(
+  const isSelectedItemId = useAtomComponentFamilyStateValue(
    isSelectedItemIdComponentFamilyState,
    searchRecord.recordId,
    selectableListComponentInstanceId,
@@ -68,12 +68,14 @@ export const MultipleRecordPickerMenuItemContent = ({
  const displayText =
    searchRecord.label?.trim() || t`Untitled ${labelSingular}`;

-  const searchableObjectMetadataItems = useAtomComponentStateValue(
-    multipleRecordPickerSearchableObjectMetadataItemsComponentState,
-    componentInstanceId,
-  );
+  const multipleRecordPickerSearchableObjectMetadataItems =
+    useAtomComponentStateValue(
+      multipleRecordPickerSearchableObjectMetadataItemsComponentState,
+      componentInstanceId,
+    );

-  const showObjectName = searchableObjectMetadataItems.length > 1;
+  const showObjectName =
+    multipleRecordPickerSearchableObjectMetadataItems.length > 1;

  return (
    <StyledSelectableItem
@@ -83,7 +85,7 @@ export const MultipleRecordPickerMenuItemContent = ({
    >
      <MenuItemMultiSelectAvatar
        onSelectChange={(isSelected) => handleSelectChange(isSelected)}
-        isKeySelected={isSelectedByKeyboard}
+        isKeySelected={isSelectedItemId}
        selected={isRecordSelectedWithObjectItem}
        avatar={
          <Avatar
@@ -14,8 +14,10 @@ export const MultipleRecordPickerSearchInput = () => {
    MultipleRecordPickerComponentInstanceContext,
  );

-  const [recordPickerSearchFilter, setRecordPickerSearchFilter] =
-    useAtomComponentState(multipleRecordPickerSearchFilterComponentState);
+  const [
+    multipleRecordPickerSearchFilter,
+    setMultipleRecordPickerSearchFilter,
+  ] = useAtomComponentState(multipleRecordPickerSearchFilterComponentState);

  const { performSearch } = useMultipleRecordPickerPerformSearch();

@@ -43,13 +45,13 @@ export const MultipleRecordPickerSearchInput = () => {

  const handleFilterChange = (event: React.ChangeEvent<HTMLInputElement>) => {
    const newSearchFilter = event.currentTarget.value;
-    setRecordPickerSearchFilter(newSearchFilter);
+    setMultipleRecordPickerSearchFilter(newSearchFilter);
    debouncedSearch(newSearchFilter);
  };

  return (
    <DropdownMenuSearchInput
-      value={recordPickerSearchFilter}
+      value={multipleRecordPickerSearchFilter}
      onChange={handleFilterChange}
      autoFocus
    />
@@ -33,13 +33,13 @@ export const SingleRecordPicker = ({
 }: SingleRecordPickerProps) => {
  const containerRef = useRef<HTMLDivElement>(null);

-  const setRecordPickerSearchFilter = useSetAtomComponentState(
+  const setSingleRecordPickerSearchFilter = useSetAtomComponentState(
    singleRecordPickerSearchFilterComponentState,
    componentInstanceId,
  );

  const handleCancel = () => {
-    setRecordPickerSearchFilter('');
+    setSingleRecordPickerSearchFilter('');

    onCancel?.();
  };
@@ -47,7 +47,7 @@ export const SingleRecordPicker = ({
  const handleMorphItemSelected = (
    selectedMorphItem?: RecordPickerPickableMorphItem | undefined,
  ) => {
-    setRecordPickerSearchFilter('');
+    setSingleRecordPickerSearchFilter('');

    onMorphItemSelected?.(selectedMorphItem);
  };
@@ -39,27 +39,29 @@ export const SingleRecordPickerMenuItem = ({
  const selectableListComponentInstanceId =
    getSingleRecordPickerSelectableListId(recordPickerComponentInstanceId);

-  const isSelectedByKeyboard = useAtomComponentFamilyStateValue(
+  const isSelectedItemId = useAtomComponentFamilyStateValue(
    isSelectedItemIdComponentFamilyState,
    morphItem.recordId,
    selectableListComponentInstanceId,
  );

-  const searchRecord = useAtomFamilyStateValue(
+  const searchRecordStore = useAtomFamilyStateValue(
    searchRecordStoreFamilyState,
    morphItem.recordId,
  );

-  const searchableObjectMetadataItems = useAtomComponentStateValue(
-    singleRecordPickerSearchableObjectMetadataItemsComponentState,
-    recordPickerComponentInstanceId,
-  );
+  const singleRecordPickerSearchableObjectMetadataItems =
+    useAtomComponentStateValue(
+      singleRecordPickerSearchableObjectMetadataItemsComponentState,
+      recordPickerComponentInstanceId,
+    );

-  if (!isDefined(searchRecord)) {
+  if (!isDefined(searchRecordStore)) {
    return null;
  }

-  const showObjectName = searchableObjectMetadataItems.length > 1;
+  const showObjectName =
+    singleRecordPickerSearchableObjectMetadataItems.length > 1;

  return (
    <StyledSelectableItem
@@ -72,21 +74,23 @@ export const SingleRecordPickerMenuItem = ({
      <MenuItemSelectAvatar
        testId="menu-item"
        onClick={() => onMorphItemSelected(morphItem)}
-        text={searchRecord.label}
+        text={searchRecordStore.label}
        selected={isRecordSelected}
-        focused={isSelectedByKeyboard}
+        focused={isSelectedItemId}
        avatar={
          <Avatar
-            avatarUrl={searchRecord.imageUrl}
+            avatarUrl={searchRecordStore.imageUrl}
            placeholderColorSeed={morphItem.recordId}
-            placeholder={searchRecord.label}
+            placeholder={searchRecordStore.label}
            size="md"
-            type={getAvatarType(searchRecord.objectNameSingular) ?? 'rounded'}
+            type={
+              getAvatarType(searchRecordStore.objectNameSingular) ?? 'rounded'
+            }
          />
        }
        contextualText={
          showObjectName
-            ? capitalize(searchRecord.objectLabelSingular)
+            ? capitalize(searchRecordStore.objectLabelSingular)
            : undefined
        }
      />
@@ -53,7 +53,7 @@ export const SingleRecordPickerMenuItems = ({
    selectableListComponentInstanceId,
  );

-  const isSelectedSelectNoneButton = useAtomComponentFamilyStateValue(
+  const isSelectedItemId = useAtomComponentFamilyStateValue(
    isSelectedItemIdComponentFamilyState,
    selectableListComponentInstanceId,
    'select-none',
@@ -72,9 +72,8 @@ export const SingleRecordPickerMenuItems = ({
  const selectableItemIds = pickableMorphItems.map(
    (morphItem) => morphItem.recordId,
  );
-  const [selectedRecordId, setSelectedRecordId] = useAtomComponentState(
-    singleRecordPickerSelectedIdComponentState,
-  );
+  const [singleRecordPickerSelectedId, setSingleRecordPickerSelectedId] =
+    useAtomComponentState(singleRecordPickerSelectedIdComponentState);

  const singleRecordPickerShouldShowSkeleton = useAtomComponentStateValue(
    singleRecordPickerShouldShowSkeletonComponentState,
@@ -101,19 +100,19 @@ export const SingleRecordPickerMenuItems = ({
          key="select-none"
          itemId="select-none"
          onEnter={() => {
-            setSelectedRecordId(undefined);
+            setSingleRecordPickerSelectedId(undefined);
            onMorphItemSelected();
          }}
        >
          <MenuItemSelect
            onClick={() => {
-              setSelectedRecordId(undefined);
+              setSingleRecordPickerSelectedId(undefined);
              onMorphItemSelected();
            }}
            LeftIcon={EmptyIcon}
            text={emptyLabel}
-            selected={isUndefined(selectedRecordId)}
-            focused={isSelectedSelectNoneButton}
+            selected={isUndefined(singleRecordPickerSelectedId)}
+            focused={isSelectedItemId}
          />
        </SelectableListItem>
      )}
@@ -127,7 +126,9 @@ export const SingleRecordPickerMenuItems = ({
            key={morphItem.recordId}
            morphItem={morphItem}
            onMorphItemSelected={onMorphItemSelected}
-            isRecordSelected={selectedRecordId === morphItem.recordId}
+            isRecordSelected={
+              singleRecordPickerSelectedId === morphItem.recordId
+            }
          />
        ))
      )}
@@ -49,7 +49,7 @@ export const SingleRecordPickerMenuItemsWithSearch = ({
    SingleRecordPickerComponentInstanceContext,
  );

-  const recordPickerSearchFilter = useAtomComponentStateValue(
+  const singleRecordPickerSearchFilter = useAtomComponentStateValue(
    singleRecordPickerSearchFilterComponentState,
    recordPickerInstanceId,
  );
@@ -75,7 +75,7 @@ export const SingleRecordPickerMenuItemsWithSearch = ({
  );

  const handleCreateNew = () => {
-    onCreate?.(recordPickerSearchFilter);
+    onCreate?.(singleRecordPickerSearchFilter);
  };

  return (
@@ -18,11 +18,11 @@ describe('useSingleRecordPickerRecords', () => {
    const { result } = renderHook(
      () => {
        const recordSelectSearchHook = useSingleRecordPickerSearch(instanceId);
-        const internallyStoredFilter = useAtomComponentStateValue(
+        const singleRecordPickerSearchFilter = useAtomComponentStateValue(
          singleRecordPickerSearchFilterComponentState,
          instanceId,
        );
-        return { recordSelectSearchHook, internallyStoredFilter };
+        return { recordSelectSearchHook, singleRecordPickerSearchFilter };
      },
      {
        wrapper: Wrapper,
@@ -37,6 +37,6 @@ describe('useSingleRecordPickerRecords', () => {
      } as ChangeEvent<HTMLInputElement>);
    });

-    expect(result.current.internallyStoredFilter).toBe(filter);
+    expect(result.current.singleRecordPickerSearchFilter).toBe(filter);
  });
 });
@@ -10,16 +10,18 @@ export const useSingleRecordPickerRecords = ({
  objectNameSingulars: string[];
  excludedRecordIds?: string[];
 }) => {
-  const recordPickerSearchFilter = useAtomComponentStateValue(
+  const singleRecordPickerSearchFilter = useAtomComponentStateValue(
    singleRecordPickerSearchFilterComponentState,
  );

-  const selectedRecordId = useAtomComponentStateValue(
+  const singleRecordPickerSelectedId = useAtomComponentStateValue(
    singleRecordPickerSelectedIdComponentState,
  );
  const { pickableMorphItems, loading } = useSingleRecordPickerPerformSearch({
-    searchFilter: recordPickerSearchFilter,
-    selectedIds: selectedRecordId ? [selectedRecordId] : [],
+    searchFilter: singleRecordPickerSearchFilter,
+    selectedIds: singleRecordPickerSelectedId
+      ? [singleRecordPickerSelectedId]
+      : [],
    excludedRecordIds: excludedRecordIds,
    objectNameSingulars,
  });
@@ -14,18 +14,18 @@ export const useSingleRecordPickerSearch = (
      recordPickerComponentInstanceIdFromProps,
    );

-  const setRecordPickerSearchFilter = useSetAtomComponentState(
+  const setSingleRecordPickerSearchFilter = useSetAtomComponentState(
    singleRecordPickerSearchFilterComponentState,
    recordPickerComponentInstanceId,
  );

-  const setRecordPickerSelectedId = useSetAtomComponentState(
+  const setSingleRecordPickerSelectedId = useSetAtomComponentState(
    singleRecordPickerSelectedIdComponentState,
    recordPickerComponentInstanceId,
  );

  const debouncedSetSearchFilter = useDebouncedCallback(
-    setRecordPickerSearchFilter,
+    setSingleRecordPickerSearchFilter,
    100,
    {
      leading: true,
@@ -34,7 +34,7 @@ export const useSingleRecordPickerSearch = (

  const resetSearchFilter = () => {
    debouncedSetSearchFilter('');
-    setRecordPickerSelectedId(undefined);
+    setSingleRecordPickerSelectedId(undefined);
  };

  const handleSearchFilterChange = (
@@ -12,23 +12,23 @@ const Wrapper = ({ children }: { children: ReactNode }) => (
 );

 describe('useUpsertRecordsInStore', () => {
-  it('should insert a new record when no current record exists', () => {
+  it('should insert a new recordStore when no current recordStore exists', () => {
    const recordId = 'test-record-1';

    const { result } = renderHook(
      () => {
-        const record = useAtomFamilyStateValue(
+        const recordStore = useAtomFamilyStateValue(
          recordStoreFamilyState,
          recordId,
        );
        const { upsertRecordsInStore } = useUpsertRecordsInStore();

-        return { record, upsertRecordsInStore };
+        return { recordStore, upsertRecordsInStore };
      },
      { wrapper: Wrapper },
    );

-    expect(result.current.record).toBeNull();
+    expect(result.current.recordStore).toBeNull();

    act(() => {
      result.current.upsertRecordsInStore({
@@ -43,7 +43,7 @@ describe('useUpsertRecordsInStore', () => {
      });
    });

-    expect(result.current.record).toEqual({
+    expect(result.current.recordStore).toEqual({
      id: recordId,
      __typename: 'Person',
      name: 'John Doe',
@@ -51,18 +51,18 @@ describe('useUpsertRecordsInStore', () => {
    });
  });

-  it('should merge filtered partial record with existing record', () => {
+  it('should merge filtered partial recordStore with existing recordStore', () => {
    const recordId = 'test-record-2';

    const { result } = renderHook(
      () => {
-        const record = useAtomFamilyStateValue(
+        const recordStore = useAtomFamilyStateValue(
          recordStoreFamilyState,
          recordId,
        );
        const { upsertRecordsInStore } = useUpsertRecordsInStore();

-        return { record, upsertRecordsInStore };
+        return { recordStore, upsertRecordsInStore };
      },
      { wrapper: Wrapper },
    );
@@ -80,7 +80,7 @@ describe('useUpsertRecordsInStore', () => {
      });
    });

-    expect(result.current.record).toEqual({
+    expect(result.current.recordStore).toEqual({
      id: recordId,
      __typename: 'Person',
      name: 'John Doe',
@@ -104,7 +104,7 @@ describe('useUpsertRecordsInStore', () => {
      });
    });

-    expect(result.current.record).toEqual({
+    expect(result.current.recordStore).toEqual({
      id: recordId,
      __typename: 'Person',
      name: 'Jane Doe',
@@ -117,13 +117,13 @@ describe('useUpsertRecordsInStore', () => {

    const { result } = renderHook(
      () => {
-        const record = useAtomFamilyStateValue(
+        const recordStore = useAtomFamilyStateValue(
          recordStoreFamilyState,
          recordId,
        );
        const { upsertRecordsInStore } = useUpsertRecordsInStore();

-        return { record, upsertRecordsInStore };
+        return { recordStore, upsertRecordsInStore };
      },
      { wrapper: Wrapper },
    );
@@ -141,7 +141,7 @@ describe('useUpsertRecordsInStore', () => {
      });
    });

-    const recordAfterFirstUpsert = result.current.record;
+    const recordAfterFirstUpsert = result.current.recordStore;

    act(() => {
      result.current.upsertRecordsInStore({
@@ -160,6 +160,6 @@ describe('useUpsertRecordsInStore', () => {
      });
    });

-    expect(result.current.record).toBe(recordAfterFirstUpsert);
+    expect(result.current.recordStore).toBe(recordAfterFirstUpsert);
  });
 });
--- a/Show More
+++ b/Show More