vibefast-cli 0.2.3 → 0.3.0

package/2/apps/native/src/features/payments/components/paywall-remote-mode.tsx

@@ -0,0 +1,146 @@
+import type React from 'react';
+import { ActivityIndicator, Pressable, Text, View } from 'react-native';
+
+import { translate } from '@/lib';
+import { useThemeConfig } from '@/lib/use-theme-config';
+
+type PaywallRemoteModeProps = {
+  onPresentPaywall: () => void;
+  isPurchasing: boolean;
+};
+
+export const PaywallRemoteMode: React.FC<PaywallRemoteModeProps> = ({
+  onPresentPaywall,
+  isPurchasing,
+}) => {
+  const theme = useThemeConfig();
+
+  return (
+    <View className="flex-1 px-4">
+      <View className="mb-8 items-center">
+        <View
+          className="mb-6 size-32 items-center justify-center rounded-full"
+          style={{
+            backgroundColor: `${theme.colors.primary}10`,
+            borderWidth: 3,
+            borderColor: theme.colors.primary,
+          }}
+        >
+          <Text className="text-6xl">🎨</Text>
+        </View>
+        <Text
+          className="mb-4 text-center text-3xl font-bold"
+          style={{ color: theme.colors.foreground }}
+        >
+          {translate('paywall.remote.hero_title')}
+        </Text>
+        <Text
+          className="mb-8 text-center text-lg leading-6"
+          style={{ color: theme.colors.mutedForeground }}
+        >
+          {translate('paywall.remote.hero_subtitle')}
+        </Text>
+      </View>
+
+      <View
+        className="mb-6 rounded-3xl p-8"
+        style={{
+          backgroundColor: theme.colors.card,
+          shadowColor: theme.colors.primary,
+          shadowOffset: { width: 0, height: 20 },
+          shadowOpacity: 0.1,
+          shadowRadius: 30,
+          elevation: 8,
+        }}
+      >
+        <View className="mb-6 items-center">
+          <Text
+            className="mb-2 text-xl font-semibold"
+            style={{ color: theme.colors.foreground }}
+          >
+            {translate('paywall.remote.features_title')}
+          </Text>
+          <View
+            className="h-1 w-16 rounded-full"
+            style={{ backgroundColor: theme.colors.primary }}
+          />
+        </View>
+
+        <View className="gap-y-4">
+          <View className="flex-row items-center">
+            <View
+              className="mr-3 size-8 items-center justify-center rounded-full"
+              style={{ backgroundColor: `${theme.colors.success}20` }}
+            >
+              <Text className="text-sm">🎨</Text>
+            </View>
+            <Text style={{ color: theme.colors.mutedForeground }}>
+              {translate('paywall.remote.features.native_ui')}
+            </Text>
+          </View>
+          <View className="flex-row items-center">
+            <View
+              className="mr-3 size-8 items-center justify-center rounded-full"
+              style={{ backgroundColor: `${theme.colors.success}20` }}
+            >
+              <Text className="text-sm">🔄</Text>
+            </View>
+            <Text style={{ color: theme.colors.mutedForeground }}>
+              {translate('paywall.remote.features.realtime_updates')}
+            </Text>
+          </View>
+          <View className="flex-row items-center">
+            <View
+              className="mr-3 size-8 items-center justify-center rounded-full"
+              style={{ backgroundColor: `${theme.colors.success}20` }}
+            >
+              <Text className="text-sm">📱</Text>
+            </View>
+            <Text style={{ color: theme.colors.mutedForeground }}>
+              {translate('paywall.remote.features.mobile_optimized')}
+            </Text>
+          </View>
+        </View>
+      </View>
+
+      <Pressable
+        onPress={onPresentPaywall}
+        disabled={isPurchasing}
+        className="mb-4 items-center justify-center rounded-3xl py-6"
+        style={{
+          backgroundColor: isPurchasing
+            ? theme.colors.muted
+            : theme.colors.primary,
+          opacity: isPurchasing ? 0.6 : 1,
+          shadowColor: theme.colors.primary,
+          shadowOffset: { width: 0, height: 8 },
+          shadowOpacity: 0.3,
+          shadowRadius: 16,
+          elevation: 8,
+        }}
+      >
+        {isPurchasing ? (
+          <View className="flex-row items-center">
+            <ActivityIndicator
+              size="small"
+              color={theme.colors.primaryForeground}
+            />
+            <Text
+              className="ml-3 text-lg font-bold"
+              style={{ color: theme.colors.primaryForeground }}
+            >
+              {translate('common.loading')}
+            </Text>
+          </View>
+        ) : (
+          <Text
+            className="text-xl font-bold"
+            style={{ color: theme.colors.primaryForeground }}
+          >
+            {translate('paywall.remote.cta')}
+          </Text>
+        )}
+      </Pressable>
+    </View>
+  );
+};

package/2/apps/native/src/features/payments/hooks/use-entitlement.ts

@@ -0,0 +1,63 @@
+import { useEffect, useState } from 'react';
+
+import { RevenueCatAdapter } from '@/features/payments/services/revenuecat-adapter';
+
+/**
+ * Hook to check if a user has a specific entitlement
+ * @param entitlementId - The entitlement identifier to check
+ * @returns Object containing entitlement status, loading state, and any error
+ */
+export const useEntitlement = (entitlementId: string) => {
+  const [isEntitled, setIsEntitled] = useState(false);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    let isMounted = true;
+
+    const checkEntitlement = async () => {
+      if (!entitlementId) {
+        if (!isMounted) return;
+        setIsEntitled(false);
+        setIsLoading(false);
+        return;
+      }
+
+      try {
+        if (!isMounted) return;
+        setIsLoading(true);
+        setError(null);
+
+        if (!RevenueCatAdapter.getIsInitialized()) {
+          await RevenueCatAdapter.initialize();
+        }
+
+        const paymentService = new RevenueCatAdapter();
+        const { isActive } =
+          await paymentService.getUserSubscriptionStatus(entitlementId);
+        if (!isMounted) return;
+        setIsEntitled(isActive);
+      } catch (e) {
+        if (!isMounted) return;
+        setIsEntitled(false); // Default to not entitled on error
+        setError(
+          e instanceof Error ? e.message : 'Failed to check entitlement',
+        );
+      } finally {
+        if (!isMounted) return;
+        setIsLoading(false);
+      }
+    };
+
+    checkEntitlement();
+
+    // Optional: Add listener for customer info updates from RevenueCat
+    // This would require implementing a listener mechanism in RevenueCatAdapter
+    // For now, we'll rely on component re-mounting or manual refresh
+    return () => {
+      isMounted = false;
+    };
+  }, [entitlementId]);
+
+  return { isEntitled, isLoading, error };
+};

package/2/apps/native/src/features/payments/index.ts

@@ -0,0 +1,8 @@
+// Components
+export { PaymentInitializer } from './components/payment-initializer';
+
+// Hooks
+export { useEntitlement } from './hooks/use-entitlement';
+
+// Services
+export { RevenueCatAdapter } from './services/revenuecat-adapter';

package/2/apps/native/src/features/payments/services/revenuecat-adapter.ts

@@ -0,0 +1,407 @@
+import { Platform } from 'react-native';
+import Purchases, {
+  LOG_LEVEL,
+  type PurchasesOffering,
+  type PurchasesPackage,
+} from 'react-native-purchases';
+
+import { ConfigService } from '@/core/config';
+import * as Logger from '@/core/logging';
+import type {
+  PaymentService,
+  ProductOffering,
+} from '@/core/payments/payment-service';
+
+// Ensure a log handler is registered ASAP to avoid
+// "TypeError: customLogHandler is not a function" on Android Hermes
+try {
+  // If a handler is already set later via configure, this will be overwritten.
+  Purchases.setLogHandler((logLevel, message) => {
+    switch (logLevel) {
+      case LOG_LEVEL.DEBUG:
+        // console.debug(`[RevenueCat] ${message}`);
+        break;
+      case LOG_LEVEL.INFO:
+        // console.info(`[RevenueCat] ${message}`);
+        break;
+      case LOG_LEVEL.WARN:
+        // console.warn(`[RevenueCat] ${message}`);
+        break;
+      case LOG_LEVEL.ERROR:
+        // console.error(`[RevenueCat] ${message}`);
+        break;
+      default:
+      // console.log(`[RevenueCat] ${message}`);
+    }
+  });
+} catch {
+  // best-effort: ignore if native module isn't ready yet
+}
+
+/**
+ * RevenueCat adapter service implementing the PaymentService interface
+ */
+export class RevenueCatAdapter implements PaymentService {
+  private static isInitialized = false;
+
+  /**
+   * Initialize the RevenueCat SDK
+   * Should be called once during app startup
+   */
+  static async initialize(): Promise<void> {
+    if (RevenueCatAdapter.isInitialized) {
+      Logger.info('[RevenueCatAdapter] SDK already initialized, skipping');
+      return;
+    }
+
+    try {
+      // Check if RevenueCat is already configured (Fast Refresh protection)
+      try {
+        await Purchases.getCustomerInfo();
+        Logger.info(
+          '[RevenueCatAdapter] RevenueCat already configured from previous session',
+        );
+        RevenueCatAdapter.isInitialized = true;
+        return;
+      } catch {
+        // Not configured yet, proceed with configuration
+        Logger.debug(
+          '[RevenueCatAdapter] RevenueCat not configured, proceeding with initialization',
+        );
+      }
+
+      // Get the appropriate API key based on platform
+      const apiKey = Platform.select({
+        ios: ConfigService.getRevenueCatApiKeyApple(),
+        android: ConfigService.getRevenueCatApiKeyGoogle(),
+      });
+
+      if (!apiKey) {
+        Logger.warn(
+          `[RevenueCatAdapter] No API key found for platform: ${Platform.OS}`,
+        );
+        return;
+      }
+
+      // Set debug logs level (only in development)
+      if (ConfigService.getAppEnv() !== 'production') {
+        Purchases.setLogLevel(LOG_LEVEL.DEBUG);
+      }
+
+      // Configure and initialize the SDK
+      await Purchases.configure({ apiKey });
+
+      RevenueCatAdapter.isInitialized = true;
+      Logger.info('[RevenueCatAdapter] SDK initialized successfully');
+    } catch (error) {
+      Logger.error(
+        '[RevenueCatAdapter] Failed to initialize SDK: ' + String(error),
+      );
+      throw error;
+    }
+  }
+
+  /**
+   * Check if the SDK is initialized
+   */
+  static getIsInitialized(): boolean {
+    return RevenueCatAdapter.isInitialized;
+  }
+
+  /**
+   * Fetch product offerings from RevenueCat
+   */
+  async fetchProductOfferings(
+    _configType: 'local' | 'remote',
+  ): Promise<ProductOffering[]> {
+    this.ensureInitialized();
+
+    try {
+      const offerings = await Purchases.getOfferings();
+      Logger.debug('[RevenueCatAdapter] Offerings retrieved');
+
+      const productOfferings: ProductOffering[] = [];
+
+      // Process current offering
+      if (offerings.current) {
+        const currentOffering = offerings.current;
+
+        // Convert packages to ProductOffering format
+        Object.values(currentOffering.availablePackages).forEach(
+          (pkg: PurchasesPackage) => {
+            productOfferings.push({
+              id: pkg.identifier,
+              priceString: pkg.product.priceString,
+            });
+          },
+        );
+      }
+
+      // Process all offerings if needed
+      Object.values(offerings.all).forEach((offering: PurchasesOffering) => {
+        Object.values(offering.availablePackages).forEach(
+          (pkg: PurchasesPackage) => {
+            // Avoid duplicates
+            if (!productOfferings.find((p) => p.id === pkg.identifier)) {
+              productOfferings.push({
+                id: pkg.identifier,
+                priceString: pkg.product.priceString,
+              });
+            }
+          },
+        );
+      });
+
+      return productOfferings;
+    } catch (error) {
+      Logger.error(
+        '[RevenueCatAdapter] Failed to fetch offerings: ' + String(error),
+      );
+      throw error;
+    }
+  }
+
+  /**
+   * Purchase a product
+   */
+  async purchaseProduct(
+    productId: string,
+    offeringIdentifier?: string,
+    onConsumablePurchase?: (details: {
+      productId: string;
+      quantity: number;
+    }) => Promise<void>,
+  ): Promise<{ success: boolean; error?: string; customerInfo?: any }> {
+    this.ensureInitialized();
+
+    try {
+      // Get offerings to find the package
+      const offerings = await Purchases.getOfferings();
+      let packageToPurchase: PurchasesPackage | null = null;
+
+      // Find the package by productId
+      if (offeringIdentifier && offerings.all[offeringIdentifier]) {
+        packageToPurchase =
+          offerings.all[offeringIdentifier].availablePackages.find(
+            (pkg) => pkg.identifier === productId,
+          ) || null;
+      } else if (offerings.current) {
+        packageToPurchase =
+          offerings.current.availablePackages.find(
+            (pkg) => pkg.identifier === productId,
+          ) || null;
+      }
+
+      if (!packageToPurchase) {
+        return {
+          success: false,
+          error: `Package with ID ${productId} not found`,
+        };
+      }
+
+      const { customerInfo } =
+        await Purchases.purchasePackage(packageToPurchase);
+      Logger.info(`[RevenueCatAdapter] Purchase successful: ${productId}`);
+
+      // Check if this is a consumable product and handle it
+      if (onConsumablePurchase && this.isConsumableProduct(productId)) {
+        const quantity = this.getConsumableQuantity(productId);
+        try {
+          await onConsumablePurchase({ productId, quantity });
+          Logger.info(
+            `[RevenueCatAdapter] Consumable purchase recorded: ${productId} (${quantity} credits)`,
+          );
+        } catch (error) {
+          Logger.error(
+            `[RevenueCatAdapter] Failed to record consumable purchase: ${String(error)}`,
+          );
+          // Continue with successful purchase response even if backend recording fails
+        }
+      }
+
+      return {
+        success: true,
+        customerInfo,
+      };
+    } catch (error) {
+      Logger.error('[RevenueCatAdapter] Purchase failed: ' + String(error));
+      return {
+        success: false,
+        error: String(error),
+      };
+    }
+  }
+
+  /**
+   * Get user subscription status
+   */
+  async getUserSubscriptionStatus(
+    entitlementId: string,
+  ): Promise<{ isActive: boolean; details?: any }> {
+    this.ensureInitialized();
+
+    try {
+      const customerInfo = await Purchases.getCustomerInfo();
+      const entitlement = customerInfo.entitlements.active[entitlementId];
+
+      return {
+        isActive: !!entitlement,
+        details: entitlement || null,
+      };
+    } catch (error) {
+      Logger.error(
+        '[RevenueCatAdapter] Failed to get subscription status: ' +
+          String(error),
+      );
+      return {
+        isActive: false,
+        details: { error: String(error) },
+      };
+    }
+  }
+
+  /**
+   * Restore purchases
+   */
+  async restorePurchases(): Promise<{
+    success: boolean;
+    error?: string;
+    restoredEntitlements?: string[];
+  }> {
+    this.ensureInitialized();
+
+    try {
+      const customerInfo = await Purchases.restorePurchases();
+      Logger.info('[RevenueCatAdapter] Purchases restored');
+
+      const restoredEntitlements = Object.keys(
+        customerInfo.entitlements.active,
+      );
+
+      return {
+        success: true,
+        restoredEntitlements,
+      };
+    } catch (error) {
+      Logger.error(
+        '[RevenueCatAdapter] Failed to restore purchases: ' + String(error),
+      );
+      return {
+        success: false,
+        error: String(error),
+      };
+    }
+  }
+
+  /**
+   * Record consumable purchase (not typically used with RevenueCat subscriptions)
+   */
+  async recordConsumablePurchase(_details: {
+    productId: string;
+    quantity: number;
+    transactionDetails: any;
+  }): Promise<{ success: boolean; error?: string }> {
+    Logger.warn(
+      '[RevenueCatAdapter] recordConsumablePurchase not implemented for RevenueCat',
+    );
+    return {
+      success: false,
+      error: 'Consumable purchases not supported by RevenueCat adapter',
+    };
+  }
+
+  /**
+   * Set user ID for RevenueCat
+   */
+  static async setUserId(userId: string) {
+    RevenueCatAdapter.ensureInitialized();
+    try {
+      const { customerInfo } = await Purchases.logIn(userId);
+      Logger.info(`[RevenueCatAdapter] User logged in: ${userId}`);
+      return customerInfo;
+    } catch (error) {
+      Logger.error(
+        '[RevenueCatAdapter] Failed to set user ID: ' + String(error),
+      );
+      throw error;
+    }
+  }
+
+  /**
+   * Log out the current user
+   */
+  static async logOut() {
+    RevenueCatAdapter.ensureInitialized();
+    try {
+      const customerInfo = await Purchases.logOut();
+      Logger.info('[RevenueCatAdapter] User logged out');
+      return customerInfo;
+    } catch (error) {
+      Logger.error(
+        '[RevenueCatAdapter] Failed to log out user: ' + String(error),
+      );
+      throw error;
+    }
+  }
+
+  /**
+   * Ensure the SDK is initialized before making calls
+   * @private
+   */
+  private ensureInitialized(): void {
+    if (!RevenueCatAdapter.isInitialized) {
+      throw new Error(
+        '[RevenueCatAdapter] SDK not initialized. Call initialize() first.',
+      );
+    }
+  }
+
+  /**
+   * Static version for class-level calls
+   * @private
+   */
+  private static ensureInitialized(): void {
+    if (!RevenueCatAdapter.isInitialized) {
+      throw new Error(
+        '[RevenueCatAdapter] SDK not initialized. Call initialize() first.',
+      );
+    }
+  }
+
+  /**
+   * Check if a product ID represents a consumable purchase (credits)
+   * @private
+   */
+  private isConsumableProduct(productId: string): boolean {
+    // Define patterns for consumable products (credits)
+    return productId.includes('credits') || productId.includes('credit');
+  }
+
+  /**
+   * Get the number of credits for a consumable product
+   * @private
+   */
+  private getConsumableQuantity(productId: string): number {
+    // Extract quantity from product ID patterns
+    const patterns = [
+      /credits?[_-]?(\d+)/i, // credits_100, credit_50, credits100
+      /(\d+)[_-]?credits?/i, // 100_credits, 50credit, 100credits
+    ];
+
+    for (const pattern of patterns) {
+      const match = productId.match(pattern);
+      if (match && match[1]) {
+        const quantity = Number.parseInt(match[1], 10);
+        if (!isNaN(quantity) && quantity > 0) {
+          return quantity;
+        }
+      }
+    }
+
+    // Default to 1 credit if pattern not recognized
+    Logger.warn(
+      `[RevenueCatAdapter] Could not parse quantity from productId: ${productId}, defaulting to 1`,
+    );
+    return 1;
+  }
+}