// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import LoadingScreen from 'components/loading_screen.jsx';
import UserStore from 'stores/user_store.jsx';
import * as Utils from 'utils/utils.jsx';
import $ from 'jquery';
import PropTypes from 'prop-types';
import React from 'react';
import {Modal} from 'react-bootstrap';
import {FormattedMessage, FormattedTime, FormattedDate} from 'react-intl';
import {General} from 'mattermost-redux/constants';
export default class ActivityLogModal extends React.Component {
static propTypes = {
onHide: PropTypes.func.isRequired,
actions: PropTypes.shape({
getSessions: PropTypes.func.isRequired,
revokeSession: PropTypes.func.isRequired
}).isRequired
}
constructor(props) {
super(props);
this.submitRevoke = this.submitRevoke.bind(this);
this.onListenerChange = this.onListenerChange.bind(this);
this.handleMoreInfo = this.handleMoreInfo.bind(this);
this.onHide = this.onHide.bind(this);
this.onShow = this.onShow.bind(this);
const state = this.getStateFromStores();
state.moreInfo = [];
state.show = true;
this.state = state;
}
getStateFromStores() {
return {
sessions: UserStore.getSessions(),
clientError: null
};
}
submitRevoke(altId, e) {
e.preventDefault();
var modalContent = $(e.target).closest('.modal-content');
modalContent.addClass('animation--highlight');
setTimeout(() => {
modalContent.removeClass('animation--highlight');
}, 1500);
this.props.actions.revokeSession(UserStore.getCurrentId(), altId).then(() => {
this.props.actions.getSessions(UserStore.getCurrentId());
});
}
onShow() {
this.props.actions.getSessions(UserStore.getCurrentId());
if (!Utils.isMobile()) {
$('.modal-body').perfectScrollbar();
}
}
onHide() {
this.setState({show: false});
}
componentDidMount() {
UserStore.addSessionsChangeListener(this.onListenerChange);
this.onShow();
}
componentWillUnmount() {
UserStore.removeSessionsChangeListener(this.onListenerChange);
}
onListenerChange() {
const newState = this.getStateFromStores();
if (!Utils.areObjectsEqual(newState.sessions, this.state.sessions)) {
this.setState(newState);
}
}
handleMoreInfo(index) {
const newMoreInfo = this.state.moreInfo;
newMoreInfo[index] = true;
this.setState({moreInfo: newMoreInfo});
}
isMobileSession = (session) => {
return session.device_id && (session.device_id.includes('apple') || session.device_id.includes('android'));
};
mobileSessionInfo = (session) => {
let deviceTypeId;
let deviceTypeMessage;
let devicePicture;
if (session.device_id.includes('apple')) {
devicePicture = 'fa fa-apple';
deviceTypeId = 'activity_log_modal.iphoneNativeClassicApp';
deviceTypeMessage = 'iPhone Native Classic App';
if (session.device_id.includes(General.PUSH_NOTIFY_APPLE_REACT_NATIVE)) {
deviceTypeId = 'activity_log_modal.iphoneNativeApp';
deviceTypeMessage = 'iPhone Native App';
}
} else if (session.device_id.includes('android')) {
devicePicture = 'fa fa-android';
deviceTypeId = 'activity_log_modal.androidNativeClassicApp';
deviceTypeMessage = 'Android Native Classic App';
if (session.device_id.includes(General.PUSH_NOTIFY_ANDROID_REACT_NATIVE)) {
deviceTypeId = 'activity_log_modal.androidNativeApp';
deviceTypeMessage = 'Android Native App';
}
}
return {
devicePicture,
devicePlatform: (