fix kobotoolbox#407 : page titles added for most cases

jlpujante · Sep 9, 2016 · eb6a329 · eb6a329
1 parent d2a0e55
commit eb6a329
Show file tree

Hide file tree

Showing 7 changed files with 45 additions and 13 deletions.
diff --git a/jsapp/js/components/accountSettings.es6 b/jsapp/js/components/accountSettings.es6
@@ -2,6 +2,7 @@ import React from 'react/addons';
 import Reflux from 'reflux';
 import _ from 'underscore';
 import {dataInterface} from '../dataInterface';
+import DocumentTitle from 'react-document-title';
 
 import actions from '../actions';
 import bem from '../bem';
@@ -142,6 +143,7 @@ export var AccountSettings = React.createClass({
     var accountName = stores.session.currentAccount.username;
 
     return (
+      <DocumentTitle title={`${accountName} | KoboToolbox`}>
       <ui.Panel>
         <bem.AccountSettings>
           <bem.AccountSettings__left>
@@ -310,6 +312,7 @@ export var AccountSettings = React.createClass({
           </bem.AccountSettings__right>
         </bem.AccountSettings>
       </ui.Panel>
+      </DocumentTitle>
     );
   }
 });

diff --git a/jsapp/js/components/formData.es6 b/jsapp/js/components/formData.es6
@@ -12,6 +12,8 @@ import Select from 'react-select';
 import ui from '../ui';
 import mixins from '../mixins';
 import mdl from '../libs/rest_framework/material';
+import DocumentTitle from 'react-document-title';
+
 import {
   ProjectSettingsEditor,
   ProjectDownloads
@@ -80,18 +82,22 @@ var FormData = React.createClass({
       }
     }
 
+    var docTitle = this.state.name || t('Untitled');
+
     return (
-            <bem.FormView>
-              <bem.FormView__wrapper>
-                <bem.FormView__cell m='iframe'>
-                  {this.state.name != undefined && this.state.currentRoute.name == 'form-data-settings' ? 
-                    <ProjectSettingsEditor asset={this.state} iframeUrl={iframeUrl} />
-                  : 
-                    <iframe src={iframeUrl} />
-                  }
-                </bem.FormView__cell>
-              </bem.FormView__wrapper>              
-            </bem.FormView>
+        <DocumentTitle title={`${docTitle} | KoboToolbox`}>      
+          <bem.FormView>
+            <bem.FormView__wrapper>
+              <bem.FormView__cell m='iframe'>
+                {this.state.name != undefined && this.state.currentRoute.name == 'form-data-settings' ? 
+                  <ProjectSettingsEditor asset={this.state} iframeUrl={iframeUrl} />
+                : 
+                  <iframe src={iframeUrl} />
+                }
+              </bem.FormView__cell>
+            </bem.FormView__wrapper>              
+          </bem.FormView>
+        </DocumentTitle>
       );
   },
   componentDidUpdate() {

diff --git a/jsapp/js/components/formEditors.es6 b/jsapp/js/components/formEditors.es6
@@ -9,6 +9,7 @@ import existingFormMixin from '../editorMixins/existingForm';
 import Select from 'react-select';
 import ui from '../ui';
 import bem from '../bem';
+import DocumentTitle from 'react-document-title';
 
 import {Navigation} from 'react-router';
 import {session} from '../stores';
@@ -327,7 +328,10 @@ export var ProjectDownloads = React.createClass({
   },
   render () {
     let translations = this.props.asset.content.translations;
+    var docTitle = this.props.asset.name || t('Untitled');
+
     return (
+      <DocumentTitle title={`${docTitle} | KoboToolbox`}>
       <bem.FormView>
         <bem.FormView__cell>
           <bem.FormModal__form onSubmit={this.handleSubmit}>
@@ -399,6 +403,7 @@ export var ProjectDownloads = React.createClass({
           </bem.FormModal__form>
         </bem.FormView__cell>
       </bem.FormView>
+      </DocumentTitle>
     );
   },
 });

diff --git a/jsapp/js/components/reports.es6 b/jsapp/js/components/reports.es6
@@ -11,6 +11,7 @@ import stores from '../stores';
 import Select from 'react-select';
 import ui from '../ui';
 import mdl from '../libs/rest_framework/material';
+import DocumentTitle from 'react-document-title';
 
 import ReportViewItem from './reportViewItem';
 
@@ -483,13 +484,16 @@ var Reports = React.createClass({
         rowsByKuid = this.state.rowsByKuid,
         explicitStyles,
         explicitStylesList = [],
-        defaultStyle;
+        defaultStyle, 
+        docTitle = t('Report');
     if (asset && asset.content) {
       explicitStyles = this.state.reportStyles.specified || {};
       defaultStyle = this.state.reportStyles.default || {};
 
       defaultStyle.graphWidth = this.state.graphWidth;
       defaultStyle.graphHeight = this.state.graphHeight;
+
+      docTitle = asset.name || t('Untitled');
     }
 
     let translations = false;
@@ -500,6 +504,7 @@ var Reports = React.createClass({
     }
 
     return (
+      <DocumentTitle title={`${docTitle} | KoboToolbox`}>
         <bem.ReportView>
           {this.renderReportButtons()}
           {this.state.asset ?
@@ -563,6 +568,7 @@ var Reports = React.createClass({
 
           : null}
         </bem.ReportView>
+      </DocumentTitle>
       );
   },
   componentDidUpdate() {

diff --git a/jsapp/js/components/searchcollectionlist.es6 b/jsapp/js/components/searchcollectionlist.es6
@@ -8,6 +8,8 @@ import stores from '../stores';
 import bem from '../bem';
 import mdl from '../libs/rest_framework/material';
 import AssetRow from './assetrow';
+import DocumentTitle from 'react-document-title';
+
 import {
   parsePermissions,
   t,
@@ -148,12 +150,16 @@ var SearchCollectionList = React.createClass({
   },
   render () {
     var s = this.state;
+    var docTitle = '';
     if (this.props.searchContext.store.filterTags == 'asset_type:survey') {
       var display = 'grouped';
+      docTitle = t('Projects');
     } else {
       var display = 'regular';
+      docTitle = t('Library');
     }
     return (
+      <DocumentTitle title={`${docTitle} | KoboToolbox`}>
         <bem.List m={display}>
           {
             (()=>{
@@ -226,6 +232,7 @@ var SearchCollectionList = React.createClass({
           }
           </bem.AssetList>
         </bem.List>
+      </DocumentTitle>
       );
   },
   componentDidUpdate() {

diff --git a/jsapp/js/editorMixins/editableForm.es6 b/jsapp/js/editorMixins/editableForm.es6
@@ -688,8 +688,9 @@ export default assign({
   },
   render () {
     var isSurvey = this.app && !isLibrary(this.context.router);
+    var docTitle = this.state.name || t('Untitled');
     return (
-        <DocumentTitle title={this.state.name || t('Untitled')}>
+        <DocumentTitle title={`${docTitle} | KoboToolbox`}>
           <ui.Panel m={'transparent'}>
             <bem.FormBuilder m={this.state.formStylePanelDisplayed ? 'formStyleDisplayed': null }>
               {this.renderSaveAndPreviewButtons()}

diff --git a/jsapp/js/mixins.es6 b/jsapp/js/mixins.es6
@@ -7,6 +7,7 @@ import {Link} from 'react-router';
 import mdl from './libs/rest_framework/material';
 import TagsInput from 'react-tagsinput';
 import ReactZeroClipboard from 'react-zeroclipboard';
+import DocumentTitle from 'react-document-title';
 
 import {dataInterface} from './dataInterface';
 import stores from './stores';
@@ -133,7 +134,9 @@ var dmix = {
     },
     survey: {
       innerRender: function () {
+        var docTitle = this.state.name || t('Untitled');
         return (
+          <DocumentTitle title={`${docTitle} | KoboToolbox`}>
             <bem.FormView m='scrollable'>
                 <bem.FormView__wrapper m='form'>
                   <bem.FormView__row>
@@ -150,6 +153,7 @@ var dmix = {
                   : null }
                 </bem.FormView__wrapper> 
             </bem.FormView>
+          </DocumentTitle>
           );
       }
     }