* Revert "persist last-intersected status update and restore when ScrollableList is restored"

This reverts commit 07e26142ef6a8e74bd2ac5e9b461a5a1699bd4c8.

accidentally merged spurious code in https://github.com/tootsuite/mastodon/pull/12661.  https://github.com/tootsuite/mastodon/pull/12735 removes the slowdown that this code was trying to solve; and other functionality successfully restores the view state of the list

* Revert "cache currently-viewing status id to avoid calling redux with identical value"

This reverts commit c93df2159fbd3888a5c48d8a8b8ae61dbbc54b89.

accidentally merged spurious code in https://github.com/tootsuite/mastodon/pull/12661.  https://github.com/tootsuite/mastodon/pull/12735 removes the slowdown that this code was trying to solve; and other functionality successfully restores the view state of the list
pull/1259/head
Matt Panaro 2020-01-02 16:46:42 -05:00 committed by Eugen Rochko
parent aa138ea350
commit 9cbbc50fcd
6 changed files with 1 additions and 34 deletions

View File

@ -17,14 +17,6 @@ export const TIMELINE_LOAD_PENDING = 'TIMELINE_LOAD_PENDING';
export const TIMELINE_DISCONNECT = 'TIMELINE_DISCONNECT'; export const TIMELINE_DISCONNECT = 'TIMELINE_DISCONNECT';
export const TIMELINE_CONNECT = 'TIMELINE_CONNECT'; export const TIMELINE_CONNECT = 'TIMELINE_CONNECT';
export const CURRENTLY_VIEWING = 'CURRENTLY_VIEWING';
export const updateCurrentlyViewing = (timeline, id) => ({
type: CURRENTLY_VIEWING,
timeline,
id,
});
export const loadPending = timeline => ({ export const loadPending = timeline => ({
type: TIMELINE_LOAD_PENDING, type: TIMELINE_LOAD_PENDING,
timeline, timeline,

View File

@ -20,8 +20,6 @@ export default class IntersectionObserverArticle extends React.Component {
cachedHeight: PropTypes.number, cachedHeight: PropTypes.number,
onHeightChange: PropTypes.func, onHeightChange: PropTypes.func,
children: PropTypes.node, children: PropTypes.node,
currentlyViewing: PropTypes.number,
updateCurrentlyViewing: PropTypes.func,
}; };
state = { state = {
@ -50,8 +48,6 @@ export default class IntersectionObserverArticle extends React.Component {
); );
this.componentMounted = true; this.componentMounted = true;
if(id === this.props.currentlyViewing) this.node.scrollIntoView();
} }
componentWillUnmount () { componentWillUnmount () {
@ -64,8 +60,6 @@ export default class IntersectionObserverArticle extends React.Component {
handleIntersection = (entry) => { handleIntersection = (entry) => {
this.entry = entry; this.entry = entry;
if(entry.intersectionRatio > 0.75 && this.props.updateCurrentlyViewing) this.props.updateCurrentlyViewing(this.id);
scheduleIdleTask(this.calculateHeight); scheduleIdleTask(this.calculateHeight);
this.setState(this.updateStateAfterIntersection); this.setState(this.updateStateAfterIntersection);
} }

View File

@ -36,8 +36,6 @@ export default class ScrollableList extends PureComponent {
emptyMessage: PropTypes.node, emptyMessage: PropTypes.node,
children: PropTypes.node, children: PropTypes.node,
bindToDocument: PropTypes.bool, bindToDocument: PropTypes.bool,
currentlyViewing: PropTypes.number,
updateCurrentlyViewing: PropTypes.func,
}; };
static defaultProps = { static defaultProps = {
@ -314,8 +312,6 @@ export default class ScrollableList extends PureComponent {
listLength={childrenCount} listLength={childrenCount}
intersectionObserverWrapper={this.intersectionObserverWrapper} intersectionObserverWrapper={this.intersectionObserverWrapper}
saveHeightKey={trackScroll ? `${this.context.router.route.location.key}:${scrollKey}` : null} saveHeightKey={trackScroll ? `${this.context.router.route.location.key}:${scrollKey}` : null}
currentlyViewing={this.props.currentlyViewing}
updateCurrentlyViewing={this.props.updateCurrentlyViewing}
> >
{React.cloneElement(child, { {React.cloneElement(child, {
getScrollPosition: this.getScrollPosition, getScrollPosition: this.getScrollPosition,

View File

@ -26,8 +26,6 @@ export default class StatusList extends ImmutablePureComponent {
emptyMessage: PropTypes.node, emptyMessage: PropTypes.node,
alwaysPrepend: PropTypes.bool, alwaysPrepend: PropTypes.bool,
timelineId: PropTypes.string, timelineId: PropTypes.string,
currentlyViewing: PropTypes.number,
updateCurrentlyViewing: PropTypes.func,
}; };
static defaultProps = { static defaultProps = {
@ -60,12 +58,6 @@ export default class StatusList extends ImmutablePureComponent {
this.props.onLoadMore(this.props.statusIds.size > 0 ? this.props.statusIds.last() : undefined); this.props.onLoadMore(this.props.statusIds.size > 0 ? this.props.statusIds.last() : undefined);
}, 300, { leading: true }) }, 300, { leading: true })
updateCurrentlyViewingWithCache = (id) => {
if(this.cachedCurrentlyViewing === id) return;
this.cachedCurrentlyViewing = id;
this.props.updateCurrentlyViewing(id);
}
_selectChild (index, align_top) { _selectChild (index, align_top) {
const container = this.node.node; const container = this.node.node;
const element = container.querySelector(`article:nth-of-type(${index + 1}) .focusable`); const element = container.querySelector(`article:nth-of-type(${index + 1}) .focusable`);
@ -87,7 +79,6 @@ export default class StatusList extends ImmutablePureComponent {
render () { render () {
const { statusIds, featuredStatusIds, shouldUpdateScroll, onLoadMore, timelineId, ...other } = this.props; const { statusIds, featuredStatusIds, shouldUpdateScroll, onLoadMore, timelineId, ...other } = this.props;
const { isLoading, isPartial } = other; const { isLoading, isPartial } = other;
other.updateCurrentlyViewing = this.updateCurrentlyViewingWithCache;
if (isPartial) { if (isPartial) {
return <RegenerationIndicator />; return <RegenerationIndicator />;

View File

@ -1,6 +1,6 @@
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import StatusList from '../../../components/status_list'; import StatusList from '../../../components/status_list';
import { scrollTopTimeline, loadPending, updateCurrentlyViewing } from '../../../actions/timelines'; import { scrollTopTimeline, loadPending } from '../../../actions/timelines';
import { Map as ImmutableMap, List as ImmutableList } from 'immutable'; import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import { debounce } from 'lodash'; import { debounce } from 'lodash';
@ -39,7 +39,6 @@ const makeMapStateToProps = () => {
isPartial: state.getIn(['timelines', timelineId, 'isPartial'], false), isPartial: state.getIn(['timelines', timelineId, 'isPartial'], false),
hasMore: state.getIn(['timelines', timelineId, 'hasMore']), hasMore: state.getIn(['timelines', timelineId, 'hasMore']),
numPending: getPendingStatusIds(state, { type: timelineId }).size, numPending: getPendingStatusIds(state, { type: timelineId }).size,
currentlyViewing: state.getIn(['timelines', timelineId, 'currentlyViewing'], -1),
}); });
return mapStateToProps; return mapStateToProps;
@ -57,7 +56,6 @@ const mapDispatchToProps = (dispatch, { timelineId }) => ({
onLoadPending: () => dispatch(loadPending(timelineId)), onLoadPending: () => dispatch(loadPending(timelineId)),
updateCurrentlyViewing: id => dispatch(updateCurrentlyViewing(timelineId, id)),
}); });
export default connect(makeMapStateToProps, mapDispatchToProps)(StatusList); export default connect(makeMapStateToProps, mapDispatchToProps)(StatusList);

View File

@ -9,7 +9,6 @@ import {
TIMELINE_CONNECT, TIMELINE_CONNECT,
TIMELINE_DISCONNECT, TIMELINE_DISCONNECT,
TIMELINE_LOAD_PENDING, TIMELINE_LOAD_PENDING,
CURRENTLY_VIEWING,
} from '../actions/timelines'; } from '../actions/timelines';
import { import {
ACCOUNT_BLOCK_SUCCESS, ACCOUNT_BLOCK_SUCCESS,
@ -29,7 +28,6 @@ const initialTimeline = ImmutableMap({
hasMore: true, hasMore: true,
pendingItems: ImmutableList(), pendingItems: ImmutableList(),
items: ImmutableList(), items: ImmutableList(),
currentlyViewing: -1,
}); });
const expandNormalizedTimeline = (state, timeline, statuses, next, isPartial, isLoadingRecent, usePendingItems) => { const expandNormalizedTimeline = (state, timeline, statuses, next, isPartial, isLoadingRecent, usePendingItems) => {
@ -170,8 +168,6 @@ export default function timelines(state = initialState, action) {
initialTimeline, initialTimeline,
map => map.set('online', false).update(action.usePendingItems ? 'pendingItems' : 'items', items => items.first() ? items.unshift(null) : items) map => map.set('online', false).update(action.usePendingItems ? 'pendingItems' : 'items', items => items.first() ? items.unshift(null) : items)
); );
case CURRENTLY_VIEWING:
return state.update(action.timeline, initialTimeline, map => map.set('currentlyViewing', action.id));
default: default:
return state; return state;
} }