diff options
5 files changed, 26 insertions, 3 deletions
diff --git a/web-ui/app/locales/en_US/translation.json b/web-ui/app/locales/en_US/translation.json index 4b27c9ef..160e71ff 100644 --- a/web-ui/app/locales/en_US/translation.json +++ b/web-ui/app/locales/en_US/translation.json @@ -105,7 +105,8 @@ }, "backup-account-step": { "image-description": "Backup Account - Step 4 of 4", - "title": "Wait! What if you forget your password again?" + "title": "Wait! What if you forget your password again?", + "buttonText": "Set-up Backup Account" }, "button-next": "Next", "back": "Back to previous step" diff --git a/web-ui/app/locales/pt_BR/translation.json b/web-ui/app/locales/pt_BR/translation.json index fe0711cb..b7cac507 100644 --- a/web-ui/app/locales/pt_BR/translation.json +++ b/web-ui/app/locales/pt_BR/translation.json @@ -105,7 +105,8 @@ }, "backup-account-step": { "image-description": "E-mail de Recuperação - Passo 4 de 4", - "title": "Opa! E se você esquecer sua senha de novo?" + "title": "Opa! E se você esquecer sua senha de novo?", + "buttonText": "Configurar E-mail de Recuperação" }, "button-next": "Próximo", "back": "Voltar ao passo anterior" diff --git a/web-ui/src/account_recovery/backup_account_step/backup_account_step.js b/web-ui/src/account_recovery/backup_account_step/backup_account_step.js index b4dcbaaf..f2498a8a 100644 --- a/web-ui/src/account_recovery/backup_account_step/backup_account_step.js +++ b/web-ui/src/account_recovery/backup_account_step/backup_account_step.js @@ -16,6 +16,7 @@ */ import React from "react"; import {translate} from "react-i18next"; +import SubmitButton from 'src/common/submit_button/submit_button'; export const BackupAccountStep = ({ t }) => ( <div className='account-recovery-form backup-account'> @@ -25,6 +26,11 @@ export const BackupAccountStep = ({ t }) => ( alt={t('account-recovery.backup-account-step.image-description')} /> <h1>{t('account-recovery.backup-account-step.title')}</h1> + <SubmitButton + buttonText={t('account-recovery.backup-account-step.buttonText')} + containerElement='a' + href='/backup-account' + /> </div> ); diff --git a/web-ui/src/account_recovery/backup_account_step/backup_account_step.spec.js b/web-ui/src/account_recovery/backup_account_step/backup_account_step.spec.js index 3b27b369..561079c9 100644 --- a/web-ui/src/account_recovery/backup_account_step/backup_account_step.spec.js +++ b/web-ui/src/account_recovery/backup_account_step/backup_account_step.spec.js @@ -2,6 +2,7 @@ import { shallow } from 'enzyme'; import expect from 'expect'; import React from 'react'; import { BackupAccountStep } from './backup_account_step'; +import SubmitButton from 'src/common/submit_button/submit_button'; describe('BackupAccountStep', () => { let backupAccountStep; @@ -14,4 +15,17 @@ describe('BackupAccountStep', () => { it('renders title for backup account step', () => { expect(backupAccountStep.find('h1').text()).toEqual('account-recovery.backup-account-step.title'); }); + + it('renders submit button with given href', () => { + expect(backupAccountStep.find(SubmitButton).props().href).toEqual('/backup-account'); + }); + + it('renders submit button with given container element', () => { + expect(backupAccountStep.find(SubmitButton).props().containerElement).toEqual('a'); + }); + + it('renders submit button with given button text', () => { + expect(backupAccountStep.find(SubmitButton).props().buttonText) + .toEqual('account-recovery.backup-account-step.buttonText'); + }); }); diff --git a/web-ui/src/common/submit_button/submit_button.js b/web-ui/src/common/submit_button/submit_button.js index 1224c7bd..f77a5596 100644 --- a/web-ui/src/common/submit_button/submit_button.js +++ b/web-ui/src/common/submit_button/submit_button.js @@ -30,7 +30,7 @@ const buttonStyle = { height: '48px' }; -const SubmitButton = ({ buttonText, disabled = false }) => ( +const SubmitButton = ({ buttonText, disabled = false, ...other }) => ( <div className='submit-button'> <RaisedButton type='submit' @@ -41,6 +41,7 @@ const SubmitButton = ({ buttonText, disabled = false }) => ( overlayStyle={buttonStyle} fullWidth primary + {...other} /> </div> ); |