diff --git a/packages/trace-viewer/src/ui/shared/dialog.tsx b/packages/trace-viewer/src/ui/shared/dialog.tsx index 8e74c97b85..8a9ee56ff7 100644 --- a/packages/trace-viewer/src/ui/shared/dialog.tsx +++ b/packages/trace-viewer/src/ui/shared/dialog.tsx @@ -37,6 +37,10 @@ export const Dialog: React.FC> = ({ }) => { const dialogRef = React.useRef(null); + // Allow window dimension changes to force a rerender + // eslint-disable-next-line @typescript-eslint/no-unused-vars + const [_, setRecalculateDimensionsCount] = React.useState(0); + let style: React.CSSProperties | undefined = undefined; if (hostingElement?.current) { @@ -83,14 +87,19 @@ export const Dialog: React.FC> = ({ return () => {}; }, [open, requestClose]); + React.useEffect(() => { + const onResize = () => setRecalculateDimensionsCount(count => count + 1); + + window.addEventListener('resize', onResize); + + return () => { + window.removeEventListener('resize', onResize); + }; + }, []); + return ( open && ( - + {children} )