Merge pull request #369 from nickago/MM-1703
MM 1703 Closing access history or activity log returns user to security menu
Этот коммит содержится в:
@@ -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>
|
||||
|
||||
@@ -10,40 +10,41 @@ 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();
|
||||
});
|
||||
|
||||
var self = this;
|
||||
$(this.refs.modal.getDOMNode()).on('hidden.bs.modal', function(e) {
|
||||
self.setState({ moreInfo: [] });
|
||||
$('#user_settings').modal('show');
|
||||
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);
|
||||
@@ -52,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();
|
||||
@@ -61,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 = (
|
||||
<div>
|
||||
<div>{'First time active: ' + firstAccessTime.toDateString() + ', ' + lastAccessTime.toLocaleTimeString()}</div>
|
||||
<div>{'OS: ' + currentSession.props.os}</div>
|
||||
<div>{'Browser: ' + currentSession.props.browser}</div>
|
||||
<div>{'Session ID: ' + currentSession.alt_id}</div>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
moreInfo = (<a className='theme' href='#' onClick={this.handleMoreInfo.bind(this, i)}>More info</a>);
|
||||
}
|
||||
|
||||
activityList[i] = (
|
||||
<div className="activity-log__table">
|
||||
<div className="activity-log__report">
|
||||
<div className="report__platform"><i className={devicePicture} />{currentSession.props.platform}</div>
|
||||
<div className="report__info">
|
||||
<div>{"Last activity: " + lastAccessTime.toDateString() + ", " + lastAccessTime.toLocaleTimeString()}</div>
|
||||
{ this.state.moreInfo[i] ?
|
||||
<div>
|
||||
<div>{"First time active: " + firstAccessTime.toDateString() + ", " + lastAccessTime.toLocaleTimeString()}</div>
|
||||
<div>{"OS: " + currentSession.props.os}</div>
|
||||
<div>{"Browser: " + currentSession.props.browser}</div>
|
||||
<div>{"Session ID: " + currentSession.alt_id}</div>
|
||||
</div>
|
||||
:
|
||||
<a className="theme" href="#" onClick={this.handleMoreInfo.bind(this, i)}>More info</a>
|
||||
}
|
||||
<div className='activity-log__table'>
|
||||
<div className='activity-log__report'>
|
||||
<div className='report__platform'><i className={devicePicture} />{currentSession.props.platform}</div>
|
||||
<div className='report__info'>
|
||||
<div>{'Last activity: ' + lastAccessTime.toDateString() + ', ' + lastAccessTime.toLocaleTimeString()}</div>
|
||||
{moreInfo}
|
||||
</div>
|
||||
</div>
|
||||
<div className="activity-log__action"><button onClick={this.submitRevoke.bind(this, currentSession.alt_id)} className="btn btn-primary">Logout</button></div>
|
||||
<div className='activity-log__action'><button onClick={this.submitRevoke.bind(this, currentSession.alt_id)} className='btn btn-primary'>Logout</button></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
var content;
|
||||
if (this.state.sessions.loading) {
|
||||
content = (<LoadingScreen />);
|
||||
} else {
|
||||
content = (<form role='form'>{activityList}</form>);
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="modal fade" ref="modal" id="activity-log" tabIndex="-1" role="dialog" aria-hidden="true">
|
||||
<div className="modal-dialog modal-lg">
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
<button type="button" className="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 className="modal-title" id="myModalLabel">Active Sessions</h4>
|
||||
<div className='modal fade' ref='modal' id='activity-log' tabIndex='-1' role='dialog' aria-hidden='true'>
|
||||
<div className='modal-dialog modal-lg'>
|
||||
<div className='modal-content'>
|
||||
<div className='modal-header'>
|
||||
<button type='button' className='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>×</span></button>
|
||||
<h4 className='modal-title' id='myModalLabel'>Active Sessions</h4>
|
||||
</div>
|
||||
<p className="session-help-text">Sessions are created when you log in with your email and password to a new browser on a device. Sessions let you use Mattermost for up to 30 days without having to log in again. If you want to log out sooner, use the "Logout" button below to end a session.</p>
|
||||
<div ref="modalBody" className="modal-body">
|
||||
{ !this.state.sessions.loading ?
|
||||
<div>
|
||||
<form role="form">
|
||||
{ activityList }
|
||||
</form>
|
||||
{ server_error }
|
||||
</div>
|
||||
:
|
||||
<LoadingScreen />
|
||||
}
|
||||
<p className='session-help-text'>Sessions are created when you log in with your email and password to a new browser on a device. Sessions let you use Mattermost for up to 30 days without having to log in again. If you want to log out sooner, use the 'Logout' button below to end a session.</p>
|
||||
<div ref='modalBody' className='modal-body'>
|
||||
{content}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -96,7 +96,7 @@ var NavbarDropdown = React.createClass({
|
||||
<span className='dropdown__icon' dangerouslySetInnerHTML={{__html: Constants.MENU_ICON}} />
|
||||
</a>
|
||||
<ul className='dropdown-menu' role='menu'>
|
||||
<li><a href='#' data-toggle='modal' data-target='#user_settings1'>Account Settings</a></li>
|
||||
<li><a href='#' data-toggle='modal' data-target='#user_settings'>Account Settings</a></li>
|
||||
{teamSettings}
|
||||
{inviteLink}
|
||||
{teamLink}
|
||||
|
||||
@@ -72,7 +72,7 @@ module.exports = React.createClass({
|
||||
|
||||
<div className='nav-pills__container'>
|
||||
<ul className='nav nav-pills nav-stacked'>
|
||||
<li><a href='#' data-toggle='modal' data-target='#user_settings1'><i className='glyphicon glyphicon-cog'></i>Account Settings</a></li>
|
||||
<li><a href='#' data-toggle='modal' data-target='#user_settings'><i className='glyphicon glyphicon-cog'></i>Account Settings</a></li>
|
||||
{teamSettingsLink}
|
||||
{inviteLink}
|
||||
{teamLink}
|
||||
|
||||
@@ -105,11 +105,11 @@ var NotificationsTab = React.createClass({
|
||||
},
|
||||
componentDidMount: function() {
|
||||
UserStore.addChangeListener(this._onChange);
|
||||
$('#user_settings1').on('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').on('hidden.bs.modal', this.handleClose);
|
||||
},
|
||||
componentWillUnmount: function() {
|
||||
UserStore.removeChangeListener(this._onChange);
|
||||
$('#user_settings1').off('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').off('hidden.bs.modal', this.handleClose);
|
||||
this.props.updateSection('');
|
||||
},
|
||||
_onChange: function() {
|
||||
@@ -513,27 +513,34 @@ var SecurityTab = React.createClass({
|
||||
this.setState({confirmPassword: e.target.value});
|
||||
},
|
||||
handleHistoryOpen: function() {
|
||||
$('#user_settings1').modal('hide');
|
||||
this.setState({willReturn: true});
|
||||
$("#user_settings").modal('hide');
|
||||
},
|
||||
handleDevicesOpen: function() {
|
||||
$('#user_settings1').modal('hide');
|
||||
this.setState({willReturn: true});
|
||||
$("#user_settings").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');
|
||||
} else {
|
||||
this.setState({willReturn: false});
|
||||
}
|
||||
},
|
||||
componentDidMount: function() {
|
||||
$('#user_settings1').on('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').on('hidden.bs.modal', this.handleClose);
|
||||
},
|
||||
componentWillUnmount: function() {
|
||||
$('#user_settings1').off('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').off('hidden.bs.modal', this.handleClose);
|
||||
this.props.updateSection('');
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {currentPassword: '', newPassword: '', confirmPassword: ''};
|
||||
return {currentPassword: '', newPassword: '', confirmPassword: '', willReturn: false};
|
||||
},
|
||||
render: function() {
|
||||
var serverError = this.state.serverError ? this.state.serverError : null;
|
||||
@@ -811,10 +818,10 @@ var GeneralTab = React.createClass({
|
||||
this.props.updateSection('');
|
||||
},
|
||||
componentDidMount: function() {
|
||||
$('#user_settings1').on('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').on('hidden.bs.modal', this.handleClose);
|
||||
},
|
||||
componentWillUnmount: function() {
|
||||
$('#user_settings1').off('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').off('hidden.bs.modal', this.handleClose);
|
||||
},
|
||||
getInitialState: function() {
|
||||
var user = this.props.user;
|
||||
@@ -1093,7 +1100,7 @@ var AppearanceTab = React.createClass({
|
||||
if (this.props.activeSection === "theme") {
|
||||
$(this.refs[this.state.theme].getDOMNode()).addClass('active-border');
|
||||
}
|
||||
$('#user_settings1').on('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').on('hidden.bs.modal', this.handleClose);
|
||||
},
|
||||
componentDidUpdate: function() {
|
||||
if (this.props.activeSection === "theme") {
|
||||
@@ -1102,7 +1109,7 @@ var AppearanceTab = React.createClass({
|
||||
}
|
||||
},
|
||||
componentWillUnmount: function() {
|
||||
$('#user_settings1').off('hidden.bs.modal', this.handleClose);
|
||||
$('#user_settings').off('hidden.bs.modal', this.handleClose);
|
||||
this.props.updateSection('');
|
||||
},
|
||||
getInitialState: function() {
|
||||
|
||||
@@ -32,7 +32,7 @@ module.exports = React.createClass({
|
||||
tabs.push({name: "appearance", ui_name: "Appearance", icon: "glyphicon glyphicon-wrench"});
|
||||
|
||||
return (
|
||||
<div className="modal fade" ref="modal" id="user_settings1" role="dialog" tabIndex="-1" aria-hidden="true">
|
||||
<div className="modal fade" ref="modal" id="user_settings" role="dialog" tabIndex="-1" aria-hidden="true">
|
||||
<div className="modal-dialog settings-modal">
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
@@ -64,4 +64,3 @@ module.exports = React.createClass({
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -431,9 +431,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
#user_settings {
|
||||
border-right: none;
|
||||
}
|
||||
body {
|
||||
&.white {
|
||||
.inner__wrap {
|
||||
|
||||
@@ -143,12 +143,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
#user_settings {
|
||||
padding: 0 0.5em;
|
||||
border-right: 1px solid #ddd;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.channel-settings {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
Ссылка в новой задаче
Block a user