2 files changed, 16 insertions, 4 deletions
diff --git a/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.js b/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.js
index a4119885..c39c894d 100644
--- a/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.js
+++ b/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.js
@@ -24,7 +24,7 @@ import BackLink from 'src/common/back_link/back_link';
 
 import './user_recovery_code_form.scss';
 
-export const UserRecoveryCodeForm = ({ t, previous, next }) => (
+export const UserRecoveryCodeForm = ({ t, previous, next, saveCode }) => (
   <form className='account-recovery-form user-code' onSubmit={next}>
     <img
       className='account-recovery-progress'
@@ -40,7 +40,10 @@ export const UserRecoveryCodeForm = ({ t, previous, next }) => (
       />
       <p>{t('account-recovery.user-form.description')}</p>
     </div>
-    <InputField name='admin-code' label={t('account-recovery.user-form.input-label')} />
+    <InputField
+      name='user-code' label={t('account-recovery.user-form.input-label')}
+      onChange={saveCode}
+    />
     <SubmitButton buttonText={t('account-recovery.button-next')} />
     <BackLink text={t('account-recovery.back')} onClick={previous} />
   </form>
@@ -49,7 +52,8 @@ export const UserRecoveryCodeForm = ({ t, previous, next }) => (
 UserRecoveryCodeForm.propTypes = {
   t: React.PropTypes.func.isRequired,
   previous: React.PropTypes.func.isRequired,
-  next: React.PropTypes.func.isRequired
+  next: React.PropTypes.func.isRequired,
+  saveCode: React.PropTypes.func.isRequired
 };
 
 export default translate('', { wait: true })(UserRecoveryCodeForm);
diff --git a/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.spec.js b/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.spec.js
index e47f2e6c..386c3a19 100644
--- a/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.spec.js
+++ b/web-ui/src/account_recovery/user_recovery_code_form/user_recovery_code_form.spec.js
@@ -7,14 +7,17 @@ describe('UserRecoveryCodeForm', () => {
   let userRecoveryCodeForm;
   let mockNext;
   let mockPrevious;
+  let mockSaveCode;
 
   beforeEach(() => {
     const mockTranslations = key => key;
     mockNext = expect.createSpy();
     mockPrevious = expect.createSpy();
+    mockSaveCode = expect.createSpy();
     userRecoveryCodeForm = shallow(
       <UserRecoveryCodeForm
-        t={mockTranslations} next={mockNext} previous={mockPrevious}
+        t={mockTranslations} next={mockNext}
+        previous={mockPrevious} saveCode={mockSaveCode}
       />
     );
   });
@@ -44,4 +47,9 @@ describe('UserRecoveryCodeForm', () => {
     userRecoveryCodeForm.find('BackLink').simulate('click');
     expect(mockPrevious).toHaveBeenCalled();
   });
+
+  it('saves code on input change', () => {
+    userRecoveryCodeForm.find('InputField').simulate('change', '123');
+    expect(mockSaveCode).toHaveBeenCalledWith('123');
+  });
 });