feat(Blockstack): second password check

blockchain · Oct 30, 2019 · e9d1f12 · e9d1f12
1 parent 4e221d9
commit e9d1f12
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 16 deletions.
diff --git a/packages/blockchain-wallet-v4-frontend/src/data/modules/profile/sagas.js b/packages/blockchain-wallet-v4-frontend/src/data/modules/profile/sagas.js
@@ -51,9 +51,9 @@ export default ({ api, coreSagas, networks }) => {
       }
     }
     if (campaign.name === 'BLOCKSTACK') {
-      let password = yield call(promptForSecondPassword)
+      let password = yield call(promptForSecondPassword, ['BLOCKSTACK'])
       yield put(actions.core.data.stx.generateAddress(password))
-      const { payload } = yield take(actions.core.data.stx.setAddress)
+      const { payload } = yield take(actionTypes.core.data.stx.SET_ADDRESS)
       const { address } = payload
       return {
         'x-campaign-address': address

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/Settings/SecondPassword/template.js b/packages/blockchain-wallet-v4-frontend/src/modals/Settings/SecondPassword/template.js
@@ -2,6 +2,7 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import { reduxForm } from 'redux-form'
 import { FormattedMessage } from 'react-intl'
+import styled from 'styled-components'
 
 import {
   Button,
@@ -13,28 +14,55 @@ import {
   PasswordInput,
   Text
 } from 'blockchain-info-components'
-import { Form } from 'components/Form'
+import { Form, FormLabel } from 'components/Form'
+
+const SecPasswordHeader = styled(ModalHeader)`
+  border-bottom: 0;
+  padding-bottom: 12px;
+`
+
+const PurposeContainer = styled.div`
+  padding: 6px 30px 0px 30px;
+`
+
+const PURPOSES = {
+  BLOCKSTACK: (
+    <Text size='14px' weight={600} color='grey600'>
+      <FormattedMessage
+        id='modals.secondpassword.blockstack'
+        defaultMessage='Our next airdrop is here. Enter your second password to reserve an address for the Blockstack Airdrop.'
+      />
+    </Text>
+  )
+}
 
 const SecondPassword = props => {
   const { position, total, close, ...rest } = props
-  const { handleSubmit, handleChange, value } = rest
+  const { handleSubmit, handleChange, purposes = [], value } = rest
 
   return (
     <Modal size='medium' position={position} total={total} closeButton={false}>
       <Form onSubmit={handleSubmit}>
-        <ModalHeader icon='safe' onClose={close}>
-          <FormattedMessage
-            id='modals.secondpassword.title'
-            defaultMessage='Second password required'
-          />
-        </ModalHeader>
-        <ModalBody>
-          <Text size='14px' weight={500}>
+        <SecPasswordHeader icon='safe' onClose={close}>
+          <Text weight={600} size='20px'>
             <FormattedMessage
-              id='modals.secondpassword.explain'
-              defaultMessage='Please enter your second password'
+              id='modals.secondpassword.title1'
+              defaultMessage='Enter Your Second Password'
             />
           </Text>
+        </SecPasswordHeader>
+        {purposes && purposes.length ? (
+          <PurposeContainer>
+            {purposes.map(purpose => PURPOSES[purpose])}
+          </PurposeContainer>
+        ) : null}
+        <ModalBody>
+          <FormLabel>
+            <FormattedMessage
+              id='modals.secondpassword.explain1'
+              defaultMessage='Second Password'
+            />
+          </FormLabel>
           <PasswordInput
             value={value}
             onChange={handleChange}

diff --git a/packages/blockchain-wallet-v4-frontend/src/services/SagaService/index.js b/packages/blockchain-wallet-v4-frontend/src/services/SagaService/index.js
@@ -16,10 +16,10 @@ export const askSecondPasswordEnhancer = coreSaga =>
     return yield call(coreSaga, enhancedArgs)
   }
 
-export const promptForSecondPassword = function * () {
+export const promptForSecondPassword = function * (purposes) {
   const wallet = yield select(selectors.core.wallet.getWallet)
   if (Types.Wallet.isDoubleEncrypted(wallet)) {
-    yield put(actions.modals.showModal('SecondPassword'))
+    yield put(actions.modals.showModal('SecondPassword', { purposes }))
     let { response, canceled } = yield race({
       response: take(actionTypes.wallet.SUBMIT_SECOND_PASSWORD),
       canceled: take(actionTypes.modals.CLOSE_MODAL)