chinwagsocial/app/javascript/mastodon/features/ui/containers/status_list_container.js
Akihiko Odaki b0664a5e6c Replace onScrollToBottom with onLoadMore (#6615)
onScrollToBottom was a function to run instead of onScrollToTop and
onScroll when scrolling to the bottom. The behavior to prevent
onScrollToTop was inconvenient because the viewport can be at the bottom
and at the top at the same time if the viewport is larger than the
container.

onScrollToBottom was also called when the button to load more is clicked
on contray to the name suggests, which led notifications and
status_list_container components to mark the scrolled location is not at
the top mistakenly.

onLoadMore is a replacement for onScrollToBottom. It will be called
independently from onScrollToTop and onScroll.
2018-03-05 19:31:40 +01:00

72 lines
2.4 KiB
JavaScript

import { connect } from 'react-redux';
import StatusList from '../../../components/status_list';
import { scrollTopTimeline } from '../../../actions/timelines';
import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
import { createSelector } from 'reselect';
import { debounce } from 'lodash';
import { me } from '../../../initial_state';
const makeGetStatusIds = () => createSelector([
(state, { type }) => state.getIn(['settings', type], ImmutableMap()),
(state, { type }) => state.getIn(['timelines', type, 'items'], ImmutableList()),
(state) => state.get('statuses'),
], (columnSettings, statusIds, statuses) => {
const rawRegex = columnSettings.getIn(['regex', 'body'], '').trim();
let regex = null;
try {
regex = rawRegex && new RegExp(rawRegex, 'i');
} catch (e) {
// Bad regex, don't affect filters
}
return statusIds.filter(id => {
const statusForId = statuses.get(id);
let showStatus = true;
if (columnSettings.getIn(['shows', 'reblog']) === false) {
showStatus = showStatus && statusForId.get('reblog') === null;
}
if (columnSettings.getIn(['shows', 'reply']) === false) {
showStatus = showStatus && (statusForId.get('in_reply_to_id') === null || statusForId.get('in_reply_to_account_id') === me);
}
if (showStatus && regex && statusForId.get('account') !== me) {
const searchIndex = statusForId.get('reblog') ? statuses.getIn([statusForId.get('reblog'), 'search_index']) : statusForId.get('search_index');
showStatus = !regex.test(searchIndex);
}
return showStatus;
});
});
const makeMapStateToProps = () => {
const getStatusIds = makeGetStatusIds();
const mapStateToProps = (state, { timelineId }) => ({
statusIds: getStatusIds(state, { type: timelineId }),
isLoading: state.getIn(['timelines', timelineId, 'isLoading'], true),
isPartial: state.getIn(['timelines', timelineId, 'isPartial'], false),
hasMore: !!state.getIn(['timelines', timelineId, 'next']),
});
return mapStateToProps;
};
const mapDispatchToProps = (dispatch, { timelineId, loadMore }) => ({
onLoadMore: debounce(loadMore, 300, { leading: true }),
onScrollToTop: debounce(() => {
dispatch(scrollTopTimeline(timelineId, true));
}, 100),
onScroll: debounce(() => {
dispatch(scrollTopTimeline(timelineId, false));
}, 100),
});
export default connect(makeMapStateToProps, mapDispatchToProps)(StatusList);