From 384cb44e6ba595469615e7557a509abc4fdaf80a Mon Sep 17 00:00:00 2001
From: Princi Vershwal <vershwal.princi@gmail.com>
Date: Wed, 24 Jan 2024 18:40:37 +0530
Subject: [PATCH] Optimised iframe for offers (#19567)

---
 .../settings/membership/portal/PortalFrame.tsx        | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx b/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx
index 9af587ad54..bdc9a47147 100644
--- a/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx
+++ b/apps/admin-x-settings/src/components/settings/membership/portal/PortalFrame.tsx
@@ -18,7 +18,6 @@ const PortalFrame: React.FC<PortalFrameProps> = ({href, onDestroyed, selectedTab
     const makeVisible = useCallback(() => {
         setTimeout(() => {
             if (iframeRef.current) {
-                setHasLoaded(true);
                 setIsInvisible(false);
             }
         }, 500);
@@ -51,16 +50,22 @@ const PortalFrame: React.FC<PortalFrameProps> = ({href, onDestroyed, selectedTab
     }
 
     return (
-        <>{!hasLoaded && isInvisible && <div className="mt-[-7%] flex h-screen items-center justify-center"><span><LoadingIndicator /></span></div>}
+        <>
+            {isInvisible && (
+                <div className="mt-[-7%] flex h-screen items-center justify-center">
+                    <span><LoadingIndicator /></span>
+                </div>
+            ) }
             <iframe
                 ref={iframeRef}
-                className={!isInvisible && hasLoaded ? '' : 'hidden'}
+                className={hasLoaded && !isInvisible ? '' : 'hidden'}
                 data-testid="portal-preview"
                 height="100%"
                 src={href}
                 title="Portal Preview"
                 width="100%"
                 onLoad={() => {
+                    setHasLoaded(true);
                 }}
             />
         </>