feat(Jumio): parse postMessage and continue flow

blockchain · Jul 20, 2018 · c9965b5 · c9965b5
1 parent bd7722c
commit c9965b5
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 17 deletions.
diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/SfoxExchangeData/Jumio/index.js b/packages/blockchain-wallet-v4-frontend/src/modals/SfoxExchangeData/Jumio/index.js
@@ -1,6 +1,7 @@
 import React from 'react'
 import { connect } from 'react-redux'
 import { bindActionCreators, compose } from 'redux'
+import { path } from 'ramda'
 import { actions } from 'data'
 
 import { getData } from './selectors'
@@ -12,8 +13,20 @@ class JumioContainer extends React.PureComponent {
     this.onFinish = this.onFinish.bind(this)
   }
 
-  componentWillMount () {
+  componentDidMount () {
     this.props.sfoxActions.getJumioToken()
+
+    let receiveMessage = e => {
+      const jumioWhitelist = ['done']
+      if (!e.data.command) return
+      if (e.data.from !== 'jumio') return
+      if (e.data.to !== 'exchange') return
+      if (e.origin !== this.props.jumioBaseUrl) return
+      if (jumioWhitelist.indexOf(e.data.command) < 0) return
+
+      if (e.data.command === 'done') this.onFinish()
+    }
+    window.addEventListener('message', receiveMessage, false)
   }
 
   onFinish () {
@@ -42,7 +55,11 @@ class JumioContainer extends React.PureComponent {
 }
 
 const mapStateToProps = state => ({
-  data: getData(state)
+  data: getData(state),
+  jumioBaseUrl: path(
+    ['walletOptionsPath', 'data', 'domains', 'walletHelper'],
+    state
+  )
 })
 
 const mapDispatchToProps = dispatch => ({

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/SfoxExchangeData/Jumio/template.success.js b/packages/blockchain-wallet-v4-frontend/src/modals/SfoxExchangeData/Jumio/template.success.js
@@ -16,20 +16,9 @@ const JumioFrame = styled.iframe`
   border-style: solid;
   border-color: ${props => props.theme['gray-1']};
 `
-const LinkContainer = styled.div`
-  width: 80%;
-  margin-top: 5px;
-  text-align: right;
-`
-const Link = styled.span`
-  cursor: pointer;
-  font-size: 13px;
-  text-decoration: underline;
-  color: ${props => props.theme['brand-secondary']};
-`
 
 const Success = props => {
-  const { options, token, onFinish } = props
+  const { options, token } = props
   const { authorizationToken } = token
   const walletHelperRoot = path(['domains', 'walletHelper'], options)
   const jumioUrl = `${walletHelperRoot}/wallet-helper/jumio/#/key/${authorizationToken}`
@@ -42,9 +31,6 @@ const Success = props => {
         scrolling='yes'
         id='jumio'
       />
-      <LinkContainer>
-        <Link onClick={onFinish}>Next</Link>
-      </LinkContainer>
     </Container>
   )
 }