Improve detailed status component lifecycle
- Move componentWillMount and componentWillReceiveProps logic to getDerivedStateFromProps. - Compute CW auto-unfold status earlier
This commit is contained in:
parent
7e63fb26e0
commit
6a264c9379
|
@ -91,26 +91,26 @@ export default class Status extends ImmutablePureComponent {
|
||||||
fullscreen: false,
|
fullscreen: false,
|
||||||
isExpanded: undefined,
|
isExpanded: undefined,
|
||||||
threadExpanded: undefined,
|
threadExpanded: undefined,
|
||||||
|
statusId: undefined,
|
||||||
};
|
};
|
||||||
|
|
||||||
componentWillMount () {
|
|
||||||
this.props.dispatch(fetchStatus(this.props.params.statusId));
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount () {
|
componentDidMount () {
|
||||||
attachFullscreenListener(this.onFullScreenChange);
|
attachFullscreenListener(this.onFullScreenChange);
|
||||||
|
this.props.dispatch(fetchStatus(this.props.params.statusId));
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps (nextProps) {
|
static getDerivedStateFromProps(props, state) {
|
||||||
if (this.state.isExpanded === undefined) {
|
if (state.statusId === props.params.statusId || !props.params.statusId) {
|
||||||
const isExpanded = autoUnfoldCW(nextProps.settings, nextProps.status);
|
return null;
|
||||||
if (isExpanded !== undefined) this.setState({ isExpanded: isExpanded });
|
|
||||||
}
|
|
||||||
if (nextProps.params.statusId !== this.props.params.statusId && nextProps.params.statusId) {
|
|
||||||
this._scrolledIntoView = false;
|
|
||||||
this.props.dispatch(fetchStatus(nextProps.params.statusId));
|
|
||||||
this.setState({ isExpanded: autoUnfoldCW(nextProps.settings, nextProps.status), threadExpanded: undefined });
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
props.dispatch(fetchStatus(props.params.statusId));
|
||||||
|
|
||||||
|
return {
|
||||||
|
threadExpanded: undefined,
|
||||||
|
isExpanded: autoUnfoldCW(props.settings, props.status),
|
||||||
|
statusId: props.params.statusId,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
handleExpandedToggle = () => {
|
handleExpandedToggle = () => {
|
||||||
|
@ -338,11 +338,8 @@ export default class Status extends ImmutablePureComponent {
|
||||||
this.node = c;
|
this.node = c;
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidUpdate () {
|
componentDidUpdate (prevProps) {
|
||||||
if (this._scrolledIntoView) {
|
if (this.props.params.statusId !== prevProps.params.statusId && this.props.params.statusId) {
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const { status, ancestorsIds } = this.props;
|
const { status, ancestorsIds } = this.props;
|
||||||
|
|
||||||
if (status && ancestorsIds && ancestorsIds.size > 0) {
|
if (status && ancestorsIds && ancestorsIds.size > 0) {
|
||||||
|
@ -351,7 +348,7 @@ export default class Status extends ImmutablePureComponent {
|
||||||
window.requestAnimationFrame(() => {
|
window.requestAnimationFrame(() => {
|
||||||
element.scrollIntoView(true);
|
element.scrollIntoView(true);
|
||||||
});
|
});
|
||||||
this._scrolledIntoView = true;
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Reference in New Issue