From cf5505dee9e9f568f2135eae1f45b4354ba63d72 Mon Sep 17 00:00:00 2001
From: Alex Windett <windettalex@gmail.com>
Date: Tue, 24 Jan 2017 13:39:41 +0000
Subject: [PATCH] creating table directory and moving tooltip to speerate file
 so it can  re-used by role column

---
 .../people-list/{table.js => table/index.js}  |  1 +
 .../people-list/{ => table}/person-role.js    |  0
 .../people-list/{ => table}/person-status.js  | 32 +++++------------
 .../components/people-list/table/tooltip.js   | 34 +++++++++++++++++++
 frontend/src/mock-state.json                  | 10 ++++++
 5 files changed, 53 insertions(+), 24 deletions(-)
 rename frontend/src/components/people-list/{table.js => table/index.js} (93%)
 rename frontend/src/components/people-list/{ => table}/person-role.js (100%)
 rename frontend/src/components/people-list/{ => table}/person-status.js (74%)
 create mode 100644 frontend/src/components/people-list/table/tooltip.js

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) => (
       <PersonStatus
         handleStatusTooltip={handleStatusTooltip}
+        membersStatusOptions={orgUI.members_status}
         person={person}
         toggledID={orgUI.member_role_tooltip}
       />
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) => (
-  <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,
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 (
+    <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,
+};
\ 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": [{