1
0
mirror of https://github.com/yldio/copilot.git synced 2024-11-13 06:40:06 +02:00

creating table directory and moving tooltip to speerate file so it can re-used by role column

This commit is contained in:
Alex Windett 2017-01-24 13:39:41 +00:00
parent deca0897a8
commit cf5505dee9
5 changed files with 53 additions and 24 deletions

View File

@ -35,6 +35,7 @@ const PeopleTable = (props) => {
const status = (person) => (
<PersonStatus
handleStatusTooltip={handleStatusTooltip}
membersStatusOptions={orgUI.members_status}
person={person}
toggledID={orgUI.member_role_tooltip}
/>

View File

@ -1,10 +1,11 @@
const React = require('react');
const Styled = require('styled-components');
const Tooltip = require('@ui/components/tooltip');
const fns = require('@ui/shared/functions');
const composers = require('@ui/shared/composers');
const Tooltip = require('./tooltip');
const {
pseudoEl
} = composers;
@ -36,17 +37,6 @@ const StyledWrapper = styled.div`
}
`;
const arrowPosition = {
bottom: '100%',
right: '10%'
};
const tooltipStyle = {
position: 'absolute',
top: 0,
zIndex: 1
};
const PlainButton = styled.button`
background: transparent;
font-size: inherit;
@ -56,22 +46,13 @@ const PlainButton = styled.button`
color: inherit;
`;
const tooltip = (person) => (
<Tooltip
arrowPosition={arrowPosition}
key={person.uuid}
style={tooltipStyle}
>
<li>Admin</li>
<li>Read Only</li>
<li>Unassigned</li>
</Tooltip>
);
const PersonStatus = (props) => {
const {
toggledID,
membersStatusOptions,
person,
handleStatusTooltip
} = props;
@ -85,13 +66,16 @@ const PersonStatus = (props) => {
{person.status}
</PlainButton>
{toggledID === person.uuid ? tooltip(person) : null}
{ toggledID === person.uuid
? <Tooltip options={membersStatusOptions} person={person} />
: null }
</StyledWrapper>
);
};
PersonStatus.propTypes = {
handleStatusTooltip: React.PropTypes.func,
membersStatusOptions: React.PropTypes.array,
person: React.PropTypes.object,
toggledID: React.PropTypes.oneOfType([
React.PropTypes.string,

View File

@ -0,0 +1,34 @@
const React = require('react');
const Tooltip = require('@ui/components/tooltip');
const tooltipStyle = {
position: 'absolute',
top: '30px',
zIndex: 1
};
const arrowPosition = {
bottom: '100%',
right: '10%'
};
module.exports = ({
person = {},
options = []
}) => {
return (
<Tooltip
arrowPosition={arrowPosition}
key={person.uuid}
style={tooltipStyle}
>
{options.map((o, i) => <li key={i}>{o}</li>)}
</Tooltip>
);
};
module.exports.propTypes = {
options: React.PropTypes.array,
person: React.PropTypes.object,
};

View File

@ -204,6 +204,16 @@
"projects",
"people",
"settings"
],
"members_status": [
"Active",
"Inactive",
"Invitation Sent"
],
"members_roles": [
"Owner",
"Unnassigned",
"Read Only"
]
},
"data": [{