diff --git a/internal_packages/composer/lib/account-contact-field.cjsx b/internal_packages/composer/lib/account-contact-field.cjsx
index 24589e5c0..dbd4ab479 100644
--- a/internal_packages/composer/lib/account-contact-field.cjsx
+++ b/internal_packages/composer/lib/account-contact-field.cjsx
@@ -1,5 +1,6 @@
-React = require 'react'
_ = require 'underscore'
+React = require 'react'
+classnames = require 'classnames'
{AccountStore} = require 'nylas-exports'
{Menu, ButtonDropdown} = require 'nylas-component-kit'
@@ -9,41 +10,52 @@ class AccountContactField extends React.Component
@propTypes:
value: React.PropTypes.object
- account: React.PropTypes.object,
+ accounts: React.PropTypes.array.isRequired
onChange: React.PropTypes.func.isRequired
- render: =>
-
-
{"From:"}
- {@_renderFromPicker()}
-
+ _onChooseContact: (contact) =>
+ accountId = contact.accountId
+ from = [contact]
+ @props.onChange({accountId, from})
+ @refs.dropdown.toggleDropdown()
- _renderFromPicker: ->
- if @props.account? && @props.value?
- label = @props.value.toString()
- if @props.account.aliases.length is 0
- return @_renderAccountSpan(label)
- return
+ return unless @props.value
+ label = @props.value.toString()
+ multipleAccounts = @props.accounts.length > 1
+ hasAliases = @props.accounts[0]?.aliases.length > 0
+ if multipleAccounts or hasAliases
+ {label}}
- menu={@_renderAliasesMenu(@props.account)}/>
+ menu={@_renderAccounts(@props.accounts)} />
else
- return @_renderAccountSpan("Please select an account")
+ @_renderAccountSpan(label)
- _renderAliasesMenu: (account) =>
+ _renderMenuItem: (contact) =>
+ className = classnames(
+ 'contact': true
+ 'is-alias': contact.isAlias
+ )
+ {contact.toString()}
+
+ _renderAccounts: (accounts) =>
+ items = AccountStore.aliasesFor(accounts)