diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstCell.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstCell.tsx index 1876559b9b..2c4cb6bdfe 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstCell.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstCell.tsx @@ -7,6 +7,7 @@ import { RecordTableHeaderResizeHandler } from '@/object-record/record-table/rec import { RecordTableHeaderCellContainer } from '@/object-record/record-table/record-table-header/components/RecordTableHeaderCellContainer'; import { hasRecordGroupsComponentSelector } from '@/object-record/record-group/states/selectors/hasRecordGroupsComponentSelector'; +import { TABLE_Z_INDEX } from '@/object-record/record-table/constants/TableZIndex'; import { RecordTableHeaderLabelIdentifierCellPlusButton } from '@/object-record/record-table/record-table-header/components/RecordTableHeaderLabelIdentifierCellPlusButton'; import { getVisibleFieldWithLowestPosition } from '@/object-record/record-table/record-table-header/utils/getVisibleFieldWithLowestPosition.util'; import { isRecordTableRowActiveComponentFamilyState } from '@/object-record/record-table/states/isRecordTableRowActiveComponentFamilyState'; @@ -21,13 +22,11 @@ import { cx } from '@linaria/core'; import { useState } from 'react'; import { isDefined } from 'twenty-shared/utils'; -const StyledColumnHeadContainer = styled.div` - cursor: pointer; - display: flex; - flex-direction: row; - justify-content: space-between; - - overflow: hidden; +const StyledPlusButtonWrapper = styled.div` + position: absolute; + top: 0; + right: 0; + z-index: ${TABLE_Z_INDEX.headerColumns.withoutGroups.headerColumnsSticky}; `; export const RecordTableHeaderFirstCell = () => { @@ -85,13 +84,16 @@ export const RecordTableHeaderFirstCell = () => { shouldDisplayBorderBottom={shouldDisplayBorderBottom} isResizing={isResizingAnyColumn} > - - - {iconIsVisible && } - + + {iconIsVisible && ( + + + + )} + );