From ee3d7d1fc80ef4bbb5652ce11c5488833a6ba9d1 Mon Sep 17 00:00:00 2001
From: Artem Makushov <waterim3009@gmail.com>
Date: Tue, 23 Jul 2024 14:03:20 +0200
Subject: [PATCH] add clean-up for event listener

---
 .../CardAuthenticationModal/index.tsx         | 29 ++++++++++---------
 1 file changed, 16 insertions(+), 13 deletions(-)

diff --git a/src/pages/settings/Subscription/CardAuthenticationModal/index.tsx b/src/pages/settings/Subscription/CardAuthenticationModal/index.tsx
index bdf9c30052d5..41ed4d667fc4 100644
--- a/src/pages/settings/Subscription/CardAuthenticationModal/index.tsx
+++ b/src/pages/settings/Subscription/CardAuthenticationModal/index.tsx
@@ -1,4 +1,4 @@
-import React, {useEffect, useState} from 'react';
+import React, {useCallback, useEffect, useState} from 'react';
 import {View} from 'react-native';
 import {useOnyx} from 'react-native-onyx';
 import FullScreenLoadingIndicator from '@components/FullscreenLoadingIndicator';
@@ -31,19 +31,22 @@ function CardAuthenticationModal({headerTitle}: CardAuthenticationModalProps) {
         Navigation.navigate(ROUTES.SETTINGS_SUBSCRIPTION);
     }, [privateStripeCustomerID]);
 
-    useEffect(() => {
-        window.addEventListener(
-            'message',
-            (event: MessageEvent<string>) => {
-                if (event.data !== CONST.GBP_AUTHENTICATION_COMPLETE) {
-                    return;
-                }
-
+    const handleGBPAuthentication = useCallback(
+        (event: MessageEvent<string>) => {
+            const message = event.data;
+            if (message === CONST.GBP_AUTHENTICATION_COMPLETE) {
                 PaymentMethods.verifySetupIntent(session?.accountID ?? -1, true);
-            },
-            false,
-        );
-    }, [session?.accountID]);
+            }
+        },
+        [session?.accountID],
+    );
+
+    useEffect(() => {
+        window.addEventListener('message', handleGBPAuthentication);
+        return () => {
+            window.removeEventListener('message', handleGBPAuthentication);
+        };
+    }, [handleGBPAuthentication]);
 
     const onModalClose = () => {
         PaymentMethods.clearPaymentCard3dsVerification();