@umituz/react-native-ai-generation-content 1.83.48 → 1.83.50

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-ai-generation-content",
-  "version": "1.83.48",
+  "version": "1.83.50",
   "description": "Provider-agnostic AI generation orchestration for React Native with result preview components",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/domains/generation/wizard/infrastructure/strategies/wizard-strategy.constants.ts

@@ -17,6 +17,9 @@ export const PHOTO_KEY_PREFIX = "photo_";
 /** Default style value (no custom style applied) */
 export const DEFAULT_STYLE_VALUE = "original";
 
+/** Debounce interval to prevent rapid double-tap on generation start (ms) */
+export const GENERATION_DEBOUNCE_MS = 500;
+
 /** Model input defaults */
 export const MODEL_INPUT_DEFAULTS = {
   aspectRatio: "1:1",

package/src/domains/generation/wizard/infrastructure/utils/creation-persistence-factory.ts

@@ -1,19 +1,17 @@
 /**
  * Creation Persistence Factory
- * Infrastructure: Creates persistence handler instance
+ * Creates a persistence handler bound to the creations repository
  */
 
 import { createCreationsRepository } from "../../../../creations/infrastructure/adapters";
-import type { CreationPersistenceConfig, ProcessingCreationData, CompletedCreationData } from "./creation-persistence.types";
+import type { ProcessingCreationData, CompletedCreationData } from "./creation-persistence.types";
 import { saveAsProcessing } from "./creation-save-operations";
 import { updateToCompleted, updateToFailed, updateRequestId } from "./creation-update-operations";
 
-/**
- * Creates a creation persistence handler for a wizard flow
- */
-export function createCreationPersistence(config: CreationPersistenceConfig = {}) {
-  const { collectionName = "creations" } = config;
-  const repository = createCreationsRepository(collectionName);
+const COLLECTION_NAME = "creations";
+
+export function createCreationPersistence() {
+  const repository = createCreationsRepository(COLLECTION_NAME);
 
   return {
     saveAsProcessing: (userId: string, data: ProcessingCreationData) =>

package/src/domains/generation/wizard/infrastructure/utils/creation-persistence.types.ts

@@ -3,10 +3,6 @@
  * Domain: Value objects for creation persistence
  */
 
-export interface CreationPersistenceConfig {
-  readonly collectionName?: string;
-}
-
 export interface ProcessingCreationData {
   readonly scenarioId: string;
   readonly scenarioTitle: string;

package/src/domains/generation/wizard/presentation/hooks/useGenerationHandlers.ts

@@ -0,0 +1,72 @@
+/**
+ * Generation-specific handlers: complete, error, dismiss
+ */
+
+import { useCallback } from "react";
+import { AlertType, AlertMode, useAlert } from "@umituz/react-native-design-system";
+import type { Creation } from "../../../../creations/domain/entities/Creation";
+import { isCreation } from "./typeGuards";
+import { classifyError } from "../../../../../infrastructure/utils/error-classification";
+import type { GenerationErrorInfo } from "../components/WizardFlow.types";
+
+interface UseGenerationHandlersProps {
+  readonly skipResultStep: boolean;
+  readonly t: (key: string) => string;
+  readonly nextStep: () => void;
+  readonly setResult: (result: unknown) => void;
+  readonly setCurrentCreation: (creation: Creation | null) => void;
+  readonly onGenerationComplete?: (result: unknown) => void;
+  readonly onGenerationError?: (error: string, errorInfo?: GenerationErrorInfo) => void;
+  readonly onBack?: () => void;
+}
+
+export function useGenerationHandlers(props: UseGenerationHandlersProps) {
+  const { skipResultStep, t, nextStep, setResult, setCurrentCreation, onGenerationComplete, onGenerationError, onBack } = props;
+
+  const alert = useAlert();
+
+  const handleGenerationComplete = useCallback(
+    (result: unknown) => {
+      if (typeof __DEV__ !== "undefined" && __DEV__) {
+        console.log("[handleGenerationComplete] Called", { isCreation: isCreation(result), skipResultStep });
+      }
+      setResult(result);
+      setCurrentCreation(isCreation(result) ? result : null);
+      onGenerationComplete?.(result);
+      if (!skipResultStep) nextStep();
+    },
+    [setResult, setCurrentCreation, nextStep, onGenerationComplete, skipResultStep],
+  );
+
+  const handleGenerationError = useCallback(
+    (errorMessage: string) => {
+      const safeErrorMessage = errorMessage?.trim() || "error.generation.unknown";
+      const displayMessage = safeErrorMessage.startsWith("error.") ? t(safeErrorMessage) : safeErrorMessage;
+      const errorClassification = classifyError(errorMessage);
+      const errorInfo: GenerationErrorInfo = {
+        message: safeErrorMessage,
+        shouldRefund: errorClassification.retryable ?? false,
+        errorType: errorClassification.type,
+      };
+
+      if (typeof __DEV__ !== "undefined" && __DEV__) {
+        console.log("[handleGenerationError] Called", { errorType: errorClassification.type, shouldRefund: errorInfo.shouldRefund });
+      }
+
+      alert.show(AlertType.ERROR, AlertMode.MODAL, t("common.error"), displayMessage);
+      onGenerationError?.(safeErrorMessage, errorInfo);
+      onBack?.();
+    },
+    [alert, t, onGenerationError, onBack],
+  );
+
+  const handleDismissGenerating = useCallback(() => {
+    if (typeof __DEV__ !== "undefined" && __DEV__) {
+      console.log("[handleDismissGenerating] User dismissed generating screen");
+    }
+    alert.show(AlertType.INFO, AlertMode.TOAST, t("generator.backgroundTitle"), t("generator.backgroundMessage"));
+    onBack?.();
+  }, [alert, t, onBack]);
+
+  return { handleGenerationComplete, handleGenerationError, handleDismissGenerating };
+}

package/src/domains/generation/wizard/presentation/hooks/useNavigationHandlers.ts

@@ -0,0 +1,87 @@
+/**
+ * Navigation and step transition handlers
+ */
+
+import { useCallback, useRef } from "react";
+import { StepType, type StepDefinition } from "../../../../../domain/entities/flow-config.types";
+import type { UploadedImage } from "../../../../../presentation/hooks/generation/useAIGenerateState";
+import { GENERATION_DEBOUNCE_MS } from "../../infrastructure/strategies/wizard-strategy.constants";
+
+interface UseNavigationHandlersProps {
+  readonly currentStepIndex: number;
+  readonly flowSteps: StepDefinition[];
+  readonly customData: Record<string, unknown>;
+  readonly nextStep: () => void;
+  readonly previousStep: () => void;
+  readonly setCustomData: (stepId: string, data: unknown) => void;
+  readonly onGenerationStart?: (data: Record<string, unknown>, proceed: () => void, onError?: (error: string) => void) => void;
+  readonly handleGenerationError: (error: string) => void;
+  readonly onBack?: () => void;
+}
+
+function isPlainObjectData(data: unknown): data is Record<string, unknown> {
+  return !!data && typeof data === "object" && !("nativeEvent" in data) && !Array.isArray(data);
+}
+
+export function useNavigationHandlers(props: UseNavigationHandlersProps) {
+  const {
+    currentStepIndex, flowSteps, customData, nextStep, previousStep,
+    setCustomData, onGenerationStart, handleGenerationError, onBack,
+  } = props;
+
+  const lastGenerationAttemptRef = useRef(0);
+
+  const handleBack = useCallback(() => {
+    if (typeof __DEV__ !== "undefined" && __DEV__) {
+      console.log("[handleBack] Called", { currentStepIndex, isFirstStep: currentStepIndex === 0 });
+    }
+    if (currentStepIndex === 0) onBack?.();
+    else previousStep();
+  }, [currentStepIndex, previousStep, onBack]);
+
+  const handleNextStep = useCallback((additionalData?: Record<string, unknown>) => {
+    const nextStepDef = flowSteps[currentStepIndex + 1];
+    const mergedData = isPlainObjectData(additionalData) ? { ...customData, ...additionalData } : customData;
+
+    if (typeof __DEV__ !== "undefined" && __DEV__) {
+      console.log("[handleNextStep] Called", {
+        currentStepIndex,
+        nextStepType: nextStepDef?.type,
+        nextStepId: nextStepDef?.id,
+        totalSteps: flowSteps.length,
+        hasOnGenerationStart: !!onGenerationStart,
+        dataKeys: Object.keys(mergedData),
+      });
+    }
+
+    if (nextStepDef?.type === StepType.GENERATING && onGenerationStart) {
+      const now = Date.now();
+      if (now - lastGenerationAttemptRef.current < GENERATION_DEBOUNCE_MS) {
+        if (typeof __DEV__ !== "undefined" && __DEV__) {
+          console.log("[handleNextStep] Debounced - too rapid");
+        }
+        return;
+      }
+      lastGenerationAttemptRef.current = now;
+      if (typeof __DEV__ !== "undefined" && __DEV__) {
+        console.log("[handleNextStep] Calling onGenerationStart");
+      }
+      onGenerationStart(mergedData, nextStep, handleGenerationError);
+      return;
+    }
+    nextStep();
+  }, [currentStepIndex, flowSteps, customData, onGenerationStart, nextStep, handleGenerationError]);
+
+  const handlePhotoContinue = useCallback(
+    (stepId: string, image: UploadedImage) => {
+      if (typeof __DEV__ !== "undefined" && __DEV__) {
+        console.log("[handlePhotoContinue] Called", { stepId, hasImage: !!image, currentStepIndex });
+      }
+      setCustomData(stepId, image);
+      handleNextStep({ [stepId]: image });
+    },
+    [setCustomData, handleNextStep, currentStepIndex],
+  );
+
+  return { handleBack, handleNextStep, handlePhotoContinue };
+}

package/src/domains/generation/wizard/presentation/hooks/useWizardFlowHandlers.ts

@@ -1,161 +1,69 @@
-import { useCallback, useRef } from "react";
-import { AlertType, AlertMode, useAlert } from "@umituz/react-native-design-system";
-import { StepType, type StepDefinition } from "../../../../../domain/entities/flow-config.types";
-import type { UploadedImage } from "../../../../../presentation/hooks/generation/useAIGenerateState";
-import type { Creation } from "../../../../creations/domain/entities/Creation";
-import { isCreation } from "./typeGuards";
-import { classifyError } from "../../../../../infrastructure/utils/error-classification";
-import type { GenerationErrorInfo } from "../components/WizardFlow.types";
+/**
+ * Wizard Flow Handlers - Composition Hook
+ * Combines generation, navigation, and rating handlers
+ */
 
-interface UseWizardFlowHandlersProps {
-  readonly currentStepIndex: number;
-  readonly flowSteps: StepDefinition[];
-  readonly customData: Record<string, unknown>;
-  readonly skipResultStep: boolean;
-  readonly userId?: string;
-  readonly currentCreation: Creation | null;
-  readonly repository: { rate: (uid: string, id: string, rating: number, desc: string) => Promise<boolean> };
-  readonly t: (key: string) => string;
-  readonly nextStep: () => void;
-  readonly previousStep: () => void;
-  readonly setResult: (result: unknown) => void;
-  readonly setCustomData: (stepId: string, data: unknown) => void;
-  readonly setCurrentCreation: (creation: Creation | null) => void;
-  readonly setHasRated: (hasRated: boolean) => void;
-  readonly setShowRatingPicker: (show: boolean) => void;
-  readonly onGenerationStart?: (data: Record<string, unknown>, proceed: () => void, onError?: (error: string) => void) => void;
-  readonly onGenerationComplete?: (result: unknown) => void;
-  readonly onGenerationError?: (error: string, errorInfo?: GenerationErrorInfo) => void;
-  readonly onBack?: () => void;
-}
+import { useCallback } from "react";
+import { AlertType, AlertMode, useAlert } from "@umituz/react-native-design-system";
+import type { UseWizardFlowHandlersProps } from "./wizard-flow-handlers.types";
+import { useGenerationHandlers } from "./useGenerationHandlers";
+import { useNavigationHandlers } from "./useNavigationHandlers";
 
 export function useWizardFlowHandlers(props: UseWizardFlowHandlersProps) {
   const {
+    currentStepIndex, flowSteps, customData, userId, currentCreation,
+    repository, t, nextStep, previousStep, setCustomData,
+    onGenerationStart, onBack,
+  } = props;
+
+  const alert = useAlert();
+
+  const generation = useGenerationHandlers({
+    skipResultStep: props.skipResultStep,
+    t,
+    nextStep,
+    setResult: props.setResult,
+    setCurrentCreation: props.setCurrentCreation,
+    onGenerationComplete: props.onGenerationComplete,
+    onGenerationError: props.onGenerationError,
+    onBack,
+  });
+
+  const navigation = useNavigationHandlers({
     currentStepIndex,
     flowSteps,
     customData,
-    skipResultStep,
-    userId,
-    currentCreation,
-    repository,
-    t,
     nextStep,
     previousStep,
-    setResult,
     setCustomData,
-    setCurrentCreation,
-    setHasRated,
-    setShowRatingPicker,
     onGenerationStart,
-    onGenerationComplete,
-    onGenerationError,
+    handleGenerationError: generation.handleGenerationError,
     onBack,
-  } = props;
-
-  const alert = useAlert();
-  // Guard: prevent multiple onGenerationStart calls from auto-advancing steps
-  const generationStartedRef = useRef(false);
-
-  const handleGenerationComplete = useCallback(
-    (result: unknown) => {
-      generationStartedRef.current = false;
-      setResult(result);
-      setCurrentCreation(isCreation(result) ? result : null);
-      onGenerationComplete?.(result);
-      if (!skipResultStep) nextStep();
-    },
-    [setResult, setCurrentCreation, nextStep, onGenerationComplete, skipResultStep],
-  );
-
-  const handleGenerationError = useCallback(
-    (errorMessage: string) => {
-      generationStartedRef.current = false;
-      const safeErrorMessage = errorMessage?.trim() || "error.generation.unknown";
-      const displayMessage = safeErrorMessage.startsWith("error.") ? t(safeErrorMessage) : safeErrorMessage;
-
-      // Classify error to determine refund eligibility
-      const errorClassification = classifyError(errorMessage);
-      const errorInfo: GenerationErrorInfo = {
-        message: safeErrorMessage,
-        shouldRefund: errorClassification.retryable ?? false,
-        errorType: errorClassification.type,
-      };
-
-      alert.show(AlertType.ERROR, AlertMode.MODAL, t("common.error"), displayMessage);
-      onGenerationError?.(safeErrorMessage, errorInfo);
-      onBack?.();
-    },
-    [alert, t, onGenerationError, onBack],
-  );
-
-  const handleDismissGenerating = useCallback(() => {
-    alert.show(AlertType.INFO, AlertMode.TOAST, t("generator.backgroundTitle"), t("generator.backgroundMessage"));
-    onBack?.();
-  }, [alert, t, onBack]);
-
-  const handleBack = useCallback(() => {
-    if (currentStepIndex === 0) onBack?.();
-    else previousStep();
-  }, [currentStepIndex, previousStep, onBack]);
-
-  const handleNextStep = useCallback((additionalData?: Record<string, unknown>) => {
-    const nextStepDef = flowSteps[currentStepIndex + 1];
-    // Merge additionalData to avoid stale closure issue
-    // When called from handlePhotoContinue, customData in closure may not include the just-set value
-    // Guard: Only merge plain objects (ignore SyntheticEvents from onPress handlers)
-    const isPlainObject = additionalData && typeof additionalData === "object" && !("nativeEvent" in additionalData) && !Array.isArray(additionalData);
-    const mergedData = isPlainObject ? { ...customData, ...additionalData } : customData;
-    if (typeof __DEV__ !== "undefined" && __DEV__) {
-      console.log("[handleNextStep] Called", {
-        currentStepIndex,
-        nextStepType: nextStepDef?.type,
-        nextStepId: nextStepDef?.id,
-        totalSteps: flowSteps.length,
-        hasOnGenerationStart: !!onGenerationStart,
-        dataKeys: Object.keys(mergedData),
-      });
-    }
-    if (nextStepDef?.type === StepType.GENERATING && onGenerationStart) {
-      if (generationStartedRef.current) return;
-      generationStartedRef.current = true;
-      onGenerationStart(mergedData, nextStep, handleGenerationError);
-      return;
-    }
-    nextStep();
-  }, [currentStepIndex, flowSteps, customData, onGenerationStart, nextStep, handleGenerationError]);
-
-  const handlePhotoContinue = useCallback(
-    (stepId: string, image: UploadedImage) => {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[handlePhotoContinue] Called", { stepId, hasImage: !!image, currentStepIndex });
-      }
-      setCustomData(stepId, image);
-      // Pass the just-set data to avoid stale closure issue
-      handleNextStep({ [stepId]: image });
-    },
-    [setCustomData, handleNextStep, currentStepIndex],
-  );
+  });
 
   const handleSubmitRating = useCallback(
     async (rating: number, description: string) => {
       if (!currentCreation?.id || !userId) return;
+      if (typeof __DEV__ !== "undefined" && __DEV__) {
+        console.log("[handleSubmitRating] Called", { creationId: currentCreation.id, rating });
+      }
       const success = await repository.rate(userId, currentCreation.id, rating, description);
       if (success) {
-        setHasRated(true);
+        props.setHasRated(true);
         alert.show(AlertType.SUCCESS, AlertMode.TOAST, t("result.rateSuccessTitle"), t("result.rateSuccessMessage"));
       }
-      setShowRatingPicker(false);
+      props.setShowRatingPicker(false);
     },
-    [currentCreation, userId, repository, alert, t, setHasRated, setShowRatingPicker],
+    [currentCreation, userId, repository, alert, t, props.setHasRated, props.setShowRatingPicker],
   );
 
   return {
-    handleGenerationComplete,
-    handleGenerationError,
-    handleDismissGenerating,
-    handleBack,
-    handleNextStep,
-    handlePhotoContinue,
+    handleGenerationComplete: generation.handleGenerationComplete,
+    handleGenerationError: generation.handleGenerationError,
+    handleDismissGenerating: generation.handleDismissGenerating,
+    handleBack: navigation.handleBack,
+    handleNextStep: navigation.handleNextStep,
+    handlePhotoContinue: navigation.handlePhotoContinue,
     handleSubmitRating,
   };
 }

package/src/domains/generation/wizard/presentation/hooks/wizard-flow-handlers.types.ts

@@ -0,0 +1,29 @@
+/**
+ * Types for Wizard Flow Handlers
+ */
+
+import type { StepDefinition } from "../../../../../domain/entities/flow-config.types";
+import type { Creation } from "../../../../creations/domain/entities/Creation";
+import type { GenerationErrorInfo } from "../components/WizardFlow.types";
+
+export interface UseWizardFlowHandlersProps {
+  readonly currentStepIndex: number;
+  readonly flowSteps: StepDefinition[];
+  readonly customData: Record<string, unknown>;
+  readonly skipResultStep: boolean;
+  readonly userId?: string;
+  readonly currentCreation: Creation | null;
+  readonly repository: { rate: (uid: string, id: string, rating: number, desc: string) => Promise<boolean> };
+  readonly t: (key: string) => string;
+  readonly nextStep: () => void;
+  readonly previousStep: () => void;
+  readonly setResult: (result: unknown) => void;
+  readonly setCustomData: (stepId: string, data: unknown) => void;
+  readonly setCurrentCreation: (creation: Creation | null) => void;
+  readonly setHasRated: (hasRated: boolean) => void;
+  readonly setShowRatingPicker: (show: boolean) => void;
+  readonly onGenerationStart?: (data: Record<string, unknown>, proceed: () => void, onError?: (error: string) => void) => void;
+  readonly onGenerationComplete?: (result: unknown) => void;
+  readonly onGenerationError?: (error: string, errorInfo?: GenerationErrorInfo) => void;
+  readonly onBack?: () => void;
+}

package/src/presentation/components/buttons/GenerateButton.tsx

@@ -4,7 +4,7 @@
  * Props-driven for 100+ apps compatibility
  */
 
-import React, { useEffect } from "react";
+import React from "react";
 import { View, StyleSheet, TouchableOpacity, type ViewStyle } from "react-native";
 import {
   AtomicText,
@@ -41,25 +41,12 @@ export const GenerateButton: React.FC<GenerateButtonProps> = ({
   onAccessoryRightPress,
   style,
 }) => {
-  if (__DEV__) {
-    console.log("[GenerateButton] RENDERING NOW");
-  }
-
   const tokens = useAppDesignTokens();
   const disabled = isDisabled || isProcessing;
   const displayText = isProcessing && processingText ? processingText : text;
   const finalDisplayText = costLabel ? `${displayText} (${costLabel})` : displayText;
 
-  useEffect(() => {
-    if (__DEV__) {
-      console.log("[GenerateButton] MOUNTED/UPDATED - isDisabled:", isDisabled, "isProcessing:", isProcessing, "disabled:", disabled, "text:", text);
-    }
-  }, [isDisabled, isProcessing, disabled, text]);
-
   const handlePress = () => {
-    if (__DEV__) {
-      console.log("[GenerateButton] PRESSED - disabled:", disabled, "isDisabled:", isDisabled, "isProcessing:", isProcessing);
-    }
     if (!disabled) {
       onPress();
     }