Individual Community Group Pages to View and Join Communities

[KrNel]

New Features

• Individual Community Group Pages

Individual communities can now be viewed through their own page. This page grabs the data for the community, relative to the logged in user in order to know their access to the community. This determines if they joined it or not, and if they can or not.

All the posts that have been curated/added to the community are shown, with some stats such as Likes, Views and Rating (not yet developed). YOu also know who submitted it to the group, and when.

Below the Post section is the Members section. You can see the total number of members in the header, followed by the users in the group. the Role they have, and the date they Joined the group.

---

Other Changes/Improvements

• 'Join' requests moved to per-group pages

Previously, the Join requests where implemented on the main Communities page. But when I started to add the option in two places, the Newly Created in addition to where it already was in Recently Active, I had problems updating the status of the join request for one place only.

As such, I decided to move the Join requesting to the individual community pages that I was making. It's less quick to Join a group, since you now have to load the community page itself rather than click on Join from the Communities listing page. It just made things simpler for me. Maybe I'll bring it back to the COmmunities page in the future as well.

---

Bug and Other Fixes

• Spinner / no data when logging out after a page refresh

This was an annoying thing that took me a while to figure out how to correct properly. I thought I would have it one day, then I would do some more coding and do certain things, like refreshing and clicking, and notice the bug was happening in another case.

With Redux, I'm loading props from the connect() method to mapStateToProps. The user authentication data is then sent to the component. But, Redux is slow. It's not like passing the props in from the parent component where they are available immediately in `componentDidMount.

So I was ending up with empty user names and isAuth values defaulting to false since the props weren't received yet. I needed to check the user logged in with isAuth, and a user not logged in with (!isAuth && user === 'x') in order to get data called, along with a check in componentDidUpdate for when the previous user props changed to actually be the logged in user for database fetching of user related data.

But when doing a page refresh, then logging out immediately, none of the components were updating for the componentDidUpdate to check and fetch data. The csrf token was still in the Redux store, so I grabbed that as a way to check if someone just logged out and needs to get the data fetchced for them (csrf && !isAuth)

• Page error on looking for non-existent group

One thing I hadn't thought to check for earlier was the non-existent communities being searched for, like say if you manually typed it in, or had the page for it open in one tab, and then deleted it in another, and refreshed the page int he first. This was crashing the app because I didn't perform a check for the empty object.

To fix this, I checked the returned data to make sure the object was there by looking for it any properties having a length. If there is no length, that means there is nothing in the object, i.e. a community group that doesn't exist.

• Join Requests and Users count not updating on Manage page

One more thing that wasn't working was the updating of the Users and Join Requests count. It's not a bug, but something that needed to be fixed.

This was done with a call to increment the user count on the previous onUserUpdate function, and create a new onJoinRequestUpdate function to handle reducing the Join Requests count by 1