@umituz/react-native-subscription 2.41.12 → 2.42.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-subscription",
-  "version": "2.41.12",
+  "version": "2.42.0",
   "description": "Complete subscription management with RevenueCat, paywall UI, and credits system for React Native apps",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/domains/paywall/components/PaywallScreen.tsx

@@ -14,6 +14,7 @@ import {
   StatusBar,
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
+import { usePremium } from "../../subscription/presentation/usePremium";
 import { AtomicText, AtomicIcon, AtomicSpinner } from "@umituz/react-native-design-system/atoms";
 import { useSafeAreaInsets } from "@umituz/react-native-design-system/safe-area";
 import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
@@ -32,6 +33,15 @@ import { hasItems } from "../../../shared/utils/arrayUtils";
 export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) => {
   const navigation = useNavigation();
 
+  if (__DEV__) {
+    console.log('[PaywallScreen] 📱 Rendering PaywallScreen', {
+      hasPackages: !!props.packages?.length,
+      packagesCount: props.packages?.length || 0,
+    });
+  }
+
+  const { purchasePackage, restorePurchase } = usePremium();
+
   const {
     onClose,
     translations,
@@ -42,8 +52,6 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
     creditAmounts,
     creditsLabel,
     heroImage,
-    onPurchase,
-    onRestore,
     onPurchaseSuccess,
     onPurchaseError,
     onAuthRequired,
@@ -54,8 +62,8 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
   const tokens = useAppDesignTokens();
   const insets = useSafeAreaInsets();
 
-  // Default close handler using navigation
   const handleClose = useCallback(() => {
+    if (__DEV__) console.log('[PaywallScreen] 🔙 Closing paywall');
     if (onClose) {
       onClose();
     } else if (navigation.canGoBack()) {
@@ -72,8 +80,8 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
     resetState
   } = usePaywallActions({
     packages,
-    onPurchase,
-    onRestore,
+    purchasePackage,
+    restorePurchase,
     source,
     onPurchaseSuccess,
     onPurchaseError,
@@ -81,9 +89,9 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
     onClose: handleClose
   });
 
-  // Reset state when screen is closed to avoid lockups
   useEffect(() => {
     return () => {
+      if (__DEV__) console.log('[PaywallScreen] 🧹 Cleanup: resetting state');
       resetState();
     };
   }, [resetState]);
@@ -209,7 +217,7 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
 
 
   // Performance Optimization: getItemLayout for FlatList
-  const getItemLayout = useCallback((_data: any, index: number) => {
+  const getItemLayout = useCallback((_data: ArrayLike<PaywallListItem> | null, index: number) => {
     return calculatePaywallItemLayout(flatData, index);
   }, [flatData]);
 
@@ -303,7 +311,7 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
           translations={translations}
           legalUrls={legalUrls}
           isProcessing={isProcessing}
-          onRestore={onRestore ? handleRestore : undefined}
+          onRestore={handleRestore}
           onLegalClick={handleLegalUrl}
         />
       </View>

package/src/domains/paywall/components/PaywallScreen.types.ts

@@ -13,8 +13,7 @@ export interface PaywallScreenProps {
   creditAmounts?: Record<string, number>;
   creditsLabel?: string;
   heroImage?: ImageSourcePropType;
-  onPurchase?: (pkg: PurchasesPackage) => Promise<void | boolean>;
-  onRestore?: () => Promise<void | boolean>;
+  // Purchase/restore handlers removed - always use usePremium hook internally
   onPurchaseSuccess?: () => void;
   onPurchaseError?: (error: Error | string) => void;
   onAuthRequired?: () => void;

package/src/domains/paywall/hooks/usePaywallActions.ts

@@ -7,8 +7,8 @@ import { useCredits } from "../../credits/presentation/useCredits";
 
 interface UsePaywallActionsParams {
   packages?: PurchasesPackage[];
-  onPurchase?: (pkg: PurchasesPackage) => Promise<void | boolean>;
-  onRestore?: () => Promise<void | boolean>;
+  purchasePackage: (pkg: PurchasesPackage) => Promise<boolean>;
+  restorePurchase: () => Promise<boolean>;
   source?: PurchaseSource;
   onPurchaseSuccess?: () => void;
   onPurchaseError?: (error: Error | string) => void;
@@ -18,8 +18,8 @@ interface UsePaywallActionsParams {
 
 export function usePaywallActions({
   packages = [],
-  onPurchase,
-  onRestore,
+  purchasePackage,
+  restorePurchase,
   onPurchaseSuccess,
   onPurchaseError,
   onAuthRequired,
@@ -28,33 +28,26 @@ export function usePaywallActions({
   const [selectedPlanId, setSelectedPlanId] = useState<string | null>(null);
   const [isLocalProcessing, setIsLocalProcessing] = useState(false);
 
-  // Use optimized selector for global purchasing state
   const isGlobalPurchasing = usePurchaseLoadingStore(selectIsPurchasing);
-  
-  // Get premium and credits status for fallback success checks
   const { refetch: refetchStatus } = useSubscriptionStatus();
   const { refetch: refetchCredits } = useCredits();
-  
-  // Combine processing states
+
   const isProcessing = isLocalProcessing || isGlobalPurchasing;
-  
-  // Use ref for isProcessing to keep callbacks stable without re-creating them
   const isProcessingRef = useRef(isProcessing);
   isProcessingRef.current = isProcessing;
 
   const { startPurchase, endPurchase } = usePurchaseLoadingStore();
 
-  const onPurchaseRef = useRef(onPurchase);
-  const onRestoreRef = useRef(onRestore);
+  const purchasePackageRef = useRef(purchasePackage);
+  const restorePurchaseRef = useRef(restorePurchase);
   const onPurchaseSuccessRef = useRef(onPurchaseSuccess);
   const onPurchaseErrorRef = useRef(onPurchaseError);
   const onAuthRequiredRef = useRef(onAuthRequired);
   const onCloseRef = useRef(onClose);
   const packagesRef = useRef(packages);
 
-  // Update refs in render body — always in sync
-  onPurchaseRef.current = onPurchase;
-  onRestoreRef.current = onRestore;
+  purchasePackageRef.current = purchasePackage;
+  restorePurchaseRef.current = restorePurchase;
   onPurchaseSuccessRef.current = onPurchaseSuccess;
   onPurchaseErrorRef.current = onPurchaseError;
   onAuthRequiredRef.current = onAuthRequired;
@@ -62,29 +55,20 @@ export function usePaywallActions({
   packagesRef.current = packages;
 
   const handlePurchase = useCallback(async () => {
-    // Access current state via refs to keep callback stable
     const currentSelectedId = selectedPlanId;
     if (!currentSelectedId) return;
 
-    if (!onPurchaseRef.current) {
-      onPurchaseErrorRef.current?.(new Error("Purchase handler not configured"));
-      return;
-    }
-
     if (isProcessingRef.current) return;
 
     const pkg = packagesRef.current.find((p) => p.product.identifier === currentSelectedId);
-
     if (!pkg) {
       onPurchaseErrorRef.current?.(new Error(`Package not found: ${currentSelectedId}`));
       return;
     }
 
     if (__DEV__) {
-      console.log('[usePaywallActions] Starting purchase', {
+      console.log('[usePaywallActions] 🛒 Starting purchase', {
         productId: pkg.product.identifier,
-        hasOnClose: !!onCloseRef.current,
-        hasOnSuccess: !!onPurchaseSuccessRef.current,
       });
     }
 
@@ -92,87 +76,77 @@ export function usePaywallActions({
     startPurchase(currentSelectedId, "manual");
 
     try {
-      const success = await onPurchaseRef.current(pkg);
+      const success = await purchasePackageRef.current(pkg);
+
       if (__DEV__) {
-        console.log('[usePaywallActions] Purchase completed', { success });
+        console.log('[usePaywallActions] ✅ Purchase completed', { success });
       }
 
-      // Check if purchase was successful
-      // We consider it success if:
-      // 1. Handler returns true
-      // 2. Handler returns void (undefined) but user is now premium (fallback for misconfigured handlers)
       let isActuallySuccessful = success === true;
-      
+
       if (success === undefined) {
         if (__DEV__) {
-          console.log('[usePaywallActions] Handler returned undefined, checking premium status as fallback...');
+          console.log('[usePaywallActions] 🔍 Checking premium status as fallback...');
         }
-        
-        // Use Promise.all to fetch both in parallel
+
         const [statusResult, creditsResult] = await Promise.all([
           refetchStatus(),
           refetchCredits()
         ]);
-        
+
         const isSubscriptionPremium = statusResult.data?.isPremium ?? false;
         const isCreditsPremium = creditsResult.data?.isPremium ?? false;
-        
+
         isActuallySuccessful = isSubscriptionPremium || isCreditsPremium;
-        
+
         if (__DEV__) {
-          console.log('[usePaywallActions] Fallback check result:', { 
-            isSubscriptionPremium, 
-            isCreditsPremium, 
-            isActuallySuccessful 
+          console.log('[usePaywallActions] 📊 Fallback check result:', {
+            isSubscriptionPremium,
+            isCreditsPremium,
+            isActuallySuccessful
           });
         }
       }
 
       if (isActuallySuccessful) {
         if (__DEV__) {
-          console.log('[usePaywallActions] Purchase successful, calling onPurchaseSuccess and onClose');
+          console.log('[usePaywallActions] 🎉 Purchase successful, closing paywall');
         }
         onPurchaseSuccessRef.current?.();
-        // Always close paywall on successful purchase
         onCloseRef.current?.();
       } else {
         if (__DEV__) {
-          console.warn('[usePaywallActions] Purchase did not indicate success, not closing');
+          console.warn('[usePaywallActions] ⚠️ Purchase did not indicate success');
         }
       }
     } catch (error) {
+      if (__DEV__) {
+        console.error('[usePaywallActions] ❌ Purchase error:', error);
+      }
       onPurchaseErrorRef.current?.(error instanceof Error ? error : new Error(String(error)));
     } finally {
       setIsLocalProcessing(false);
       endPurchase(currentSelectedId);
     }
-  }, [selectedPlanId, startPurchase, endPurchase, refetchStatus, refetchCredits]); // Only depend on state that must trigger re-creation if changed
+  }, [selectedPlanId, startPurchase, endPurchase, refetchStatus, refetchCredits]);
 
   const handleRestore = useCallback(async () => {
-    if (!onRestoreRef.current) {
-      onPurchaseErrorRef.current?.(new Error("Restore handler not configured"));
-      return;
-    }
-
     if (isProcessingRef.current) return;
 
     if (__DEV__) {
-      console.log('[usePaywallActions] Starting restore', {
-        hasOnClose: !!onCloseRef.current,
-        hasOnSuccess: !!onPurchaseSuccessRef.current,
-      });
+      console.log('[usePaywallActions] 🔄 Starting restore');
     }
 
     setIsLocalProcessing(true);
     try {
-      const success = await onRestoreRef.current();
+      const success = await restorePurchaseRef.current();
+
       if (__DEV__) {
-        console.log('[usePaywallActions] Restore completed', { success });
+        console.log('[usePaywallActions] ✅ Restore completed', { success });
       }
 
-      // Check success with same fallback as purchase
       let isActuallySuccessful = success === true;
-      
+
       if (success === undefined) {
         const [statusResult, creditsResult] = await Promise.all([
           refetchStatus(),
@@ -183,23 +157,29 @@ export function usePaywallActions({
 
       if (isActuallySuccessful) {
         if (__DEV__) {
-          console.log('[usePaywallActions] Restore successful, calling onPurchaseSuccess and onClose');
+          console.log('[usePaywallActions] 🎉 Restore successful, closing paywall');
         }
         onPurchaseSuccessRef.current?.();
         onCloseRef.current?.();
       } else {
         if (__DEV__) {
-          console.warn('[usePaywallActions] Restore did not indicate success, not closing');
+          console.warn('[usePaywallActions] ⚠️ Restore did not indicate success');
         }
       }
     } catch (error) {
+      if (__DEV__) {
+        console.error('[usePaywallActions] ❌ Restore error:', error);
+      }
       onPurchaseErrorRef.current?.(error instanceof Error ? error : new Error(String(error)));
     } finally {
       setIsLocalProcessing(false);
     }
-  }, [refetchStatus, refetchCredits]); // Truly stable callback
+  }, [refetchStatus, refetchCredits]);
 
   const resetState = useCallback(() => {
+    if (__DEV__) {
+      console.log('[usePaywallActions] 🧹 Resetting state');
+    }
     setSelectedPlanId(null);
     setIsLocalProcessing(false);
   }, []);

package/src/domains/paywall/hooks/usePaywallOrchestrator.ts

@@ -1,15 +1,17 @@
-import { useEffect, useCallback, useRef } from "react";
+import { useEffect, useRef } from "react";
+import type { NavigationProp } from "@react-navigation/native";
+import type { ImageSourcePropType } from "react-native";
 import { usePremium } from "../../subscription/presentation/usePremium";
 import { useSubscriptionFlowStore } from "../../subscription/presentation/useSubscriptionFlow";
 import { usePaywallVisibility } from "../../subscription/presentation/usePaywallVisibility";
 import { PaywallTranslations, PaywallLegalUrls, SubscriptionFeature } from "../entities/types";
 
 export interface PaywallOrchestratorOptions {
-  navigation: any;
+  navigation: NavigationProp<any>;
   translations: PaywallTranslations;
   features: SubscriptionFeature[];
   legalUrls: PaywallLegalUrls;
-  heroImage: any;
+  heroImage: ImageSourcePropType;
   isNavReady?: boolean;
   isLocalizationReady?: boolean;
   onAuthRequired?: () => void;
@@ -36,11 +38,12 @@ export function usePaywallOrchestrator({
   bestValueIdentifier = "yearly",
   creditsLabel,
 }: PaywallOrchestratorOptions) {
+  // Sadece isPremium ve packages alıyoruz
+  // purchasePackage ve restoreRestore fonksiyonlarını ALMIYORUZ
+  // Çünkü PaywallScreen zaten usePremium hook'unu doğrudan kullanıyor
   const {
     isPremium,
-    packages,
-    purchasePackage,
-    restorePurchase
+    packages
   } = usePremium();
 
   // Selectors for stable references and fine-grained updates
@@ -54,7 +57,6 @@ export function usePaywallOrchestrator({
   const setShowFeedback = useSubscriptionFlowStore((state) => state.setShowFeedback);
 
   const { showPaywall, closePaywall } = usePaywallVisibility();
-  const purchasedRef = useRef(false);
   const hasNavigatedRef = useRef(false);
 
   useEffect(() => {
@@ -74,10 +76,13 @@ export function usePaywallOrchestrator({
       if (hasNavigatedRef.current) return;
       hasNavigatedRef.current = true;
 
-      if (__DEV__) console.log('[usePaywallOrchestrator] 🚀 Navigating to Paywall', { 
-        source: shouldShowPostOnboarding ? "onboarding" : "manual" 
+      if (__DEV__) console.log('[usePaywallOrchestrator] 🚀 Navigating to Paywall', {
+        source: shouldShowPostOnboarding ? "onboarding" : "manual",
+        packagesCount: packages.length
       });
 
+      // SADECE DATA geçiyoruz - FONKSİYON YOK
+      // PaywallScreen kendi usePremium hook'unu kullanacak
       navigation.navigate("PaywallScreen", {
         translations,
         legalUrls,
@@ -87,6 +92,8 @@ export function usePaywallOrchestrator({
         heroImage,
         source: shouldShowPostOnboarding ? "onboarding" : "manual",
         packages,
+        onPurchaseSuccess,
+        onAuthRequired,
       });
 
       if (shouldShowPostOnboarding) {
@@ -119,6 +126,8 @@ export function usePaywallOrchestrator({
     closePaywall,
     bestValueIdentifier,
     creditsLabel,
+    onPurchaseSuccess,
+    onAuthRequired,
   ]);
 
   const completeOnboarding = useSubscriptionFlowStore((state) => state.completeOnboarding);

package/src/domains/subscription/presentation/components/ManagedSubscriptionFlow.tsx

@@ -1,4 +1,6 @@
 import React, { useState, useEffect } from "react";
+import type { NavigationProp } from "@react-navigation/native";
+import type { ImageSourcePropType } from "react-native";
 import { SplashScreen, useSplashFlow } from "@umituz/react-native-design-system/molecules";
 import { OnboardingScreen } from "@umituz/react-native-design-system/onboarding";
 import { OfflineBanner } from "@umituz/react-native-design-system/offline";
@@ -11,7 +13,7 @@ import { usePaywallFeedbackSubmit } from "../../../../presentation/hooks/feedbac
 
 export interface ManagedSubscriptionFlowProps {
   children: React.ReactNode;
-  navigation: any;
+  navigation: NavigationProp<any>;
   islocalizationReady: boolean;
 
   // Splash Configuration
@@ -40,7 +42,7 @@ export interface ManagedSubscriptionFlowProps {
     translations: PaywallTranslations;
     features: SubscriptionFeature[];
     legalUrls: PaywallLegalUrls;
-    heroImage: any;
+    heroImage: ImageSourcePropType;
     bestValueIdentifier?: string;
     creditsLabel?: string;
     onAuthRequired?: () => void;

package/src/domains/subscription/presentation/usePremium.ts

@@ -14,7 +14,6 @@ import { UsePremiumResult } from './usePremium.types';
 const EMPTY_PACKAGES: PurchasesPackage[] = [];
 
 export const usePremium = (): UsePremiumResult => {
-
   const { isPremium: subscriptionActive, isLoading: statusLoading } = useSubscriptionStatus();
   const { credits, isLoading: creditsLoading } = useCredits();
 
@@ -38,7 +37,10 @@ export const usePremium = (): UsePremiumResult => {
       try {
         const result = await purchaseMutation.mutateAsync(pkg);
         return result.success;
-      } catch {
+      } catch (error) {
+        if (__DEV__) {
+          console.error('[usePremium] Purchase failed:', error);
+        }
         return false;
       }
     },
@@ -49,7 +51,10 @@ export const usePremium = (): UsePremiumResult => {
     try {
       const result = await restoreMutation.mutateAsync();
       return result.success;
-    } catch {
+    } catch (error) {
+      if (__DEV__) {
+        console.error('[usePremium] Restore failed:', error);
+      }
       return false;
     }
   }, [restoreMutation]);