diff --git a/ts/components/session/menu/ConversationListItemContextMenu.tsx b/ts/components/session/menu/ConversationListItemContextMenu.tsx index 941fad8f8..681a4a5cb 100644 --- a/ts/components/session/menu/ConversationListItemContextMenu.tsx +++ b/ts/components/session/menu/ConversationListItemContextMenu.tsx @@ -15,7 +15,7 @@ import { getInviteContactMenuItem, getLeaveGroupMenuItem, getMarkAllReadMenuItem, - MenuItemPinConversation, + getPinConversationMenuItem, } from './Menu'; export type PropsContextConversationItem = { @@ -46,15 +46,11 @@ export const ConversationListItemContextMenu = (props: PropsContextConversationI const isGroup = type === 'group'; const isMessagesSection = useSelector(getFocusedSection) === SectionType.Message; - const pinMenuItem = - isMessagesSection && window.lokiFeatureFlags.enablePinConversations ? ( - - ) : null; return ( <> - {pinMenuItem} + {getPinConversationMenuItem(isMessagesSection, conversationId)} {getBlockMenuItem(isMe, type === ConversationTypeEnum.PRIVATE, isBlocked, conversationId)} {getCopyMenuItem(isPublic, isGroup, conversationId)} {getMarkAllReadMenuItem(conversationId)} diff --git a/ts/components/session/menu/Menu.tsx b/ts/components/session/menu/Menu.tsx index ff03f5c89..d4ed5fc62 100644 --- a/ts/components/session/menu/Menu.tsx +++ b/ts/components/session/menu/Menu.tsx @@ -130,28 +130,32 @@ export interface PinConversationMenuItemProps { conversationId: string; } -export const MenuItemPinConversation = ( - props: PinConversationMenuItemProps +export const getPinConversationMenuItem = ( + isMessagesSection: boolean, + conversationId: string ): JSX.Element | null => { - const { conversationId } = props; - const conversation = getConversationController().get(conversationId); - const isPinned = conversation.isPinned(); - const nbOfAlreadyPinnedConvos = useSelector(getNumberOfPinnedConversations); - - const togglePinConversation = async () => { - if ((!isPinned && nbOfAlreadyPinnedConvos < maxNumberOfPinnedConversations) || isPinned) { - await conversation.setIsPinned(!isPinned); - } else { - ToastUtils.pushToastWarning( - 'pinConversationLimitToast', - window.i18n('pinConversationLimitTitle'), - window.i18n('pinConversationLimitToastDescription', maxNumberOfPinnedConversations) - ); - } - }; + if (isMessagesSection && window.lokiFeatureFlags.enablePinConversations) { + const conversation = getConversationController().get(conversationId); + const isPinned = conversation.isPinned(); + const nbOfAlreadyPinnedConvos = useSelector(getNumberOfPinnedConversations); + + const togglePinConversation = async () => { + if ((!isPinned && nbOfAlreadyPinnedConvos < maxNumberOfPinnedConversations) || isPinned) { + await conversation.setIsPinned(!isPinned); + } else { + ToastUtils.pushToastWarning( + 'pinConversationLimitToast', + window.i18n('pinConversationLimitTitle'), + window.i18n('pinConversationLimitToastDescription', maxNumberOfPinnedConversations) + ); + } + }; - const menuText = isPinned ? window.i18n('unpinConversation') : window.i18n('pinConversation'); - return {menuText}; + const menuText = isPinned ? window.i18n('unpinConversation') : window.i18n('pinConversation'); + return {menuText}; + } else { + return null; + } }; export function getDeleteContactMenuItem(