@umituz/react-native-subscription 2.27.113 → 2.27.115

package/src/domains/subscription/presentation/components/feedback/FeedbackOption.tsx

@@ -0,0 +1,139 @@
+/**
+ * Feedback Option Component
+ * Single feedback option with radio button and optional text input
+ */
+
+import React from "react";
+import { View, TouchableOpacity, TextInput, StyleSheet } from "react-native";
+import { AtomicText, useAppDesignTokens } from "@umituz/react-native-design-system";
+
+interface FeedbackOptionProps {
+  isSelected: boolean;
+  text: string;
+  showInput: boolean;
+  placeholder: string;
+  inputValue: string;
+  onSelect: () => void;
+  onChangeText: (text: string) => void;
+}
+
+export const FeedbackOption: React.FC<FeedbackOptionProps> = React.memo(({
+  isSelected,
+  text,
+  showInput,
+  placeholder,
+  inputValue,
+  onSelect,
+  onChangeText,
+}) => {
+  const tokens = useAppDesignTokens();
+
+  const containerStyle = {
+    marginBottom: tokens.spacing.sm,
+    backgroundColor: tokens.colors.surfaceVariant,
+    borderRadius: tokens.borderRadius.md,
+    overflow: "hidden" as const,
+  };
+
+  return (
+    <View style={containerStyle}>
+      <TouchableOpacity
+        style={[
+          styles.optionRow,
+          {
+            borderBottomWidth: showInput ? 1 : 0,
+            borderBottomColor: tokens.colors.border,
+            paddingVertical: tokens.spacing.md,
+            paddingHorizontal: tokens.spacing.md,
+          },
+        ]}
+        onPress={onSelect}
+        activeOpacity={0.7}
+      >
+        <AtomicText
+          type="bodyMedium"
+          style={[
+            styles.optionText,
+            isSelected && { color: tokens.colors.primary, fontWeight: "600" },
+          ]}
+        >
+          {text}
+        </AtomicText>
+
+        <View
+          style={[
+            styles.radioButton,
+            {
+              borderColor: isSelected ? tokens.colors.primary : tokens.colors.border,
+              backgroundColor: isSelected ? tokens.colors.primary : "transparent",
+            },
+          ]}
+        >
+          {isSelected && (
+            <View style={[styles.radioButtonInner, { backgroundColor: tokens.colors.primary }]} />
+          )}
+        </View>
+      </TouchableOpacity>
+
+      {showInput && (
+        <View style={styles.inputContainer}>
+          <TextInput
+            style={[
+              styles.textInput,
+              {
+                backgroundColor: tokens.colors.surface,
+                borderRadius: tokens.borderRadius.sm,
+                padding: tokens.spacing.sm,
+                color: tokens.colors.textPrimary,
+                minHeight: 80,
+                textAlignVertical: "top",
+              },
+            ]}
+            placeholder={placeholder}
+            placeholderTextColor={tokens.colors.textTertiary}
+            multiline
+            maxLength={200}
+            value={inputValue}
+            onChangeText={onChangeText}
+            autoFocus
+          />
+        </View>
+      )}
+    </View>
+  );
+});
+
+FeedbackOption.displayName = "FeedbackOption";
+
+const styles = StyleSheet.create({
+  optionRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+  },
+  optionText: {
+    flex: 1,
+    marginRight: 12,
+  },
+  radioButton: {
+    width: 22,
+    height: 22,
+    borderRadius: 11,
+    borderWidth: 2,
+    justifyContent: "center",
+    alignItems: "center",
+  },
+  radioButtonInner: {
+    width: 12,
+    height: 12,
+    borderRadius: 6,
+  },
+  inputContainer: {
+    padding: 12,
+  },
+  textInput: {
+    fontSize: 15,
+    borderWidth: 1,
+    borderColor: "#ccc",
+  },
+});

package/src/domains/subscription/presentation/components/feedback/PaywallFeedbackModal.tsx

@@ -1,8 +1,9 @@
 import React, { useMemo } from "react";
-import { View, TouchableOpacity, TextInput } from "react-native";
+import { View, TouchableOpacity } from "react-native";
 import { AtomicText, BaseModal, useAppDesignTokens } from "@umituz/react-native-design-system";
 import { usePaywallFeedback } from "../../../../../presentation/hooks/feedback/usePaywallFeedback";
 import { createPaywallFeedbackStyles } from "./paywallFeedbackStyles";
+import { FeedbackOption } from "./FeedbackOption";
 
 const FEEDBACK_OPTION_IDS = [
     "too_expensive",
@@ -69,77 +70,18 @@ export const PaywallFeedbackModal: React.FC<PaywallFeedbackModalProps> = React.m
                         const isSelected = selectedReason === optionId;
                         const isOther = optionId === "other";
                         const showInput = isSelected && isOther;
-                        const displayText = translations.reasons[optionId];
-                        
-                        // Dynamic styles for the container
-                        const containerStyle = {
-                            marginBottom: tokens.spacing.sm,
-                            backgroundColor: tokens.colors.surfaceVariant,
-                            borderRadius: tokens.borderRadius.md,
-                            overflow: 'hidden' as const, // Ensure children don't bleed out
-                        };
 
                         return (
-                            <View key={optionId} style={containerStyle}>
-                                <TouchableOpacity
-                                    style={{
-                                        borderBottomWidth: showInput ? 1 : 0,
-                                        borderBottomColor: tokens.colors.surface, // Subtle separator
-                                        paddingVertical: tokens.spacing.md,
-                                        paddingHorizontal: tokens.spacing.md,
-                                        flexDirection: 'row',
-                                        alignItems: 'center',
-                                        justifyContent: 'space-between',
-                                    }}
-                                    onPress={() => selectReason(optionId)}
-                                    activeOpacity={0.7}
-                                >
-                                    <AtomicText
-                                        type="bodyMedium"
-                                        style={[
-                                            styles.optionText,
-                                            isSelected && { color: tokens.colors.primary, fontWeight: '600' },
-                                        ]}
-                                    >
-                                        {displayText}
-                                    </AtomicText>
-
-                                    <View
-                                        style={[
-                                            styles.radioButton,
-                                            isSelected && styles.radioButtonSelected,
-                                        ]}
-                                    >
-                                        {isSelected && (
-                                            <View style={styles.radioButtonInner} />
-                                        )}
-                                    </View>
-                                </TouchableOpacity>
-
-                                {showInput && (
-                                    <View style={[styles.inputContainer, { backgroundColor: 'transparent', marginTop: 0, padding: tokens.spacing.sm }]}>
-                                        <TextInput
-                                            style={[
-                                                styles.textInput, 
-                                                { 
-                                                    minHeight: 80, 
-                                                    textAlignVertical: 'top',
-                                                    backgroundColor: tokens.colors.surface, // Slightly different background for input
-                                                    borderRadius: tokens.borderRadius.sm,
-                                                    padding: tokens.spacing.sm,
-                                                }
-                                            ]}
-                                            placeholder={translations.otherPlaceholder}
-                                            placeholderTextColor={tokens.colors.textTertiary}
-                                            multiline
-                                            maxLength={200}
-                                            value={otherText}
-                                            onChangeText={setOtherText}
-                                            autoFocus
-                                        />
-                                    </View>
-                                )}
-                            </View>
+                            <FeedbackOption
+                                key={optionId}
+                                isSelected={isSelected}
+                                text={translations.reasons[optionId]}
+                                showInput={showInput}
+                                placeholder={translations.otherPlaceholder}
+                                inputValue={otherText}
+                                onSelect={() => selectReason(optionId)}
+                                onChangeText={setOtherText}
+                            />
                         );
                     })}
                 </View>
@@ -159,4 +101,7 @@ export const PaywallFeedbackModal: React.FC<PaywallFeedbackModalProps> = React.m
     );
 });
 
+PaywallFeedbackModal.displayName = "PaywallFeedbackModal";
+
+
 

package/src/domains/subscription/presentation/components/feedback/paywallFeedbackStyles.ts

@@ -10,105 +10,13 @@ export const createPaywallFeedbackStyles = (
     tokens: DesignTokens,
     canSubmit: boolean
 ) => {
-    const overlayColor = tokens.colors.backgroundPrimary + '99';
-
     return StyleSheet.create({
-        overlay: {
-            flex: 1,
-            backgroundColor: overlayColor,
-            justifyContent: "center",
-            alignItems: "center",
-            padding: 20,
-        },
-        keyboardView: {
-            width: "100%",
-            alignItems: "center",
-        },
-        container: {
-            width: "100%",
-            maxWidth: 360,
-            backgroundColor: tokens.colors.surface,
-            borderRadius: 24,
-            padding: 24,
-            borderWidth: 1,
-            borderColor: tokens.colors.border,
-        },
-        header: {
-            alignItems: "center",
-            marginBottom: 20,
-        },
-        title: {
-            color: tokens.colors.textPrimary,
-            marginBottom: 8,
-            textAlign: "center",
-        },
-        subtitle: {
-            color: tokens.colors.textSecondary,
-            textAlign: "center",
-            lineHeight: 22,
-        },
         optionsContainer: {
             backgroundColor: tokens.colors.surfaceSecondary,
             borderRadius: 16,
             overflow: "hidden",
             marginBottom: 20,
         },
-        optionRow: {
-            flexDirection: "row",
-            alignItems: "center",
-            justifyContent: "space-between",
-            paddingVertical: 16,
-            paddingHorizontal: 16,
-            borderBottomWidth: 1,
-            borderBottomColor: tokens.colors.border,
-        },
-        optionRowLast: {
-            borderBottomWidth: 0,
-        },
-        optionText: {
-            color: tokens.colors.textSecondary,
-            flex: 1,
-            marginRight: 12,
-        },
-        optionTextSelected: {
-            color: tokens.colors.textPrimary,
-            fontWeight: "600",
-        },
-        radioButton: {
-            width: 22,
-            height: 22,
-            borderRadius: 11,
-            borderWidth: 2,
-            borderColor: tokens.colors.border,
-            justifyContent: "center",
-            alignItems: "center",
-            backgroundColor: "transparent",
-        },
-        radioButtonSelected: {
-            borderColor: tokens.colors.primary,
-            borderWidth: 2,
-        },
-        radioButtonInner: {
-            width: 12,
-            height: 12,
-            borderRadius: 6,
-            backgroundColor: tokens.colors.primary,
-        },
-        inputContainer: {
-            paddingHorizontal: 16,
-            paddingBottom: 16,
-        },
-        textInput: {
-            backgroundColor: tokens.colors.surface,
-            borderRadius: 12,
-            borderWidth: 1,
-            borderColor: tokens.colors.border,
-            padding: 12,
-            fontSize: 15,
-            color: tokens.colors.textPrimary,
-            minHeight: 80,
-            textAlignVertical: "top",
-        },
         submitButton: {
             backgroundColor: canSubmit ? tokens.colors.primary : tokens.colors.surfaceSecondary,
             borderRadius: 14,

package/src/domains/subscription/presentation/stores/purchaseLoadingStore.ts

@@ -32,21 +32,10 @@ const initialState: PurchaseLoadingState = {
   purchaseSource: null,
 };
 
-export const usePurchaseLoadingStore = create<PurchaseLoadingStore>((set, get) => ({
+export const usePurchaseLoadingStore = create<PurchaseLoadingStore>((set) => ({
   ...initialState,
 
   startPurchase: (productId, source) => {
-    const currentState = get();
-    if (currentState.isPurchasing) {
-      if (__DEV__) {
-        console.warn("[PurchaseLoadingStore] startPurchase called while purchase already in progress:", {
-          currentProductId: currentState.purchasingProductId,
-          newProductId: productId,
-          currentSource: currentState.purchaseSource,
-          newSource: source,
-        });
-      }
-    }
     set({
       isPurchasing: true,
       purchasingProductId: productId,
@@ -55,12 +44,6 @@ export const usePurchaseLoadingStore = create<PurchaseLoadingStore>((set, get) =
   },
 
   endPurchase: () => {
-    const currentState = get();
-    if (!currentState.isPurchasing) {
-      if (__DEV__) {
-        console.warn("[PurchaseLoadingStore] endPurchase called while no purchase in progress");
-      }
-    }
     set({
       isPurchasing: false,
       purchasingProductId: null,

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

@@ -7,59 +7,24 @@ import { useCallback } from "react";
 import type { PurchasesPackage } from "react-native-purchases";
 import { usePremium } from "./usePremium";
 import type { PurchaseSource } from "../core/SubscriptionConstants";
+import { authPurchaseStateManager } from "../infrastructure/utils/authPurchaseState";
 
-export interface PurchaseAuthProvider {
-  isAuthenticated: () => boolean;
-  showAuthModal: () => void;
-}
-
-let globalAuthProvider: PurchaseAuthProvider | null = null;
-
-interface SavedPurchaseState {
-  pkg: PurchasesPackage;
-  source: PurchaseSource;
-  timestamp: number;
-}
-
-const SAVED_PURCHASE_EXPIRY_MS = 5 * 60 * 1000; // 5 minutes
-let savedPurchaseState: SavedPurchaseState | null = null;
+export type { PurchaseAuthProvider } from "../infrastructure/utils/authPurchaseState";
 
-export const configureAuthProvider = (provider: PurchaseAuthProvider): void => {
-  globalAuthProvider = provider;
+export const configureAuthProvider = (provider: import("../infrastructure/utils/authPurchaseState").PurchaseAuthProvider): void => {
+  authPurchaseStateManager.configure(provider);
 };
 
-/**
- * Cleanup method to reset global auth provider state
- * Call this when app is shutting down or auth system is being reset
- */
 export const cleanupAuthProvider = (): void => {
-  if (__DEV__) {
-    console.log("[useAuthAwarePurchase] Cleaning up auth provider");
-  }
-  globalAuthProvider = null;
-  clearSavedPurchase();
-};
-
-const savePurchase = (pkg: PurchasesPackage, source: PurchaseSource): void => {
-  savedPurchaseState = { pkg, source, timestamp: Date.now() };
+  authPurchaseStateManager.cleanup();
 };
 
 export const getSavedPurchase = (): { pkg: PurchasesPackage; source: PurchaseSource } | null => {
-  if (!savedPurchaseState) {
-    return null;
-  }
-
-  const isExpired = Date.now() - savedPurchaseState.timestamp > SAVED_PURCHASE_EXPIRY_MS;
-  if (isExpired) {
-    savedPurchaseState = null;
-    return null;
-  }
-
-  return { pkg: savedPurchaseState.pkg, source: savedPurchaseState.source };
+  return authPurchaseStateManager.getSavedPurchase();
 };
 
 export const clearSavedPurchase = (): void => {
-  savedPurchaseState = null;
+  authPurchaseStateManager.clearSavedPurchase();
 };
 
 export interface UseAuthAwarePurchaseParams {
@@ -79,25 +44,17 @@ export const useAuthAwarePurchase = (
 
   const handlePurchase = useCallback(
     async (pkg: PurchasesPackage, source?: PurchaseSource): Promise<boolean> => {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[useAuthAwarePurchase] handlePurchase:", {
-          productId: pkg.product.identifier,
-          hasAuthProvider: !!globalAuthProvider,
-        });
-      }
+      const authProvider = authPurchaseStateManager.getProvider();
 
-      if (!globalAuthProvider) {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.error("[useAuthAwarePurchase] Auth provider not configured");
-        }
+      if (!authProvider) {
         return false;
       }
 
-      const isAuth = globalAuthProvider.isAuthenticated();
+      const isAuth = authProvider.isAuthenticated();
 
       if (!isAuth) {
-        savePurchase(pkg, source || params?.source || "settings");
-        globalAuthProvider.showAuthModal();
+        authPurchaseStateManager.savePurchase(pkg, source || params?.source || "settings");
+        authProvider.showAuthModal();
         return false;
       }
 
@@ -107,12 +64,14 @@ export const useAuthAwarePurchase = (
   );
 
   const handleRestore = useCallback(async (): Promise<boolean> => {
-    if (!globalAuthProvider) {
+    const authProvider = authPurchaseStateManager.getProvider();
+
+    if (!authProvider) {
       return false;
     }
 
-    if (!globalAuthProvider.isAuthenticated()) {
-      globalAuthProvider.showAuthModal();
+    if (!authProvider.isAuthenticated()) {
+      authProvider.showAuthModal();
       return false;
     }
 
@@ -120,29 +79,16 @@ export const useAuthAwarePurchase = (
   }, [restorePurchase]);
 
   const executeSavedPurchase = useCallback(async (): Promise<boolean> => {
-    const saved = getSavedPurchase();
+    const saved = authPurchaseStateManager.getSavedPurchase();
     if (!saved) {
       return false;
     }
 
-    if (typeof __DEV__ !== "undefined" && __DEV__) {
-      console.log("[useAuthAwarePurchase] Executing saved purchase:", saved.pkg.product.identifier);
-    }
-
-    try {
-      const result = await purchasePackage(saved.pkg);
-      // Only clear after successful purchase
-      if (result) {
-        clearSavedPurchase();
-      }
-      return result;
-    } catch (error) {
-      // Don't clear on error - allow retry
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.error("[useAuthAwarePurchase] Saved purchase failed:", error);
-      }
-      throw error;
+    const result = await purchasePackage(saved.pkg);
+    if (result) {
+      authPurchaseStateManager.clearSavedPurchase();
     }
+    return result;
   }, [purchasePackage]);
 
   return {

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

@@ -47,16 +47,10 @@ export const usePremium = (): UsePremiumResult => {
 
   const handlePurchase = useCallback(
     async (pkg: PurchasesPackage): Promise<boolean> => {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[usePremium] handlePurchase:", pkg.product.identifier);
-      }
       try {
         const result = await purchaseMutation.mutateAsync(pkg);
         return result.success;
-      } catch (error) {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.error("[usePremium] Purchase failed:", error);
-        }
+      } catch {
         return false;
       }
     },
@@ -67,10 +61,7 @@ export const usePremium = (): UsePremiumResult => {
     try {
       const result = await restoreMutation.mutateAsync();
       return result.success;
-    } catch (error) {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.error("[usePremium] Restore failed:", error);
-      }
+    } catch {
       return false;
     }
   }, [restoreMutation]);

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

@@ -37,13 +37,8 @@ export const useSubscriptionStatus = (): SubscriptionStatusResult => {
 
       try {
         const result = await SubscriptionManager.checkPremiumStatus();
-        // Ensure we always return a valid object even if result is null/undefined
         return result ?? { isPremium: false, expirationDate: null };
-      } catch (error) {
-        if (__DEV__) {
-          console.error('[useSubscriptionStatus] Failed to check premium status:', error);
-        }
-        // Return default state on error to prevent crashes
+      } catch {
         return { isPremium: false, expirationDate: null };
       }
     },

package/src/domains/trial/application/TrialService.ts

@@ -18,8 +18,7 @@ export async function checkTrialEligibility(userId?: string, deviceId?: string):
     const id = deviceId || await getDeviceId();
     const record = await repository.getRecord(id);
     return TrialEligibilityService.check(userId, id, record);
-  } catch (error) {
-    if (__DEV__) console.error("[TrialService] Eligibility check error:", error);
+  } catch {
     return { eligible: false, reason: "error" };
   }
 }
@@ -34,8 +33,7 @@ export async function recordTrialStart(userId: string, deviceId?: string): Promi
       lastUserId: userId,
       userIds: arrayUnion(userId) as any,
     });
-  } catch (error) {
-    if (__DEV__) console.error("[TrialService] Record trial error:", error);
+  } catch {
     return false;
   }
 }
@@ -48,8 +46,7 @@ export async function recordTrialEnd(deviceId?: string): Promise<boolean> {
       trialInProgress: false,
       trialEndedAt: serverTimestamp() as any,
     });
-  } catch (error) {
-    if (__DEV__) console.error("[TrialService] Record trial end error:", error);
+  } catch {
     return false;
   }
 }
@@ -62,8 +59,7 @@ export async function recordTrialConversion(deviceId?: string): Promise<boolean>
       trialInProgress: false,
       trialConvertedAt: serverTimestamp() as any,
     });
-  } catch (error) {
-    if (__DEV__) console.error("[TrialService] Record conversion error:", error);
+  } catch {
     return false;
   }
 }

package/src/domains/wallet/infrastructure/services/ProductMetadataService.ts

@@ -58,21 +58,8 @@ export class ProductMetadataService {
     try {
       const data = await this.fetchFromFirebase();
       this.cache = { data, timestamp: Date.now() };
-
-      if (__DEV__) {
-        console.log(
-          "[ProductMetadataService] Loaded:",
-          data.length,
-          "products"
-        );
-      }
-
       return data;
     } catch (error) {
-      if (__DEV__) {
-        console.error("[ProductMetadataService] Fetch error:", error);
-      }
-
       if (this.cache) {
         return this.cache.data;
       }

package/src/domains/wallet/presentation/hooks/useProductMetadata.ts

@@ -72,16 +72,6 @@ export function useProductMetadata({
   const creditsPackages = products.filter((p) => p.type === "credits");
   const subscriptionPackages = products.filter((p) => p.type === "subscription");
 
-  if (__DEV__) {
-    console.log("[useProductMetadata] State", {
-      enabled,
-      isLoading,
-      count: products.length,
-      credits: creditsPackages.length,
-      subscriptions: subscriptionPackages.length,
-    });
-  }
-
   return {
     products,
     isLoading,

package/src/domains/wallet/presentation/hooks/useTransactionHistory.ts

@@ -69,14 +69,6 @@ export function useTransactionHistory({
 
   const transactions = data ?? [];
 
-  if (typeof __DEV__ !== "undefined" && __DEV__) {
-    console.log("[useTransactionHistory] State", {
-      userId: userId?.slice(0, 8),
-      isLoading,
-      count: transactions.length,
-    });
-  }
-
   return {
     transactions,
     isLoading,