fix(Tiers): Fix settings/profile, pull email/mobile from wallet payload

blockchain · Dec 13, 2018 · 59e967c · 59e967c
1 parent 550a0d2
commit 59e967c
Show file tree

Hide file tree

Showing 7 changed files with 98 additions and 17 deletions.
diff --git a/packages/blockchain-wallet-v4-frontend/src/components/IdentityVerification/TierCard/index.js b/packages/blockchain-wallet-v4-frontend/src/components/IdentityVerification/TierCard/index.js
@@ -92,8 +92,14 @@ const ActionButton = styled(Button)`
   margin-top: 20px;
 `
 
-export const TierCard = ({ userData, userTiers, tier, ...rest }) => {
-  const { verifyIdentity, column } = rest
+export const TierCard = ({
+  userData,
+  userTiers,
+  emailVerified,
+  mobileVerified,
+  ...rest
+}) => {
+  const { verifyIdentity, column, tier } = rest
   const tierData = head(userTiers.filter(propEq('index', tier)))
   return (
     <Wrapper className={column ? 'column' : ''}>
@@ -134,7 +140,12 @@ export const TierCard = ({ userData, userTiers, tier, ...rest }) => {
               {path([tier, 'requirements'], TIERS).map((requirement, i) => (
                 <TextGroup inline key={i} style={{ marginBottom: '8px' }}>
                   {messages[requirement.name]}
-                  {requirement.complete(userData, userTiers) && (
+                  {requirement.complete({
+                    userData,
+                    userTiers,
+                    mobileVerified,
+                    emailVerified
+                  }) && (
                     <Icon
                       style={{ marginLeft: '5px' }}
                       color='success'

diff --git a/packages/blockchain-wallet-v4-frontend/src/components/IdentityVerification/TierCard/model.js b/packages/blockchain-wallet-v4-frontend/src/components/IdentityVerification/TierCard/model.js
@@ -7,20 +7,20 @@ export const TIERS = {
     requirements: [
       {
         name: 'EMAIL',
-        complete: prop('email')
+        complete: ({ emailVerified }) => emailVerified === 1
       },
       {
         name: 'NAME',
-        complete: userData =>
+        complete: ({ userData }) =>
           prop('firstName', userData) && prop('lastName', userData)
       },
       {
         name: 'DOB',
-        complete: prop('dob')
+        complete: ({ userData }) => prop('dob', userData)
       },
       {
         name: 'ADDRESS',
-        complete: userData =>
+        complete: ({ userData }) =>
           path(['address', 'city'], userData) &&
           path(['address', 'country'], userData) &&
           path(['address', 'line1'], userData)
@@ -33,19 +33,19 @@ export const TIERS = {
     requirements: [
       {
         name: 'TIER1',
-        complete: (userData, tiersData) => tiersData[1].state === 'verified'
+        complete: ({ userTiers }) => userTiers[1].state === 'verified'
       },
       {
         name: 'MOBILE',
-        complete: prop('mobileVerified')
+        complete: ({ mobileVerified }) => mobileVerified === 1
       },
       {
         name: 'GOVID',
-        complete: userData => prop('kycState', userData) !== 'NONE'
+        complete: ({ userData }) => prop('kycState', userData) !== 'NONE'
       },
       {
         name: 'SELFIE',
-        complete: userData => prop('kycState', userData) !== 'NONE'
+        complete: ({ userData }) => prop('kycState', userData) !== 'NONE'
       }
     ]
   }

diff --git a/...s/blockchain-wallet-v4-frontend/src/components/IdentityVerification/TierCard/selectors.js b/...s/blockchain-wallet-v4-frontend/src/components/IdentityVerification/TierCard/selectors.js
@@ -3,5 +3,11 @@ import { selectors } from 'data'
 export const getData = state => {
   const userData = selectors.modules.profile.getUserData(state).getOrElse(null)
   const userTiers = selectors.modules.profile.getTiers(state).getOrElse(null)
-  return { userData, userTiers }
+  const emailVerified = selectors.core.settings
+    .getEmailVerified(state)
+    .getOrElse(false)
+  const mobileVerified = selectors.core.settings
+    .getSmsVerified(state)
+    .getOrElse(false)
+  return { userData, userTiers, emailVerified, mobileVerified }
 }
diff --git a/...es/blockchain-wallet-v4-frontend/src/scenes/ExchangeProfile/IdentityVerification/index.js b/...es/blockchain-wallet-v4-frontend/src/scenes/ExchangeProfile/IdentityVerification/index.js
@@ -68,7 +68,7 @@ const TierRow = styled(Row)`
   > div {
     margin: 0 15px;
   }
-  margin-top: 30px;
+  margin-top: 10px;
   @media (min-width: 1200px) {
     align-items: flex-end;
   }

diff --git a/packages/blockchain-wallet-v4-frontend/src/scenes/ExchangeProfile/index.js b/packages/blockchain-wallet-v4-frontend/src/scenes/ExchangeProfile/index.js
@@ -34,10 +34,10 @@ const Loading = () => (
 
 export const Profile = ({ data, fetchUser }) =>
   data.cata({
-    Success: ({ userData, userTiers }) => (
+    Success: () => (
       <Wrapper>
         <Container>
-          <IdentityVerification userData={userData} userTiers={userTiers} />
+          <IdentityVerification />
         </Container>
       </Wrapper>
     ),

diff --git a/packages/blockchain-wallet-v4-frontend/src/scenes/Settings/Profile/index.js b/packages/blockchain-wallet-v4-frontend/src/scenes/Settings/Profile/index.js
@@ -1,3 +1,56 @@
-import { Profile } from 'scenes/ExchangeProfile'
+import React from 'react'
+import { connect } from 'react-redux'
+import styled from 'styled-components'
 
-export default Profile
+import { actions } from 'data'
+import { getData } from './selectors'
+
+import IdentityVerification from './IdentityVerification'
+import DataError from 'components/DataError'
+
+import { BlockchainLoader } from 'blockchain-info-components'
+
+const Wrapper = styled.section`
+  width: 100%;
+`
+const LoadingWrapper = styled.div`
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`
+const Container = styled.div`
+  padding: 30px;
+  width: 100%;
+  box-sizing: border-box;
+`
+
+const Loading = () => (
+  <LoadingWrapper>
+    <BlockchainLoader />
+  </LoadingWrapper>
+)
+
+export const Profile = ({ data, fetchUser }) =>
+  data.cata({
+    Success: () => (
+      <Wrapper>
+        <Container>
+          <IdentityVerification />
+        </Container>
+      </Wrapper>
+    ),
+    NotAsked: () => <Loading />,
+    Loading: () => <Loading />,
+    Failure: () => <DataError onClick={fetchUser} />
+  })
+
+const mapDispatchToProps = dispatch => ({
+  fetchUser: () => dispatch(actions.modules.profile.fetchUser())
+})
+
+export default connect(
+  getData,
+  mapDispatchToProps
+)(Profile)
diff --git a/packages/blockchain-wallet-v4-frontend/src/scenes/Settings/Profile/selectors.js b/packages/blockchain-wallet-v4-frontend/src/scenes/Settings/Profile/selectors.js
@@ -0,0 +1,11 @@
+import { lift } from 'ramda'
+
+import { selectors } from 'data'
+
+export const getData = state => {
+  const transform = (userData, userTiers) => ({ userData, userTiers })
+  const userDataR = selectors.modules.profile.getUserData(state)
+  const userTiersR = selectors.modules.profile.getTiers(state)
+  const data = lift(transform)(userDataR, userTiersR)
+  return { data }
+}