55 lines
2.1 KiB
JavaScript
55 lines
2.1 KiB
JavaScript
import React from 'react';
|
|
import AccountFolders from './AccountFolders.js';
|
|
import DropDownButton from './DropDownButton.js';
|
|
import ProgressBar from './ProgressBar.js';
|
|
|
|
export default class FolderList extends React.PureComponent
|
|
{
|
|
state = { selectedAccount: -1, selectedFolder: -1 }
|
|
|
|
render()
|
|
{
|
|
return (<div className={"folder-list"+(this.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={this.onClickCheckSend} />
|
|
</div>
|
|
// TODO: keyboard navigation
|
|
<div className="listview" tabIndex="1">
|
|
{this.props.accounts.map((account, i) => <AccountFolders
|
|
key={'a'+account.accountId}
|
|
accountIndex={i}
|
|
onSelect={this.onSelectFolder}
|
|
selected={this.state.selectedAccount == i ? this.state.selectedFolder : -1}
|
|
account={account}
|
|
/>)}
|
|
</div>
|
|
<ProgressBar
|
|
text={this.props.progressText}
|
|
progress={this.props.progressPercent}
|
|
/>
|
|
</div>)
|
|
}
|
|
|
|
onClickCheckSend = () =>
|
|
{
|
|
this.props.startResync();
|
|
}
|
|
|
|
onSelectFolder = (accIndex, folderIndex) =>
|
|
{
|
|
let acc = this.props.accounts[accIndex];
|
|
let folder = this.props.accounts[accIndex].folders[folderIndex];
|
|
if (this.state.selectedAccount != accIndex || this.state.selectedFolder != folderIndex)
|
|
{
|
|
if (folder.folderId)
|
|
this.props.loadFolder({ folderId: folder.folderId });
|
|
else
|
|
this.props.loadFolder({ accountId: acc.accountId, folderType: folder.type });
|
|
}
|
|
this.setState({ selectedAccount: accIndex, selectedFolder: folderIndex });
|
|
}
|
|
}
|