From 98c3a5e9c38b3bc653002dafab0504fdee3d2c44 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Fri, 4 Nov 2016 12:48:53 +0100 Subject: Optimize how statuses are re-rendered and relative time intervals --- .../components/containers/status_container.jsx | 50 +++++++++++++++++++--- 1 file changed, 44 insertions(+), 6 deletions(-) (limited to 'app/assets/javascripts/components/containers') diff --git a/app/assets/javascripts/components/containers/status_container.jsx b/app/assets/javascripts/components/containers/status_container.jsx index 5e0b489b3..2bcb7026c 100644 --- a/app/assets/javascripts/components/containers/status_container.jsx +++ b/app/assets/javascripts/components/containers/status_container.jsx @@ -13,13 +13,47 @@ import { } from '../actions/interactions'; import { deleteStatus } from '../actions/statuses'; import { openMedia } from '../actions/modal'; +import { createSelector } from 'reselect' -const makeMapStateToProps = () => { - const getStatus = makeGetStatus(); +const mapStateToProps = (state, props) => ({ + statusBase: state.getIn(['statuses', props.id]), + me: state.getIn(['meta', 'me']) +}); + +const makeMapStateToPropsInner = () => { + const getStatus = (() => { + return createSelector( + [ + (_, base) => base, + (state, base) => (base ? state.getIn(['accounts', base.get('account')]) : null), + (state, base) => (base ? state.getIn(['statuses', base.get('reblog')], null) : null) + ], + + (base, account, reblog) => (base ? base.set('account', account).set('reblog', reblog) : null) + ); + })(); + + const mapStateToProps = (state, { statusBase }) => ({ + status: getStatus(state, statusBase) + }); + + return mapStateToProps; +}; + +const makeMapStateToPropsLast = () => { + const getStatus = (() => { + return createSelector( + [ + (_, status) => status, + (state, status) => (status ? state.getIn(['accounts', status.getIn(['reblog', 'account'])], null) : null) + ], + + (status, reblogAccount) => (status && status.get('reblog') ? status.setIn(['reblog', 'account'], reblogAccount) : status) + ); + })(); - const mapStateToProps = (state, props) => ({ - status: getStatus(state, props.id), - me: state.getIn(['meta', 'me']) + const mapStateToProps = (state, { status }) => ({ + status: getStatus(state, status) }); return mapStateToProps; @@ -61,4 +95,8 @@ const mapDispatchToProps = (dispatch) => ({ }); -export default connect(makeMapStateToProps, mapDispatchToProps)(Status); +export default connect(mapStateToProps, mapDispatchToProps)( + connect(makeMapStateToPropsInner)( + connect(makeMapStateToPropsLast)(Status) + ) +); -- cgit