diff --git a/web/chat/chat-message-list.css b/web/chat/chat-message-list.css --- a/web/chat/chat-message-list.css +++ b/web/chat/chat-message-list.css @@ -52,7 +52,7 @@ padding-top: 6px; } -div.messageActionActiveArea { +div.messageTooltipActiveArea { position: absolute; display: flex; top: 0; @@ -61,17 +61,17 @@ padding: 0 12px; } -div.viewerMessageActionActiveArea { +div.viewerMessageTooltipActiveArea { right: 100%; } div.nonViewerMessageActiveArea { left: 100%; } -div.messageActionActiveArea > div + div { +div.messageTooltipActiveArea > div + div { margin-left: 4px; } -div.messageActionLinkIcon:hover { +div.messageTooltipLinkIcon:hover { cursor: pointer; } diff --git a/web/chat/composed-message.react.js b/web/chat/composed-message.react.js --- a/web/chat/composed-message.react.js +++ b/web/chat/composed-message.react.js @@ -18,7 +18,7 @@ import css from './chat-message-list.css'; import FailedSend from './failed-send.react'; import { InlineSidebar } from './inline-sidebar.react'; -import MessageActionButtons from './message-action-buttons'; +import MessageTooltip from './message-tooltip.react'; import { type OnMessagePositionWithContainerInfo, type MessagePositionInfo, @@ -118,7 +118,7 @@ ); } - let messageActionButtons; + let messageTooltip; if ( this.props.mouseOverMessagePosition && this.props.mouseOverMessagePosition.item.messageInfo.id === id && @@ -128,8 +128,8 @@ ? availableTooltipPositionsForViewerMessage : availableTooltipPositionsForNonViewerMessage; - messageActionButtons = ( - {messageActionButtons} + messageTooltipLinks = ( +
{messageTooltip}
); } - const viewerActionLinks = isViewer ? messageActionLinks : null; - const nonViewerActionLinks = !isViewer ? messageActionLinks : null; + const viewerTooltipLinks = isViewer ? messageTooltipLinks : null; + const nonViewerTooltipLinks = !isViewer ? messageTooltipLinks : null; let inlineSidebar = null; if (item.threadCreatedFromMessage) { @@ -179,11 +179,11 @@ onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave} > - {viewerActionLinks} + {viewerTooltipLinks}
{this.props.children}
- {nonViewerActionLinks} + {nonViewerTooltipLinks} {deliveryIcon} diff --git a/web/chat/message-action-buttons.css b/web/chat/message-tooltip.css rename from web/chat/message-action-buttons.css rename to web/chat/message-tooltip.css diff --git a/web/chat/message-action-buttons.js b/web/chat/message-tooltip.react.js rename from web/chat/message-action-buttons.js rename to web/chat/message-tooltip.react.js --- a/web/chat/message-action-buttons.js +++ b/web/chat/message-tooltip.react.js @@ -16,8 +16,8 @@ useOnClickPendingSidebar, } from '../selectors/nav-selectors'; import SWMansionIcon from '../SWMansionIcon.react'; -import css from './message-action-buttons.css'; import MessageReplyButton from './message-reply-button.react'; +import css from './message-tooltip.css'; import type { ItemAndContainerPositionInfo, MessagePositionInfo, @@ -38,7 +38,7 @@ type TooltipType = 'sidebar' | 'reply'; -type MessageActionButtonsProps = { +type MessageTooltipProps = { +threadInfo: ThreadInfo, +item: ChatMessageInfoItem, +availableTooltipPositions: $ReadOnlyArray, @@ -49,7 +49,7 @@ +canReply?: boolean, +inputState?: ?InputState, }; -function MessageActionButtons(props: MessageActionButtonsProps): React.Node { +function MessageTooltip(props: MessageTooltipProps): React.Node { const { threadInfo, item, @@ -272,4 +272,4 @@ return { className }; } -export default MessageActionButtons; +export default MessageTooltip; diff --git a/web/chat/robotext-message.css b/web/chat/robotext-message.css --- a/web/chat/robotext-message.css +++ b/web/chat/robotext-message.css @@ -15,7 +15,7 @@ margin-top: 4px; margin-bottom: -8px; } -div.messageActionLinks { +div.messageTooltipLinks { position: absolute; display: flex; top: 0; @@ -24,12 +24,12 @@ color: gray; padding: 0 6px; } -div.viewerMessageActionLinks { +div.viewerMessageTooltipLinks { right: 100%; } -div.nonViewerMessageActionLinks { +div.nonViewerMessageTooltipLinks { left: 100%; } -div.messageActionLinks > div + div { +div.messageTooltipLinks > div + div { margin-left: 4px; } diff --git a/web/chat/robotext-message.react.js b/web/chat/robotext-message.react.js --- a/web/chat/robotext-message.react.js +++ b/web/chat/robotext-message.react.js @@ -16,7 +16,7 @@ import { useSelector } from '../redux/redux-utils'; import { updateNavInfoActionType } from '../types/nav-types'; import { InlineSidebar } from './inline-sidebar.react'; -import MessageActionButtons from './message-action-buttons'; +import MessageTooltip from './message-tooltip.react'; import type { MessagePositionInfo, OnMessagePositionWithContainerInfo, @@ -59,14 +59,14 @@ const { item, threadInfo, sidebarExistsOrCanBeCreated } = this.props; const { id } = item.messageInfo; - let messageActionTooltip; + let messageTooltip; if ( this.props.mouseOverMessagePosition && this.props.mouseOverMessagePosition.item.messageInfo.id === id && sidebarExistsOrCanBeCreated ) { - messageActionTooltip = ( - - {messageActionTooltip} + {messageTooltip} ); } @@ -97,7 +97,7 @@ onMouseLeave={this.onMouseLeave} > {this.linkedRobotext()} - {messageActionLinks} + {messageTooltipLinks} {inlineSidebar}