implimenting adding member to org and project

frontend/src/components/people-list/invite.js

@@ -11,9 +11,11 @@ require('react-select/dist/react-select.css');
 const Invite = React.createClass({
 
   propTypes: {
+    addMemember: React.PropTypes.func,
     // UI: React.PropTypes.object,
     handleToggle: React.PropTypes.func,
     // people: React.PropTypes.array,
+    parentIndex: React.PropTypes.number,
     platformMembers: React.PropTypes.array,
   },
 
@@ -31,6 +33,22 @@ const Invite = React.createClass({
     }));
   },
 
+  handleSubmit(e) {
+    e.preventDefault();
+
+    const data = {
+      member: {
+        name: this.state.selectValue.label,
+        email: this.state.selectValue.value,
+        role: 'Unassigned',
+        status: 'Sent invitation',
+      },
+      parentIndex: this.props.parentIndex,
+    };
+
+    this.props.addMemember(data);
+  },
+
   render() {
 
     const {
@@ -69,21 +87,22 @@ const Invite = React.createClass({
 
           <Row>
             <Column xs={12}>
-              {/*TODO: Fix why there are issues with webpack and nodemodules*/}
-              <Select
-
-                onChange={handleSelectChange}
-                options={selectData}
-                placeholder="Enter an email address or password"
-                style={InputStyle}
-                value={this.state.selectValue}
-              />
-              <Button
-                secondary
-                style={AddButtonStyle}
-              >
-                Add
-              </Button>
+              <form onSubmit={this.handleSubmit}>
+                <Select
+                  onChange={handleSelectChange}
+                  options={selectData}
+                  placeholder="Enter an email address or password"
+                  style={InputStyle}
+                  value={this.state.selectValue}
+                />
+                <Button
+                  secondary
+                  style={AddButtonStyle}
+                  type="submit"
+                >
+                  Add
+                </Button>
+              </form>
             </Column>
           </Row>
 

frontend/src/containers/org/people.js

@@ -17,6 +17,7 @@ const {
 } = selectors;
 
 const {
+  addMemberToOrg,
   orgHandleInviteToggle,
   orgHandlePeopleRoleTooltip,
   orgHandlePeopleStatusTooltip,
@@ -43,6 +44,7 @@ const mapStateToProps = (state, {
 });
 
 const mapDispatchToProps = (dispatch) => ({
+  addMemember: (member) => dispatch(addMemberToOrg(member)),
   handleToggle: () => dispatch(orgHandleInviteToggle()),
   handleStatusTooltip: (id) => dispatch(orgHandlePeopleStatusTooltip(id)),
   handleRoleTooltip: (id) => dispatch(orgHandlePeopleRoleTooltip(id)),

frontend/src/containers/project/people.js

@@ -17,6 +17,7 @@ const {
 } = selectors;
 
 const {
+  addMemberToProject,
   projectHandleInviteToggle,
   projectHandlePeopleRoleTooltip,
   projectHandlePeopleStatusTooltip,
@@ -43,6 +44,7 @@ const mapStateToProps = (state, {
 });
 
 const mapDispatchToProps = (dispatch) => ({
+  addMemember: (member) => dispatch(addMemberToProject(member)),
   handleToggle: () => dispatch(projectHandleInviteToggle()),
   handleStatusTooltip: (id) => dispatch(projectHandlePeopleStatusTooltip(id)),
   handleRoleTooltip: (id) => dispatch(projectHandlePeopleRoleTooltip(id)),

frontend/src/state/actions.js

@@ -8,6 +8,8 @@ const {
 const APP = constantCase(process.env['APP_NAME']);
 
 const projectMemberActions = {
+  addMemberToProject:
+    createAction(`${APP}/PROJECT_ADD_MEMBER`),
   projectHandleInviteToggle:
     createAction(`${APP}/PROJECT_HANDLE_INVITE_MEMBER_TOGGLE`),
   projectHandlePeopleStatusTooltip:
@@ -21,6 +23,8 @@ const projectMemberActions = {
 };
 
 const orgMemberActions = {
+  addMemberToOrg:
+    createAction(`${APP}/ORG_ADD_MEMBER`),
   orgHandleInviteToggle:
     createAction(`${APP}/ORG_HANDLE_INVITE_MEMBER_TOGGLE`),
   orgHandlePeopleStatusTooltip:

frontend/src/state/reducers/orgs.js

@@ -7,6 +7,7 @@ const {
 } = ReduxActions;
 
 const {
+  addMemberToOrg,
   orgHandleInviteToggle,
   orgHandlePeopleRoleTooltip,
   orgHandlePeopleStatusTooltip,
@@ -15,6 +16,28 @@ const {
 } = actions;
 
 module.exports = handleActions({
+  [addMemberToOrg.toString()]: (state, action) => {
+
+    const {
+      parentIndex,
+      member,
+    } = action.payload;
+
+    return {
+      ...state,
+      data: [
+        ...state.data.slice(0, parentIndex),
+        {
+          ...state.data[parentIndex],
+          members: [
+            ...state.data[parentIndex].members,
+            member
+          ]
+        },
+        ...state.data.slice(parentIndex + 1),
+      ]
+    };
+  },
   [orgHandleInviteToggle.toString()]: (state, action) => {
     return {
       ...state,

frontend/src/state/reducers/projects.js

@@ -7,6 +7,7 @@ const {
 } = ReduxActions;
 
 const {
+  addMemberToProject,
   projectHandleInviteToggle,
   projectHandlePeopleRoleTooltip,
   projectHandlePeopleStatusTooltip,
@@ -15,6 +16,28 @@ const {
 } = actions;
 
 module.exports = handleActions({
+  [addMemberToProject.toString()]: (state, action) => {
+
+    const {
+      parentIndex,
+      member,
+    } = action.payload;
+
+    return {
+      ...state,
+      data: [
+        ...state.data.slice(0, parentIndex),
+        {
+          ...state.data[parentIndex],
+          members: [
+            ...state.data[parentIndex].members,
+            member
+          ]
+        },
+        ...state.data.slice(parentIndex + 1),
+      ]
+    };
+  },
   [projectHandleInviteToggle.toString()]: (state, action) => {
     return {
       ...state,