From 09f4b703ef6b24b1a78b0731d8e760b7373fcb9b Mon Sep 17 00:00:00 2001
From: Warrick Corfe-Tan <warrickct@gmail.com>
Date: Mon, 7 Jun 2021 17:42:45 +1000
Subject: [PATCH] seed dialog refactored

---
 background.html                               |  1 -
 js/background.js                              |  5 ---
 js/views/app_view.js                          |  7 ----
 js/views/seed_dialog_view.js                  | 35 -------------------
 .../session/LeftPaneSettingSection.tsx        | 20 ++++++++++-
 ts/components/session/SessionSeedModal.tsx    | 16 +++++++--
 ts/components/session/SessionWrapperModal.tsx |  2 +-
 7 files changed, 33 insertions(+), 53 deletions(-)
 delete mode 100644 js/views/seed_dialog_view.js

diff --git a/background.html b/background.html
index ed5fea97c..86d2b3336 100644
--- a/background.html
+++ b/background.html
@@ -150,7 +150,6 @@
   <script type='text/javascript' src='js/views/moderators_remove_dialog_view.js'></script>
   <script type='text/javascript' src='js/views/user_details_dialog_view.js'></script>
   <script type='text/javascript' src='js/views/password_dialog_view.js'></script>
-  <script type='text/javascript' src='js/views/seed_dialog_view.js'></script>
   <script type='text/javascript' src='js/views/session_id_reset_view.js'></script>
 
   <!-- CRYPTO -->
diff --git a/js/background.js b/js/background.js
index 0e63c507a..7acc305b3 100644
--- a/js/background.js
+++ b/js/background.js
@@ -640,11 +640,6 @@
       }
     });
 
-    Whisper.events.on('showSeedDialog', async () => {
-      if (appView) {
-        appView.showSeedDialog();
-      }
-    });
 
     Whisper.events.on('showPasswordDialog', async options => {
       if (appView) {
diff --git a/js/views/app_view.js b/js/views/app_view.js
index 0800c3a0a..5bc964a20 100644
--- a/js/views/app_view.js
+++ b/js/views/app_view.js
@@ -16,7 +16,6 @@
       this.applyRtl();
       this.applyHideMenu();
 
-      this.showSeedDialog = this.showSeedDialog.bind(this);
       this.showPasswordDialog = this.showPasswordDialog.bind(this);
     },
     events: {
@@ -131,12 +130,6 @@
       const dialog = new Whisper.PasswordDialogView(options);
       this.el.prepend(dialog.el);
     },
-    showSeedDialog() {
-      const dialog = new Whisper.SeedDialogView({
-        theme: this.getThemeObject(),
-      });
-      this.el.prepend(dialog.el);
-    },
     getThemeObject() {
       const themeSettings = storage.get('theme-setting') || 'light';
       const theme = themeSettings === 'light' ? window.lightTheme : window.darkTheme;
diff --git a/js/views/seed_dialog_view.js b/js/views/seed_dialog_view.js
deleted file mode 100644
index 9355100a9..000000000
--- a/js/views/seed_dialog_view.js
+++ /dev/null
@@ -1,35 +0,0 @@
-/* global Whisper */
-
-// eslint-disable-next-line func-names
-(function() {
-  'use strict';
-
-  window.Whisper = window.Whisper || {};
-
-  Whisper.SeedDialogView = Whisper.View.extend({
-    className: 'loki-dialog seed-dialog modal',
-    initialize(options) {
-      this.close = this.close.bind(this);
-      this.theme = options.theme;
-      this.render();
-    },
-
-    render() {
-      this.dialogView = new Whisper.ReactWrapperView({
-        className: 'seed-dialog-wrapper',
-        Component: window.Signal.Components.SessionSeedModal,
-        props: {
-          onClose: this.close,
-          theme: this.theme,
-        },
-      });
-
-      this.$el.append(this.dialogView.el);
-      return this;
-    },
-
-    close() {
-      this.remove();
-    },
-  });
-})();
diff --git a/ts/components/session/LeftPaneSettingSection.tsx b/ts/components/session/LeftPaneSettingSection.tsx
index 24dd82f13..224a11239 100644
--- a/ts/components/session/LeftPaneSettingSection.tsx
+++ b/ts/components/session/LeftPaneSettingSection.tsx
@@ -13,6 +13,7 @@ import { showSettingsSection } from '../../state/ducks/section';
 import { getFocusedSettingsSection } from '../../state/selectors/section';
 import { getTheme } from '../../state/selectors/theme';
 import { SessionConfirm } from './SessionConfirm';
+import { SessionSeedModal } from './SessionSeedModal';
 
 type Props = {
   settingsCategory: SessionSettingCategory;
@@ -128,6 +129,23 @@ const onDeleteAccount = ( setModal: any) => {
   />)
 };
 
+const onShowRecoverPhrase = (setModal: any) => {
+
+  const clearModal = () => {
+    setModal(null);
+  }
+
+  setModal(
+
+    <SessionSeedModal
+     onClose={clearModal} 
+    ></SessionSeedModal>
+  
+  )
+
+
+}
+
 const LeftPaneBottomButtons = (props: { setModal: any}) => {
   const dangerButtonText = window.i18n('clearAllData');
   const showRecoveryPhrase = window.i18n('showRecoveryPhrase');
@@ -146,7 +164,7 @@ const LeftPaneBottomButtons = (props: { setModal: any}) => {
         text={showRecoveryPhrase}
         buttonType={SessionButtonType.SquareOutline}
         buttonColor={SessionButtonColor.White}
-        onClick={() => window.Whisper.events.trigger('showSeedDialog')}
+        onClick={() => onShowRecoverPhrase(setModal)}
       />
     </div>
   );
diff --git a/ts/components/session/SessionSeedModal.tsx b/ts/components/session/SessionSeedModal.tsx
index 691672556..8a5d3f089 100644
--- a/ts/components/session/SessionSeedModal.tsx
+++ b/ts/components/session/SessionSeedModal.tsx
@@ -8,6 +8,7 @@ import { PasswordUtil } from '../../util';
 import { getPasswordHash } from '../../data/data';
 import { QRCode } from 'react-qr-svg';
 import { mn_decode } from '../../session/crypto/mnemonic';
+import { SessionWrapperModal } from './SessionWrapperModal';
 
 interface Props {
   onClose: any;
@@ -62,11 +63,19 @@ class SessionSeedModalInner extends React.Component<Props, State> {
     return (
       <>
         {!loading && (
-          <SessionModal
+          // <SessionModal
+          //   title={i18n('showRecoveryPhrase')}
+          //   onClose={onClose}
+          //   theme={this.props.theme}
+          // >
+
+            <SessionWrapperModal
             title={i18n('showRecoveryPhrase')}
             onClose={onClose}
             theme={this.props.theme}
-          >
+            >
+
+
             <div className="spacer-sm" />
 
             {hasPassword && !passwordValid ? (
@@ -74,7 +83,8 @@ class SessionSeedModalInner extends React.Component<Props, State> {
             ) : (
               <>{this.renderSeedView()}</>
             )}
-          </SessionModal>
+            </SessionWrapperModal>
+          // </SessionModal>
         )}
       </>
     );
diff --git a/ts/components/session/SessionWrapperModal.tsx b/ts/components/session/SessionWrapperModal.tsx
index c7377d128..8a558e9e9 100644
--- a/ts/components/session/SessionWrapperModal.tsx
+++ b/ts/components/session/SessionWrapperModal.tsx
@@ -48,7 +48,7 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
     title,
     onConfirm,
     onClose,
-    showHeader,
+    showHeader = true,
     showClose = false,
     confirmText,
     cancelText,