Ways to disable scroll

React Modal open should disable body scroll:

useEffect(() => {
  if (isOpen) {
    document.documentElement.style.overflow = 'hidden';
  } else {
    document.documentElement.style.overflow = 'auto';
  }
}, [isOpen]);

if (!isOpen) return null;

Show the content in a fixed full-screen container:

<div style="width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: 999"></div>

Reference

https://code-boxx.com/disable-scrolling-javascript/