diff --git a/components/legacy_sidebar/sidebar.jsx b/components/legacy_sidebar/sidebar.jsx index e7170098984d..2efeb06f3cc3 100644 --- a/components/legacy_sidebar/sidebar.jsx +++ b/components/legacy_sidebar/sidebar.jsx @@ -8,6 +8,7 @@ import ReactDOM from 'react-dom'; import {FormattedMessage, injectIntl} from 'react-intl'; import {PropTypes} from 'prop-types'; import classNames from 'classnames'; +import throttle from 'lodash/throttle'; import Scrollbars from 'react-custom-scrollbars'; import {SpringSystem, MathUtil} from 'rebound'; @@ -275,9 +276,9 @@ class LegacySidebar extends React.PureComponent { } } - onScroll = () => { + onScroll = throttle(() => { this.updateUnreadIndicators(); - } + }, 100); handleScrollAnimationUpdate = (spring) => { const {scrollbar} = this.refs; diff --git a/components/sidebar/sidebar_channel_list/sidebar_channel_list.tsx b/components/sidebar/sidebar_channel_list/sidebar_channel_list.tsx index 984b2c288c03..94a67b403ca4 100644 --- a/components/sidebar/sidebar_channel_list/sidebar_channel_list.tsx +++ b/components/sidebar/sidebar_channel_list/sidebar_channel_list.tsx @@ -7,7 +7,7 @@ import Scrollbars from 'react-custom-scrollbars'; import {DragDropContext, Droppable, DropResult, DragStart, BeforeCapture} from 'react-beautiful-dnd'; import {Spring, SpringSystem} from 'rebound'; import classNames from 'classnames'; -import debounce from 'lodash/debounce'; +import throttle from 'lodash/throttle'; import {General} from 'mattermost-redux/constants'; import {Channel} from 'mattermost-redux/types/channels'; @@ -346,11 +346,11 @@ export default class SidebarChannelList extends React.PureComponent { + onScroll = throttle(() => { this.updateUnreadIndicators(); - } + }, 100); - onTransitionEnd = debounce(() => { + onTransitionEnd = throttle(() => { this.updateUnreadIndicators(); }, 100); diff --git a/components/sidebar/sidebar_menu/sidebar_menu.tsx b/components/sidebar/sidebar_menu/sidebar_menu.tsx index dcf0dc79ce59..b7ac97ab552c 100644 --- a/components/sidebar/sidebar_menu/sidebar_menu.tsx +++ b/components/sidebar/sidebar_menu/sidebar_menu.tsx @@ -59,22 +59,6 @@ export default class SidebarMenu extends React.PureComponent { } } - // TODO: Temporary code to keep the menu in place while scrolling - // This shouldn't be necessary once the menus are fixed up - componentDidMount() { - const scrollbars = document.querySelectorAll('#SidebarContainer .SidebarNavContainer .scrollbar--view'); - if (scrollbars && scrollbars[0]) { - scrollbars[0].addEventListener('scroll', this.closeMenu); - } - } - - componentWillUnmount() { - const scrollbars = document.querySelectorAll('#SidebarContainer .SidebarNavContainer .scrollbar--view'); - if (scrollbars && scrollbars[0]) { - scrollbars[0].removeEventListener('scroll', this.closeMenu); - } - } - closeMenu = () => { if (this.menuWrapperRef.current) { this.menuWrapperRef.current.close();