@umituz/react-native-subscription 2.41.13 → 2.43.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-subscription",
-  "version": "2.41.13",
+  "version": "2.43.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

@@ -33,8 +33,14 @@ import { hasItems } from "../../../shared/utils/arrayUtils";
 export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) => {
   const navigation = useNavigation();
 
-  // Get purchase functions from usePremium as fallback
-  const { purchasePackage: premiumPurchase, restorePurchase: premiumRestore } = usePremium();
+  if (__DEV__) {
+    console.log('[PaywallScreen] 📱 Rendering PaywallScreen', {
+      hasPackages: !!props.packages?.length,
+      packagesCount: props.packages?.length || 0,
+    });
+  }
+
+  const { purchasePackage, restorePurchase } = usePremium();
 
   const {
     onClose,
@@ -46,8 +52,6 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
     creditAmounts,
     creditsLabel,
     heroImage,
-    onPurchase,
-    onRestore,
     onPurchaseSuccess,
     onPurchaseError,
     onAuthRequired,
@@ -58,23 +62,8 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
   const tokens = useAppDesignTokens();
   const insets = useSafeAreaInsets();
 
-  // Use provided purchase functions or fall back to usePremium
-  const handlePurchasePackage = useCallback(async (pkg: any) => {
-    if (onPurchase) {
-      return await onPurchase(pkg);
-    }
-    return await premiumPurchase(pkg);
-  }, [onPurchase, premiumPurchase]);
-
-  const handleRestorePackages = useCallback(async () => {
-    if (onRestore) {
-      return await onRestore();
-    }
-    return await premiumRestore();
-  }, [onRestore, premiumRestore]);
-
-  // Default close handler using navigation
   const handleClose = useCallback(() => {
+    if (__DEV__) console.log('[PaywallScreen] 🔙 Closing paywall');
     if (onClose) {
       onClose();
     } else if (navigation.canGoBack()) {
@@ -91,8 +80,8 @@ export const PaywallScreen: React.FC<PaywallScreenProps> = React.memo((props) =>
     resetState
   } = usePaywallActions({
     packages,
-    onPurchase: handlePurchasePackage,
-    onRestore: handleRestorePackages,
+    purchasePackage,
+    restorePurchase,
     source,
     onPurchaseSuccess,
     onPurchaseError,
@@ -100,12 +89,12 @@ 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, handlePurchasePackage, handleRestorePackages]);
+  }, [resetState]);
 
   // Auto-select first package
   useEffect(() => {
@@ -228,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]);
 
@@ -322,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,19 +1,19 @@
-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;
-  onPurchaseSuccess?: () => void;
   bestValueIdentifier?: string;
   creditsLabel?: string;
 }
@@ -31,16 +31,15 @@ export function usePaywallOrchestrator({
   heroImage,
   isNavReady = true,
   isLocalizationReady = true,
-  onAuthRequired,
-  onPurchaseSuccess,
   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 +53,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 +72,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,10 +88,6 @@ export function usePaywallOrchestrator({
         heroImage,
         source: shouldShowPostOnboarding ? "onboarding" : "manual",
         packages,
-        onPurchase: purchasePackage,
-        onRestore: restorePurchase,
-        onPurchaseSuccess,
-        onAuthRequired,
       });
 
       if (shouldShowPostOnboarding) {
@@ -119,14 +116,10 @@ export function usePaywallOrchestrator({
     features,
     heroImage,
     packages,
-    purchasePackage,
-    restorePurchase,
     markPaywallShown,
     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,11 +42,9 @@ export interface ManagedSubscriptionFlowProps {
     translations: PaywallTranslations;
     features: SubscriptionFeature[];
     legalUrls: PaywallLegalUrls;
-    heroImage: any;
+    heroImage: ImageSourcePropType;
     bestValueIdentifier?: string;
     creditsLabel?: string;
-    onAuthRequired?: () => void;
-    onPurchaseSuccess?: () => void;
   };
 
   // Feedback Configuration
@@ -53,7 +53,7 @@ export interface ManagedSubscriptionFlowProps {
     onSubmit?: (data: { reason: string; otherText?: string }) => void | Promise<void>;
   };
 
-  // Offline Configuration
+  // Offline Configuration (optional)
   offline?: {
     isOffline: boolean;
     message: string;
@@ -102,10 +102,10 @@ const ManagedSubscriptionFlowInner = React.memo<ManagedSubscriptionFlowProps>(({
     }
   }, [isSplashComplete, islocalizationReady]);
 
-  const { 
-    flowState, 
+  const {
+    flowState,
     setShowFeedback,
-    completeOnboarding 
+    completeOnboarding
   } = usePaywallOrchestrator({
     navigation,
     isNavReady,
@@ -114,8 +114,6 @@ const ManagedSubscriptionFlowInner = React.memo<ManagedSubscriptionFlowProps>(({
     features: paywall.features,
     legalUrls: paywall.legalUrls,
     heroImage: paywall.heroImage,
-    onAuthRequired: paywall.onAuthRequired,
-    onPurchaseSuccess: paywall.onPurchaseSuccess,
     bestValueIdentifier: paywall.bestValueIdentifier,
     creditsLabel: paywall.creditsLabel,
   });

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]);