From 7cb724bfbe8cad88cfb0cbb5cac006e4535eeaa6 Mon Sep 17 00:00:00 2001
From: Jannis R <mail@jannisr.de>
Date: Thu, 3 Nov 2016 17:47:27 +0100
Subject: [PATCH] put SMS verification into action bar

---
 js/src/modals/index.js          |  2 ++
 js/src/views/Account/account.js | 31 ++++++++++++++++++++++++++++++-
 2 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/js/src/modals/index.js b/js/src/modals/index.js
index 0e8c33563..1979fb088 100644
--- a/js/src/modals/index.js
+++ b/js/src/modals/index.js
@@ -22,6 +22,7 @@ import EditMeta from './EditMeta';
 import ExecuteContract from './ExecuteContract';
 import FirstRun from './FirstRun';
 import Shapeshift from './Shapeshift';
+import SMSVerification from './SMSVerification';
 import Transfer from './Transfer';
 import PasswordManager from './PasswordManager';
 
@@ -34,6 +35,7 @@ export {
   ExecuteContract,
   FirstRun,
   Shapeshift,
+  SMSVerification,
   Transfer,
   PasswordManager
 };
diff --git a/js/src/views/Account/account.js b/js/src/views/Account/account.js
index 902e3e7c1..2e0759242 100644
--- a/js/src/views/Account/account.js
+++ b/js/src/views/Account/account.js
@@ -20,8 +20,9 @@ import { bindActionCreators } from 'redux';
 import ContentCreate from 'material-ui/svg-icons/content/create';
 import ContentSend from 'material-ui/svg-icons/content/send';
 import LockIcon from 'material-ui/svg-icons/action/lock';
+import VerifyIcon from 'material-ui/svg-icons/action/verified-user';
 
-import { EditMeta, Shapeshift, Transfer, PasswordManager } from '../../modals';
+import { EditMeta, Shapeshift, SMSVerification, Transfer, PasswordManager } from '../../modals';
 import { Actionbar, Button, Page } from '../../ui';
 
 import shapeshiftBtn from '../../../assets/images/shapeshift-btn.png';
@@ -45,6 +46,7 @@ class Account extends Component {
   state = {
     showEditDialog: false,
     showFundDialog: false,
+    showVerificationDialog: false,
     showTransferDialog: false,
     showPasswordDialog: false
   }
@@ -64,6 +66,7 @@ class Account extends Component {
       <div className={ styles.account }>
         { this.renderEditDialog(account) }
         { this.renderFundDialog() }
+        { this.renderVerificationDialog() }
         { this.renderTransferDialog() }
         { this.renderPasswordDialog() }
         { this.renderActionbar() }
@@ -99,6 +102,11 @@ class Account extends Component {
         icon={ <img src={ shapeshiftBtn } className={ styles.btnicon } /> }
         label='shapeshift'
         onClick={ this.onShapeshiftAccountClick } />,
+      <Button
+        key='sms-verification'
+        icon={ <VerifyIcon /> }
+        label='Verify via SMS'
+        onClick={ this.openVerification } />,
       <Button
         key='editmeta'
         icon={ <ContentCreate /> }
@@ -149,6 +157,19 @@ class Account extends Component {
     );
   }
 
+  renderVerificationDialog () {
+    if (!this.state.showVerificationDialog) {
+      return null;
+    }
+
+    const { address } = this.props.params;
+
+    // TODO: pass props
+    return (
+      <SMSVerification onClose={ this.onVerificationClose } />
+    );
+  }
+
   renderTransferDialog () {
     const { showTransferDialog } = this.state;
 
@@ -205,6 +226,14 @@ class Account extends Component {
     this.onShapeshiftAccountClick();
   }
 
+  openVerification = () => {
+    this.setState({ showVerificationDialog: true });
+  }
+
+  onVerificationClose = () => {
+    this.setState({ showVerificationDialog: false });
+  }
+
   onTransferClick = () => {
     this.setState({
       showTransferDialog: !this.state.showTransferDialog