PLT-3982 Add statuses to profile pictures in the RHS and popover member list (#3845)

* Added status indicator back to popover member list

* Updating positions of status indicator (#3844)

* Fixed squishy profile pictures and added statuses to RHS pics

1 files changed, 10 insertions, 4 deletions

diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx
index 423abcf82..cbb000922 100644
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -4,6 +4,7 @@
 import UserProfile from './user_profile.jsx';
 import PostBodyAdditionalContent from 'components/post_view/components/post_body_additional_content.jsx';
 import FileAttachmentList from './file_attachment_list.jsx';
+import ProfilePicture from 'components/profile_picture.jsx';
 
 import ChannelStore from 'stores/channel_store.jsx';
 import UserStore from 'stores/user_store.jsx';
@@ -40,6 +41,10 @@ export default class RhsRootPost extends React.Component {
     }
 
     shouldComponentUpdate(nextProps) {
+        if (nextProps.status !== this.props.status) {
+            return true;
+        }
+
         if (nextProps.compactDisplay !== this.props.compactDisplay) {
             return true;
         }
@@ -276,11 +281,11 @@ export default class RhsRootPost extends React.Component {
         }
 
         let profilePic = (
-            <img
-                className='post-profile-img'
+            <ProfilePicture
                 src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
-                height='36'
+                status={this.props.status}
                 width='36'
+                height='36'
             />
         );
 
@@ -410,5 +415,6 @@ RhsRootPost.propTypes = {
     commentCount: React.PropTypes.number,
     compactDisplay: React.PropTypes.bool,
     useMilitaryTime: React.PropTypes.bool.isRequired,
-    isFlagged: React.PropTypes.bool
+    isFlagged: React.PropTypes.bool,
+    status: React.PropTypes.string
 };