fix: bring back notification submenu to both context menu

ts/components/menu/ConversationHeaderMenu.tsx

@@ -1,14 +1,8 @@
 import React from 'react';
 import { animation, Item, Menu, Submenu } from 'react-contexify';
 import { useSelector } from 'react-redux';
-import {
+import { setDisappearingMessagesByConvoId } from '../../interactions/conversationInteractions';
-  setDisappearingMessagesByConvoId,
+import { isSearching } from '../../state/selectors/search';
-  setNotificationForConvoId,
-} from '../../interactions/conversationInteractions';
-import {
-  ConversationNotificationSetting,
-  ConversationNotificationSettingType,
-} from '../../models/conversationAttributes';
 import {
   useSelectedConversationKey,
   useSelectedIsActive,
@@ -18,10 +12,9 @@ import {
   useSelectedIsPrivate,
   useSelectedIsPrivateFriend,
   useSelectedIsPublic,
-  useSelectedNotificationSetting,
 } from '../../state/selectors/selectedConversation';
 import { getTimerOptions } from '../../state/selectors/timerOptions';
-import { LocalizerKeys } from '../../types/LocalizerKeys';
+import { ContextConversationProvider } from '../leftpane/conversation-list-item/ConvoIdContext';
 import { SessionContextMenuContainer } from '../SessionContextMenuContainer';
 import {
   AddModeratorsMenuItem,
@@ -29,21 +22,20 @@ import {
   BlockMenuItem,
   ChangeNicknameMenuItem,
   ClearNicknameMenuItem,
-  DeletePrivateContactMenuItem,
+  CopyMenuItem,
   DeleteGroupOrCommunityMenuItem,
   DeleteMessagesMenuItem,
+  DeletePrivateContactMenuItem,
+  DeletePrivateConversationMenuItem,
   InviteContactMenuItem,
   LeaveGroupMenuItem,
   MarkAllReadMenuItem,
+  NotificationForConvoMenuItem,
   RemoveModeratorsMenuItem,
   ShowUserDetailsMenuItem,
   UnbanMenuItem,
   UpdateGroupNameMenuItem,
-  DeletePrivateConversationMenuItem,
-  CopyMenuItem,
 } from './Menu';
-import { ContextConversationProvider } from '../leftpane/conversation-list-item/ConvoIdContext';
-import { isSearching } from '../../state/selectors/search';
 
 export type PropsConversationHeaderMenu = {
   triggerId: string;
@@ -145,71 +137,3 @@ const DisappearingMessageMenuItem = (): JSX.Element | null => {
     </Submenu>
   );
 };
-
-/**
- * Only accessible through the triple dots menu on the conversation header. Not on the Conversation list item, because there is too much to check for before showing it
- */
-const NotificationForConvoMenuItem = (): JSX.Element | null => {
-  const selectedConvoId = useSelectedConversationKey();
-
-  const currentNotificationSetting = useSelectedNotificationSetting();
-  const isBlocked = useSelectedIsBlocked();
-  const isActive = useSelectedIsActive();
-  const isLeft = useSelectedIsLeft();
-  const isKickedFromGroup = useSelectedIsKickedFromGroup();
-  const isFriend = useSelectedIsPrivateFriend();
-  const isPrivate = useSelectedIsPrivate();
-
-  if (
-    !selectedConvoId ||
-    isLeft ||
-    isKickedFromGroup ||
-    isBlocked ||
-    !isActive ||
-    (isPrivate && !isFriend)
-  ) {
-    return null;
-  }
-
-  // const isRtlMode = isRtlBody();'
-
-  // exclude mentions_only settings for private chats as this does not make much sense
-  const notificationForConvoOptions = ConversationNotificationSetting.filter(n =>
-    isPrivate ? n !== 'mentions_only' : true
-  ).map((n: ConversationNotificationSettingType) => {
-    // do this separately so typescript's compiler likes it
-    const keyToUse: LocalizerKeys =
-      n === 'all' || !n
-        ? 'notificationForConvo_all'
-        : n === 'disabled'
-        ? 'notificationForConvo_disabled'
-        : 'notificationForConvo_mentions_only';
-    return { value: n, name: window.i18n(keyToUse) };
-  });
-
-  return (
-    // Remove the && false to make context menu work with RTL support
-    <Submenu
-      label={window.i18n('notificationForConvo') as any}
-      // rtl={isRtlMode && false}
-    >
-      {(notificationForConvoOptions || []).map(item => {
-        const disabled = item.value === currentNotificationSetting;
-
-        return (
-          <Item
-            key={item.value}
-            onClick={async () => {
-              await setNotificationForConvoId(selectedConvoId, item.value);
-            }}
-            disabled={disabled}
-          >
-            {item.name}
-          </Item>
-        );
-      })}
-    </Submenu>
-  );
-
-  return null;
-};

ts/components/menu/ConversationListItemContextMenu.tsx

@@ -27,6 +27,7 @@ import {
   ShowUserDetailsMenuItem,
   UnbanMenuItem,
   DeletePrivateConversationMenuItem,
+  NotificationForConvoMenuItem,
 } from './Menu';
 import { isSearching } from '../../state/selectors/search';
 
@@ -51,6 +52,8 @@ const ConversationListItemContextMenu = (props: PropsContextConversationItem) =>
         <DeclineAndBlockMsgRequestMenuItem />
         {/* Generic actions */}
         <PinConversationMenuItem />
+        <NotificationForConvoMenuItem />
+
         <BlockMenuItem />
         <CopyMenuItem />
         {/* Read state actions */}

ts/components/menu/Menu.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { Item } from 'react-contexify';
+import { Item, Submenu } from 'react-contexify';
 import { useDispatch, useSelector } from 'react-redux';
 import {
   useAvatarPath,
@@ -25,6 +25,7 @@ import {
   declineConversationWithConfirm,
   deleteAllMessagesByConvoIdWithConfirmation,
   markAllReadByConvoId,
+  setNotificationForConvoId,
   showAddModeratorsByConvoId,
   showBanUserByConvoId,
   showInviteContactByConvoId,
@@ -42,9 +43,23 @@ import {
   updateUserDetailsModal,
 } from '../../state/ducks/modalDialog';
 import { getIsMessageSection } from '../../state/selectors/section';
-import { useSelectedConversationKey } from '../../state/selectors/selectedConversation';
+import {
+  useSelectedConversationKey,
+  useSelectedIsActive,
+  useSelectedIsBlocked,
+  useSelectedIsKickedFromGroup,
+  useSelectedIsLeft,
+  useSelectedIsPrivate,
+  useSelectedIsPrivateFriend,
+  useSelectedNotificationSetting,
+} from '../../state/selectors/selectedConversation';
 import { SessionButtonColor } from '../basic/SessionButton';
 import { useConvoIdFromContext } from '../leftpane/conversation-list-item/ConvoIdContext';
+import {
+  ConversationNotificationSetting,
+  ConversationNotificationSettingType,
+} from '../../models/conversationAttributes';
+import { LocalizerKeys } from '../../types/LocalizerKeys';
 
 /** Menu items standardized */
 
@@ -539,3 +554,68 @@ export const DeclineAndBlockMsgRequestMenuItem = () => {
   }
   return null;
 };
+
+export const NotificationForConvoMenuItem = (): JSX.Element | null => {
+  const selectedConvoId = useSelectedConversationKey();
+
+  const currentNotificationSetting = useSelectedNotificationSetting();
+  const isBlocked = useSelectedIsBlocked();
+  const isActive = useSelectedIsActive();
+  const isLeft = useSelectedIsLeft();
+  const isKickedFromGroup = useSelectedIsKickedFromGroup();
+  const isFriend = useSelectedIsPrivateFriend();
+  const isPrivate = useSelectedIsPrivate();
+
+  if (
+    !selectedConvoId ||
+    isLeft ||
+    isKickedFromGroup ||
+    isBlocked ||
+    !isActive ||
+    (isPrivate && !isFriend)
+  ) {
+    return null;
+  }
+
+  // const isRtlMode = isRtlBody();'
+
+  // exclude mentions_only settings for private chats as this does not make much sense
+  const notificationForConvoOptions = ConversationNotificationSetting.filter(n =>
+    isPrivate ? n !== 'mentions_only' : true
+  ).map((n: ConversationNotificationSettingType) => {
+    // do this separately so typescript's compiler likes it
+    const keyToUse: LocalizerKeys =
+      n === 'all' || !n
+        ? 'notificationForConvo_all'
+        : n === 'disabled'
+        ? 'notificationForConvo_disabled'
+        : 'notificationForConvo_mentions_only';
+    return { value: n, name: window.i18n(keyToUse) };
+  });
+
+  return (
+    // Remove the && false to make context menu work with RTL support
+    <Submenu
+      label={window.i18n('notificationForConvo') as any}
+      // rtl={isRtlMode && false}
+    >
+      {(notificationForConvoOptions || []).map(item => {
+        const disabled = item.value === currentNotificationSetting;
+
+        return (
+          <Item
+            key={item.value}
+            onClick={async () => {
+              await setNotificationForConvoId(selectedConvoId, item.value);
+            }}
+            disabled={disabled}
+          >
+            {item.name}
+          </Item>
+        );
+      })}
+    </Submenu>
+  );
+
+  return null;
+};