Use reselect to memoize denormalization in UI state
Also upgrade react-redux to latest version. This is a performance update
This commit is contained in:
parent
1f650d327d
commit
ef9d4f4e06
12 changed files with 136 additions and 80 deletions
|
@ -1,14 +1,14 @@
|
|||
import { connect } from 'react-redux';
|
||||
import ComposeForm from '../components/compose_form';
|
||||
import { changeCompose, submitCompose, cancelReplyCompose } from '../../../actions/compose';
|
||||
import { selectStatus } from '../../../reducers/timelines';
|
||||
import { getStatus } from '../../../selectors';
|
||||
|
||||
const mapStateToProps = function (state, props) {
|
||||
return {
|
||||
text: state.getIn(['compose', 'text']),
|
||||
is_submitting: state.getIn(['compose', 'is_submitting']),
|
||||
is_uploading: state.getIn(['compose', 'is_uploading']),
|
||||
in_reply_to: selectStatus(state, state.getIn(['compose', 'in_reply_to']))
|
||||
in_reply_to: getStatus(state, state.getIn(['compose', 'in_reply_to']))
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -4,14 +4,10 @@ import {
|
|||
dismissNotification,
|
||||
clearNotifications
|
||||
} from '../../../actions/notifications';
|
||||
import { getNotifications } from '../../../selectors';
|
||||
|
||||
const mapStateToProps = (state, props) => ({
|
||||
notifications: state.get('notifications').map((item, i) => ({
|
||||
message: item.get('message'),
|
||||
title: item.get('title'),
|
||||
key: item.get('key'),
|
||||
dismissAfter: 5000
|
||||
})).toJS()
|
||||
notifications: getNotifications(state)
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => {
|
||||
|
|
|
@ -8,14 +8,18 @@ import {
|
|||
unfavourite
|
||||
} from '../../../actions/interactions';
|
||||
import { expandTimeline } from '../../../actions/timelines';
|
||||
import { selectStatus } from '../../../reducers/timelines';
|
||||
import { makeGetTimeline } from '../../../selectors';
|
||||
import { deleteStatus } from '../../../actions/statuses';
|
||||
|
||||
const mapStateToProps = function (state, props) {
|
||||
return {
|
||||
statuses: state.getIn(['timelines', props.type]).map(id => selectStatus(state, id)),
|
||||
const makeMapStateToProps = () => {
|
||||
const getTimeline = makeGetTimeline();
|
||||
|
||||
const mapStateToProps = (state, props) => ({
|
||||
statuses: getTimeline(state, props.type),
|
||||
me: state.getIn(['timelines', 'me'])
|
||||
};
|
||||
});
|
||||
|
||||
return mapStateToProps;
|
||||
};
|
||||
|
||||
const mapDispatchToProps = function (dispatch, props) {
|
||||
|
@ -50,4 +54,4 @@ const mapDispatchToProps = function (dispatch, props) {
|
|||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(StatusList);
|
||||
export default connect(makeMapStateToProps, mapDispatchToProps)(StatusList);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue