src/renderer/component/walletSend/index.js

@@ -1,9 +1,9 @@
 import { connect } from 'react-redux';
-import { doSendDraftTransaction, selectBalance } from 'lbry-redux';
+import { selectBalance, doNotify } from 'lbry-redux';
 import WalletSend from './view';
 
 const perform = dispatch => ({
-  sendToAddress: (address, amount) => dispatch(doSendDraftTransaction(address, amount)),
+  openModal: (modal, props) => dispatch(doNotify(modal, props)),
 });
 
 const select = state => ({

src/renderer/component/walletSend/view.jsx

@@ -1,5 +1,6 @@
 // @flow
 import React from 'react';
+import { MODALS } from 'lbry-redux';
 import Button from 'component/button';
 import { Form, FormRow, FormField } from 'component/common/form';
 import { Formik } from 'formik';
@@ -11,7 +12,7 @@ type DraftTransaction = {
 };
 
 type Props = {
-  sendToAddress: (string, number) => void,
+  openModal: ({ id: string }, { address: string, amount: number }) => void,
   balance: number,
 };
 
@@ -23,10 +24,12 @@ class WalletSend extends React.PureComponent<Props> {
   }
 
   handleSubmit(values: DraftTransaction) {
-    const { sendToAddress } = this.props;
+    const { openModal } = this.props;
     const { address, amount } = values;
     if (amount && address) {
-      sendToAddress(address, amount);
+      const notificationId = { id: MODALS.CONFIRM_TRANSACTION };
+      const modalProps = { address, amount };
+      openModal(notificationId, modalProps);
     }
   }
 

src/renderer/modal/modalConfirmTransaction/index.js

@@ -0,0 +1,10 @@
+import { connect } from 'react-redux';
+import { doHideNotification, doSendDraftTransaction } from 'lbry-redux';
+import ModalConfirmTransaction from './view';
+
+const perform = dispatch => ({
+  closeModal: () => dispatch(doHideNotification()),
+  sendToAddress: (address, amount) => dispatch(doSendDraftTransaction(address, amount)),
+});
+
+export default connect(null, perform)(ModalConfirmTransaction);

src/renderer/modal/modalConfirmTransaction/view.jsx

@@ -0,0 +1,44 @@
+// @flow
+import React from 'react';
+import { Modal } from 'modal/modal';
+
+type Props = {
+  address: string,
+  amount: number,
+  closeModal: () => void,
+  sendToAddress: (string, number) => void,
+};
+
+class ModalConfirmTransaction extends React.PureComponent<Props> {
+  onConfirmed() {
+    const { closeModal, sendToAddress, amount, address } = this.props;
+    sendToAddress(address, amount);
+    closeModal();
+  }
+
+  render() {
+    const { amount, address, closeModal } = this.props;
+    return (
+      <Modal
+        isOpen
+        contentLabel={__('Confirm Transaction')}
+        type="confirm"
+        confirmButtonLabel={__('Continue')}
+        onConfirmed={() => this.onConfirmed()}
+        onAborted={closeModal}
+      >
+        <p>{__('Are you sure you want to ')}</p>
+        <h1>
+          {__('send ')} {amount} LBC
+        </h1>
+        <p>{__('Sending: ')}</p>
+        <blockquote>{amount} LBC</blockquote>
+        <p>{__('To address: ')}</p>
+        <blockquote>{address}</blockquote>
+        <p>{__('Once the transaction is sent, it cannot be reversed.')}</p>
+      </Modal>
+    );
+  }
+}
+
+export default ModalConfirmTransaction;

src/renderer/modal/modalRouter/view.jsx

@@ -18,6 +18,7 @@ import ModalRevokeClaim from 'modal/modalRevokeClaim';
 import ModalEmailCollection from 'modal/modalEmailCollection';
 import ModalPhoneCollection from 'modal/modalPhoneCollection';
 import ModalFirstSubscription from 'modal/modalFirstSubscription';
+import ModalConfirmTransaction from 'modal/modalConfirmTransaction';
 import ModalSendTip from '../modalSendTip';
 import ModalPublish from '../modalPublish';
 import ModalSearch from '../modalSearch';
@@ -158,6 +159,8 @@ class ModalRouter extends React.PureComponent {
         return <ModalSearch {...notificationProps} />;
       case MODALS.CONFIRM_EXTERNAL_LINK:
         return <ModalOpenExternalLink {...notificationProps} />;
+      case MODALS.CONFIRM_TRANSACTION:
+        return <ModalConfirmTransaction {...notificationProps} />;
       default:
         return null;
     }

yarn.lock

@@ -5837,9 +5837,9 @@ lazy-val@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/lazy-val/-/lazy-val-1.0.3.tgz#bb97b200ef00801d94c317e29dc6ed39e31c5edc"
 
-lbry-redux@lbryio/lbry-redux#c41899e78415cae6fcb7bfca0e6ba48bb6bfe6c4:
+lbry-redux@lbryio/lbry-redux#8db54c08dd25c2c74ed5d658cf9c0794a68f71ab:
   version "0.0.1"
-  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/c41899e78415cae6fcb7bfca0e6ba48bb6bfe6c4"
+  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/8db54c08dd25c2c74ed5d658cf9c0794a68f71ab"
   dependencies:
     proxy-polyfill "0.1.6"
     reselect "^3.0.0"