MM-18771 Removed componentwillreceiveprops (#4980)

* at_mention : removed componentwillreceiveprops

* channel_mention : remove componentwillreceiveprops

* slash_suggestion : remove componentWillReceiveProps
This commit is contained in:
A C SREEDHAR REDDY 2020-12-01 23:06:56 +05:30 committed by GitHub
parent 04bb204191
commit 0360ceeb6e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 72 additions and 79 deletions

View file

@ -54,51 +54,38 @@ export default class AtMention extends PureComponent {
sections: [],
};
}
componentWillReceiveProps(nextProps) {
const {groups, inChannel, outChannel, teamMembers, isSearch, matchTerm, requestStatus} = nextProps;
// Not invoked, render nothing.
if (matchTerm === null) {
this.setState({
sections: [],
});
return;
}
if (matchTerm !== this.props.matchTerm) {
const sections = this.buildSections(nextProps);
this.setState({
sections,
});
this.props.onResultCountChange(sections.reduce((total, section) => total + section.data.length, 0));
// Update user autocomplete list with results of server request
const {currentTeamId, currentChannelId} = this.props;
const channelId = isSearch ? '' : currentChannelId;
this.props.actions.autocompleteUsers(matchTerm, currentTeamId, channelId);
return;
}
// Server request is complete
if (
groups !== this.props.groups ||
(
requestStatus !== RequestStatus.STARTED &&
(inChannel !== this.props.inChannel || outChannel !== this.props.outChannel || teamMembers !== this.props.teamMembers)
)
) {
const sections = this.buildSections(nextProps);
this.setState({
sections,
});
this.props.onResultCountChange(sections.reduce((total, section) => total + section.data.length, 0));
}
updateSections(sections) {
this.setState({sections});
}
componentDidUpdate(prevProps, prevState) {
if (this.props.matchTerm !== prevProps.matchTerm) {
if (this.props.matchTerm === null) {
this.updateSections([]);
} else {
const sections = this.buildSections(this.props);
this.updateSections(sections);
this.props.onResultCountChange(sections.reduce((total, section) => total + section.data.length, 0));
// Update user autocomplete list with results of server request
const {currentTeamId, currentChannelId} = this.props;
const channelId = this.props.isSearch ? '' : currentChannelId;
this.props.actions.autocompleteUsers(this.props.matchTerm, currentTeamId, channelId);
}
}
if (this.props.matchTerm !== null && this.props.matchTerm === prevProps.matchTerm) {
if (
this.props.groups !== prevProps.groups ||
(
this.props.requestStatus !== RequestStatus.STARTED &&
(this.props.inChannel !== prevProps.inChannel || this.props.outChannel !== prevProps.outChannel || this.props.teamMembers !== prevProps.teamMembers)
)
) {
const sections = this.buildSections(this.props);
this.updateSections(sections);
this.props.onResultCountChange(sections.reduce((total, section) => total + section.data.length, 0));
}
}
if (prevState.sections.length !== this.state.sections.length && this.state.sections.length === 0) {
this.props.onResultCountChange(0);
}

View file

@ -61,15 +61,23 @@ export default class ChannelMention extends PureComponent {
this.props.actions.autocompleteChannelsForSearch(currentTeamId, matchTerm);
}, 200);
componentWillReceiveProps(nextProps) {
const {isSearch, matchTerm, myChannels, otherChannels, privateChannels, publicChannels, directAndGroupMessages, requestStatus, myMembers} = nextProps;
resetState() {
this.setState({
mentionComplete: false,
sections: [],
});
}
if ((matchTerm !== this.props.matchTerm && matchTerm === null) || this.state.mentionComplete) {
updateSections(sections) {
this.setState({sections});
}
componentDidUpdate(prevProps, prevState) {
const {isSearch, matchTerm, myChannels, otherChannels, privateChannels, publicChannels, directAndGroupMessages, requestStatus, myMembers} = this.props;
if ((matchTerm !== prevProps.matchTerm && matchTerm === null) || (this.state.mentionComplete !== prevState.mentionComplete && this.state.mentionComplete)) {
// if the term changes but is null or the mention has been completed we render this component as null
this.setState({
mentionComplete: false,
sections: [],
});
this.resetState();
this.props.onResultCountChange(0);
@ -79,15 +87,15 @@ export default class ChannelMention extends PureComponent {
return;
}
if (matchTerm !== this.props.matchTerm) {
if (matchTerm !== prevProps.matchTerm) {
const {currentTeamId} = this.props;
this.runSearch(currentTeamId, matchTerm);
}
if (matchTerm === '' || (myChannels !== this.props.myChannels || otherChannels !== this.props.otherChannels ||
privateChannels !== this.props.privateChannels || publicChannels !== this.props.publicChannels ||
directAndGroupMessages !== this.props.directAndGroupMessages ||
myMembers !== this.props.myMembers)) {
if ((matchTerm !== prevProps.matchTerm && matchTerm === '') || (myChannels !== prevProps.myChannels || otherChannels !== prevProps.otherChannels ||
privateChannels !== prevProps.privateChannels || publicChannels !== prevProps.publicChannels ||
directAndGroupMessages !== prevProps.directAndGroupMessages ||
myMembers !== prevProps.myMembers)) {
const sections = [];
if (isSearch) {
if (publicChannels.length) {
@ -139,9 +147,7 @@ export default class ChannelMention extends PureComponent {
}
}
this.setState({
sections,
});
this.updateSections(sections);
this.props.onResultCountChange(sections.reduce((total, section) => total + section.data.length, 0));
}
}

View file

@ -48,51 +48,53 @@ export default class SlashSuggestion extends PureComponent {
lastCommandRequest: 0,
};
componentWillReceiveProps(nextProps) {
if ((nextProps.value === this.props.value && nextProps.suggestions === this.props.suggestions && nextProps.commands === this.props.commands) ||
nextProps.isSearch || nextProps.value.startsWith('//') || !nextProps.channelId) {
setActive(active) {
this.setState({active});
}
setLastCommandRequest(lastCommandRequest) {
this.setState({lastCommandRequest});
}
componentDidUpdate(prevProps) {
if ((this.props.value === prevProps.value && this.props.suggestions === prevProps.suggestions && this.props.commands === prevProps.commands) ||
this.props.isSearch || this.props.value.startsWith('//') || !this.props.channelId) {
return;
}
const {currentTeamId} = this.props;
const {currentTeamId} = prevProps;
const {
commands: nextCommands,
currentTeamId: nextTeamId,
value: nextValue,
suggestions: nextSuggestions,
} = nextProps;
} = this.props;
if (nextValue[0] !== '/') {
this.setState({
active: false,
});
this.setActive(false);
this.props.onResultCountChange(0);
return;
}
if (nextValue.indexOf(' ') === -1) { // return suggestions for a top level cached commands
if (currentTeamId !== nextTeamId) {
this.setState({
lastCommandRequest: 0,
});
this.setLastCommandRequest(0);
}
const dataIsStale = Date.now() - this.state.lastCommandRequest > TIME_BEFORE_NEXT_COMMAND_REQUEST;
if ((!nextCommands.length || dataIsStale)) {
this.props.actions.getAutocompleteCommands(nextProps.currentTeamId);
this.setState({
lastCommandRequest: Date.now(),
});
this.props.actions.getAutocompleteCommands(this.props.currentTeamId);
this.setLastCommandRequest(Date.now());
}
const matches = this.filterSlashSuggestions(nextValue.substring(1), nextCommands);
this.updateSuggestions(matches);
} else if (isMinimumServerVersion(Client4.getServerVersion(), 5, 24)) {
if (nextSuggestions === this.props.suggestions) {
if (nextSuggestions === prevProps.suggestions) {
const args = {
channel_id: this.props.channelId,
...(this.props.rootId && {root_id: this.props.rootId, parent_id: this.props.rootId}),
channel_id: prevProps.channelId,
...(prevProps.rootId && {root_id: prevProps.rootId, parent_id: prevProps.rootId}),
};
this.props.actions.getCommandAutocompleteSuggestions(nextValue, nextTeamId, args);
} else {
@ -110,9 +112,7 @@ export default class SlashSuggestion extends PureComponent {
this.updateSuggestions(matches);
}
} else {
this.setState({
active: false,
});
this.setActive(false);
}
}