Full-Stack React Projects - Second Edition

Header

The header will contain information such as the name, avatar, and link to the profile of the user who posted, as well as the date the post was created. The code to display these details in the header section will be as follows.

mern-social/client/post/Post.js:

<CardHeader   avatar={      <Avatar src={'/api/users/photo/'+props.post.postedBy._id}/>   }   action={ props.post.postedBy._id === auth.isAuthenticated().user._id &&              <IconButton onClick={deletePost}>                <DeleteIcon />              </IconButton>          }   title={<Link to={"/user/" + props.post.postedBy._id}>{props.post.postedBy.name}</Link>}   subheader={(new Date(props.post.created)).toDateString()}   className={classes.cardHeader}/>

The header will also conditionally show a delete button if the signed-in user is ...