diff --git a/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventParticipantsResponseStatusField.tsx b/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventParticipantsResponseStatusField.tsx index 30918e5b0318..14ccd69a2094 100644 --- a/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventParticipantsResponseStatusField.tsx +++ b/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventParticipantsResponseStatusField.tsx @@ -104,12 +104,7 @@ export const CalendarEventParticipantsResponseStatusField = ({ {isRightDrawerAnimationCompleted && ( - - {styledChips} - + {styledChips} )} diff --git a/packages/twenty-front/src/modules/activities/components/ActivityTargetChips.tsx b/packages/twenty-front/src/modules/activities/components/ActivityTargetChips.tsx index 1123a6d1f56c..ab30c2de8b0f 100644 --- a/packages/twenty-front/src/modules/activities/components/ActivityTargetChips.tsx +++ b/packages/twenty-front/src/modules/activities/components/ActivityTargetChips.tsx @@ -6,7 +6,6 @@ import { ExpandableList } from '@/ui/layout/expandable-list/components/Expandabl type ActivityTargetChipsProps = { activityTargetObjectRecords: ActivityTargetWithTargetRecord[]; - anchorElement?: HTMLElement; maxWidth?: number; }; @@ -19,12 +18,11 @@ const StyledContainer = styled.div<{ maxWidth?: number }>` export const ActivityTargetChips = ({ activityTargetObjectRecords, - anchorElement, maxWidth, }: ActivityTargetChipsProps) => { return ( - + {activityTargetObjectRecords.map( (activityTargetObjectRecord, index) => ( } label="Relations" - displayModeContent={({ cellElement }) => ( + displayModeContent={() => ( diff --git a/packages/twenty-front/src/modules/object-record/record-field/components/FieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-field/components/FieldDisplay.tsx index e41354d9e32a..4e2b6d71ab73 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/components/FieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/components/FieldDisplay.tsx @@ -80,7 +80,6 @@ export const FieldDisplay = ({ ) : isFieldLinks(fieldDefinition) ? ( ) : isFieldCurrency(fieldDefinition) ? ( diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/LinksFieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/LinksFieldDisplay.tsx index 034209dd243b..2d93d91a8800 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/LinksFieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/LinksFieldDisplay.tsx @@ -3,13 +3,11 @@ import { LinksDisplay } from '@/ui/field/display/components/LinksDisplay'; type LinksFieldDisplayProps = { isCellSoftFocused?: boolean; - cellElement?: HTMLElement; fromTableCell?: boolean; }; export const LinksFieldDisplay = ({ isCellSoftFocused, - cellElement, fromTableCell, }: LinksFieldDisplayProps) => { const { fieldValue } = useLinksField(); @@ -17,7 +15,6 @@ export const LinksFieldDisplay = ({ return ( diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/MultiSelectFieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/MultiSelectFieldDisplay.tsx index 5dc2be72ad0b..b61557e9e3b8 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/MultiSelectFieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/MultiSelectFieldDisplay.tsx @@ -11,7 +11,6 @@ type MultiSelectFieldDisplayProps = { export const MultiSelectFieldDisplay = ({ isCellSoftFocused, - cellElement, fromTableCell, }: MultiSelectFieldDisplayProps) => { const { fieldValues, fieldDefinition } = useMultiSelectField(); @@ -26,7 +25,6 @@ export const MultiSelectFieldDisplay = ({ return ( diff --git a/packages/twenty-front/src/modules/ui/field/display/components/LinksDisplay.tsx b/packages/twenty-front/src/modules/ui/field/display/components/LinksDisplay.tsx index 4ee52c7b0439..01fb5353a5f2 100644 --- a/packages/twenty-front/src/modules/ui/field/display/components/LinksDisplay.tsx +++ b/packages/twenty-front/src/modules/ui/field/display/components/LinksDisplay.tsx @@ -17,13 +17,12 @@ import { getUrlHostName } from '~/utils/url/getUrlHostName'; type LinksDisplayProps = Pick< ExpandableListProps, - 'anchorElement' | 'isChipCountDisplayed' | 'withExpandedListBorder' + 'isChipCountDisplayed' | 'withExpandedListBorder' > & { value?: FieldLinksValue; }; export const LinksDisplay = ({ - anchorElement, isChipCountDisplayed, withExpandedListBorder, value, @@ -55,7 +54,6 @@ export const LinksDisplay = ({ return ( diff --git a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandableList.tsx b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandableList.tsx index fbea95c8dcf9..6e7acc7b3ead 100644 --- a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandableList.tsx +++ b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandableList.tsx @@ -41,7 +41,6 @@ const StyledChipCount = styled(Chip)` `; export type ExpandableListProps = { - anchorElement?: HTMLElement; isChipCountDisplayed?: boolean; withExpandedListBorder?: boolean; }; @@ -53,7 +52,6 @@ export type ChildrenProperty = { export const ExpandableList = ({ children, - anchorElement, isChipCountDisplayed: isChipCountDisplayedFromProps, withExpandedListBorder = false, }: { @@ -75,10 +73,10 @@ export const ExpandableList = ({ // @see https://floating-ui.com/docs/useFloating#elements const [childrenContainerElement, setChildrenContainerElement] = useState(null); + const [previousChildrenContainerWidth, setPreviousChildrenContainerWidth] = useState(childrenContainerElement?.clientWidth ?? 0); - // Used with useListenClickOutside. const containerRef = useRef(null); const [firstHiddenChildIndex, setFirstHiddenChildIndex] = useState( @@ -165,7 +163,7 @@ export const ExpandableList = ({ )} {isListExpanded && ( { resetFirstHiddenChildIndex(); setIsListExpanded(false); diff --git a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandedListDropdown.tsx b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandedListDropdown.tsx index d5b93758ec0c..76213eaf7ca1 100644 --- a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandedListDropdown.tsx +++ b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/ExpandedListDropdown.tsx @@ -42,7 +42,7 @@ export const ExpandedListDropdown = ({ const { refs, floatingStyles } = useFloating({ // @ts-expect-error placement accepts 'start' as value even if the typing does not permit it placement: 'start', - middleware: [offset({ mainAxis: -1, crossAxis: -1 })], + middleware: [offset({ mainAxis: -9, crossAxis: -7 })], elements: { reference: anchorElement }, }); diff --git a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx index 4ccb01805004..fbbd5d593e90 100644 --- a/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx +++ b/packages/twenty-front/src/modules/ui/layout/expandable-list/components/__stories__/ExpandableList.stories.tsx @@ -35,7 +35,6 @@ const meta: Meta = { }, argTypes: { children: { control: false }, - anchorElement: { control: false }, }, };