feature: Joined Communities functional, Post stats on group; Bug fix …

…on menu; Fully commented

The 'Communities You Joined' section is now working, rather than just dispalying a default message that you don't belong to any other communities. Adding someone to a community means they will see it show up on their end when they login, and they can add posts.

The groups list now show the amount of posts added to a group. Increment and decrement for adding or deleting posts.

A bug was present on initial login where the menu wouldn't show 'Logout'. Refereshing the page would show it though. Fixed that.

All files are now commented in detail. I spent most of the day at work getting that done, rather than listen to training.

client/src/actions/authActions.js

@@ -52,6 +52,7 @@ export const receiveLogout = () => ({
 /**
  *  Action creator for requesting a login.
  *
+ *  @param {string} user - User name
  *  @returns {object} - The action data
  */
 export const requestLogin = (user) => ({
@@ -117,10 +118,10 @@ const fetchLogout = (state) => dispatch => {
  *  @returns {function} - Dispatches returned action object
  */
 const fetchLogin = (state, expiresAt, accessToken, user) => dispatch => {
-  const user = state.auth.userData.name;
+  //const user = state.auth.userData.name;
   dispatch(requestLogin(user));
 
-  return axios.post('/auth/validate', {
+  return axios.post('/auth/login', {
       expiresAt: expiresAt,
       accessToken: accessToken,
       user: user
@@ -137,7 +138,8 @@ const fetchLogin = (state, expiresAt, accessToken, user) => dispatch => {
  *  @returns {function} - Dispatches returned action object
  */
 export const handleReturning = () => (dispatch, getState) => {
-  return dispatch(fetchReturning());
+  if (!getState().auth.isLoggingIn)
+    return dispatch(fetchReturning());
 }
 
 /**

client/src/components/pages/Manage/GroupManage.js

@@ -1,6 +1,6 @@
 import React, {Component} from 'react';
 import PropTypes from 'prop-types';
-import { Grid, Header, Icon, Form, Label } from "semantic-ui-react";
+import { Grid, Header, Icon, Form, Label, Divider } from "semantic-ui-react";
 import axios from 'axios';
 
 import ErrorLabel from '../../ErrorLabel/ErrorLabel';
@@ -32,6 +32,7 @@ class GroupManage extends Component {
         posts: PropTypes.array.isRequired,
         users: PropTypes.array.isRequired,
     }).isRequired,
+    onPostUpdate: PropTypes.func.isRequired,
   };
 
   constructor(props) {
@@ -145,7 +146,6 @@ class GroupManage extends Component {
     }
 
     if(valid && !/^https?:\/\/([\w\d-]+\.)+\w{2,}(\/.+)?$/.test(newPost)) {
-
       errors["newPost"] = "Must be a valid URL";
       valid = false;
     }
@@ -183,6 +183,8 @@ class GroupManage extends Component {
             postExists: false,
             addPostLoading: false,
           });
+          const { onPostUpdate } = this.props;
+          onPostUpdate(group, 'inc');
         }else {
           //error adding in db...
           this.setState({
@@ -220,7 +222,9 @@ class GroupManage extends Component {
         this.setState({
           posts: newPosts,
           deletingPost: '',
-        })
+        });
+        const { onPostUpdate } = this.props;
+        onPostUpdate(group, 'dec');
       }/*else error deleting post*/
     }).catch(err => {
       throw new Error('Error deleting post: ', err);
@@ -348,8 +352,10 @@ class GroupManage extends Component {
       deletingUser,
     } = this.state;
 
-    const {manageGroup} = this.props;
-
+    const {
+      manageGroup,
+    } = this.props;
+console.log('manageGroup2', manageGroup)
     let addErrorPost = '';
     let addErrorUser = '';
 
@@ -366,7 +372,7 @@ class GroupManage extends Component {
           <Grid.Column floated='left' width={10}>
             <Header as='h2'>
               <Label size='big' color='blue'>Managing Group:</Label>
-              {'  '}
+              {'   '}
               {manageGroup.group.display}
             </Header>
           </Grid.Column>
@@ -451,6 +457,7 @@ class GroupManage extends Component {
           </Grid.Column>
         </Grid.Row>
 
+        <Divider />
       </React.Fragment>
     )
   }

client/src/components/pages/Manage/GroupsList.js

@@ -14,10 +14,10 @@ import Loading from '../../Loading/Loading';
  *  @param {object} props - Component props
  *  @param {array} props.groups - Array of obejcts for each group to view
  *  @param {bool} props.areGroupsLoading - Determines if loading spinner shown
- *  @param {function} props.handleManageGroup - Call parent function to maange a group
- *  @param {bool} props.noOwned - Determines if there are no Owned groups to show
- *  @param {bool} props.isGroupLoading - Determines if loading spinner shown for that group
- *  @param {bool} props.selectedGroup - Selected group will have spinner if loading data
+ *  @param {function} props.handleManageGroup - Parent function to manage group
+ *  @param {bool} props.noOwned - Determines if there are no Owned groups
+ *  @param {bool} props.isGroupLoading - Determines if to show loading spinner
+ *  @param {bool} props.selectedGroup - Selected group will have spinner
  *  @param {function} props.showModal - Sets the modal to be shown or hidden
  *  @returns {Component} - A list of group components is rendered
  */
@@ -31,6 +31,7 @@ const GroupsList = (props) => {
     isGroupLoading,
     selectedGroup,
     showModal,
+    type,
   } = props;
 
   if (areGroupsLoading) {
@@ -83,10 +84,10 @@ const GroupsList = (props) => {
                         <div>
                           {`Created: ${date}`}
                         </div>
-                        {/*<div>
+                        <div>
                           {'Posts: '}
                           {g.posts}
-                        </div>*/}
+                        </div>
                         {/*<div>Followers: {g.followers}</div>*/}
                         {/*<div>Likes: {g.likes}</div>*/}
                       </div>
@@ -100,13 +101,14 @@ const GroupsList = (props) => {
         </Grid.Row>
       )
     }else {
+      const message = (type === 'owned')
+        ? ("You don't own any community groups. You can create up to 4 community groups.")
+        : ("You don't belong to any other communities.")
       return (
         <Grid.Column width={8}>
           <Segment>
             <p>
-              {"You don't own any community groups."}
-              <br />
-              {"You can create up to 4 community groups."}
+              {message}
             </p>
           </Segment>
         </Grid.Column>
@@ -123,6 +125,7 @@ GroupsList.propTypes = {
   isGroupLoading: PropTypes.bool.isRequired,
   selectedGroup: PropTypes.string.isRequired,
   showModal: PropTypes.func.isRequired,
+  type: PropTypes.string.isRequired,
 };
 
 export default GroupsList;