From 673f3a1144884373540030a8f5cca3bad3d00b63 Mon Sep 17 00:00:00 2001
From: Chris <ccbrown112@gmail.com>
Date: Wed, 19 Jul 2017 13:54:16 -0700
Subject: PLT-6689: fix user image requests (#6946)

* fix user image requests

* fix eslint errors and a few more cache busters
---
 webapp/components/post_view/post/post.jsx                     | 11 ++---------
 webapp/components/rhs_comment.jsx                             |  6 ++----
 webapp/components/rhs_root_post.jsx                           |  5 ++---
 webapp/components/search_results_item.jsx                     |  4 +---
 webapp/components/suggestion/at_mention_provider.jsx          |  3 +--
 webapp/components/suggestion/search_user_provider.jsx         |  3 +--
 webapp/components/suggestion/switch_channel_provider.jsx      |  5 +++--
 webapp/components/user_profile.jsx                            |  3 +--
 .../user_settings_general/user_settings_general.jsx           |  3 +--
 webapp/components/webrtc/components/webrtc_notification.jsx   |  3 +--
 webapp/components/webrtc/webrtc_controller.jsx                |  7 +++----
 11 files changed, 18 insertions(+), 35 deletions(-)

(limited to 'webapp/components')

diff --git a/webapp/components/post_view/post/post.jsx b/webapp/components/post_view/post/post.jsx
index eda4405bb..4491d888c 100644
--- a/webapp/components/post_view/post/post.jsx
+++ b/webapp/components/post_view/post/post.jsx
@@ -199,13 +199,6 @@ export default class Post extends React.PureComponent {
         const isSystemMessage = PostUtils.isSystemMessage(post);
         const fromWebhook = post.props && post.props.from_webhook === 'true';
 
-        let timestamp = 0;
-        if (!this.props.user || this.props.user.last_picture_update == null) {
-            timestamp = this.props.currentUser.last_picture_update;
-        } else {
-            timestamp = this.props.user.last_picture_update;
-        }
-
         let status = this.props.status;
         if (fromWebhook) {
             status = null;
@@ -213,7 +206,7 @@ export default class Post extends React.PureComponent {
 
         let profilePic = (
             <ProfilePicture
-                src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                src={PostUtils.getProfilePicSrcForPost(post, this.props.user)}
                 status={status}
                 user={this.props.user}
                 isBusy={this.props.isBusy}
@@ -223,7 +216,7 @@ export default class Post extends React.PureComponent {
         if (fromWebhook) {
             profilePic = (
                 <ProfilePicture
-                    src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                    src={PostUtils.getProfilePicSrcForPost(post, this.props.user)}
                 />
             );
         } else if (PostUtils.isSystemMessage(post)) {
diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx
index 568d85304..6592c487d 100644
--- a/webapp/components/rhs_comment.jsx
+++ b/webapp/components/rhs_comment.jsx
@@ -212,8 +212,6 @@ export default class RhsComment extends React.Component {
         const isEphemeral = Utils.isPostEphemeral(post);
         const isSystemMessage = PostUtils.isSystemMessage(post);
 
-        var timestamp = this.props.currentUser.last_picture_update;
-
         let status = this.props.status;
         if (post.props && post.props.from_webhook === 'true') {
             status = null;
@@ -277,7 +275,7 @@ export default class RhsComment extends React.Component {
 
         let profilePic = (
             <ProfilePicture
-                src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                src={PostUtils.getProfilePicSrcForPost(post, this.props.user)}
                 status={status}
                 width='36'
                 height='36'
@@ -289,7 +287,7 @@ export default class RhsComment extends React.Component {
         if (post.props && post.props.from_webhook) {
             profilePic = (
                 <ProfilePicture
-                    src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                    src={PostUtils.getProfilePicSrcForPost(post, this.props.user)}
                     width='36'
                     height='36'
                 />
diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx
index fa72da167..1a28dc008 100644
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -196,7 +196,6 @@ export default class RhsRootPost extends React.Component {
         const post = this.props.post;
         const user = this.props.user;
         const mattermostLogo = Constants.MATTERMOST_ICON_SVG;
-        var timestamp = user ? user.last_picture_update : 0;
         var channel = ChannelStore.get(post.channel_id);
 
         const isEphemeral = Utils.isPostEphemeral(post);
@@ -303,7 +302,7 @@ export default class RhsRootPost extends React.Component {
 
         let profilePic = (
             <ProfilePicture
-                src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                src={PostUtils.getProfilePicSrcForPost(post, user)}
                 status={status}
                 width='36'
                 height='36'
@@ -315,7 +314,7 @@ export default class RhsRootPost extends React.Component {
         if (post.props && post.props.from_webhook) {
             profilePic = (
                 <ProfilePicture
-                    src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                    src={PostUtils.getProfilePicSrcForPost(post, user)}
                     width='36'
                     height='36'
                 />
diff --git a/webapp/components/search_results_item.jsx b/webapp/components/search_results_item.jsx
index 3b632ee5e..56b91fe68 100644
--- a/webapp/components/search_results_item.jsx
+++ b/webapp/components/search_results_item.jsx
@@ -9,7 +9,6 @@ import ProfilePicture from './profile_picture.jsx';
 import CommentIcon from 'components/common/comment_icon.jsx';
 
 import TeamStore from 'stores/team_store.jsx';
-import UserStore from 'stores/user_store.jsx';
 
 import AppDispatcher from '../dispatcher/app_dispatcher.jsx';
 import * as GlobalActions from 'actions/global_actions.jsx';
@@ -113,7 +112,6 @@ export default class SearchResultsItem extends React.Component {
     render() {
         let channelName = null;
         const channel = this.props.channel;
-        const timestamp = UserStore.getCurrentUser().last_picture_update;
         const user = this.props.user || {};
         const post = this.props.post;
 
@@ -154,7 +152,7 @@ export default class SearchResultsItem extends React.Component {
 
         const profilePic = (
             <ProfilePicture
-                src={PostUtils.getProfilePicSrcForPost(post, timestamp)}
+                src={PostUtils.getProfilePicSrcForPost(post, user)}
                 user={this.props.user}
                 status={this.props.status}
                 isBusy={this.props.isBusy}
diff --git a/webapp/components/suggestion/at_mention_provider.jsx b/webapp/components/suggestion/at_mention_provider.jsx
index f967da3e4..9cf32440f 100644
--- a/webapp/components/suggestion/at_mention_provider.jsx
+++ b/webapp/components/suggestion/at_mention_provider.jsx
@@ -10,7 +10,6 @@ import {autocompleteUsersInChannel} from 'actions/user_actions.jsx';
 
 import AppDispatcher from 'dispatcher/app_dispatcher.jsx';
 import * as Utils from 'utils/utils.jsx';
-import {Client4} from 'mattermost-redux/client';
 import {Constants, ActionTypes} from 'utils/constants.jsx';
 
 import React from 'react';
@@ -66,7 +65,7 @@ class AtMentionSuggestion extends Suggestion {
             icon = (
                 <img
                     className='mention__image'
-                    src={Client4.getUsersRoute() + '/' + user.id + '/image?time=' + user.last_picture_update}
+                    src={Utils.imageURLForUser(user)}
                 />
             );
         }
diff --git a/webapp/components/suggestion/search_user_provider.jsx b/webapp/components/suggestion/search_user_provider.jsx
index d05d42a54..f3191c408 100644
--- a/webapp/components/suggestion/search_user_provider.jsx
+++ b/webapp/components/suggestion/search_user_provider.jsx
@@ -7,7 +7,6 @@ import Provider from './provider.jsx';
 import {autocompleteUsersInTeam} from 'actions/user_actions.jsx';
 
 import AppDispatcher from 'dispatcher/app_dispatcher.jsx';
-import {Client4} from 'mattermost-redux/client';
 import * as Utils from 'utils/utils.jsx';
 import {ActionTypes} from 'utils/constants.jsx';
 
@@ -41,7 +40,7 @@ class SearchUserSuggestion extends Suggestion {
                 <i className='fa fa fa-plus-square'/>
                 <img
                     className='profile-img rounded'
-                    src={Client4.getUsersRoute() + '/' + item.id + '/image?time=' + item.last_picture_update}
+                    src={Utils.imageURLForUser(item)}
                 />
                 <div className='mention--align'>
                     <span>
diff --git a/webapp/components/suggestion/switch_channel_provider.jsx b/webapp/components/suggestion/switch_channel_provider.jsx
index ba060d924..ac4af9c8b 100644
--- a/webapp/components/suggestion/switch_channel_provider.jsx
+++ b/webapp/components/suggestion/switch_channel_provider.jsx
@@ -58,7 +58,7 @@ class SwitchChannelSuggestion extends Suggestion {
                 <div className='pull-left'>
                     <img
                         className='mention__image'
-                        src={Client4.getUsersRoute() + '/' + channel.id + '/image?time=' + channel.last_picture_update}
+                        src={Utils.imageURLForUser(channel)}
                     />
                 </div>
             );
@@ -239,7 +239,8 @@ export default class SwitchChannelProvider extends Provider {
                     name: user.username,
                     id: user.id,
                     update_at: user.update_at,
-                    type: Constants.DM_CHANNEL
+                    type: Constants.DM_CHANNEL,
+                    last_picture_update: user.last_picture_update || 0
                 },
                 name: user.username
             };
diff --git a/webapp/components/user_profile.jsx b/webapp/components/user_profile.jsx
index 1cd2ef637..d8549cc7b 100644
--- a/webapp/components/user_profile.jsx
+++ b/webapp/components/user_profile.jsx
@@ -3,7 +3,6 @@
 
 import ProfilePopover from './profile_popover.jsx';
 import * as Utils from 'utils/utils.jsx';
-import {Client4} from 'mattermost-redux/client';
 
 import {OverlayTrigger} from 'react-bootstrap';
 
@@ -59,7 +58,7 @@ export default class UserProfile extends React.Component {
 
         if (this.props.user) {
             name = Utils.displayUsername(this.props.user.id);
-            profileImg = Client4.getUsersRoute() + '/' + this.props.user.id + '/image?time=' + this.props.user.last_picture_update;
+            profileImg = Utils.imageURLForUser(this.props.user);
         }
 
         if (this.props.overwriteName) {
diff --git a/webapp/components/user_settings/user_settings_general/user_settings_general.jsx b/webapp/components/user_settings/user_settings_general/user_settings_general.jsx
index 0f0459180..613744b43 100644
--- a/webapp/components/user_settings/user_settings_general/user_settings_general.jsx
+++ b/webapp/components/user_settings/user_settings_general/user_settings_general.jsx
@@ -9,7 +9,6 @@ import SettingPicture from 'components/setting_picture.jsx';
 import UserStore from 'stores/user_store.jsx';
 import ErrorStore from 'stores/error_store.jsx';
 
-import {Client4} from 'mattermost-redux/client';
 import Constants from 'utils/constants.jsx';
 import * as Utils from 'utils/utils.jsx';
 
@@ -1141,7 +1140,7 @@ class UserSettingsGeneralTab extends React.Component {
                 <SettingPicture
                     title={formatMessage(holders.profilePicture)}
                     submit={this.submitPicture}
-                    src={Client4.getUsersRoute() + '/' + user.id + '/image?time=' + user.last_picture_update}
+                    src={Utils.imageURLForUser(user)}
                     serverError={serverError}
                     clientError={clientError}
                     updateSection={(e) => {
diff --git a/webapp/components/webrtc/components/webrtc_notification.jsx b/webapp/components/webrtc/components/webrtc_notification.jsx
index 2c21924b2..efa6ee637 100644
--- a/webapp/components/webrtc/components/webrtc_notification.jsx
+++ b/webapp/components/webrtc/components/webrtc_notification.jsx
@@ -1,7 +1,6 @@
 // Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-import {Client4} from 'mattermost-redux/client';
 import WebSocketClient from 'client/web_websocket_client.jsx';
 
 import UserStore from 'stores/user_store.jsx';
@@ -197,7 +196,7 @@ export default class WebrtcNotification extends React.Component {
         const user = this.state.userCalling;
         if (user) {
             const username = Utils.displayUsername(user.id);
-            const profileImgSrc = Client4.getUsersRoute() + '/' + user.id + '/image?time=' + (user.last_picture_update || new Date().getTime());
+            const profileImgSrc = Utils.imageURLForUser(user);
             const profileImg = (
                 <img
                     className='user-popover__image'
diff --git a/webapp/components/webrtc/webrtc_controller.jsx b/webapp/components/webrtc/webrtc_controller.jsx
index 650a8dd9e..9a6dcb94e 100644
--- a/webapp/components/webrtc/webrtc_controller.jsx
+++ b/webapp/components/webrtc/webrtc_controller.jsx
@@ -5,7 +5,6 @@ import UserStore from 'stores/user_store.jsx';
 import ChannelStore from 'stores/channel_store.jsx';
 import WebrtcStore from 'stores/webrtc_store.jsx';
 
-import {Client4} from 'mattermost-redux/client';
 import WebSocketClient from 'client/web_websocket_client.jsx';
 import Janus from 'janus';
 
@@ -84,14 +83,14 @@ export default class WebrtcController extends React.Component {
 
         const currentUser = UserStore.getCurrentUser();
         const remoteUser = UserStore.getProfile(props.userId);
-        const remoteUserImage = Client4.getUsersRoute() + '/' + remoteUser.id + '/image?time=' + remoteUser.last_picture_update;
+        const remoteUserImage = Utils.imageURLForUser(remoteUser);
 
         this.state = {
             windowWidth: Utils.windowWidth(),
             windowHeight: Utils.windowHeight(),
             channelId: ChannelStore.getCurrentId(),
             currentUser,
-            currentUserImage: Client4.getUsersRoute() + '/' + currentUser.id + '/image?time=' + currentUser.last_picture_update,
+            currentUserImage: Utils.imageURLForUser(currentUser),
             remoteUserImage,
             localMediaLoaded: false,
             isPaused: false,
@@ -133,7 +132,7 @@ export default class WebrtcController extends React.Component {
             (nextProps.userId !== this.props.userId) ||
             (nextProps.isCaller !== this.props.isCaller)) {
             const remoteUser = UserStore.getProfile(nextProps.userId);
-            const remoteUserImage = Client4.getUsersRoute() + '/' + remoteUser.id + '/image?time=' + remoteUser.last_picture_update;
+            const remoteUserImage = Utils.imageURLForUser(remoteUser);
             this.setState({
                 error: null,
                 remoteUserImage
-- 
cgit v1.2.3-1-g7c22