Fix <Modal> scroll event handler

This commit is contained in:
Evan Hahn 2021-09-21 11:25:21 -05:00 committed by GitHub
parent a68e3a6d20
commit 7937280971
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 4 deletions

View file

@ -38,6 +38,7 @@ export function Modal({
theme,
}: Readonly<PropsType>): ReactElement {
const modalRef = useRef<HTMLDivElement | null>(null);
const bodyRef = useRef<HTMLDivElement | null>(null);
const [scrolled, setScrolled] = useState(false);
const [hasOverflow, setHasOverflow] = useState(false);
@ -107,10 +108,14 @@ export function Modal({
? getClassName('__body--overflow')
: null
)}
onScroll={event => {
setScrolled((event.target as HTMLDivElement).scrollTop > 2);
onScroll={() => {
const scrollTop = bodyRef.current?.scrollTop || 0;
setScrolled(scrollTop > 2);
}}
ref={bodyEl => {
measureRef(bodyEl);
bodyRef.current = bodyEl;
}}
ref={measureRef}
>
{children}
</div>