Browse Source

Use debounce for dispatch scrollTopNotification and expandNotifications (#3700)

pull/4/head
unarist 5 years ago
committed by Eugen Rochko
parent
commit
4e6b5e7879
1 changed files with 17 additions and 8 deletions
  1. +17
    -8
      app/javascript/mastodon/features/notifications/index.js

+ 17
- 8
app/javascript/mastodon/features/notifications/index.js View File

@ -13,6 +13,7 @@ import ColumnSettingsContainer from './containers/column_settings_container';
import { createSelector } from 'reselect';
import Immutable from 'immutable';
import LoadMore from '../../components/load_more';
import { debounce } from 'lodash';
const messages = defineMessages({
title: { id: 'column.notifications', defaultMessage: 'Notifications' },
@ -50,19 +51,27 @@ export default class Notifications extends React.PureComponent {
trackScroll: true,
};
dispatchExpandNotifications = debounce(() => {
this.props.dispatch(expandNotifications());
}, 300, { leading: true });
dispatchScrollToTop = debounce((top) => {
this.props.dispatch(scrollTopNotifications(top));
}, 100);
handleScroll = (e) => {
const { scrollTop, scrollHeight, clientHeight } = e.target;
const offset = scrollHeight - scrollTop - clientHeight;
this._oldScrollPosition = scrollHeight - scrollTop;
if (250 > offset && !this.props.isLoading) {
if (this.props.hasMore) {
this.props.dispatch(expandNotifications());
}
} else if (scrollTop < 100) {
this.props.dispatch(scrollTopNotifications(true));
if (250 > offset && this.props.hasMore && !this.props.isLoading) {
this.dispatchExpandNotifications();
}
if (scrollTop < 100) {
this.dispatchScrollToTop(true);
} else {
this.props.dispatch(scrollTopNotifications(false));
this.dispatchScrollToTop(false);
}
}
@ -74,7 +83,7 @@ export default class Notifications extends React.PureComponent {
handleLoadMore = (e) => {
e.preventDefault();
this.props.dispatch(expandNotifications());
this.dispatchExpandNotifications();
}
handlePin = () => {

Loading…
Cancel
Save