[#938] Adds link to backup-account on the backup account step

with @anikarni

3 files changed, 22 insertions, 1 deletions

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>
 );