From e01cae5c0965371efa8179abf10434d12dfd5843 Mon Sep 17 00:00:00 2001 From: nickago Date: Fri, 7 Aug 2015 09:41:14 -0700 Subject: access history and activity log closing re-opens user settings in correct state --- web/react/components/access_history_modal.jsx | 1 + web/react/components/activity_log_modal.jsx | 1 + web/react/components/user_settings.jsx | 16 +++++++++++----- 3 files changed, 13 insertions(+), 5 deletions(-) (limited to 'web') diff --git a/web/react/components/access_history_modal.jsx b/web/react/components/access_history_modal.jsx index 16768a119..fecb11c7d 100644 --- a/web/react/components/access_history_modal.jsx +++ b/web/react/components/access_history_modal.jsx @@ -21,6 +21,7 @@ module.exports = React.createClass({ var self = this; $(this.refs.modal.getDOMNode()).on('hidden.bs.modal', function(e) { + $('#user_settings1').modal('show'); self.setState({moreInfo: []}); }); }, diff --git a/web/react/components/activity_log_modal.jsx b/web/react/components/activity_log_modal.jsx index f28f0d5f1..64f93ca71 100644 --- a/web/react/components/activity_log_modal.jsx +++ b/web/react/components/activity_log_modal.jsx @@ -37,6 +37,7 @@ module.exports = React.createClass({ var self = this; $(this.refs.modal.getDOMNode()).on('hidden.bs.modal', function(e) { + $('#user_settings1').modal('show'); self.setState({ moreInfo: [] }); }); }, diff --git a/web/react/components/user_settings.jsx b/web/react/components/user_settings.jsx index 1a0c313d3..d0ce23639 100644 --- a/web/react/components/user_settings.jsx +++ b/web/react/components/user_settings.jsx @@ -513,17 +513,23 @@ var SecurityTab = React.createClass({ this.setState({confirmPassword: e.target.value}); }, handleHistoryOpen: function() { - $('#user_settings1').modal('hide'); + this.setState({willReturn: true}); + $("#user_settings1").modal('hide'); }, handleDevicesOpen: function() { - $('#user_settings1').modal('hide'); + this.setState({willReturn: true}); + $("#user_settings1").modal('hide'); }, handleClose: function() { $(this.getDOMNode()).find('.form-control').each(function() { this.value = ''; }); - this.setState({currentPassword: '', newPassword: '', confirmPassword: '', serverError: null, passwordError: null}); - this.props.updateTab('general'); + + if (!this.state.willReturn) { + this.props.updateTab('general'); + } + + this.setState({current_password: '', new_password: '', confirm_password: '', server_error: null, password_error: null, willReturn: false}); }, componentDidMount: function() { $('#user_settings1').on('hidden.bs.modal', this.handleClose); @@ -533,7 +539,7 @@ var SecurityTab = React.createClass({ this.props.updateSection(''); }, getInitialState: function() { - return {currentPassword: '', newPassword: '', confirmPassword: ''}; + return { current_password: '', new_password: '', confirm_password: '', willReturn: false }; }, render: function() { var serverError = this.state.serverError ? this.state.serverError : null; -- cgit v1.2.3-1-g7c22 From f61e093b53c8e18cd3365b8f0bb03ffadb6422ef Mon Sep 17 00:00:00 2001 From: nickago Date: Fri, 7 Aug 2015 11:21:39 -0700 Subject: Cosmetic refactoring and removing no-op condition of set state --- web/react/components/access_history_modal.jsx | 30 +++++++++++++++------------ web/react/components/user_settings.jsx | 5 +++-- 2 files changed, 20 insertions(+), 15 deletions(-) (limited to 'web') diff --git a/web/react/components/access_history_modal.jsx b/web/react/components/access_history_modal.jsx index fecb11c7d..678113a47 100644 --- a/web/react/components/access_history_modal.jsx +++ b/web/react/components/access_history_modal.jsx @@ -13,22 +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_settings1').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); @@ -62,6 +63,16 @@ module.exports = React.createClass({ currentAudit.session_id = 'N/A (Login attempt)'; } + var moreInfo = (More info); + if (this.state.moreInfo[i]) { + moreInfo = ( +
+
{'Session ID: ' + currentAudit.session_id}
+
{'URL: ' + currentAudit.action.replace(/\/api\/v[1-9]/, '')}
+
+ ); + } + accessList[i] = (
{newDate}
@@ -69,14 +80,7 @@ module.exports = React.createClass({
{newHistoryDate.toLocaleTimeString(navigator.language, {hour: '2-digit', minute: '2-digit'})}
{'IP: ' + currentAudit.ip_address}
- {this.state.moreInfo[i] ? -
-
{'Session ID: ' + currentAudit.session_id}
-
{'URL: ' + currentAudit.action.replace(/\/api\/v[1-9]/, '')}
-
- : - More info - } + {moreInfo}
{i < this.state.audits.length - 1 ?
diff --git a/web/react/components/user_settings.jsx b/web/react/components/user_settings.jsx index d0ce23639..ed4f3fd98 100644 --- a/web/react/components/user_settings.jsx +++ b/web/react/components/user_settings.jsx @@ -524,12 +524,13 @@ var SecurityTab = React.createClass({ $(this.getDOMNode()).find('.form-control').each(function() { this.value = ''; }); + this.setState({current_password: '', new_password: '', confirm_password: '', server_error: null, password_error: null}); if (!this.state.willReturn) { this.props.updateTab('general'); + } else { + this.setState({willReturn: false}); } - - this.setState({current_password: '', new_password: '', confirm_password: '', server_error: null, password_error: null, willReturn: false}); }, componentDidMount: function() { $('#user_settings1').on('hidden.bs.modal', this.handleClose); -- cgit v1.2.3-1-g7c22 From da4618013134e484f84ecd9e05e825e4a6d51f3d Mon Sep 17 00:00:00 2001 From: nickago Date: Tue, 11 Aug 2015 13:55:46 -0700 Subject: Fixed camelCase typos --- web/react/components/user_settings.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'web') diff --git a/web/react/components/user_settings.jsx b/web/react/components/user_settings.jsx index ed4f3fd98..7bc842814 100644 --- a/web/react/components/user_settings.jsx +++ b/web/react/components/user_settings.jsx @@ -524,7 +524,7 @@ var SecurityTab = React.createClass({ $(this.getDOMNode()).find('.form-control').each(function() { this.value = ''; }); - this.setState({current_password: '', new_password: '', confirm_password: '', server_error: null, password_error: null}); + this.setState({currentPassword: '', newPassword: '', confirmPassword: '', serverError: null, passwordError: null}); if (!this.state.willReturn) { this.props.updateTab('general'); @@ -540,7 +540,7 @@ var SecurityTab = React.createClass({ this.props.updateSection(''); }, getInitialState: function() { - return { current_password: '', new_password: '', confirm_password: '', willReturn: false }; + return {currentPassword: '', newPassword: '', confirmPassword: '', willReturn: false}; }, render: function() { var serverError = this.state.serverError ? this.state.serverError : null; -- cgit v1.2.3-1-g7c22 From 5c1bead36ac59ed62aeab97fc49ad2e6a9df458b Mon Sep 17 00:00:00 2001 From: nickago Date: Fri, 14 Aug 2015 09:09:39 -0700 Subject: cosmetic refactoring --- web/react/components/access_history_modal.jsx | 26 +++--- web/react/components/activity_log_modal.jsx | 112 ++++++++++++++------------ 2 files changed, 74 insertions(+), 64 deletions(-) (limited to 'web') diff --git a/web/react/components/access_history_modal.jsx b/web/react/components/access_history_modal.jsx index 678113a47..59c3384df 100644 --- a/web/react/components/access_history_modal.jsx +++ b/web/react/components/access_history_modal.jsx @@ -73,6 +73,11 @@ module.exports = React.createClass({ ); } + var divider = null; + if (i < this.state.audits.length - 1) { + divider = (
) + } + accessList[i] = (
{newDate}
@@ -82,16 +87,19 @@ module.exports = React.createClass({
{'IP: ' + currentAudit.ip_address}
{moreInfo}
- {i < this.state.audits.length - 1 ? -
- : - null - } + {divider}
); } + var content; + if (this.state.audits.loading) { + content = (); + } else { + content = (
{accessList}
); + } + return (
- {!this.state.audits.loading ? -
- {accessList} -
- : - - } + {content}
diff --git a/web/react/components/activity_log_modal.jsx b/web/react/components/activity_log_modal.jsx index 64f93ca71..6d466f976 100644 --- a/web/react/components/activity_log_modal.jsx +++ b/web/react/components/activity_log_modal.jsx @@ -10,27 +10,27 @@ var utils = require('../utils/utils.jsx'); function getStateFromStoresForSessions() { return { sessions: UserStore.getSessions(), - server_error: null, - client_error: null + serverError: null, + clientError: null }; } module.exports = React.createClass({ + displayName: 'ActivityLogModal', submitRevoke: function(altId) { - var self = this; Client.revokeSession(altId, function(data) { AsyncClient.getSessions(); }.bind(this), function(err) { - state = getStateFromStoresForSessions(); - state.server_error = err; + var state = getStateFromStoresForSessions(); + state.serverError = err; this.setState(state); }.bind(this) ); }, componentDidMount: function() { - UserStore.addSessionsChangeListener(this._onChange); + UserStore.addSessionsChangeListener(this.onListenerChange); $(this.refs.modal.getDOMNode()).on('shown.bs.modal', function (e) { AsyncClient.getSessions(); }); @@ -38,13 +38,13 @@ module.exports = React.createClass({ var self = this; $(this.refs.modal.getDOMNode()).on('hidden.bs.modal', function(e) { $('#user_settings1').modal('show'); - self.setState({ moreInfo: [] }); + self.setState({moreInfo: []}); }); }, componentWillUnmount: function() { - UserStore.removeSessionsChangeListener(this._onChange); + UserStore.removeSessionsChangeListener(this.onListenerChange); }, - _onChange: function() { + onListenerChange: function() { var newState = getStateFromStoresForSessions(); if (!utils.areStatesEqual(newState.sessions, this.state.sessions)) { this.setState(newState); @@ -53,7 +53,7 @@ module.exports = React.createClass({ handleMoreInfo: function(index) { var newMoreInfo = this.state.moreInfo; newMoreInfo[index] = true; - this.setState({ moreInfo: newMoreInfo }); + this.setState({moreInfo: newMoreInfo}); }, getInitialState: function() { var initialState = getStateFromStoresForSessions(); @@ -62,68 +62,76 @@ module.exports = React.createClass({ }, render: function() { var activityList = []; - var server_error = this.state.server_error ? this.state.server_error : null; + var serverError = this.state.serverError; + + // Squash any false-y value for server error into null + if (!serverError) { + serverError = null; + } for (var i = 0; i < this.state.sessions.length; i++) { var currentSession = this.state.sessions[i]; var lastAccessTime = new Date(currentSession.last_activity_at); var firstAccessTime = new Date(currentSession.create_at); - var devicePicture = ""; + var devicePicture = ''; - if (currentSession.props.platform === "Windows") { - devicePicture = "fa fa-windows"; + if (currentSession.props.platform === 'Windows') { + devicePicture = 'fa fa-windows'; } - else if (currentSession.props.platform === "Macintosh" || currentSession.props.platform === "iPhone") { - devicePicture = "fa fa-apple"; + else if (currentSession.props.platform === 'Macintosh' || currentSession.props.platform === 'iPhone') { + devicePicture = 'fa fa-apple'; } - else if (currentSession.props.platform === "Linux") { - devicePicture = "fa fa-linux"; + else if (currentSession.props.platform === 'Linux') { + devicePicture = 'fa fa-linux'; + } + + var moreInfo; + if (this.state.moreInfo[i]) { + moreInfo = ( +
+
{'First time active: ' + firstAccessTime.toDateString() + ', ' + lastAccessTime.toLocaleTimeString()}
+
{'OS: ' + currentSession.props.os}
+
{'Browser: ' + currentSession.props.browser}
+
{'Session ID: ' + currentSession.alt_id}
+
+ ); + } else { + moreInfo = (More info); } activityList[i] = ( -
-
-
{currentSession.props.platform}
-
-
{"Last activity: " + lastAccessTime.toDateString() + ", " + lastAccessTime.toLocaleTimeString()}
- { this.state.moreInfo[i] ? -
-
{"First time active: " + firstAccessTime.toDateString() + ", " + lastAccessTime.toLocaleTimeString()}
-
{"OS: " + currentSession.props.os}
-
{"Browser: " + currentSession.props.browser}
-
{"Session ID: " + currentSession.alt_id}
-
- : - More info - } +
+
+
{currentSession.props.platform}
+
+
{'Last activity: ' + lastAccessTime.toDateString() + ', ' + lastAccessTime.toLocaleTimeString()}
+ {moreInfo}
-
+
); } + var content; + if (this.state.sessions.loading) { + content = (); + } else { + content = (
{activityList}
); + } + return (
-