Merge pull request #2320 from kortix-ai/feature/mobile-upgrades

WIP

Author: Ino-Bagaric

apps/mobile/components/settings/BillingPage.tsx

@@ -4,8 +4,8 @@
  * Matches web's "Billing Status – Manage your credits and subscription" design
  */
 
-import React, { useState, useCallback } from 'react';
-import { View, ScrollView, Pressable } from 'react-native';
+import React, { useState, useCallback, useEffect } from 'react';
+import { View, ScrollView, Pressable, Platform } from 'react-native';
 import * as WebBrowser from 'expo-web-browser';
 import { Text } from '@/components/ui/text';
 import { Icon } from '@/components/ui/icon';
@@ -21,6 +21,8 @@ import {
   presentCustomerInfo,
   shouldUseRevenueCat,
   isRevenueCatConfigured,
+  isRevenueCatInitialized,
+  initializeRevenueCat,
 } from '@/lib/billing';
 import { useAuthContext } from '@/contexts';
 import { useLanguage } from '@/contexts';
@@ -148,17 +150,47 @@ export function BillingPage({ visible, onClose, onChangePlan }: BillingPageProps
   const handleCustomerInfo = useCallback(async () => {
     Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
     try {
+      // Ensure RevenueCat is initialized before presenting customer info
+      if (user && shouldUseRevenueCat() && isRevenueCatConfigured()) {
+        const initialized = await isRevenueCatInitialized();
+        if (!initialized) {
+          console.log('🔄 RevenueCat not initialized, initializing now...');
+          try {
+            await initializeRevenueCat(user.id, user.email || undefined, true);
+          } catch (initError) {
+            console.warn('⚠️ RevenueCat initialization warning:', initError);
+          }
+        }
+      }
+
       await presentCustomerInfo();
       // Refresh billing data after user returns from customer info portal
       handleSubscriptionUpdate();
     } catch (error) {
       console.error('Error presenting customer info portal:', error);
       Haptics.notificationAsync(Haptics.NotificationFeedbackType.Error);
     }
-  }, [handleSubscriptionUpdate]);
+  }, [user, handleSubscriptionUpdate]);
 
+  // Show button if RevenueCat should be used and is configured
+  // We'll handle initialization when the button is clicked if needed
   const useRevenueCat = shouldUseRevenueCat() && isRevenueCatConfigured();
 
+  // Debug logging to help diagnose button visibility
+  useEffect(() => {
+    if (visible) {
+      console.log('🔍 [BillingPage] RevenueCat button visibility check:', {
+        shouldUseRevenueCat: shouldUseRevenueCat(),
+        isRevenueCatConfigured: isRevenueCatConfigured(),
+        useRevenueCat,
+        platform: Platform.OS,
+        hasIosKey: !!process.env.EXPO_PUBLIC_REVENUECAT_IOS_API_KEY,
+        hasAndroidKey: !!process.env.EXPO_PUBLIC_REVENUECAT_ANDROID_API_KEY,
+        useRevenueCatEnv: process.env.EXPO_PUBLIC_USE_REVENUECAT,
+      });
+    }
+  }, [visible, useRevenueCat]);
+
   if (!visible) return null;
 
   if (isLoadingSubscription) {

apps/mobile/lib/billing/index.ts

@@ -86,6 +86,7 @@ export {
   checkSubscriptionStatus,
   presentPaywall,
   presentCustomerInfo,
+  isRevenueCatInitialized,
 } from './revenuecat';
 export type { RevenueCatProduct } from './revenuecat';
 

apps/mobile/lib/billing/revenuecat.ts

@@ -463,6 +463,19 @@ export async function getCustomerInfo(): Promise<CustomerInfo> {
   }
 }
 
+/**
+ * Check if RevenueCat is actually initialized and ready to use
+ * This is more reliable than just checking for API keys
+ */
+export async function isRevenueCatInitialized(): Promise<boolean> {
+  try {
+    await Purchases.getCustomerInfo();
+    return true;
+  } catch {
+    return false;
+  }
+}
+
 export function getSubscriptionInfo(customerInfo: CustomerInfo): RevenueCatSubscriptionInfo {
   const entitlements = customerInfo.entitlements.active;
   const hasActiveEntitlement = Object.keys(entitlements).length > 0;