Fix null error in status component when determining showMedia state (#10838)

* Fix null error in status component when determining showMedia state

Also update the showMedia value if the status passed to the
component changes

* Refactor media visibility computation into a defaultMediaVisibility function

* Fix default media visibility with reblogs
This commit is contained in:
Eugen Rochko 2019-05-26 13:48:16 +02:00 committed by GitHub
parent 3d219c5956
commit 988342a56c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 5 deletions

View file

@ -18,6 +18,7 @@ import classNames from 'classnames';
import Icon from 'mastodon/components/icon'; import Icon from 'mastodon/components/icon';
import PollContainer from 'mastodon/containers/poll_container'; import PollContainer from 'mastodon/containers/poll_container';
import { displayMedia } from '../initial_state'; import { displayMedia } from '../initial_state';
import { is } from 'immutable';
// We use the component (and not the container) since we do not want // We use the component (and not the container) since we do not want
// to use the progress bar to show download progress // to use the progress bar to show download progress
@ -40,6 +41,18 @@ export const textForScreenReader = (intl, status, rebloggedByText = false) => {
return values.join(', '); return values.join(', ');
}; };
export const defaultMediaVisibility = (status) => {
if (!status) {
return undefined;
}
if (status.get('reblog', null) !== null && typeof status.get('reblog') === 'object') {
status = status.get('reblog');
}
return (displayMedia !== 'hide_all' && !status.get('sensitive') || displayMedia === 'show_all');
};
export default @injectIntl export default @injectIntl
class Status extends ImmutablePureComponent { class Status extends ImmutablePureComponent {
@ -87,7 +100,7 @@ class Status extends ImmutablePureComponent {
]; ];
state = { state = {
showMedia: displayMedia !== 'hide_all' && !this.props.status.get('sensitive') || displayMedia === 'show_all', showMedia: defaultMediaVisibility(this.props.status),
}; };
// Track height changes we know about to compensate scrolling // Track height changes we know about to compensate scrolling
@ -103,11 +116,19 @@ class Status extends ImmutablePureComponent {
} }
} }
componentWillReceiveProps (nextProps) {
if (!is(nextProps.status, this.props.status) && nextProps.status) {
this.setState({ showMedia: defaultMediaVisibility(nextProps.status) });
}
}
// Compensate height changes // Compensate height changes
componentDidUpdate (prevProps, prevState, snapshot) { componentDidUpdate (prevProps, prevState, snapshot) {
const doShowCard = !this.props.muted && !this.props.hidden && this.props.status && this.props.status.get('card'); const doShowCard = !this.props.muted && !this.props.hidden && this.props.status && this.props.status.get('card');
if (doShowCard && !this.didShowCard) { if (doShowCard && !this.didShowCard) {
this.didShowCard = true; this.didShowCard = true;
if (snapshot !== null && this.props.updateScrollBottom) { if (snapshot !== null && this.props.updateScrollBottom) {
if (this.node && this.node.offsetTop < snapshot.top) { if (this.node && this.node.offsetTop < snapshot.top) {
this.props.updateScrollBottom(snapshot.height - snapshot.top); this.props.updateScrollBottom(snapshot.height - snapshot.top);

View file

@ -41,9 +41,9 @@ import { openModal } from '../../actions/modal';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component'; import ImmutablePureComponent from 'react-immutable-pure-component';
import { HotKeys } from 'react-hotkeys'; import { HotKeys } from 'react-hotkeys';
import { boostModal, deleteModal, displayMedia } from '../../initial_state'; import { boostModal, deleteModal } from '../../initial_state';
import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../ui/util/fullscreen'; import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../ui/util/fullscreen';
import { textForScreenReader } from '../../components/status'; import { textForScreenReader, defaultMediaVisibility } from '../../components/status';
import Icon from 'mastodon/components/icon'; import Icon from 'mastodon/components/icon';
const messages = defineMessages({ const messages = defineMessages({
@ -131,7 +131,7 @@ class Status extends ImmutablePureComponent {
state = { state = {
fullscreen: false, fullscreen: false,
showMedia: !this.props.status ? undefined : (displayMedia !== 'hide_all' && !this.props.status.get('sensitive') || displayMedia === 'show_all'), showMedia: defaultMediaVisibility(this.props.status),
}; };
componentWillMount () { componentWillMount () {
@ -147,8 +147,9 @@ class Status extends ImmutablePureComponent {
this._scrolledIntoView = false; this._scrolledIntoView = false;
this.props.dispatch(fetchStatus(nextProps.params.statusId)); this.props.dispatch(fetchStatus(nextProps.params.statusId));
} }
if (!Immutable.is(nextProps.status, this.props.status) && nextProps.status) { if (!Immutable.is(nextProps.status, this.props.status) && nextProps.status) {
this.setState({ showMedia: displayMedia !== 'hide_all' && !nextProps.status.get('sensitive') || displayMedia === 'show_all' }); this.setState({ showMedia: defaultMediaVisibility(nextProps.status) });
} }
} }