mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 08:16:09 +08:00
bd361c8abb
Summary: Refactored signature preferences page to allow more signatures than the previous 1-1 mapping for signatures and accounts. Created a multi select dropdown of the accounts for which a certain signature is set as default for. Added a button into the draft header From field to toggle between saved signatures. refactor(signatures): Add basic add/remove capabilities to static refactor(signatures): Hooked up signature actions and signature store for basic functionality fix(signatures): Cleaned up signature store and started on multiselectdropdown fix(signatures): Add multi signature toggle select to multiselect dropdown build(signatures): Built framework for multiselect dropdown build(signatures): Toggle button functionality for dropdown build(signatures): Build multi select from components and add debounce refactor(signatures): Move signature actions and signature store into flux fix(signatures): Styled composer signatures button/dropdown and fixed preferences checkmarks build(signatures): Finish main functionality, about to refactor composer signature button into injected component fix(signatures): Changed position styles fix(signatures): Fixed background color for dropdown button when blurred build(signatures): Began to write tests for signatures store, preferences and dropdown Test Plan: Wrote tests for preferences signatures, signature store, signature composer dropdown and refactored tests for signature composer extension. For signature composer extension I removed applyTransformsToDraft and unapplyTransformsToDraft and tested by sending emails with signatures to different providers to make sure the <signature> tag caused problems. Reviewers: bengotow, juan Reviewed By: juan Differential Revision: https://phab.nylas.com/D3073
106 lines
2.6 KiB
JavaScript
106 lines
2.6 KiB
JavaScript
import React from 'react';
|
|
import classnames from 'classnames';
|
|
import {
|
|
AccountStore,
|
|
} from 'nylas-exports';
|
|
import {Menu, ButtonDropdown, InjectedComponentSet} from 'nylas-component-kit';
|
|
|
|
export default class AccountContactField extends React.Component {
|
|
static displayName = 'AccountContactField';
|
|
|
|
static propTypes = {
|
|
value: React.PropTypes.object,
|
|
accounts: React.PropTypes.array.isRequired,
|
|
session: React.PropTypes.object.isRequired,
|
|
draft: React.PropTypes.object.isRequired,
|
|
onChange: React.PropTypes.func.isRequired,
|
|
};
|
|
|
|
_onChooseContact = (contact) => {
|
|
this.props.onChange({from: [contact]});
|
|
this.props.session.ensureCorrectAccount()
|
|
this.refs.dropdown.toggleDropdown();
|
|
}
|
|
|
|
_renderAccountSelector() {
|
|
if (!this.props.value) {
|
|
return (
|
|
<span />
|
|
);
|
|
}
|
|
|
|
const label = this.props.value.toString();
|
|
const multipleAccounts = this.props.accounts.length > 1;
|
|
const hasAliases = this.props.accounts[0] && this.props.accounts[0].aliases.length > 0;
|
|
|
|
if (multipleAccounts || hasAliases) {
|
|
return (
|
|
<ButtonDropdown
|
|
ref="dropdown"
|
|
bordered={false}
|
|
primaryItem={<span>{label}</span>}
|
|
menu={this._renderAccounts(this.props.accounts)}
|
|
/>
|
|
);
|
|
}
|
|
return this._renderAccountSpan(label);
|
|
}
|
|
|
|
_renderAccountSpan = (label) => {
|
|
return (
|
|
<span style={{position: "relative", top: 13, left: "0.5em"}}>
|
|
{label}
|
|
</span>
|
|
);
|
|
}
|
|
|
|
_renderMenuItem = (contact) => {
|
|
const className = classnames({
|
|
'contact': true,
|
|
'is-alias': contact.isAlias,
|
|
});
|
|
return (
|
|
<span className={className}>{contact.toString()}</span>
|
|
);
|
|
}
|
|
|
|
_renderAccounts(accounts) {
|
|
const items = AccountStore.aliasesFor(accounts);
|
|
return (
|
|
<Menu
|
|
items={items}
|
|
itemKey={contact => contact.id}
|
|
itemContent={this._renderMenuItem}
|
|
onSelect={this._onChooseContact}
|
|
/>
|
|
);
|
|
}
|
|
|
|
|
|
_renderFromFieldComponents = () => {
|
|
const {draft, session, accounts} = this.props
|
|
return (
|
|
<InjectedComponentSet
|
|
className="dropdown-component"
|
|
matching={{role: "Composer:FromFieldComponents"}}
|
|
exposedProps={{
|
|
draft,
|
|
session,
|
|
accounts,
|
|
currentAccount: draft.from[0],
|
|
}}
|
|
/>
|
|
)
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div className="composer-participant-field">
|
|
<div className="composer-field-label">From:</div>
|
|
{this._renderAccountSelector()}
|
|
{this._renderFromFieldComponents()}
|
|
</div>
|
|
);
|
|
}
|
|
}
|