Basic dropdown

This commit is contained in:
John Lyon-Smith
2018-03-26 07:37:41 -07:00
parent cb708c720f
commit 90a920264b
7 changed files with 242 additions and 16 deletions

View File

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
import autobind from 'autobind-decorator'
import { regExpPattern } from 'regexp-pattern'
import { api } from 'src/API'
import { Row, Column, BoundInput, BoundButton, BoundCheckbox, BoundEmailIcon } from 'ui'
import { Row, Column, BoundInput, BoundButton, BoundCheckbox, BoundEmailIcon, DropdownList } from 'ui'
import { FormBinder } from 'react-form-binder'
import { sizeInfo } from 'ui/style'
@@ -144,6 +144,13 @@ export class UserForm extends React.Component {
</Row.Item>
</Row>
</Column.Item>
<Column.Item>
<DropdownList render={(item) => (
<DropdownList.Item style={{ paddingLeft: 8 }}>
<DropdownList.Text>Team Name</DropdownList.Text>
</DropdownList.Item>
)} />
</Column.Item>
<Column.Item height={sizeInfo.formColumnSpacing} />
<Column.Item minHeight={sizeInfo.buttonHeight}>
<Row>

View File

@@ -32,7 +32,7 @@ export class Users extends Component {
api.listUsers().then((list) => {
list.items.sort((userA, userB) => (userA.lastName.localeCompare(userB.lastName)))
this.setState({ users: list.items })
this.setState({ users: list.items, selectedUser: list.items[0] }) // TODO: <- Remove
}).catch((error) => {
this.setState({
messageModal: {
@@ -276,10 +276,10 @@ export class Users extends Component {
<Box border={{ width: sizeInfo.headerBorderWidth, color: colorInfo.headerBorder }} radius={sizeInfo.formBoxRadius}>
{
this.state.selectedUser
? <UserForm user={this.state.selectedUser} onSave={this.handleSave}
onRemove={this.handleRemove} onModifiedChanged={this.handleModifiedChanged}
onChangeEmail={this.handleChangeEmail} onResendEmail={this.handleResendEmail} />
: <UserFormPlaceholder />
? <UserForm user={this.state.selectedUser} onSave={this.handleSave}
onRemove={this.handleRemove} onModifiedChanged={this.handleModifiedChanged}
onChangeEmail={this.handleChangeEmail} onResendEmail={this.handleResendEmail} />
: <UserFormPlaceholder />
}
</Box>
</Row.Item>