Popup confirmation before sending a message containing the users recovery phrase.

_locales/en/messages.json

@@ -413,5 +413,7 @@
   "pinConversation": "Pin Conversation",
   "unpinConversation": "Unpin Conversation",
   "pinConversationLimitTitle": "Pinned conversations limit",
-  "pinConversationLimitToastDescription": "You can only pin $number$ conversations"
+  "pinConversationLimitToastDescription": "You can only pin $number$ conversations",
+  "sendRecoveryPhraseTitle": "Sending Recovery Phrase",
+  "sendRecoveryPhraseMessage": "You are attempting send your recovery phrase which can be used to access your account. Are you sure you want to send this message?"
 }

ts/components/session/SessionSeedModal.tsx

@@ -1,9 +1,8 @@
 import React from 'react';
 
-import { SessionModal } from './SessionModal';
 import { SessionButton } from './SessionButton';
 import { ToastUtils, UserUtils } from '../../session/utils';
-import { DefaultTheme, withTheme } from 'styled-components';
+import { withTheme } from 'styled-components';
 import { PasswordUtil } from '../../util';
 import { getPasswordHash } from '../../data/data';
 import { QRCode } from 'react-qr-svg';

ts/components/session/SessionWrapperModal.tsx

@@ -64,27 +64,22 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
     if (!modalRef.current?.contains(e.target)) {
       props.onClose?.();
     }
-  }
+  };
 
   useEffect(() => {
-    document.addEventListener("mousedown", handleClick);
+    document.addEventListener('mousedown', handleClick);
 
     return () => {
-      document.removeEventListener("mousedown", handleClick);
-    }
-  }, [])
+      document.removeEventListener('mousedown', handleClick);
+    };
+  }, []);
 
   return (
     <div
-      className={classNames(
-        `loki-dialog modal`,
-        additionalClassName ? additionalClassName : null
-      )}>
-      <div
-        className="session-confirm-wrapper">
-        <div
-          ref={modalRef}
-          className="session-modal">
+      className={classNames('loki-dialog modal', additionalClassName ? additionalClassName : null)}
+    >
+      <div className="session-confirm-wrapper">
+        <div ref={modalRef} className="session-modal">
           {showHeader ? (
             <div className={classNames('session-modal__header', headerReverse && 'reverse')}>
               <div className="session-modal__header__close">
@@ -101,17 +96,17 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
               <div className="session-modal__header__icons">
                 {headerIconButtons
                   ? headerIconButtons.map((iconItem: any) => {
-                    return (
-                      <SessionIconButton
-                        key={iconItem.iconType}
-                        iconType={iconItem.iconType}
-                        iconSize={SessionIconSize.Large}
-                        iconRotation={iconItem.iconRotation}
-                        onClick={iconItem.onClick}
-                        theme={theme}
-                      />
-                    );
-                  })
+                      return (
+                        <SessionIconButton
+                          key={iconItem.iconType}
+                          iconType={iconItem.iconType}
+                          iconSize={SessionIconSize.Large}
+                          iconRotation={iconItem.iconRotation}
+                          onClick={iconItem.onClick}
+                          theme={theme}
+                        />
+                      );
+                    })
                   : null}
               </div>
             </div>

ts/components/session/conversation/SessionConversation.tsx

@@ -39,6 +39,7 @@ import { updateMentionsMembers } from '../../../state/ducks/mentionsInput';
 import { sendDataExtractionNotification } from '../../../session/messages/outgoing/controlMessage/DataExtractionNotificationMessage';
 
 import { SessionButtonColor } from '../SessionButton';
+import { updateConfirmModal } from '../../../state/ducks/modalDialog';
 interface State {
   // Message sending progress
   messageProgressVisible: boolean;
@@ -233,12 +234,35 @@ export class SessionConversation extends React.Component<Props, State> {
       if (!conversationModel) {
         return;
       }
-      void conversationModel.sendMessage(body, attachments, quote, preview, groupInvitation);
-      if (this.messageContainerRef.current) {
-        // force scrolling to bottom on message sent
-        // this will mark all messages as read, and reset the conversation unreadCount
-        (this.messageContainerRef
-          .current as any).scrollTop = this.messageContainerRef.current?.scrollHeight;
+
+      const sendAndScroll = () => {
+        void conversationModel.sendMessage(body, attachments, quote, preview, groupInvitation);
+        if (this.messageContainerRef.current) {
+          (this.messageContainerRef
+            .current as any).scrollTop = this.messageContainerRef.current?.scrollHeight;
+        }
+      };
+
+      // const recoveryPhrase = window.textsecure.storage.get('mnemonic');
+      const recoveryPhrase = UserUtils.getCurrentRecoveryPhrase();
+
+      // string replace to fix case where pasted text contains invis characters causing false negatives
+      if (body.replace(/\s/g, '').includes(recoveryPhrase.replace(/\s/g, ''))) {
+        window.inboxStore?.dispatch(
+          updateConfirmModal({
+            title: window.i18n('sendRecoveryPhraseTitle'),
+            message: window.i18n('sendRecoveryPhraseMessage'),
+            okTheme: SessionButtonColor.Danger,
+            onClickOk: () => {
+              sendAndScroll();
+            },
+            onClickClose: () => {
+              window.inboxStore?.dispatch(updateConfirmModal(null));
+            },
+          })
+        );
+      } else {
+        sendAndScroll();
       }
     };
     const showMessageDetails = !!messageDetailShowProps;