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:
		
							parent
							
								
									3d219c5956
								
							
						
					
					
						commit
						988342a56c
					
				
					 2 changed files with 27 additions and 5 deletions
				
			
		| 
						 | 
				
			
			@ -18,6 +18,7 @@ import classNames from 'classnames';
 | 
			
		|||
import Icon from 'mastodon/components/icon';
 | 
			
		||||
import PollContainer from 'mastodon/containers/poll_container';
 | 
			
		||||
import { displayMedia } from '../initial_state';
 | 
			
		||||
import { is } from 'immutable';
 | 
			
		||||
 | 
			
		||||
// We use the component (and not the container) since we do not want
 | 
			
		||||
// to use the progress bar to show download progress
 | 
			
		||||
| 
						 | 
				
			
			@ -40,6 +41,18 @@ export const textForScreenReader = (intl, status, rebloggedByText = false) => {
 | 
			
		|||
  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
 | 
			
		||||
class Status extends ImmutablePureComponent {
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -87,7 +100,7 @@ class Status extends ImmutablePureComponent {
 | 
			
		|||
  ];
 | 
			
		||||
 | 
			
		||||
  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
 | 
			
		||||
| 
						 | 
				
			
			@ -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
 | 
			
		||||
  componentDidUpdate (prevProps, prevState, snapshot) {
 | 
			
		||||
    const doShowCard  = !this.props.muted && !this.props.hidden && this.props.status && this.props.status.get('card');
 | 
			
		||||
 | 
			
		||||
    if (doShowCard && !this.didShowCard) {
 | 
			
		||||
      this.didShowCard = true;
 | 
			
		||||
 | 
			
		||||
      if (snapshot !== null && this.props.updateScrollBottom) {
 | 
			
		||||
        if (this.node && this.node.offsetTop < snapshot.top) {
 | 
			
		||||
          this.props.updateScrollBottom(snapshot.height - snapshot.top);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -41,9 +41,9 @@ import { openModal } from '../../actions/modal';
 | 
			
		|||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 | 
			
		||||
import ImmutablePureComponent from 'react-immutable-pure-component';
 | 
			
		||||
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 { textForScreenReader } from '../../components/status';
 | 
			
		||||
import { textForScreenReader, defaultMediaVisibility } from '../../components/status';
 | 
			
		||||
import Icon from 'mastodon/components/icon';
 | 
			
		||||
 | 
			
		||||
const messages = defineMessages({
 | 
			
		||||
| 
						 | 
				
			
			@ -131,7 +131,7 @@ class Status extends ImmutablePureComponent {
 | 
			
		|||
 | 
			
		||||
  state = {
 | 
			
		||||
    fullscreen: false,
 | 
			
		||||
    showMedia: !this.props.status ? undefined : (displayMedia !== 'hide_all' && !this.props.status.get('sensitive') || displayMedia === 'show_all'),
 | 
			
		||||
    showMedia: defaultMediaVisibility(this.props.status),
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  componentWillMount () {
 | 
			
		||||
| 
						 | 
				
			
			@ -147,8 +147,9 @@ class Status extends ImmutablePureComponent {
 | 
			
		|||
      this._scrolledIntoView = false;
 | 
			
		||||
      this.props.dispatch(fetchStatus(nextProps.params.statusId));
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    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) });
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue