likeopera-frontend/FolderList.js

54 lines
2.1 KiB
JavaScript

import React from 'react';
import AccountFolders from './AccountFolders.js';
import DropDownButton from './DropDownButton.js';
import Store from './Store.js';
import StoreListener from './StoreListener.js';
import MailProgress from './MailProgress.js';
class FolderList extends React.PureComponent
{
state = { selectedAccount: -1, selectedFolder: -1 }
render()
{
var self = this;
return (<div className={"folder-list"+(self.props.progressText ? ' progress-visible' : '')}>
<div className="top-border-gradient"></div>
<div className="bottom-border-gradient"></div>
<div className="actions">
<a className="button"><img src="icons/compose.png" /> Compose</a>
<DropDownButton dropdownId="check-send" className="check-send" icon="mail_check_send" onClick={self.onClickCheckSend} />
</div>
// TODO: keyboard navigation
<div className="listview" tabIndex="1">
{self.props.accounts.map(function(account, i) {
return <AccountFolders key={'a'+account.accountId} accountIndex={i}
onSelect={self.onSelectFolder} selected={self.state.selectedAccount == i ? self.state.selectedFolder : -1} account={account} />
})}
</div>
<MailProgress />
</div>)
}
onClickCheckSend = () =>
{
Store.startResync();
}
onSelectFolder = (accIndex, folderIndex) =>
{
var acc = this.props.accounts[accIndex];
var folder = this.props.accounts[accIndex].folders[folderIndex];
if (this.state.selectedAccount != accIndex || this.state.selectedFolder != folderIndex)
{
if (folder.folderId)
Store.loadFolder({ folderId: folder.folderId });
else
Store.loadFolder({ accountId: acc.accountId, folderType: folder.type });
}
this.setState({ selectedAccount: accIndex, selectedFolder: folderIndex });
}
}
export default StoreListener(FolderList, (data) => { return { accounts: data.accounts, progressText: data.progressText }; });