diff --git a/web/chat/message-action-buttons.js b/web/chat/message-action-buttons.js --- a/web/chat/message-action-buttons.js +++ b/web/chat/message-action-buttons.js @@ -20,6 +20,7 @@ ItemAndContainerPositionInfo, MessagePositionInfo, OnMessagePositionWithContainerInfo, + PositionInfo, } from './position-types'; import { tooltipPositions, type TooltipPosition } from './tooltip-utils'; import { @@ -67,25 +68,10 @@ return; } const rect = event.currentTarget.getBoundingClientRect(); - const { top, bottom, left, right, width, height } = rect; - - const iconPosition: ItemAndContainerPositionInfo = { + const iconPosition: ItemAndContainerPositionInfo = getIconPosition( + rect, containerPosition, - itemPosition: { - top: - top - - containerPosition.top + - messageActionIconExcessVerticalWhitespace, - bottom: - bottom - - containerPosition.top - - messageActionIconExcessVerticalWhitespace, - left: left - containerPosition.left, - right: right - containerPosition.left, - width, - height: height - messageActionIconExcessVerticalWhitespace * 2, - }, - }; + ); setPointingTo(iconPosition); }, [containerPosition, tooltipVisible], @@ -189,6 +175,28 @@ ); } +function getIconPosition( + rect: ClientRect, + containerPosition: PositionInfo, +): ItemAndContainerPositionInfo { + const { top, bottom, left, right, width, height } = rect; + return { + containerPosition, + itemPosition: { + top: + top - containerPosition.top + messageActionIconExcessVerticalWhitespace, + bottom: + bottom - + containerPosition.top - + messageActionIconExcessVerticalWhitespace, + left: left - containerPosition.left, + right: right - containerPosition.left, + width, + height: height - messageActionIconExcessVerticalWhitespace * 2, + }, + }; +} + function getMessageActionTooltipStyle( tooltipPosition: TooltipPosition, ): TooltipStyle {