Fix render loop in <Modal>
, clean up ref merger code
This commit is contained in:
parent
1366d09f11
commit
893a77a3ad
8 changed files with 36 additions and 39 deletions
|
@ -12,6 +12,7 @@ import { Theme } from '../util/theme';
|
|||
import { getClassNamesFor } from '../util/getClassNamesFor';
|
||||
import { useAnimated } from '../hooks/useAnimated';
|
||||
import { useHasWrapped } from '../hooks/useHasWrapped';
|
||||
import { useRefMerger } from '../hooks/useRefMerger';
|
||||
|
||||
type PropsType = {
|
||||
children: ReactNode;
|
||||
|
@ -85,6 +86,8 @@ export function ModalWindow({
|
|||
}: Readonly<PropsType>): JSX.Element {
|
||||
const modalRef = useRef<HTMLDivElement | null>(null);
|
||||
|
||||
const refMerger = useRefMerger();
|
||||
|
||||
const bodyRef = useRef<HTMLDivElement | null>(null);
|
||||
const [scrolled, setScrolled] = useState(false);
|
||||
const [hasOverflow, setHasOverflow] = useState(false);
|
||||
|
@ -155,10 +158,7 @@ export function ModalWindow({
|
|||
const scrollTop = bodyRef.current?.scrollTop || 0;
|
||||
setScrolled(scrollTop > 2);
|
||||
}}
|
||||
ref={bodyEl => {
|
||||
measureRef(bodyEl);
|
||||
bodyRef.current = bodyEl;
|
||||
}}
|
||||
ref={refMerger(measureRef, bodyRef)}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue