1
0
mirror of https://github.com/yldio/copilot.git synced 2024-11-28 14:10:04 +02:00

working on custom dropdown and pulling in platform members as datas

This commit is contained in:
Alex Windett 2017-01-30 15:20:37 +00:00
parent 59b678a101
commit 023f7fbe04
3 changed files with 95 additions and 89 deletions

View File

@ -43,6 +43,7 @@
"react-redux": "^5.0.2",
"react-router": "4.0.0-alpha.6",
"reduce-reducers": "^0.1.2",
"react-select": "^1.0.0-rc.2",
"redux": "^3.6.0",
"redux-actions": "^1.2.0",
"redux-batched-actions": "^0.1.5",

View File

@ -1,23 +1,48 @@
const React = require('react');
// const PropTypes = require('@root/prop-types');
const Row = require('@ui/components/row');
const Column = require('@ui/components/column');
const Button = require('@ui/components/button');
// const SelectCustom = require('@ui/components/select-custom');
const Invite = (props) => {
// TOOD: Require from UI Components - causes issue ATM.
const Select = require('react-select');
require('react-select/dist/react-select.css');
const Invite = React.createClass({
propTypes: {
// UI: React.PropTypes.object,
handleToggle: React.PropTypes.func,
// people: React.PropTypes.array,
platformMembers: React.PropTypes.array,
},
getInitialState() {
return {
selectValue: '',
members: []
};
},
getFormattedPlatformMembers() {
return this.props.platformMembers.map((m) => ({
value: m.email,
label: m.name
}));
},
render() {
const {
// people = [],
handleToggle,
// platformMembers
} = props;
// UI = {},
// people = [],
} = this.props;
// const InputStyle = {
// float: 'left',
// width: '75%'
// };
const InputStyle = {
float: 'left',
width: '75%'
};
const AddButtonStyle = {
float: 'right',
@ -28,32 +53,13 @@ const Invite = (props) => {
display: 'inline-block'
};
// const selectData = [
// {
// value: 'one',
// label: 'One'
// },
// {
// value: 'two',
// label: 'Two'
// },
// {
// value: 'three',
// label: 'Three'
// },
// {
// value: 'four',
// label: 'Four'
// },
// {
// value: 'five',
// label: 'Five'
// },
// {
// value: 'six',
// label: 'Six'
// }
// ];
const selectData = this.getFormattedPlatformMembers();
const handleSelectChange = (v) => {
this.setState({
selectValue: v
});
};
return (
<Row>
@ -64,13 +70,14 @@ const Invite = (props) => {
<Row>
<Column xs={12}>
{/*TODO: Fix why there are issues with webpack and nodemodules*/}
{/*<SelectCustom*/}
{/*multi*/}
{/*onChange={function noop() {}}*/}
{/*options={selectData}*/}
{/*placeholder="Enter an email address or password"*/}
{/*style={InputStyle}*/}
{/*/>*/}
<Select
onChange={handleSelectChange}
options={selectData}
placeholder="Enter an email address or password"
style={InputStyle}
value={this.state.selectValue}
/>
<Button
secondary
style={AddButtonStyle}
@ -96,12 +103,7 @@ const Invite = (props) => {
</Column>
</Row>
);
};
Invite.propTypes = {
handleToggle: React.PropTypes.func,
// orgUI: React.PropTypes.obj,
// people: React.PropTypes.arrayOf(PropTypes.person)
};
},
});
module.exports = Invite;

View File

@ -535,6 +535,9 @@
},
"projects": {
"ui": {
"invite_toggled": true,
"member_status_tooltip": false,
"member_role_tooltip": false,
"sections": [
"services",
"instances",