From 4d484cf7519e936af2d29b6899e9eabe4a6e44dd Mon Sep 17 00:00:00 2001
From: Alex Bakoushin <alex@bakoush.in>
Date: Tue, 12 Mar 2024 18:22:22 +0100
Subject: [PATCH] fix: the NFT reward bottom sheet unexpectedly reappears after
 CTA button is pressed (#5076)

### Description

On the iOS production build the NFT reward bottom sheet unexpectedly
reappears after CTA button is pressed.
The hypothesis is that `onChange` event isn't fired for some reason when
the bottom sheet is closed programmatically.

The fix is to fire `dispatch` on CTA press handler instead of relying on
`onChange` event.

Another possible option is to rely on `onClose` event. But unfortunately
it is called when component unmounts on Android.

### Test plan

Tested manually on:
* Android emulator
* iOS simulator
* dev iOS build on device

Planing to additionally test on the nightly iOS build.

### Related issues

- Related to  RET-1002

### Backwards compatibility

Y

### Network scalability

NA
---
 src/home/celebration/NftReward.test.tsx |  3 +++
 src/home/celebration/NftReward.tsx      | 14 ++++++++------
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/home/celebration/NftReward.test.tsx b/src/home/celebration/NftReward.test.tsx
index 7758d2d18fb..835c9f7593a 100644
--- a/src/home/celebration/NftReward.test.tsx
+++ b/src/home/celebration/NftReward.test.tsx
@@ -5,6 +5,7 @@ import { Provider } from 'react-redux'
 import { HomeEvents } from 'src/analytics/Events'
 import ValoraAnalytics from 'src/analytics/ValoraAnalytics'
 import { openDeepLink } from 'src/app/actions'
+import { nftRewardDisplayed } from 'src/home/actions'
 import { getFeatureGate } from 'src/statsig/index'
 import Colors from 'src/styles/colors'
 import { createMockStore } from 'test/utils'
@@ -42,6 +43,8 @@ describe('NftReward', () => {
       openDeepLink(mockStoreRewardReady.home.nftCelebration.deepLink, true)
     )
 
+    expect(store.dispatch).toHaveBeenCalledWith(nftRewardDisplayed())
+
     expect(ValoraAnalytics.track).toHaveBeenCalledWith(HomeEvents.nft_reward_accept, {
       networkId: mockNftAllFields.networkId,
       contractAddress: mockNftAllFields.contractAddress,
diff --git a/src/home/celebration/NftReward.tsx b/src/home/celebration/NftReward.tsx
index 5fe10a3a60e..f68ae8ec35a 100644
--- a/src/home/celebration/NftReward.tsx
+++ b/src/home/celebration/NftReward.tsx
@@ -83,9 +83,9 @@ export default function NftRewardBottomSheet() {
           contractAddress: nftCelebration.contractAddress,
           remainingDays: differenceInDays(rewardExpirationDate, Date.now()),
         })
-      }
 
-      dispatch(nftRewardDisplayed())
+        dispatch(nftRewardDisplayed())
+      }
     }
   }
 
@@ -100,14 +100,16 @@ export default function NftRewardBottomSheet() {
       remainingDays: differenceInDays(rewardExpirationDate, Date.now()),
     })
 
-    setRewardAccepted(true)
-
-    bottomSheetRef.current?.close()
-
     if (nftCelebration?.deepLink) {
       const isSecureOrigin = true
       dispatch(openDeepLink(nftCelebration.deepLink, isSecureOrigin))
     }
+
+    setRewardAccepted(true)
+
+    bottomSheetRef.current?.close()
+
+    dispatch(nftRewardDisplayed())
   }
 
   if (!isVisible) {