rtt-modal-use-portal.tsx

export const usePortal = () => {
  const portal = useRef(document.createElement("div"));

  useEffect(() => {
    const current = portal.current;
    document.body.appendChild(portal.current);
    return () => void document.body.removeChild(current); // let's avoid dangling `div`s
  }, []);

  return portal;
};

// then in our modal...
const portal = usePortal();
return ReactDOM.createPortal(
  <div...</div>, {/* the entire thing from before */}
  portal.current
);