selectChannel: sync auto-resolved value during mounting.

## Issue
Fixes `4621 Can't create Comments if you recently deleted a channel`

The `channel` that the parent passes in is from a persisted state. If the channel has been deleted, `<select>` will automatically resolve to another selectable value. However, `onChange` will not be called for this scenario, so we now have a mismatch.

## Changes
- Manually check if the value has been auto-resolved and report it to the parent.
- An extra `setTimeout` was needed. It seems like `onChannelChange` needs to be called after the first `useEffect` of the parent, otherwise the call has no effect.
This commit is contained in:
infiinte-persistence 2020-08-04 15:56:15 +08:00 committed by Sean Yesmunt
parent d64d278676
commit 37a1fd88e3
2 changed files with 14 additions and 1 deletions

View file

@ -14,6 +14,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
### Fixed
- Fix sluggish Back button when navigation back to channels with lots of comments _community pr!_ ([#4576](https://github.com/lbryio/lbry-desktop/pull/4576))
- Fix 'Related' and 'Comments' section lazy-load not working in some scenarios _community pr!_ ([#4586](https://github.com/lbryio/lbry-desktop/pull/4586))
- Fix comment-creation failure if you have recently deleted a channel _community pr!_ ([#4630](https://github.com/lbryio/lbry-desktop/pull/4630))
## [0.47.1] - [2020-07-23]

View file

@ -23,6 +23,8 @@ type State = {
addingChannel: boolean,
};
const ID_FF_SELECT_CHANNEL = 'ID_FF_SELECT_CHANNEL';
class ChannelSelection extends React.PureComponent<Props, State> {
constructor(props: Props) {
super(props);
@ -36,7 +38,7 @@ class ChannelSelection extends React.PureComponent<Props, State> {
}
componentDidMount() {
const { channels, fetchChannelListMine, fetchingChannels, emailVerified } = this.props;
const { channel, channels, fetchChannelListMine, fetchingChannels, emailVerified, onChannelChange } = this.props;
if (IS_WEB && !emailVerified) {
return;
}
@ -44,6 +46,15 @@ class ChannelSelection extends React.PureComponent<Props, State> {
if ((!channels || !channels.length) && !fetchingChannels) {
fetchChannelListMine();
}
const elem = document.getElementById(ID_FF_SELECT_CHANNEL);
// $FlowFixMe
if (elem && elem.value && elem.value !== channel) {
setTimeout(() => {
// $FlowFixMe
onChannelChange(elem.value);
}, 250);
}
}
componentDidUpdate() {
@ -84,6 +95,7 @@ class ChannelSelection extends React.PureComponent<Props, State> {
return (
<Fragment>
<FormField
id={ID_FF_SELECT_CHANNEL}
name="channel"
label={label || __('Channel')}
type="select"