diff --git a/web/utils/tooltip-action-utils.js b/web/utils/tooltip-action-utils.js --- a/web/utils/tooltip-action-utils.js +++ b/web/utils/tooltip-action-utils.js @@ -48,7 +48,6 @@ +createTooltip: (tooltipPositionStyle: TooltipPositionStyle) => React.Node, +tooltipSize: TooltipSize, +availablePositions: $ReadOnlyArray, - +preventDisplayingBelowSource?: boolean, }; type UseTooltipResult = { +onMouseEnter: (event: SyntheticEvent) => mixed, @@ -59,7 +58,6 @@ createTooltip, tooltipSize, availablePositions, - preventDisplayingBelowSource, }: UseTooltipArgs): UseTooltipResult { const [onMouseLeave, setOnMouseLeave] = React.useState mixed>(null); const [tooltipSourcePosition, setTooltipSourcePosition] = React.useState(); @@ -81,7 +79,6 @@ tooltipSourcePosition: sourcePosition, tooltipSize, availablePositions, - preventDisplayingBelowSource, }); if (!tooltipPositionStyle) { return; @@ -99,13 +96,7 @@ updateTooltip.current = renderTooltipResult.updateTooltip; } }, - [ - availablePositions, - createTooltip, - preventDisplayingBelowSource, - renderTooltip, - tooltipSize, - ], + [availablePositions, createTooltip, renderTooltip, tooltipSize], ); React.useEffect(() => { @@ -117,7 +108,6 @@ tooltipSourcePosition, tooltipSize, availablePositions, - preventDisplayingBelowSource, }); if (!tooltipPositionStyle) { return; @@ -125,13 +115,7 @@ const tooltip = createTooltip(tooltipPositionStyle); updateTooltip.current?.(tooltip); - }, [ - availablePositions, - createTooltip, - preventDisplayingBelowSource, - tooltipSize, - tooltipSourcePosition, - ]); + }, [availablePositions, createTooltip, tooltipSize, tooltipSourcePosition]); return { onMouseEnter, @@ -411,8 +395,6 @@ }: UseMessageTooltipArgs): UseTooltipResult { const tooltipActions = useMessageTooltipActions(item, threadInfo); - const containsInlineEngagement = !!item.threadCreatedFromMessage; - const messageTimestamp = React.useMemo(() => { const time = item.messageInfo.time; return longAbsoluteDate(time); @@ -447,7 +429,6 @@ createTooltip: createMessageTooltip, tooltipSize, availablePositions, - preventDisplayingBelowSource: containsInlineEngagement, }); return { diff --git a/web/utils/tooltip-utils.js b/web/utils/tooltip-utils.js --- a/web/utils/tooltip-utils.js +++ b/web/utils/tooltip-utils.js @@ -75,7 +75,6 @@ +tooltipSize: TooltipSize, +availablePositions: $ReadOnlyArray, +defaultPosition: TooltipPosition, - +preventDisplayingBelowSource?: boolean, }; function findTooltipPosition({ @@ -83,7 +82,6 @@ tooltipSize, availablePositions, defaultPosition, - preventDisplayingBelowSource, }: FindTooltipPositionArgs): TooltipPosition { const appContainerPositionInfo = getAppContainerPositionInfo(); @@ -106,14 +104,9 @@ const canBeDisplayedOnRight = tooltipWidth + pointingTo.right <= containerRight; - const willCoverSidebarOnTopSideways = - preventDisplayingBelowSource && - pointingTo.top + tooltipHeight > pointingTo.bottom; - const canBeDisplayedOnTopSideways = pointingTo.top >= containerTop && - pointingTo.top + tooltipHeight <= containerBottom && - !willCoverSidebarOnTopSideways; + pointingTo.top + tooltipHeight <= containerBottom; const canBeDisplayedOnBottomSideways = pointingTo.bottom <= containerBottom && @@ -122,14 +115,9 @@ const verticalCenterOfPointingTo = pointingTo.top + pointingTo.height / 2; const horizontalCenterOfPointingTo = pointingTo.left + pointingTo.width / 2; - const willCoverSidebarInTheMiddleSideways = - preventDisplayingBelowSource && - verticalCenterOfPointingTo + tooltipHeight / 2 > pointingTo.bottom; - const canBeDisplayedInTheMiddleSideways = verticalCenterOfPointingTo - tooltipHeight / 2 >= containerTop && - verticalCenterOfPointingTo + tooltipHeight / 2 <= containerBottom && - !willCoverSidebarInTheMiddleSideways; + verticalCenterOfPointingTo + tooltipHeight / 2 <= containerBottom; const canBeDisplayedOnTop = pointingTo.top - tooltipHeight >= containerTop && @@ -139,8 +127,7 @@ const canBeDisplayedOnBottom = pointingTo.bottom + tooltipHeight <= containerBottom && horizontalCenterOfPointingTo - tooltipWidth / 2 >= containerLeft && - horizontalCenterOfPointingTo + tooltipWidth / 2 <= containerRight && - !preventDisplayingBelowSource; + horizontalCenterOfPointingTo + tooltipWidth / 2 <= containerRight; for (const tooltipPosition of availablePositions) { if ( @@ -317,18 +304,12 @@ +tooltipSourcePosition: ?PositionInfo, +tooltipSize: TooltipSize, +availablePositions: $ReadOnlyArray, - +preventDisplayingBelowSource?: boolean, }; function getTooltipPositionStyle( params: GetTooltipPositionStyleParams, ): ?TooltipPositionStyle { - const { - tooltipSourcePosition, - tooltipSize, - availablePositions, - preventDisplayingBelowSource, - } = params; + const { tooltipSourcePosition, tooltipSize, availablePositions } = params; if (!tooltipSourcePosition) { return undefined; } @@ -337,7 +318,6 @@ tooltipSize, availablePositions, defaultPosition: availablePositions[0], - preventDisplayingBelowSource, }); if (!tooltipPosition) { return undefined; diff --git a/web/utils/tooltip-utils.test.js b/web/utils/tooltip-utils.test.js --- a/web/utils/tooltip-utils.test.js +++ b/web/utils/tooltip-utils.test.js @@ -139,44 +139,6 @@ ).toMatch(tooltipPositions.LEFT_TOP), ); - it( - 'should return bottom position on left ' + - 'to prevent covering element below source', - () => - expect( - findTooltipPosition({ - sourcePositionInfo: tooltipSourcePositionCenter, - tooltipSize: tooltipSizeBig, - availablePositions: onlyLeftTooltipPositions, - defaultPosition: onlyLeftTooltipPositions[0], - preventDisplayingBelowSource: true, - }), - ).toMatch(tooltipPositions.LEFT_BOTTOM), - ); - - it( - 'should return first position ' + - 'that does not cover element below source ', - () => - expect( - findTooltipPosition({ - sourcePositionInfo: tooltipSourcePositionCenter, - tooltipSize: tooltipSizeBig, - availablePositions: [ - tooltipPositions.BOTTOM, - tooltipPositions.RIGHT, - tooltipPositions.RIGHT_TOP, - tooltipPositions.LEFT, - tooltipPositions.LEFT_TOP, - tooltipPositions.TOP, - tooltipPositions.LEFT_BOTTOM, - ], - defaultPosition: tooltipPositions.BOTTOM, - preventDisplayingBelowSource: true, - }), - ).toMatch(tooltipPositions.TOP), - ); - it( 'should return default position ' + 'if an empty array of available is provided', @@ -191,14 +153,13 @@ ).toMatch(tooltipPositions.LEFT_BOTTOM), ); - it('should return default position if an no position is available', () => + it('should return default position if no position is available', () => expect( findTooltipPosition({ - sourcePositionInfo: tooltipSourcePositionTopRight, + sourcePositionInfo: tooltipSourcePositionBottomLeft, tooltipSize: tooltipSizeBig, availablePositions: allTooltipPositions, defaultPosition: tooltipPositions.BOTTOM, - preventDisplayingBelowSource: true, }), ).toMatch(tooltipPositions.BOTTOM)); });