Make the streaming API also handle websockets (because trying to get the browser EventSource interface to
work flawlessly was a nightmare). WARNING: This commit makes the web UI connect to the streaming API instead of ActionCable like before. This means that if you are upgrading, you should set that up beforehand.
This commit is contained in:
parent
8c0bc1309f
commit
ccb8ac8573
14 changed files with 310 additions and 132 deletions
|
@ -8,45 +8,49 @@ import {
|
|||
deleteFromTimelines
|
||||
} from '../../actions/timelines';
|
||||
import ColumnBackButtonSlim from '../../components/column_back_button_slim';
|
||||
import createStream from '../../stream';
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
accessToken: state.getIn(['meta', 'access_token'])
|
||||
});
|
||||
|
||||
const HashtagTimeline = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
params: React.PropTypes.object.isRequired,
|
||||
dispatch: React.PropTypes.func.isRequired
|
||||
dispatch: React.PropTypes.func.isRequired,
|
||||
accessToken: React.PropTypes.string.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
_subscribe (dispatch, id) {
|
||||
if (typeof App !== 'undefined') {
|
||||
this.subscription = App.cable.subscriptions.create({
|
||||
channel: 'HashtagChannel',
|
||||
tag: id
|
||||
}, {
|
||||
const { accessToken } = this.props;
|
||||
|
||||
received (data) {
|
||||
switch(data.event) {
|
||||
case 'update':
|
||||
dispatch(updateTimeline('tag', JSON.parse(data.payload)));
|
||||
break;
|
||||
case 'delete':
|
||||
dispatch(deleteFromTimelines(data.payload));
|
||||
break;
|
||||
}
|
||||
this.subscription = createStream(accessToken, `hashtag&tag=${id}`, {
|
||||
|
||||
received (data) {
|
||||
switch(data.event) {
|
||||
case 'update':
|
||||
dispatch(updateTimeline('tag', JSON.parse(data.payload)));
|
||||
break;
|
||||
case 'delete':
|
||||
dispatch(deleteFromTimelines(data.payload));
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
_unsubscribe () {
|
||||
if (typeof this.subscription !== 'undefined') {
|
||||
this.subscription.unsubscribe();
|
||||
this.subscription.close();
|
||||
this.subscription = null;
|
||||
}
|
||||
},
|
||||
|
||||
componentWillMount () {
|
||||
componentDidMount () {
|
||||
const { dispatch } = this.props;
|
||||
const { id } = this.props.params;
|
||||
|
||||
|
@ -79,4 +83,4 @@ const HashtagTimeline = React.createClass({
|
|||
|
||||
});
|
||||
|
||||
export default connect()(HashtagTimeline);
|
||||
export default connect(mapStateToProps)(HashtagTimeline);
|
||||
|
|
|
@ -9,46 +9,51 @@ import {
|
|||
} from '../../actions/timelines';
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
import ColumnBackButtonSlim from '../../components/column_back_button_slim';
|
||||
import createStream from '../../stream';
|
||||
|
||||
const messages = defineMessages({
|
||||
title: { id: 'column.public', defaultMessage: 'Public' }
|
||||
});
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
accessToken: state.getIn(['meta', 'access_token'])
|
||||
});
|
||||
|
||||
const PublicTimeline = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
dispatch: React.PropTypes.func.isRequired,
|
||||
intl: React.PropTypes.object.isRequired
|
||||
intl: React.PropTypes.object.isRequired,
|
||||
accessToken: React.PropTypes.string.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
componentWillMount () {
|
||||
const { dispatch } = this.props;
|
||||
componentDidMount () {
|
||||
const { dispatch, accessToken } = this.props;
|
||||
|
||||
dispatch(refreshTimeline('public'));
|
||||
|
||||
if (typeof App !== 'undefined') {
|
||||
this.subscription = App.cable.subscriptions.create('PublicChannel', {
|
||||
this.subscription = createStream(accessToken, 'public', {
|
||||
|
||||
received (data) {
|
||||
switch(data.event) {
|
||||
case 'update':
|
||||
dispatch(updateTimeline('public', JSON.parse(data.payload)));
|
||||
break;
|
||||
case 'delete':
|
||||
dispatch(deleteFromTimelines(data.payload));
|
||||
break;
|
||||
}
|
||||
received (data) {
|
||||
switch(data.event) {
|
||||
case 'update':
|
||||
dispatch(updateTimeline('public', JSON.parse(data.payload)));
|
||||
break;
|
||||
case 'delete':
|
||||
dispatch(deleteFromTimelines(data.payload));
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
componentWillUnmount () {
|
||||
if (typeof this.subscription !== 'undefined') {
|
||||
this.subscription.unsubscribe();
|
||||
this.subscription.close();
|
||||
this.subscription = null;
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -65,4 +70,4 @@ const PublicTimeline = React.createClass({
|
|||
|
||||
});
|
||||
|
||||
export default connect()(injectIntl(PublicTimeline));
|
||||
export default connect(mapStateToProps)(injectIntl(PublicTimeline));
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue