1 files changed, 32 insertions, 25 deletions

diff --git a/web/react/components/access_history_modal.jsx b/web/react/components/access_history_modal.jsx
index 16768a119..a19e5c16e 100644
--- a/web/react/components/access_history_modal.jsx
+++ b/web/react/components/access_history_modal.jsx
@@ -13,21 +13,23 @@ function getStateFromStoresForAudits() {
 }
 
 module.exports = React.createClass({
+    displayName: 'AccessHistoryModal',
     componentDidMount: function() {
-        UserStore.addAuditsChangeListener(this._onChange);
-        $(this.refs.modal.getDOMNode()).on('shown.bs.modal', function(e) {
+        UserStore.addAuditsChangeListener(this.onListenerChange);
+        $(this.refs.modal.getDOMNode()).on('shown.bs.modal', function() {
             AsyncClient.getAudits();
         });
 
         var self = this;
-        $(this.refs.modal.getDOMNode()).on('hidden.bs.modal', function(e) {
+        $(this.refs.modal.getDOMNode()).on('hidden.bs.modal', function() {
+            $('#user_settings').modal('show');
             self.setState({moreInfo: []});
         });
     },
     componentWillUnmount: function() {
-        UserStore.removeAuditsChangeListener(this._onChange);
+        UserStore.removeAuditsChangeListener(this.onListenerChange);
     },
-    _onChange: function() {
+    onListenerChange: function() {
         var newState = getStateFromStoresForAudits();
         if (!utils.areStatesEqual(newState.audits, this.state.audits)) {
             this.setState(newState);
@@ -61,6 +63,21 @@ module.exports = React.createClass({
                 currentAudit.session_id = 'N/A (Login attempt)';
             }
 
+            var moreInfo = (<a href='#' className='theme' onClick={this.handleMoreInfo.bind(this, i)}>More info</a>);
+            if (this.state.moreInfo[i]) {
+                moreInfo = (
+                    <div>
+                        <div>{'Session ID: ' + currentAudit.session_id}</div>
+                        <div>{'URL: ' + currentAudit.action.replace(/\/api\/v[1-9]/, '')}</div>
+                    </div>
+                );
+            }
+
+            var divider = null;
+            if (i < this.state.audits.length - 1) {
+                divider = (<div className='divider-light'></div>)
+            }
+
             accessList[i] = (
                 <div className='access-history__table'>
                     <div className='access__date'>{newDate}</div>
@@ -68,25 +85,21 @@ module.exports = React.createClass({
                         <div className='report__time'>{newHistoryDate.toLocaleTimeString(navigator.language, {hour: '2-digit', minute: '2-digit'})}</div>
                         <div className='report__info'>
                             <div>{'IP: ' + currentAudit.ip_address}</div>
-                            {this.state.moreInfo[i] ?
-                            <div>
-                                <div>{'Session ID: ' + currentAudit.session_id}</div>
-                                <div>{'URL: ' + currentAudit.action.replace(/\/api\/v[1-9]/, '')}</div>
-                            </div>
-                            :
-                            <a href='#' className='theme' onClick={this.handleMoreInfo.bind(this, i)}>More info</a>
-                            }
+                            {moreInfo}
                         </div>
-                        {i < this.state.audits.length - 1 ?
-                        <div className='divider-light'/>
-                        :
-                        null
-                        }
+                        {divider}
                     </div>
                 </div>
             );
         }
 
+        var content;
+        if (this.state.audits.loading) {
+            content = (<LoadingScreen />);
+        } else {
+            content = (<form role='form'>{accessList}</form>);
+        }
+
         return (
             <div>
                 <div className='modal fade' ref='modal' id='access-history' tabIndex='-1' role='dialog' aria-hidden='true'>
@@ -97,13 +110,7 @@ module.exports = React.createClass({
                                 <h4 className='modal-title' id='myModalLabel'>Access History</h4>
                             </div>
                             <div ref='modalBody' className='modal-body'>
-                                {!this.state.audits.loading ?
-                                <form role='form'>
-                                {accessList}
-                                </form>
-                                :
-                                <LoadingScreen />
-                                }
+                                {content}
                             </div>
                         </div>
                     </div>