From 69c3ad81e28b4f6a7e8e3a3b9cdb67b4079adeb7 Mon Sep 17 00:00:00 2001
From: Kamal Joshi <kkjoshi.it@gmail.com>
Date: Tue, 8 Oct 2024 21:56:13 +0530
Subject: [PATCH] only load palettes after init connection to purchase library
 is done

---
 ApplicationRoot.js        | 13 ++++++++-----
 hooks/useIAPConnection.ts |  8 +++++++-
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/ApplicationRoot.js b/ApplicationRoot.js
index 0a2a81d2..7db46b6f 100644
--- a/ApplicationRoot.js
+++ b/ApplicationRoot.js
@@ -28,6 +28,7 @@ import AppAuthProvider from './components/AppAuthProvider.js';
 import UserProfile from './screens/UserProfileScreen.js';
 import useApplicationStore from './hooks/useApplicationStore.js';
 import ExplorePaletteScreen from './screens/ExplorePaletteScreen.js';
+import { notifyMessage } from './libs/Helpers.js';
 
 const Stack = createNativeStackNavigator();
 
@@ -38,11 +39,13 @@ export default function App() {
   const { loadInitPaletteFromStore } = applicationState;
   const [isMenuOpen, setMenu] = useState(false);
   const navigationRef = useNavigationContainerRef();
-  useIAPConnection();
-
-  useEffect(() => {
-    loadInitPaletteFromStore();
-  }, [loadInitPaletteFromStore]);
+  useIAPConnection(function(error) {
+    if (error) {
+      // TODO: figure out a better way to handle this error and show user a way to retry, ask for help or continue.
+      notifyMessage("Error during purchase initialization. Purchase might not work. Please retry");
+    } 
+    loadInitPaletteFromStore(); // Still load the palettes. Specially simulator will always face this issue.
+  });
 
   const hamburgerMenuIcon = () => (
     <TouchableOpacity onPress={() => setMenu(!isMenuOpen)}>
diff --git a/hooks/useIAPConnection.ts b/hooks/useIAPConnection.ts
index 86f127f6..8b3a744c 100644
--- a/hooks/useIAPConnection.ts
+++ b/hooks/useIAPConnection.ts
@@ -14,12 +14,15 @@ import {
 import { notifyMessage, logEvent, sendClientError } from  '../libs/Helpers';
 // https://react-native-iap.dooboolab.com/docs/guides/purchases
 // TODO: We need to implement this properly with server side validation.
-const useIAPConnection = () => {
+const useIAPConnection = (callback) => {
   useEffect(() => {
     let purchaseUpdateSubscription = null;
     let purchaseErrorSubscription = null;
 
     initConnection().then(() => {
+      if (callback) {
+        callback();
+      }
       flushFailedPurchasesCachedAsPendingAndroid()
         .catch((error) => {
           sendClientError('purchase_event_error_flush', error.message);
@@ -66,6 +69,9 @@ const useIAPConnection = () => {
             },
           );
         });
+    }).catch((error) => {
+      callback(error);
+      sendClientError('init_connection_error', error.message);
     });
 
     return () => {