fixing breakdown functions and inconsistencies

Author: Rupeshiya

src/actions/postAction.js

@@ -111,3 +111,16 @@ export const removeReaction = (postId, type) => async (dispatch) => {
     dispatch(errorHandler(error));
   }
 };
+
+// PIN POST BY ID
+export const pinPost = (postId) => async (dispatch) => {
+  try {
+    const res = await axios.patch(`${BASE_URL}/post/pin/${postId}`)
+    if (res.status === 200) {
+      console.log('post pinned ', res.data.post)
+      dispatch(getAllPinnedPosts(10, 1));
+    }
+  } catch(error) {
+    dispatch(errorHandler(error))
+  }
+}

src/actions/usersAction.js

@@ -3,6 +3,7 @@ import { errorHandler } from '../utils/errorHandler'
 import axios from 'axios'
 import { setRequestStatus } from '../utils/setRequestStatus'
 import { BASE_URL } from './baseApi'
+const userId = localStorage.getItem('userId')
 
 // GET USER PROFILE
 export const getProfile = (id) => async (dispatch)=> {
@@ -106,11 +107,11 @@ export const updateProfile = (userId, updatedInfo) => async (dispatch) => {
 }
 
 // GET EVENTS CREATED BY USER 
-export const getEventsCreatedByUser = (userId, pagination = 10, page = 1) => async (dispatch) => {
+export const getEventsCreatedByUser = (id = userId, pagination = 10, page = 1) => async (dispatch) => {
   try { 
-    console.log('getEvents userId ', userId)
+    console.log('getEvents userId ', id)
     const res = await axios
-      .get(`${BASE_URL}/event/${userId}/all?pagination=${pagination}&page=${page}`);
+      .get(`${BASE_URL}/event/${id}/all?pagination=${pagination}&page=${page}`);
     dispatch(setRequestStatus(false))
     if(res.status === 200) {
       dispatch(setRequestStatus(true))
@@ -126,11 +127,11 @@ export const getEventsCreatedByUser = (userId, pagination = 10, page = 1) => asy
 }
 
 // GET ALL PROJECT CREATED BY A USER 
-export const getProjectCreatedByUser = (userId, pagination = 10, page = 1) => async (dispatch) => {
+export const getProjectCreatedByUser = (id = userId, pagination = 10, page = 1) => async (dispatch) => {
   try { 
-    console.log('getProjects userId ', userId)
+    console.log('getProjects userId ', id)
     const res = await axios
-      .get(`${BASE_URL}/project/${userId}/all?pagination=${pagination}&page=${page}`);
+      .get(`${BASE_URL}/project/${id}/all?pagination=${pagination}&page=${page}`);
     dispatch(setRequestStatus(false))
     if(res.status === 200) {
       dispatch(setRequestStatus(true))
@@ -146,11 +147,11 @@ export const getProjectCreatedByUser = (userId, pagination = 10, page = 1) => as
 }
 
 // GET POSTS CREATED BY USER 
-export const getPostsCreatedByUser = (userId, pagination = 10, page = 1) => async (dispatch) => {
+export const getPostsCreatedByUser = (id = userId, pagination = 10, page = 1) => async (dispatch) => {
   try { 
-    console.log('getPosts userId ', userId)
+    console.log('getPosts userId ', id)
     const res = await axios
-      .get(`${BASE_URL}/post/${userId}/all?pagination=${pagination}&page=${page}`);
+      .get(`${BASE_URL}/post/${id}/all?pagination=${pagination}&page=${page}`);
     dispatch(setRequestStatus(false))
     if(res.status === 200) {
       dispatch(setRequestStatus(true))

src/user/dashboard/news-feed/news-feed.js

@@ -10,15 +10,15 @@ import {
   Avatar,
   ListItemText,
   // ListItemSecondaryAction,
-  IconButton,
+  // IconButton,
   CardMedia,
 } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
-import { Button, Dropdown, FormControl } from "react-bootstrap";
+import { Button, Dropdown } from "react-bootstrap";
 import AddEventModal from "./popups/AddEventModal";
 import AddProjectModal from "./popups/AddProjectModal";
 import PostReactionModal from "./popups/PostReactionsModal";
-import ArrowDropUpIcon from "@material-ui/icons/ArrowDropUp";
+// import ArrowDropUpIcon from "@material-ui/icons/ArrowDropUp";
 import ChatBubbleIcon from "@material-ui/icons/ChatBubble";
 import "../../pinned-posts/posts/posts.scss";
 import "./news-feed.scss";
@@ -35,15 +35,16 @@ import { withRouter } from "react-router-dom";
 import { rsvpYes } from "../../../actions/eventAction";
 import { FaEllipsisH, FaThumbtack } from "react-icons/fa";
 import ReactionsElement from "./ReactionsElement";
+import { pinPost } from '../../../actions/postAction'
 import Moment from "react-moment";
 
-const reactionVariant = {
-  hover: {
-    scale: 1.3,
-    opacity: 0.9,
-    rotate: [0, 10, 0, -10, 0],
-  },
-};
+// const reactionVariant = {
+//   hover: {
+//     scale: 1.3,
+//     opacity: 0.9,
+//     rotate: [0, 10, 0, -10, 0],
+//   },
+// };
 
 const navStyles = { position: 'fixed', width: '83%', top: '0', zIndex:1, background: '#fff', marginTop: '0px', marginBottom:'0px'}
 
@@ -193,10 +194,10 @@ function NewsFeed(props) {
     toggle(!showComment);
   };
 
-  let onUpvote = (postId) => {
-    console.log("upvote clicked!", postId);
-    props.upVotePost(postId);
-  };
+  // let onUpvote = (postId) => {
+  //   console.log("upvote clicked!", postId);
+  //   props.upVotePost(postId);
+  // };
 
   let onRsvpYes = (eventId) => {
     console.log("On rsvp yes ", eventId);
@@ -221,6 +222,11 @@ function NewsFeed(props) {
     setShowReactions(false);
   };
 
+  let onPinPost = (postId) => {
+    console.log('Pinning post ', postId)
+    props.pinPost(postId)
+  }
+
   useEffect(() => {
     if (Object.keys(votes).length !== 0) {
       setShowReactions(true);
@@ -279,7 +285,10 @@ function NewsFeed(props) {
                   </h2>
                   <Moment format="DD MMM YYYY">{post?.createdAt}</Moment>
                 </ListItemText>
-                <FaThumbtack style={{ margin: "10px", width: "10px" }} />
+                <FaThumbtack 
+                  style={{ margin: "10px", width: "10px", cursor: "pointer" }} 
+                  onClick={() => onPinPost(post._id)}
+                />
                 <Dropdown>
                   <Dropdown.Toggle
                     as={CustomToggle}
@@ -631,5 +640,6 @@ const mapStateToProps = (state) => ({
 export default connect(mapStateToProps, {
   getAllCommentsOfPost,
   upVotePost,
+  pinPost,
   rsvpYes,
 })(withRouter(NewsFeed));

src/user/dashboard/news-feed/popups/comment.js

@@ -1,7 +1,7 @@
 import React, { Component } from "react";
 import { Modal, Button, Row, Col, Form } from "react-bootstrap";
 import { connect } from 'react-redux';
-import { createComment, getAllCommentsOfPost, deleteComment } from '../../../../actions/commentAction'
+import { createComment, deleteComment } from '../../../../actions/commentAction'
 import "./comment.scss";
 // import comments from "../../../../jsonData/comments";
 import profile_img from '../../../../assets/svgs/profile-icon.svg'
@@ -134,4 +134,4 @@ const mapStateToProps = (state) => ({
   post: state.post
 })
 
-export default connect(mapStateToProps, { getAllCommentsOfPost, createComment, deleteComment })(Comment);
+export default connect(mapStateToProps, {createComment, deleteComment })(Comment);

src/user/profile/profile-feed.js

@@ -30,21 +30,6 @@ class ProfileFeed extends Component {
       displayingPost: 0,
     };
   }
-  componentDidMount() {
-    console.log(this.props);
-    setTimeout(() => {
-      this.props.getProfile();
-    });
-    setTimeout(() => {
-      this.props.getPostsCreatedByUser();
-    });
-    setTimeout(() => {
-      this.props.getEventsCreatedByUser();
-    });
-    setTimeout(() => {
-      this.props.getProjectCreatedByUser();
-    });
-  }
 
   componentWillReceiveProps(nextProps) {
     const { userEvents, userProjects, userPosts, userProfile } = nextProps.user;

src/user/profile/profile.js

@@ -32,10 +32,10 @@ class Profile extends Component {
   componentDidMount() {
     console.log("match", this.props.match?.path);
     const { path, params } = this.props.match;
-    const userId = params.id
+    const userId = params.id ? params.id : localStorage.getItem('userId')
     console.log("checking profile", userId);
-    this.props.getProfile(userId)
     setTimeout(() => {
+      this.props.getProfile(userId);
       this.props.getOrgProfile();
     })
     setTimeout(() => {