m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00
Code

Fix popover scroll button WhatsNewPopup hiding (#19017)

Browse Source 
Co-authored-by: David Walsh <davidwalsh83@gmail.com>
This commit is contained in:
Dominik Rudzki 2023-05-09 18:32:29 +02:00 committed by GitHub
parent 09b113e0df
commit 4cb3284136
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
ui/components/app/whats-new-popup/whats-new-popup.js
View File

@ -3,6 +3,7 @@ import { useHistory } from 'react-router-dom';
import { useSelector } from 'react-redux';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { debounce } from 'lodash';
import { getCurrentLocale } from '../../../ducks/locale/locale';
import { I18nContext } from '../../../contexts/i18n';
import { useEqualityCheck } from '../../../hooks/useEqualityCheck';
@ -238,6 +239,16 @@ export default function WhatsNewPopup({ onClose }) {
const trackEvent = useContext(MetaMetricsContext);
const handleDebouncedScroll = debounce((target) => {
setShouldShowScrollButton(
target.scrollHeight - target.scrollTop !== target.clientHeight,
);
}, 100);
const handleScroll = (e) => {
handleDebouncedScroll(e.target);
};
const handleScrollDownClick = (e) => {
e.stopPropagation();
idRefMap[notifications[notifications.length - 1].id].current.scrollIntoView(
@ -245,7 +256,6 @@ export default function WhatsNewPopup({ onClose }) {
behavior: 'smooth',
},
);
setShouldShowScrollButton(false);
};
useEffect(() => {
const observer = new window.IntersectionObserver(
@ -300,6 +310,7 @@ export default function WhatsNewPopup({ onClose }) {
popoverRef={popoverRef}
showScrollDown={shouldShowScrollButton && notifications.length > 1}
onScrollDownButtonClick={handleScrollDownClick}
onScroll={handleScroll}
>
<div className="whats-new-popup__notifications">
{notifications.map(({ id }, index) => {