Hotfix: PLT-4779 Fixing scrolling on loading a channel and missing DM channel headers (#4584)
* Added all parameters to call tracker ids when getting profiles * Changed channel header rendering to not depend on knowing all users in a DM channel * Added comment about a race condition in UserActions.populateDMChannelsWithProfiles * Added a fixed-height placeholder for the ChannelHeader when its state isn't valid for rendering
Этот коммит содержится в:
коммит произвёл
GitHub
родитель
477dc6c4b6
Коммит
a9824a3653
@@ -135,6 +135,7 @@ function populateDMChannelsWithProfiles(userIds) {
|
||||
const currentUserId = UserStore.getCurrentId();
|
||||
|
||||
for (let i = 0; i < userIds.length; i++) {
|
||||
// TODO There's a race condition here for DM channels if those channels aren't loaded yet
|
||||
const channelName = getDirectChannelName(currentUserId, userIds[i]);
|
||||
const channel = ChannelStore.getByName(channelName);
|
||||
if (channel) {
|
||||
|
||||
@@ -68,12 +68,18 @@ export default class ChannelHeader extends React.Component {
|
||||
const stats = ChannelStore.getStats(this.props.channelId);
|
||||
const users = UserStore.getProfileListInChannel(this.props.channelId);
|
||||
|
||||
let otherUserId = null;
|
||||
if (channel.type === 'D') {
|
||||
otherUserId = Utils.getUserIdFromChannelName(channel);
|
||||
}
|
||||
|
||||
return {
|
||||
channel,
|
||||
memberChannel: ChannelStore.getMyMember(this.props.channelId),
|
||||
users,
|
||||
userCount: stats.member_count,
|
||||
currentUser: UserStore.getCurrentUser(),
|
||||
otherUserId,
|
||||
enableFormatting: PreferenceStore.getBool(Preferences.CATEGORY_ADVANCED_SETTINGS, 'formatting', true),
|
||||
isBusy: WebrtcStore.isBusy(),
|
||||
isFavorite: channel && ChannelUtils.isFavoriteChannel(channel)
|
||||
@@ -84,7 +90,6 @@ export default class ChannelHeader extends React.Component {
|
||||
if (!this.state.channel ||
|
||||
!this.state.memberChannel ||
|
||||
!this.state.users ||
|
||||
(Object.keys(this.state.users).length === 0 && this.state.channel.type === 'D') ||
|
||||
!this.state.userCount ||
|
||||
!this.state.currentUser) {
|
||||
return false;
|
||||
@@ -240,7 +245,10 @@ export default class ChannelHeader extends React.Component {
|
||||
const flagIcon = Constants.FLAG_ICON_SVG;
|
||||
|
||||
if (!this.validState()) {
|
||||
return null;
|
||||
// Use an empty div to make sure the header's height stays constant
|
||||
return (
|
||||
<div className='channel-header'/>
|
||||
);
|
||||
}
|
||||
|
||||
const channel = this.state.channel;
|
||||
@@ -285,7 +293,7 @@ export default class ChannelHeader extends React.Component {
|
||||
|
||||
if (isDirect) {
|
||||
const userMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
|
||||
const contact = this.state.users[0];
|
||||
const otherUserId = this.state.otherUserId;
|
||||
|
||||
const teammateId = Utils.getUserIdFromChannelName(channel);
|
||||
channelTitle = Utils.displayUsername(teammateId);
|
||||
@@ -293,7 +301,7 @@ export default class ChannelHeader extends React.Component {
|
||||
const webrtcEnabled = global.mm_config.EnableWebrtc === 'true' && userMedia && Utils.isFeatureEnabled(PreReleaseFeatures.WEBRTC_PREVIEW);
|
||||
|
||||
if (webrtcEnabled) {
|
||||
const isOffline = UserStore.getStatus(contact.id) === UserStatuses.OFFLINE;
|
||||
const isOffline = UserStore.getStatus(otherUserId) === UserStatuses.OFFLINE;
|
||||
const busy = this.state.isBusy;
|
||||
let circleClass = '';
|
||||
let webrtcMessage;
|
||||
@@ -321,7 +329,7 @@ export default class ChannelHeader extends React.Component {
|
||||
<div className='webrtc__header'>
|
||||
<a
|
||||
href='#'
|
||||
onClick={() => this.initWebrtc(contact.id, !isOffline)}
|
||||
onClick={() => this.initWebrtc(otherUserId, !isOffline)}
|
||||
disabled={isOffline}
|
||||
>
|
||||
<svg
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
@charset 'UTF-8';
|
||||
|
||||
.channel-header {
|
||||
@include flex(0 0 56px);
|
||||
@include flex(0 0 57px);
|
||||
border-left: none;
|
||||
font-size: 14px;
|
||||
line-height: 56px;
|
||||
|
||||
@@ -298,15 +298,17 @@ export function getChannelMember(channelId, userId) {
|
||||
}
|
||||
|
||||
export function getUser(userId) {
|
||||
if (isCallInProgress(`getUser${userId}`)) {
|
||||
const callName = `getUser${userId}`;
|
||||
|
||||
if (isCallInProgress(callName)) {
|
||||
return;
|
||||
}
|
||||
|
||||
callTracker[`getUser${userId}`] = utils.getTimestamp();
|
||||
callTracker[callName] = utils.getTimestamp();
|
||||
Client.getUser(
|
||||
userId,
|
||||
(data) => {
|
||||
callTracker[`getUser${userId}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
|
||||
AppDispatcher.handleServerAction({
|
||||
type: ActionTypes.RECEIVED_PROFILE,
|
||||
@@ -314,23 +316,25 @@ export function getUser(userId) {
|
||||
});
|
||||
},
|
||||
(err) => {
|
||||
callTracker[`getUser${userId}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
dispatchError(err, 'getUser');
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export function getProfiles(offset = UserStore.getPagingOffset(), limit = Constants.PROFILE_CHUNK_SIZE) {
|
||||
if (isCallInProgress(`getProfiles${offset}${limit}`)) {
|
||||
const callName = `getProfiles${offset}${limit}`;
|
||||
|
||||
if (isCallInProgress(callName)) {
|
||||
return;
|
||||
}
|
||||
|
||||
callTracker[`getProfiles${offset}${limit}`] = utils.getTimestamp();
|
||||
callTracker[callName] = utils.getTimestamp();
|
||||
Client.getProfiles(
|
||||
offset,
|
||||
limit,
|
||||
(data) => {
|
||||
callTracker[`getProfiles${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
|
||||
AppDispatcher.handleServerAction({
|
||||
type: ActionTypes.RECEIVED_PROFILES,
|
||||
@@ -338,24 +342,26 @@ export function getProfiles(offset = UserStore.getPagingOffset(), limit = Consta
|
||||
});
|
||||
},
|
||||
(err) => {
|
||||
callTracker[`getProfiles${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
dispatchError(err, 'getProfiles');
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export function getProfilesInTeam(teamId = TeamStore.getCurrentId(), offset = UserStore.getInTeamPagingOffset(), limit = Constants.PROFILE_CHUNK_SIZE) {
|
||||
if (isCallInProgress(`getProfilesInTeam${offset}${limit}`)) {
|
||||
const callName = `getProfilesInTeam${teamId}${offset}${limit}`;
|
||||
|
||||
if (isCallInProgress(callName)) {
|
||||
return;
|
||||
}
|
||||
|
||||
callTracker[`getProfilesInTeam${offset}${limit}`] = utils.getTimestamp();
|
||||
callTracker[callName] = utils.getTimestamp();
|
||||
Client.getProfilesInTeam(
|
||||
teamId,
|
||||
offset,
|
||||
limit,
|
||||
(data) => {
|
||||
callTracker[`getProfilesInTeam${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
|
||||
AppDispatcher.handleServerAction({
|
||||
type: ActionTypes.RECEIVED_PROFILES_IN_TEAM,
|
||||
@@ -366,24 +372,26 @@ export function getProfilesInTeam(teamId = TeamStore.getCurrentId(), offset = Us
|
||||
});
|
||||
},
|
||||
(err) => {
|
||||
callTracker[`getProfilesInTeam${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
dispatchError(err, 'getProfilesInTeam');
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export function getProfilesInChannel(channelId = ChannelStore.getCurrentId(), offset = UserStore.getInChannelPagingOffset(), limit = Constants.PROFILE_CHUNK_SIZE) {
|
||||
if (isCallInProgress(`getProfilesInChannel${offset}${limit}`)) {
|
||||
const callName = `getProfilesInChannel${channelId}${offset}${limit}`;
|
||||
|
||||
if (isCallInProgress()) {
|
||||
return;
|
||||
}
|
||||
|
||||
callTracker[`getProfilesInChannel${offset}${limit}`] = utils.getTimestamp();
|
||||
callTracker[callName] = utils.getTimestamp();
|
||||
Client.getProfilesInChannel(
|
||||
channelId,
|
||||
offset,
|
||||
limit,
|
||||
(data) => {
|
||||
callTracker[`getProfilesInChannel${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
|
||||
AppDispatcher.handleServerAction({
|
||||
type: ActionTypes.RECEIVED_PROFILES_IN_CHANNEL,
|
||||
@@ -396,24 +404,26 @@ export function getProfilesInChannel(channelId = ChannelStore.getCurrentId(), of
|
||||
loadStatusesForProfilesMap(data);
|
||||
},
|
||||
(err) => {
|
||||
callTracker[`getProfilesInChannel${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
dispatchError(err, 'getProfilesInChannel');
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export function getProfilesNotInChannel(channelId = ChannelStore.getCurrentId(), offset = UserStore.getNotInChannelPagingOffset(), limit = Constants.PROFILE_CHUNK_SIZE) {
|
||||
if (isCallInProgress(`getProfilesNotInChannel${offset}${limit}`)) {
|
||||
const callName = `getProfilesNotInChannel${channelId}${offset}${limit}`;
|
||||
|
||||
if (isCallInProgress(callName)) {
|
||||
return;
|
||||
}
|
||||
|
||||
callTracker[`getProfilesNotInChannel${offset}${limit}`] = utils.getTimestamp();
|
||||
callTracker[callName] = utils.getTimestamp();
|
||||
Client.getProfilesNotInChannel(
|
||||
channelId,
|
||||
offset,
|
||||
limit,
|
||||
(data) => {
|
||||
callTracker[`getProfilesNotInChannel${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
|
||||
AppDispatcher.handleServerAction({
|
||||
type: ActionTypes.RECEIVED_PROFILES_NOT_IN_CHANNEL,
|
||||
@@ -426,14 +436,16 @@ export function getProfilesNotInChannel(channelId = ChannelStore.getCurrentId(),
|
||||
loadStatusesForProfilesMap(data);
|
||||
},
|
||||
(err) => {
|
||||
callTracker[`getProfilesNotInChannel${offset}${limit}`] = 0;
|
||||
callTracker[callName] = 0;
|
||||
dispatchError(err, 'getProfilesNotInChannel');
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export function getProfilesByIds(userIds) {
|
||||
if (isCallInProgress('getProfilesByIds')) {
|
||||
const callName = 'getProfilesByIds' + JSON.stringify(userIds);
|
||||
|
||||
if (isCallInProgress(callName)) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -441,11 +453,11 @@ export function getProfilesByIds(userIds) {
|
||||
return;
|
||||
}
|
||||
|
||||
callTracker.getProfilesByIds = utils.getTimestamp();
|
||||
callTracker[callName] = utils.getTimestamp();
|
||||
Client.getProfilesByIds(
|
||||
userIds,
|
||||
(data) => {
|
||||
callTracker.getProfilesByIds = 0;
|
||||
callTracker[callName] = 0;
|
||||
|
||||
AppDispatcher.handleServerAction({
|
||||
type: ActionTypes.RECEIVED_PROFILES,
|
||||
@@ -453,7 +465,7 @@ export function getProfilesByIds(userIds) {
|
||||
});
|
||||
},
|
||||
(err) => {
|
||||
callTracker.getProfilesByIds = 0;
|
||||
callTracker[callName] = 0;
|
||||
dispatchError(err, 'getProfilesByIds');
|
||||
}
|
||||
);
|
||||
|
||||
Ссылка в новой задаче
Block a user