diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTr.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTr.tsx index 068bca830..77830ac00 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTr.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTr.tsx @@ -7,6 +7,7 @@ import { RecordTableTr } from '@/object-record/record-table/record-table-row/com import { combineRefs } from '~/utils/combineRefs'; type RecordTableDraggableTrProps = { + className?: string; draggableId: DraggableId; draggableIndex: number; isDragDisabled?: boolean; @@ -17,47 +18,60 @@ type RecordTableDraggableTrProps = { export const RecordTableDraggableTr = forwardRef< HTMLTableRowElement, RecordTableDraggableTrProps ->(({ draggableId, draggableIndex, isDragDisabled, onClick, children }, ref) => { - const theme = useTheme(); +>( + ( + { + className, + draggableId, + draggableIndex, + isDragDisabled, + onClick, + children, + }, + ref, + ) => { + const theme = useTheme(); - return ( - - {(draggableProvided, draggableSnapshot) => ( - ( - ref, - draggableProvided.innerRef, - )} - // eslint-disable-next-line react/jsx-props-no-spreading - {...draggableProvided.draggableProps} - style={{ - ...draggableProvided.draggableProps.style, - background: draggableSnapshot.isDragging - ? theme.background.transparent.light - : 'none', - borderColor: draggableSnapshot.isDragging - ? `${theme.border.color.medium}` - : 'transparent', - }} - isDragging={draggableSnapshot.isDragging} - data-testid={`row-id-${draggableId}`} - data-selectable-id={draggableId} - onClick={onClick} - > - + {(draggableProvided, draggableSnapshot) => ( + ( + ref, + draggableProvided.innerRef, + )} + className={className} + // eslint-disable-next-line react/jsx-props-no-spreading + {...draggableProvided.draggableProps} + style={{ + ...draggableProvided.draggableProps.style, + background: draggableSnapshot.isDragging + ? theme.background.transparent.light + : 'none', + borderColor: draggableSnapshot.isDragging + ? `${theme.border.color.medium}` + : 'transparent', }} + isDragging={draggableSnapshot.isDragging} + data-testid={`row-id-${draggableId}`} + data-selectable-id={draggableId} + onClick={onClick} > - {children} - - - )} - - ); -}); + + {children} + + + )} + + ); + }, +);