[#932] Hides logout button on account recovery flow

5 files changed, 27 insertions, 9 deletions

diff --git a/web-ui/src/account_recovery/page.spec.js b/web-ui/src/account_recovery/page.spec.js
index fd4e7db6..68debba0 100644
--- a/web-ui/src/account_recovery/page.spec.js
+++ b/web-ui/src/account_recovery/page.spec.js
@@ -22,8 +22,8 @@ describe('Account Recovery Page', () => {
     expect(page.props().title).toEqual('account-recovery.page-title');
   });
 
-  it('renders header', () => {
-    expect(page.find(Header).length).toEqual(1);
+  it('renders header without logout button', () => {
+    expect(page.find(Header).props().renderLogout).toEqual(false);
   });
 
   it('renders footer', () => {
diff --git a/web-ui/src/backup_account/page.js b/web-ui/src/backup_account/page.js
index be3bae36..e7663205 100644
--- a/web-ui/src/backup_account/page.js
+++ b/web-ui/src/backup_account/page.js
@@ -56,7 +56,7 @@ export class Page extends React.Component {
     return (
       <DocumentTitle title={t('backup-account.page-title')}>
         <div className='page'>
-          <Header />
+          <Header renderLogout />
           <section>
             {this.mainContent()}
           </section>
diff --git a/web-ui/src/backup_account/page.spec.js b/web-ui/src/backup_account/page.spec.js
index 2933a64e..8c014ee4 100644
--- a/web-ui/src/backup_account/page.spec.js
+++ b/web-ui/src/backup_account/page.spec.js
@@ -5,6 +5,7 @@ import { Page } from 'src/backup_account/page';
 import BackupEmail from 'src/backup_account/backup_email/backup_email';
 import Confirmation from 'src/backup_account/confirmation/confirmation';
 import SnackbarNotification from 'src/common/snackbar_notification/snackbar_notification';
+import Header from 'src/common/header/header';
 
 describe('BackupAccount', () => {
   let page;
@@ -18,6 +19,10 @@ describe('BackupAccount', () => {
     expect(page.props().title).toEqual('backup-account.page-title');
   });
 
+  it('renders header with logout button', () => {
+    expect(page.find(Header).props().renderLogout).toEqual(true);
+  });
+
   describe('save backup email', () => {
     let pageInstance;
 
diff --git a/web-ui/src/common/header/header.js b/web-ui/src/common/header/header.js
index 715d54c6..3ad924c0 100644
--- a/web-ui/src/common/header/header.js
+++ b/web-ui/src/common/header/header.js
@@ -19,7 +19,7 @@ import React from 'react';
 import Logout from 'src/common/logout/logout';
 import './header.scss';
 
-export const Header = () => (
+export const Header = ({ renderLogout }) => (
   <header className='header-wrapper'>
     <div className='header-content'>
       <a href='/'>
@@ -30,10 +30,18 @@ export const Header = () => (
         />
       </a>
       <div className='header-icons'>
-        <Logout />
+        { renderLogout ? <Logout /> : <div /> }
       </div>
     </div>
   </header>
 );
 
+Header.propTypes = {
+  renderLogout: React.PropTypes.bool
+};
+
+Header.defaultProps = {
+  renderLogout: false
+};
+
 export default Header;
diff --git a/web-ui/src/common/header/header.spec.js b/web-ui/src/common/header/header.spec.js
index 81a952c7..0c11713b 100644
--- a/web-ui/src/common/header/header.spec.js
+++ b/web-ui/src/common/header/header.spec.js
@@ -11,11 +11,16 @@ describe('Header', () => {
     header = shallow(<Header />);
   });
 
-  it('renders the header containing the logout button', () => {
-    expect(header.find('header').find(Logout)).toExist();
-  });
-
   it('renders the header pixelated logo', () => {
     expect(header.find('header').find('img').props().alt).toEqual('Pixelated');
   });
+
+  it('renders the header containing the logout button when renderLogout is true', () => {
+    header = shallow(<Header renderLogout />);
+    expect(header.find('header').find(Logout).length).toEqual(1);
+  });
+
+  it('hides logout button when renderLogout is false', () => {
+    expect(header.find('header').find(Logout).length).toEqual(0);
+  });
 });