import React from 'react'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { fetchStatus } from '../../actions/statuses'; import MissingIndicator from '../../components/missing_indicator'; import DetailedStatus from './components/detailed_status'; import ActionBar from './components/action_bar'; import Column from '../ui/components/column'; import { favourite, unfavourite, reblog, unreblog, } from '../../actions/interactions'; import { replyCompose, mentionCompose, } from '../../actions/compose'; import { deleteStatus } from '../../actions/statuses'; import { initReport } from '../../actions/reports'; import { makeGetStatus } from '../../selectors'; import { ScrollContainer } from 'react-router-scroll'; import ColumnBackButton from '../../components/column_back_button'; import StatusContainer from '../../containers/status_container'; import { openModal } from '../../actions/modal'; import { defineMessages, injectIntl } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; const messages = defineMessages({ deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' }, deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' }, }); const makeMapStateToProps = () => { const getStatus = makeGetStatus(); const mapStateToProps = (state, props) => ({ status: getStatus(state, Number(props.params.statusId)), ancestorsIds: state.getIn(['contexts', 'ancestors', Number(props.params.statusId)]), descendantsIds: state.getIn(['contexts', 'descendants', Number(props.params.statusId)]), me: state.getIn(['meta', 'me']), boostModal: state.getIn(['meta', 'boost_modal']), deleteModal: state.getIn(['meta', 'delete_modal']), autoPlayGif: state.getIn(['meta', 'auto_play_gif']), }); return mapStateToProps; }; @injectIntl @connect(makeMapStateToProps) export default class Status extends ImmutablePureComponent { static contextTypes = { router: PropTypes.object, }; static propTypes = { params: PropTypes.object.isRequired, dispatch: PropTypes.func.isRequired, status: ImmutablePropTypes.map, ancestorsIds: ImmutablePropTypes.list, descendantsIds: ImmutablePropTypes.list, me: PropTypes.number, boostModal: PropTypes.bool, deleteModal: PropTypes.bool, autoPlayGif: PropTypes.bool, intl: PropTypes.object.isRequired, }; componentWillMount () { this.props.dispatch(fetchStatus(Number(this.props.params.statusId))); } componentWillReceiveProps (nextProps) { if (nextProps.params.statusId !== this.props.params.statusId && nextProps.params.statusId) { this.props.dispatch(fetchStatus(Number(nextProps.params.statusId))); } } handleFavouriteClick = (status) => { if (status.get('favourited')) { this.props.dispatch(unfavourite(status)); } else { this.props.dispatch(favourite(status)); } } handleReplyClick = (status) => { this.props.dispatch(replyCompose(status, this.context.router.history)); } handleModalReblog = (status) => { this.props.dispatch(reblog(status)); } handleReblogClick = (status, e) => { if (status.get('reblogged')) { this.props.dispatch(unreblog(status)); } else { if (e.shiftKey || !this.props.boostModal) { this.handleModalReblog(status); } else { this.props.dispatch(openModal('BOOST', { status, onReblog: this.handleModalReblog })); } } } handleDeleteClick = (status) => { const { dispatch, intl } = this.props; if (!this.props.deleteModal) { dispatch(deleteStatus(status.get('id'))); } else { dispatch(openModal('CONFIRM', { message: intl.formatMessage(messages.deleteMessage), confirm: intl.formatMessage(messages.deleteConfirm), onConfirm: () => dispatch(deleteStatus(status.get('id'))), })); } } handleMentionClick = (account, router) => { this.props.dispatch(mentionCompose(account, router)); } handleOpenMedia = (media, index) => { this.props.dispatch(openModal('MEDIA', { media, index })); } handleOpenVideo = (media, time) => { this.props.dispatch(openModal('VIDEO', { media, time })); } handleReport = (status) => { this.props.dispatch(initReport(status.get('account'), status)); } renderChildren (list) { return list.map(id => ); } render () { let ancestors, descendants; const { status, ancestorsIds, descendantsIds, me, autoPlayGif } = this.props; if (status === null) { return ( ); } if (ancestorsIds && ancestorsIds.size > 0) { ancestors =
{this.renderChildren(ancestorsIds)}
; } if (descendantsIds && descendantsIds.size > 0) { descendants =
{this.renderChildren(descendantsIds)}
; } return (
{ancestors} {descendants}
); } }