import _ from 'underscore'; import _str from 'underscore.string'; import classNames from 'classnames'; import {Actions, AccountStore, NylasSyncStatusStore, React} from 'nylas-exports'; const MONTH_SHORT_FORMATS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; export default class InitialSyncActivity extends React.Component { static displayName = 'InitialSyncActivity'; constructor(props) { super(props); this.state = { isExpanded: false, syncState: NylasSyncStatusStore.getSyncState(), syncProgress: NylasSyncStatusStore.getSyncProgress(), } this.mounted = false; } componentDidMount() { this.mounted = true; this.unsubs = [ NylasSyncStatusStore.listen(this.onDataChanged), Actions.expandInitialSyncState.listen(this.showExpandedState), ] } componentWillUnmount() { if (this.unsubs) { this.unsubs.forEach((unsub) => unsub()) } this.mounted = false; } onDataChanged = () => { const syncState = NylasSyncStatusStore.getSyncState() const syncProgress = NylasSyncStatusStore.getSyncProgress() this.setState({syncState, syncProgress}); } hideExpandedState = () => { this.setState({isExpanded: false}); } showExpandedState = () => { if (!this.state.isExpanded) { this.setState({isExpanded: true}); } else { this.setState({blink: true}); setTimeout(() => { if (this.mounted) { this.setState({blink: false}); } }, 1000) } } renderExpandedSyncState() { let maxHeight = 0; let accounts = _.map(this.state.syncState, (accountSyncState, accountId) => { const account = _.findWhere(AccountStore.accounts(), {id: accountId}); if (!account) { return false; } const {folderSyncProgress} = accountSyncState let folderStates = _.map(folderSyncProgress, ({progress, oldestProcessedDate}, name) => { return this.renderFolderProgress(name, progress, oldestProcessedDate) }) if (folderStates.length === 0) { folderStates =