From 9c781717b359d8fa50978aec637f407a52259d73 Mon Sep 17 00:00:00 2001 From: Jason Waldrip Date: Fri, 5 Jan 2024 16:56:42 -0700 Subject: [PATCH 1/2] Fix potential infinite render. --- .../src/exports/Modal/ModalPortal.js | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/packages/react-native-web/src/exports/Modal/ModalPortal.js b/packages/react-native-web/src/exports/Modal/ModalPortal.js index 29e63a128b..60f18d78d6 100644 --- a/packages/react-native-web/src/exports/Modal/ModalPortal.js +++ b/packages/react-native-web/src/exports/Modal/ModalPortal.js @@ -14,23 +14,22 @@ import canUseDOM from '../../modules/canUseDom'; export type ModalPortalProps = {| children: any -|}; + |}; function ModalPortal(props: ModalPortalProps): React.Node { const { children } = props; const elementRef = React.useRef(null); - if (canUseDOM && !elementRef.current) { - const element = document.createElement('div'); - - if (element && document.body) { - document.body.appendChild(element); - elementRef.current = element; - } - } - React.useEffect(() => { if (canUseDOM) { + if (!elementRef.current) { + const element = document.createElement('div'); + + if (element && document.body) { + document.body.appendChild(element); + elementRef.current = element; + }; + } return () => { if (document.body && elementRef.current) { document.body.removeChild(elementRef.current); From 5061db31d45010bd252f2c3f7b9bd3259c989721 Mon Sep 17 00:00:00 2001 From: Jason Waldrip Date: Fri, 5 Jan 2024 16:57:48 -0700 Subject: [PATCH 2/2] Update ModalPortal.js --- packages/react-native-web/src/exports/Modal/ModalPortal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-web/src/exports/Modal/ModalPortal.js b/packages/react-native-web/src/exports/Modal/ModalPortal.js index 60f18d78d6..3a031246ab 100644 --- a/packages/react-native-web/src/exports/Modal/ModalPortal.js +++ b/packages/react-native-web/src/exports/Modal/ModalPortal.js @@ -14,7 +14,7 @@ import canUseDOM from '../../modules/canUseDom'; export type ModalPortalProps = {| children: any - |}; +|}; function ModalPortal(props: ModalPortalProps): React.Node { const { children } = props;