SWREI/instrumental
0
0
Fork 0
Code Issues Activity

Make in-text mentions open account detailed view when possible

Browse Source
This commit is contained in:
Eugen Rochko 2016-09-22 00:32:27 +02:00
parent bc98865c1a
commit 74dfefabd3
2 changed files with 49 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
app/assets/javascripts/components/components/status.jsx
View File

@ -6,10 +6,14 @@ import IconButton from './icon_button';
import DisplayName from './display_name';
import MediaGallery from './media_gallery';
import VideoPlayer from './video_player';
import { hashHistory } from 'react-router';
import StatusContent from './status_content';
const Status = React.createClass({
contextTypes: {
router: React.PropTypes.object
},
propTypes: {
status: ImmutablePropTypes.map.isRequired,
wrapped: React.PropTypes.bool,
@ -34,20 +38,19 @@ const Status = React.createClass({
handleClick () {
const { status } = this.props;
hashHistory.push(`/statuses/${status.getIn(['reblog', 'id'], status.get('id'))}`);
this.context.router.push(`/statuses/${status.getIn(['reblog', 'id'], status.get('id'))}`);
},
handleAccountClick (id, e) {
if (e.button === 0) {
e.preventDefault();
hashHistory.push(`/accounts/${id}`);
this.context.router.push(`/accounts/${id}`);
}
e.stopPropagation();
},
render () {
var content = { __html: this.props.status.get('content') };
var media = '';
var { status, ...other } = this.props;
@ -89,7 +92,7 @@ const Status = React.createClass({
</a>
</div>
<div className='status__content' dangerouslySetInnerHTML={content} />
<StatusContent status={status} />
{media}

41
app/assets/javascripts/components/components/status_content.jsx Normal file
View File

@ -0,0 +1,41 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import PureRenderMixin from 'react-addons-pure-render-mixin';
const StatusContent = React.createClass({
contextTypes: {
router: React.PropTypes.object
},
propTypes: {
status: ImmutablePropTypes.map.isRequired
},
mixins: [PureRenderMixin],
componentDidMount () {
const node = ReactDOM.findDOMNode(this);
this.props.status.get('mentions').forEach(mention => {
const links = node.querySelector(`a[href="${mention.get('url')}"]`);
links.addEventListener('click', this.onLinkClick.bind(this, mention));
});
},
onLinkClick (mention, e) {
if (e.button === 0) {
e.preventDefault();
this.context.router.push(`/accounts/${mention.get('id')}`);
}
e.stopPropagation();
},
render () {
const content = { __html: this.props.status.get('content') };
return <div className='status__content' dangerouslySetInnerHTML={content} />;
},
});
export default StatusContent;