diff --git a/frontend/src/components/people-list/table.js b/frontend/src/components/people-list/table/index.js
similarity index 93%
rename from frontend/src/components/people-list/table.js
rename to frontend/src/components/people-list/table/index.js
index 2060258b..9265f12c 100644
--- a/frontend/src/components/people-list/table.js
+++ b/frontend/src/components/people-list/table/index.js
@@ -35,6 +35,7 @@ const PeopleTable = (props) => {
const status = (person) => (
diff --git a/frontend/src/components/people-list/person-role.js b/frontend/src/components/people-list/table/person-role.js
similarity index 100%
rename from frontend/src/components/people-list/person-role.js
rename to frontend/src/components/people-list/table/person-role.js
diff --git a/frontend/src/components/people-list/person-status.js b/frontend/src/components/people-list/table/person-status.js
similarity index 74%
rename from frontend/src/components/people-list/person-status.js
rename to frontend/src/components/people-list/table/person-status.js
index e316093d..2f8fd0b7 100644
--- a/frontend/src/components/people-list/person-status.js
+++ b/frontend/src/components/people-list/table/person-status.js
@@ -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) => (
-
- Admin
- Read Only
- Unassigned
-
-);
+
const PersonStatus = (props) => {
const {
toggledID,
+ membersStatusOptions,
person,
handleStatusTooltip
} = props;
@@ -85,13 +66,16 @@ const PersonStatus = (props) => {
{person.status}
- {toggledID === person.uuid ? tooltip(person) : null}
+ { toggledID === person.uuid
+ ?
+ : null }
);
};
PersonStatus.propTypes = {
handleStatusTooltip: React.PropTypes.func,
+ membersStatusOptions: React.PropTypes.array,
person: React.PropTypes.object,
toggledID: React.PropTypes.oneOfType([
React.PropTypes.string,
diff --git a/frontend/src/components/people-list/table/tooltip.js b/frontend/src/components/people-list/table/tooltip.js
new file mode 100644
index 00000000..af2a0ec1
--- /dev/null
+++ b/frontend/src/components/people-list/table/tooltip.js
@@ -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 (
+
+ {options.map((o, i) => {o})}
+
+ );
+};
+
+module.exports.propTypes = {
+ options: React.PropTypes.array,
+ person: React.PropTypes.object,
+};
\ No newline at end of file
diff --git a/frontend/src/mock-state.json b/frontend/src/mock-state.json
index be4d72b1..27ffcc94 100644
--- a/frontend/src/mock-state.json
+++ b/frontend/src/mock-state.json
@@ -204,6 +204,16 @@
"projects",
"people",
"settings"
+ ],
+ "members_status": [
+ "Active",
+ "Inactive",
+ "Invitation Sent"
+ ],
+ "members_roles": [
+ "Owner",
+ "Unnassigned",
+ "Read Only"
]
},
"data": [{