Merge pull request #2199 from Bilb/prioritize-convo-details-over-message-details

Prioritize convo details over message details

stylesheets/_session_conversation.scss

@@ -36,7 +36,7 @@
   transform: translateX(100%);
   will-change: transform;
   width: 25vw;
-  z-index: 1;
+  z-index: 5;
 
   &.show {
     transform: none;

ts/components/leftpane/LeftPaneSettingSection.tsx

@@ -3,62 +3,78 @@ import classNames from 'classnames';
 
 import { LeftPaneSectionHeader } from './LeftPaneSectionHeader';
 import { useDispatch, useSelector } from 'react-redux';
-import { showSettingsSection } from '../../state/ducks/section';
+import {
+  SectionType,
+  setOverlayMode,
+  showLeftPaneSection,
+  showSettingsSection,
+} from '../../state/ducks/section';
 import { getFocusedSettingsSection } from '../../state/selectors/section';
 import { recoveryPhraseModal, updateDeleteAccountModal } from '../../state/ducks/modalDialog';
 import { SessionButton, SessionButtonColor, SessionButtonType } from '../basic/SessionButton';
 import { SessionIcon } from '../icon';
 import { SessionSettingCategory } from '../settings/SessionSettings';
+import { resetConversationExternal } from '../../state/ducks/conversations';
 
 const getCategories = () => {
   return [
     {
       id: SessionSettingCategory.Appearance,
       title: window.i18n('appearanceSettingsTitle'),
-      hidden: false,
     },
     {
       id: SessionSettingCategory.Privacy,
       title: window.i18n('privacySettingsTitle'),
-      hidden: false,
     },
     {
       id: SessionSettingCategory.Blocked,
       title: window.i18n('blockedSettingsTitle'),
-      hidden: false,
     },
     {
       id: SessionSettingCategory.Notifications,
       title: window.i18n('notificationsSettingsTitle'),
-      hidden: false,
+    },
+    {
+      id: SessionSettingCategory.MessageRequests,
+      title: window.i18n('openMessageRequestInbox'),
     },
   ];
 };
 
-const LeftPaneSettingsCategoryRow = (props: { item: any }) => {
+const LeftPaneSettingsCategoryRow = (props: {
+  item: { id: SessionSettingCategory; title: string };
+}) => {
   const { item } = props;
-
+  const { id, title } = item;
   const dispatch = useDispatch();
   const focusedSettingsSection = useSelector(getFocusedSettingsSection);
 
+  const isMessageRequestSetting = id === SessionSettingCategory.MessageRequests;
+
   return (
     <div
-      key={item.id}
+      key={id}
       className={classNames(
         'left-pane-setting-category-list-item',
-        item.id === focusedSettingsSection ? 'active' : ''
+        id === focusedSettingsSection ? 'active' : ''
       )}
       role="link"
       onClick={() => {
-        dispatch(showSettingsSection(item.id));
+        if (isMessageRequestSetting) {
+          dispatch(showLeftPaneSection(SectionType.Message));
+          dispatch(setOverlayMode('message-requests'));
+          dispatch(resetConversationExternal());
+        } else {
+          dispatch(showSettingsSection(id));
+        }
       }}
     >
       <div>
-        <strong>{item.title}</strong>
+        <strong>{title}</strong>
       </div>
 
       <div>
-        {item.id === focusedSettingsSection && (
+        {id === focusedSettingsSection && (
           <SessionIcon iconSize="medium" iconType="chevron" iconRotation={270} />
         )}
       </div>
@@ -72,11 +88,9 @@ const LeftPaneSettingsCategories = () => {
   return (
     <div className="module-left-pane__list" key={0}>
       <div className="left-pane-setting-category-list">
-        {categories
+        {categories.map(item => {
-          .filter(m => !m.hidden)
+          return <LeftPaneSettingsCategoryRow key={item.id} item={item} />;
-          .map(item => {
+        })}
-            return <LeftPaneSettingsCategoryRow key={item.id} item={item} />;
-          })}
       </div>
     </div>
   );

ts/components/leftpane/overlay/OverlayMessageRequest.tsx

@@ -15,7 +15,10 @@ import { getConversationController } from '../../../session/conversations';
 import { forceSyncConfigurationNowIfNeeded } from '../../../session/utils/syncUtils';
 import { BlockedNumberController } from '../../../util';
 import useKey from 'react-use/lib/useKey';
-import { clearConversationFocus, ReduxConversationType } from '../../../state/ducks/conversations';
+import {
+  ReduxConversationType,
+  resetConversationExternal,
+} from '../../../state/ducks/conversations';
 import { updateConfirmModal } from '../../../state/ducks/modalDialog';
 
 export const OverlayMessageRequest = () => {
@@ -66,7 +69,7 @@ export const OverlayMessageRequest = () => {
 
               // if we're looking at the convo to decline, close the convo
               if (selectedConversation?.id === id) {
-                clearConversationFocus();
+                dispatch(resetConversationExternal());
               }
               return true;
             }))
@@ -80,7 +83,7 @@ export const OverlayMessageRequest = () => {
           if (convoRequestCount === newConvosBlocked.length) {
             dispatch(setOverlayMode(undefined));
             dispatch(showLeftPaneSection(SectionType.Message));
-            clearConversationFocus();
+            dispatch(resetConversationExternal());
           }
         },
       })

ts/components/settings/SessionSettings.tsx

@@ -26,6 +26,7 @@ export enum SessionSettingCategory {
   Appearance = 'appearance',
   Privacy = 'privacy',
   Notifications = 'notifications',
+  MessageRequests = 'messageRequests',
   Blocked = 'blocked',
 }
 

ts/components/settings/section/CategoryPrivacy.tsx

@@ -5,7 +5,6 @@ import useUpdate from 'react-use/lib/useUpdate';
 import { SettingsKey } from '../../../data/settings-key';
 import { CallManager } from '../../../session/utils';
 import { sessionPassword, updateConfirmModal } from '../../../state/ducks/modalDialog';
-import { SectionType, setOverlayMode, showLeftPaneSection } from '../../../state/ducks/section';
 import { toggleMessageRequests } from '../../../state/ducks/userConfig';
 import { getHideMessageRequestBanner } from '../../../state/selectors/userConfig';
 import { SessionButtonColor } from '../../basic/SessionButton';
@@ -119,16 +118,6 @@ export const SettingsCategoryPrivacy = (props: {
           description={window.i18n('hideRequestBannerDescription')}
           active={useSelector(getHideMessageRequestBanner)}
         />
-        <SessionSettingButtonItem
-          title={window.i18n('openMessageRequestInbox')}
-          description={window.i18n('openMessageRequestInboxDescription')}
-          onClick={() => {
-            dispatch(showLeftPaneSection(SectionType.Message));
-            dispatch(setOverlayMode('message-requests'));
-          }}
-          buttonColor={SessionButtonColor.Primary}
-          buttonText={window.i18n('openMessageRequestInbox')}
-        />
         {!props.hasPassword && (
           <SessionSettingButtonItem
             title={window.i18n('setAccountPasswordTitle')}

ts/interactions/conversationInteractions.ts

@@ -30,9 +30,9 @@ import {
   removeAllMessagesInConversation,
 } from '../data/data';
 import {
-  clearConversationFocus,
   conversationReset,
   quoteMessage,
+  resetConversationExternal,
 } from '../state/ducks/conversations';
 import { getDecryptedMediaUrl } from '../session/crypto/DecryptedAttachmentsManager';
 import { IMAGE_JPEG } from '../types/MIME';
@@ -159,7 +159,7 @@ export const declineConversationWithConfirm = (convoId: string, syncToDevices: b
         await declineConversationWithoutConfirm(convoId, syncToDevices);
         await blockConvoById(convoId);
         await forceSyncConfigurationNowIfNeeded();
-        clearConversationFocus();
+        window?.inboxStore?.dispatch(resetConversationExternal());
       },
       onClickCancel: () => {
         window?.inboxStore?.dispatch(updateConfirmModal(null));

ts/state/ducks/conversations.ts

@@ -951,6 +951,7 @@ export const {
   quotedMessageToAnimate,
   setNextMessageToPlayId,
   updateMentionsMembers,
+  resetConversationExternal,
 } = actions;
 
 export async function openConversationWithMessages(args: {
@@ -976,10 +977,6 @@ export async function openConversationWithMessages(args: {
   );
 }
 
-export function clearConversationFocus() {
-  window.inboxStore?.dispatch(actions.resetConversationExternal());
-}
-
 export async function openConversationToSpecificMessage(args: {
   conversationKey: string;
   messageIdToNavigateTo: string;

ts/types/LocalizerKeys.ts

@@ -439,7 +439,6 @@ export type LocalizerKeys =
   | 'messageRequestAcceptedOursNoName'
   | 'declineRequestMessage'
   | 'openMessageRequestInbox'
-  | 'openMessageRequestInboxDescription'
   | 'hideRequestBanner'
   | 'noMessageRequestsPending'
   | 'noMediaUntilApproved'