From 859bccfdd812e432c831ddf964f34a87fa859b5f Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Sun, 8 Oct 2023 15:11:03 +0700
Subject: [PATCH] add first render ref

---
 src/components/PopoverWithoutOverlay/index.js | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/PopoverWithoutOverlay/index.js b/src/components/PopoverWithoutOverlay/index.js
index 93b73e9a7ce4..ce81c404f25a 100644
--- a/src/components/PopoverWithoutOverlay/index.js
+++ b/src/components/PopoverWithoutOverlay/index.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useRef } from 'react';
 import {View} from 'react-native';
 import {SafeAreaInsetsContext} from 'react-native-safe-area-context';
 import {PopoverContext} from '../PopoverProvider';
@@ -12,6 +12,7 @@ import usePrevious from '../../hooks/usePrevious';
 
 function Popover(props) {
     const {onOpen, close} = React.useContext(PopoverContext);
+    const firstRenderRef = useRef(true);
     const {modalStyle, modalContainerStyle, shouldAddTopSafeAreaMargin, shouldAddBottomSafeAreaMargin, shouldAddTopSafeAreaPadding, shouldAddBottomSafeAreaPadding} = getModalStyles(
         'popover',
         {
@@ -42,9 +43,15 @@ function Popover(props) {
         Modal.willAlertModalBecomeVisible(props.isVisible);
 
         // We prevent setting closeModal function to null when the first time the component is rendered
-        if (prevIsVisible === props.isVisible) {
+        if ((prevIsVisible === props.isVisible) && (!firstRenderRef.current || !props.isVisible)) {
+            if (firstRenderRef.current) {
+                firstRenderRef.current = false;
+            }
             return;
         }
+        if (firstRenderRef.current) {
+            firstRenderRef.current = false;
+        }
         Modal.setCloseModal(props.isVisible ? () => props.onClose(props.anchorRef) : null);
 
         // We want this effect to run strictly ONLY when isVisible prop changes