Changeset View
Changeset View
Standalone View
Standalone View
web/utils/tooltip-utils.js
Show First 20 Lines • Show All 446 Lines • ▼ Show 20 Lines | |||||
} | } | ||||
function useMessageReactAction( | function useMessageReactAction( | ||||
item: ChatMessageInfoItem, | item: ChatMessageInfoItem, | ||||
threadInfo: ThreadInfo, | threadInfo: ThreadInfo, | ||||
): ?MessageTooltipAction { | ): ?MessageTooltipAction { | ||||
const { messageInfo } = item; | const { messageInfo } = item; | ||||
const { setRenderEmojiKeyboard } = useTooltipContext(); | const { setShouldRenderEmojiKeyboard } = useTooltipContext(); | ||||
const canCreateReactionFromMessage = useCanCreateReactionFromMessage( | const canCreateReactionFromMessage = useCanCreateReactionFromMessage( | ||||
threadInfo, | threadInfo, | ||||
messageInfo, | messageInfo, | ||||
); | ); | ||||
return React.useMemo(() => { | return React.useMemo(() => { | ||||
if (!canCreateReactionFromMessage) { | if (!canCreateReactionFromMessage) { | ||||
return null; | return null; | ||||
} | } | ||||
const buttonContent = <CommIcon icon="emote-smile-filled" size={18} />; | const buttonContent = <CommIcon icon="emote-smile-filled" size={18} />; | ||||
const onClickReact = () => { | const onClickReact = () => { | ||||
if (!setRenderEmojiKeyboard) { | if (!setShouldRenderEmojiKeyboard) { | ||||
return; | return; | ||||
} | } | ||||
setRenderEmojiKeyboard(true); | setShouldRenderEmojiKeyboard(true); | ||||
}; | }; | ||||
return { | return { | ||||
actionButtonContent: buttonContent, | actionButtonContent: buttonContent, | ||||
onClick: onClickReact, | onClick: onClickReact, | ||||
label: 'React', | label: 'React', | ||||
}; | }; | ||||
}, [canCreateReactionFromMessage, setRenderEmojiKeyboard]); | }, [canCreateReactionFromMessage, setShouldRenderEmojiKeyboard]); | ||||
} | } | ||||
function useMessageTooltipActions( | function useMessageTooltipActions( | ||||
item: ChatMessageInfoItem, | item: ChatMessageInfoItem, | ||||
threadInfo: ThreadInfo, | threadInfo: ThreadInfo, | ||||
): $ReadOnlyArray<MessageTooltipAction> { | ): $ReadOnlyArray<MessageTooltipAction> { | ||||
const sidebarAction = useMessageTooltipSidebarAction(item, threadInfo); | const sidebarAction = useMessageTooltipSidebarAction(item, threadInfo); | ||||
const replyAction = useMessageTooltipReplyAction(item, threadInfo); | const replyAction = useMessageTooltipReplyAction(item, threadInfo); | ||||
▲ Show 20 Lines • Show All 53 Lines • ▼ Show 20 Lines | function createTooltip(params: CreateTooltipParams) { | ||||
} | } | ||||
const tooltipPositionStyle = getMessageActionTooltipStyle({ | const tooltipPositionStyle = getMessageActionTooltipStyle({ | ||||
tooltipPosition, | tooltipPosition, | ||||
sourcePositionInfo: tooltipMessagePosition, | sourcePositionInfo: tooltipMessagePosition, | ||||
tooltipSize, | tooltipSize, | ||||
}); | }); | ||||
const { alignment } = tooltipPositionStyle; | |||||
const tooltip = ( | const tooltip = ( | ||||
<MessageTooltip | <MessageTooltip | ||||
actions={tooltipActions} | actions={tooltipActions} | ||||
messageTimestamp={messageTimestamp} | messageTimestamp={messageTimestamp} | ||||
alignment={alignment} | tooltipPositionStyle={tooltipPositionStyle} | ||||
tooltipSize={tooltipSize} | |||||
item={item} | item={item} | ||||
threadInfo={threadInfo} | threadInfo={threadInfo} | ||||
/> | /> | ||||
); | ); | ||||
return { tooltip, tooltipPositionStyle }; | return { tooltip, tooltipPositionStyle }; | ||||
} | } | ||||
function useMessageTooltip({ | function useMessageTooltip({ | ||||
▲ Show 20 Lines • Show All 128 Lines • Show Last 20 Lines |