From 960d979de666a4a8edb42fb591b5443228a97803 Mon Sep 17 00:00:00 2001
From: Tayane Fernandes <tayane.rmf@gmail.com>
Date: Thu, 9 Feb 2017 16:19:12 -0200
Subject: [#922] Add dynamic page title

with @anikarni
---
 web-ui/app/locales/en_US/translation.json |  1 +
 web-ui/app/locales/pt_BR/translation.json |  1 +
 web-ui/package.json                       |  1 +
 web-ui/src/backup_account/page.js         | 55 ++++++++++++++++---------------
 4 files changed, 32 insertions(+), 26 deletions(-)

diff --git a/web-ui/app/locales/en_US/translation.json b/web-ui/app/locales/en_US/translation.json
index 6bedd5d5..7252d1d7 100644
--- a/web-ui/app/locales/en_US/translation.json
+++ b/web-ui/app/locales/en_US/translation.json
@@ -75,6 +75,7 @@
         "tags": "Tags"
     },
     "backup-account": {
+      "page-title": "Pixelated Backup Account",
       "image-description": "Forgot my password!",
       "title": "What if you forget your password?",
       "paragraph1": "You will need a backup account. Choose an alternative email address you use regularly.",
diff --git a/web-ui/app/locales/pt_BR/translation.json b/web-ui/app/locales/pt_BR/translation.json
index 20e6e269..9a4393fa 100644
--- a/web-ui/app/locales/pt_BR/translation.json
+++ b/web-ui/app/locales/pt_BR/translation.json
@@ -75,6 +75,7 @@
         "tags": "Etiquetas"
     },
     "backup-account": {
+      "page-title": "Pixelated E-mail de Recuperação",
       "image-description": "Esqueci minha senha!",
       "title": "E se você esquecer sua senha?",
       "paragraph1": "Informe outro e-mail que você usa regularmente. Esse será o seu e-mail de recuperação.",
diff --git a/web-ui/package.json b/web-ui/package.json
index 4f7c1bc5..06d0abae 100644
--- a/web-ui/package.json
+++ b/web-ui/package.json
@@ -60,6 +60,7 @@
     "react": "^15.4.2",
     "react-a11y": "^0.3.3",
     "react-addons-test-utils": "^15.4.2",
+    "react-document-title": "^2.0.2",
     "react-dom": "^15.4.2",
     "react-i18next": "^2.1.0",
     "requirejs": "2.2.0",
diff --git a/web-ui/src/backup_account/page.js b/web-ui/src/backup_account/page.js
index 2ae26d12..b5f343a9 100644
--- a/web-ui/src/backup_account/page.js
+++ b/web-ui/src/backup_account/page.js
@@ -17,6 +17,7 @@
 
 import React from 'react';
 import { translate } from 'react-i18next';
+import DocumentTitle from 'react-document-title';
 import SubmitButton from 'src/common/submit_button/submit_button';
 import InputField from 'src/common/input_field/input_field';
 import Footer from 'src/common/footer/footer';
@@ -25,32 +26,34 @@ import Header from 'src/common/header/header';
 import './page.scss';
 
 export const Page = ({ t }) => (
-  <div className='page'>
-    <Header />
-    <section>
-      <div className='container'>
-        <img
-          className='backup-account-image'
-          src='assets/images/forgot-my-password.svg'
-          alt={t('backup-account.image-description')}
-        />
-        <form>
-          <h1>{t('backup-account.title')}</h1>
-          <p>{t('backup-account.paragraph1')}</p>
-          <p>{t('backup-account.paragraph2')}</p>
-          <InputField name='email' label={t('backup-account.input-label')} />
-          <SubmitButton buttonText={t('backup-account.button')} />
-          <div>
-            <a href='/' className='link'>
-              <i className='fa fa-angle-left' aria-hidden='true' />
-              <span>{t('back-to-inbox')}</span>
-            </a>
-          </div>
-        </form>
-      </div>
-    </section>
-    <Footer />
-  </div>
+  <DocumentTitle title={t('backup-account.page-title')}>
+    <div className='page'>
+      <Header />
+      <section>
+        <div className='container'>
+          <img
+            className='backup-account-image'
+            src='assets/images/forgot-my-password.svg'
+            alt={t('backup-account.image-description')}
+          />
+          <form>
+            <h1>{t('backup-account.title')}</h1>
+            <p>{t('backup-account.paragraph1')}</p>
+            <p>{t('backup-account.paragraph2')}</p>
+            <InputField name='email' label={t('backup-account.input-label')} />
+            <SubmitButton buttonText={t('backup-account.button')} />
+            <div>
+              <a href='/' className='link'>
+                <i className='fa fa-angle-left' aria-hidden='true' />
+                <span>{t('back-to-inbox')}</span>
+              </a>
+            </div>
+          </form>
+        </div>
+      </section>
+      <Footer />
+    </div>
+  </DocumentTitle>
 );
 
 Page.propTypes = {
-- 
cgit v1.2.3