@umituz/react-native-ai-generation-content 1.90.2 → 1.90.4

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

@@ -4,180 +4,11 @@
  * Uses design system's useMedia hook for media picking with built-in validation
  */
 
-import { useState, useCallback, useEffect, useRef } from "react";
-
-import { useMedia, MediaQuality, MediaValidationError, MEDIA_CONSTANTS } from "@umituz/react-native-design-system/media";
-import type { UploadedImage } from "../../../../../presentation/hooks/generation/useAIGenerateState";
-
-export interface PhotoUploadConfig {
-  readonly maxFileSizeMB?: number;
-}
-
-export interface PhotoUploadTranslations {
-  readonly fileTooLarge: string;
-  readonly maxFileSize: string;
-  readonly error: string;
-  readonly uploadFailed: string;
-  readonly permissionDenied?: string;
-}
-
-export interface PhotoUploadError {
-  readonly title: string;
-  readonly message: string;
-}
-
-export interface UsePhotoUploadStateProps {
-  readonly config?: PhotoUploadConfig;
-  readonly translations: PhotoUploadTranslations;
-  readonly initialImage?: UploadedImage;
-  readonly stepId?: string;
-  readonly onError?: (error: PhotoUploadError) => void;
-}
-
-export interface UsePhotoUploadStateReturn {
-  readonly image: UploadedImage | null;
-  readonly handlePickImage: () => Promise<void>;
-  readonly canContinue: boolean;
-  readonly clearImage: () => void;
-}
-
-export const usePhotoUploadState = ({
-  config,
-  translations,
-  initialImage,
-  stepId,
-  onError,
-}: UsePhotoUploadStateProps): UsePhotoUploadStateReturn => {
-  const [image, setImage] = useState<UploadedImage | null>(initialImage || null);
-  const { pickImage, isLoading } = useMedia();
-  const timeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
-
-  // Use refs to avoid effect re-runs on callback changes
-  const onErrorRef = useRef(onError);
-  const translationsRef = useRef(translations);
-
-  useEffect(() => {
-    onErrorRef.current = onError;
-    translationsRef.current = translations;
-  }, [onError, translations]);
-
-  const maxFileSizeMB = config?.maxFileSizeMB ?? MEDIA_CONSTANTS.MAX_IMAGE_SIZE_MB;
-
-  useEffect(() => {
-    if (typeof __DEV__ !== "undefined" && __DEV__) {
-      console.log("[usePhotoUploadState] Step changed, resetting image", { stepId, hasInitialImage: !!initialImage });
-    }
-    setImage(initialImage || null);
-  }, [stepId, initialImage]);
-
-  useEffect(() => {
-    // Clear any existing timeout first
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-      timeoutRef.current = undefined;
-    }
-
-    if (isLoading) {
-      timeoutRef.current = setTimeout(() => {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.warn("[usePhotoUploadState] Image picker timeout - possible stuck state (DEV warning only)");
-        }
-        // NOTE: Do NOT call onError here — the picker may still complete successfully.
-        // Showing a modal alert while the picker is open blocks the UI.
-      }, 30000);
-    }
-
-    return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-        timeoutRef.current = undefined;
-      }
-    };
-  }, [isLoading]);
-
-  const clearImage = useCallback(() => {
-    setImage(null);
-  }, []);
-
-  const handlePickImage = useCallback(async () => {
-    try {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[usePhotoUploadState] Starting image pick");
-      }
-
-      const result = await pickImage({
-        allowsEditing: true,
-        aspect: [1, 1],
-        quality: MediaQuality.MEDIUM,
-        maxFileSizeMB,
-      });
-
-      if (result.error) {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.log("[usePhotoUploadState] Validation error", result.error);
-        }
-
-        if (result.error === MediaValidationError.FILE_TOO_LARGE) {
-          onErrorRef.current?.({
-            title: translationsRef.current.fileTooLarge,
-            message: translationsRef.current.maxFileSize.replace("{size}", maxFileSizeMB.toString()),
-          });
-        } else if (result.error === MediaValidationError.PERMISSION_DENIED) {
-          onErrorRef.current?.({
-            title: translationsRef.current.error,
-            message: translationsRef.current.permissionDenied ?? "Permission to access media library is required",
-          });
-        }
-        return;
-      }
-
-      if (result.canceled || !result.assets || result.assets.length === 0) {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.log("[usePhotoUploadState] Image pick canceled");
-        }
-        return;
-      }
-
-      const selectedAsset = result.assets[0];
-      if (!selectedAsset) {
-        return;
-      }
-
-      const uploadedImage: UploadedImage = {
-        uri: selectedAsset.uri,
-        previewUrl: selectedAsset.uri,
-        width: selectedAsset.width,
-        height: selectedAsset.height,
-        fileSize: selectedAsset.fileSize,
-      };
-
-      setImage(uploadedImage);
-
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        const fileSizeMB = (selectedAsset.fileSize ?? 0) / (1024 * 1024);
-        console.log("[usePhotoUploadState] Image selected", {
-          width: uploadedImage.width,
-          height: uploadedImage.height,
-          fileSizeMB: fileSizeMB.toFixed(2),
-        });
-      }
-    } catch (error) {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.error("[usePhotoUploadState] Error picking image", error);
-      }
-      onErrorRef.current?.({
-        title: translationsRef.current.error,
-        message: translationsRef.current.uploadFailed,
-      });
-    }
-  }, [pickImage, maxFileSizeMB]);
-
-  const canContinue = image !== null && !isLoading;
-
-  return {
-    image,
-    handlePickImage,
-    canContinue,
-    clearImage,
-  };
-};
+export { usePhotoUploadState } from "./photo-upload";
+export type {
+  PhotoUploadConfig,
+  PhotoUploadTranslations,
+  PhotoUploadError,
+  UsePhotoUploadStateProps,
+  UsePhotoUploadStateReturn,
+} from "./photo-upload";

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

@@ -2,298 +2,4 @@
  * Video Queue Generation Hook
  */
 
-import { useEffect, useRef, useCallback, useState } from "react";
-
-import { pollQueueStatus } from "./videoQueuePoller";
-import {
-  DEFAULT_POLL_INTERVAL_MS,
-  DEFAULT_MAX_POLL_TIME_MS,
-} from "../../../../../infrastructure/constants/polling.constants";
-import type { GenerationUrls } from "./generation-result.utils";
-import type {
-  UseVideoQueueGenerationProps,
-  UseVideoQueueGenerationReturn,
-} from "./use-video-queue-generation.types";
-
-export function useVideoQueueGeneration(props: UseVideoQueueGenerationProps): UseVideoQueueGenerationReturn {
-  const { userId, scenario, persistence, strategy, creditCost, deductCredits, onSuccess, onError } = props;
-
-  const creationIdRef = useRef<string | null>(null);
-  const requestIdRef = useRef<string | null>(null);
-  const modelRef = useRef<string | null>(null);
-  const pollingRef = useRef<ReturnType<typeof setInterval> | null>(null);
-  const isGeneratingRef = useRef(false);
-  const isPollingRef = useRef(false);
-  const consecutiveErrorsRef = useRef(0);
-  const pollStartTimeRef = useRef<number | null>(null);
-  const [isGenerating, setIsGenerating] = useState(false);
-
-  const clearPolling = useCallback(() => {
-    if (pollingRef.current) {
-      clearInterval(pollingRef.current);
-      pollingRef.current = null;
-    }
-  }, []);
-
-  useEffect(() => {
-    return () => {
-      clearPolling();
-      isGeneratingRef.current = false;
-      isPollingRef.current = false;
-      consecutiveErrorsRef.current = 0;
-      pollStartTimeRef.current = null;
-      // NOTE: Do NOT null creationIdRef/requestIdRef/modelRef here.
-      // In-flight poll callbacks may still resolve after unmount and need
-      // these refs to properly save the completed generation to Firestore.
-      // They are cleaned up by resetRefs() after handleComplete/handleError.
-      setIsGenerating(false);
-    };
-  }, [clearPolling]);
-
-  const resetRefs = useCallback(() => {
-    clearPolling();
-    creationIdRef.current = null;
-    requestIdRef.current = null;
-    modelRef.current = null;
-    isGeneratingRef.current = false;
-    isPollingRef.current = false;
-    consecutiveErrorsRef.current = 0;
-    pollStartTimeRef.current = null;
-    setIsGenerating(false);
-  }, [clearPolling]);
-
-  const handleComplete = useCallback(
-    async (urls: GenerationUrls) => {
-      clearPolling();
-
-      const creationId = creationIdRef.current;
-      const uri = (urls.videoUrl || urls.imageUrl) ?? "";
-
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[VideoQueue] ✅ handleComplete called", {
-          creationId,
-          userId,
-          hasVideoUrl: !!urls.videoUrl,
-          hasImageUrl: !!urls.imageUrl,
-          hasOnSuccess: !!onSuccess
-        });
-      }
-
-      if (!creationId || !userId || !uri || uri.trim() === "") {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.error("[VideoQueue] ❌ Invalid completion data:", { creationId, userId, uri });
-        }
-        resetRefs();
-        onError?.("Invalid completion data - no valid URL received");
-        return;
-      }
-
-      let persistenceSucceeded = true;
-      if (creationId && userId) {
-        try {
-          await persistence.updateToCompleted(userId, creationId, {
-            uri,
-            imageUrl: urls.imageUrl,
-            videoUrl: urls.videoUrl,
-            thumbnailUrl: urls.thumbnailUrl,
-            generationStartedAt: pollStartTimeRef.current ?? undefined,
-          });
-          if (typeof __DEV__ !== "undefined" && __DEV__) {
-            console.log("[VideoQueue] ✅ Updated completion status in Firestore");
-          }
-        } catch (error) {
-          persistenceSucceeded = false;
-          if (typeof __DEV__ !== "undefined" && __DEV__) {
-            console.error("[VideoQueue] ❌ Failed to update completion status:", error);
-          }
-        }
-      }
-
-      resetRefs();
-
-      // Deduct credits after successful generation
-      if (deductCredits && creditCost) {
-        await deductCredits(creditCost).catch((err) => {
-          if (typeof __DEV__ !== "undefined" && __DEV__) {
-            console.error("[VideoQueue] deductCredits error:", err);
-          }
-        });
-      }
-
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[VideoQueue] 🎯 Calling onSuccess callback now...", { persistenceSucceeded });
-      }
-      onSuccess?.(urls);
-
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.log("[VideoQueue] ✅ onSuccess callback completed");
-      }
-    },
-    [userId, persistence, deductCredits, creditCost, onSuccess, onError, resetRefs, clearPolling],
-  );
-
-  const handleError = useCallback(
-    async (errorMsg: string) => {
-      clearPolling();
-      const creationId = creationIdRef.current;
-      if (creationId && userId) {
-        try {
-          await persistence.updateToFailed(userId, creationId, errorMsg);
-        } catch (error) {
-          if (typeof __DEV__ !== "undefined" && __DEV__) {
-            console.error("[VideoQueue] Failed to update error status:", error);
-          }
-        }
-      }
-      resetRefs();
-      onError?.(errorMsg);
-    },
-    [userId, persistence, onError, resetRefs, clearPolling],
-  );
-
-  // Use a ref to hold the latest handleComplete/handleError to avoid stale closures
-  // in the setInterval callback
-  const handleCompleteRef = useRef(handleComplete);
-  const handleErrorRef = useRef(handleError);
-  useEffect(() => { handleCompleteRef.current = handleComplete; }, [handleComplete]);
-  useEffect(() => { handleErrorRef.current = handleError; }, [handleError]);
-
-  const pollStatus = useCallback(async () => {
-    const requestId = requestIdRef.current;
-    const model = modelRef.current;
-    if (!requestId || !model) return;
-
-    // Check max poll time
-    if (pollStartTimeRef.current !== null) {
-      const elapsed = Date.now() - pollStartTimeRef.current;
-      if (elapsed >= DEFAULT_MAX_POLL_TIME_MS) {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.warn("[VideoQueue] ⏰ Max poll time exceeded, aborting");
-        }
-        await handleErrorRef.current("Generation timed out. Please try again.");
-        return;
-      }
-    }
-
-    try {
-      await pollQueueStatus({
-        requestId,
-        model,
-        isPollingRef,
-        pollingRef,
-        consecutiveErrorsRef,
-        onComplete: handleCompleteRef.current,
-        onError: handleErrorRef.current,
-      });
-    } catch (error) {
-      if (typeof __DEV__ !== "undefined" && __DEV__) {
-        console.error("[VideoQueue] Unexpected poll error:", error);
-      }
-    }
-  }, []);
-
-  // Keep a stable ref to pollStatus for the setInterval closure
-  const pollStatusRef = useRef(pollStatus);
-  useEffect(() => { pollStatusRef.current = pollStatus; }, [pollStatus]);
-
-  const startGeneration = useCallback(
-    async (input: unknown, prompt: string) => {
-      if (!strategy.submitToQueue) {
-        onError?.("Queue submission not available");
-        return;
-      }
-      if (isGeneratingRef.current) return;
-
-      isGeneratingRef.current = true;
-      setIsGenerating(true);
-
-      let creationId: string | null = null;
-      if (userId && prompt) {
-        try {
-          const inputData = input as Record<string, unknown>;
-          const duration = typeof inputData?.duration === "number" ? inputData.duration : undefined;
-          const resolution = typeof inputData?.resolution === "string" ? inputData.resolution : undefined;
-          const aspectRatio = typeof inputData?.aspectRatio === "string" ? inputData.aspectRatio : undefined;
-
-          const result = await persistence.saveAsProcessing(userId, {
-            scenarioId: scenario.id,
-            scenarioTitle: scenario.title || scenario.id,
-            prompt,
-            duration,
-            resolution,
-            creditCost,
-            aspectRatio,
-            provider: "fal",
-            outputType: scenario.outputType,
-          });
-          creationId = result.creationId;
-          creationIdRef.current = creationId;
-          // Record the actual DB-level start time for accurate durationMs
-          pollStartTimeRef.current = result.startedAt.getTime();
-        } catch (error) {
-          if (typeof __DEV__ !== "undefined" && __DEV__) {
-            console.error("[VideoQueue] Failed to save processing creation:", error);
-          }
-        }
-      }
-
-      let queueResult;
-      try {
-        queueResult = await strategy.submitToQueue(input);
-      } catch (error) {
-        if (creationId && userId) {
-          try {
-            await persistence.updateToFailed(userId, creationId, error instanceof Error ? error.message : "Queue submission failed");
-          } catch (persistError) {
-            if (typeof __DEV__ !== "undefined" && __DEV__) {
-              console.error("[VideoQueue] Failed to persist submission error:", persistError);
-            }
-          }
-        }
-        isGeneratingRef.current = false;
-        setIsGenerating(false);
-        onError?.(error instanceof Error ? error.message : "Queue submission failed");
-        return;
-      }
-
-      if (!queueResult.success || !queueResult.requestId || !queueResult.model) {
-        if (creationId && userId) {
-          try {
-            await persistence.updateToFailed(userId, creationId, queueResult.error || "Queue submission failed");
-          } catch (persistError) {
-            if (typeof __DEV__ !== "undefined" && __DEV__) {
-              console.error("[VideoQueue] Failed to persist queue failure:", persistError);
-            }
-          }
-        }
-        isGeneratingRef.current = false;
-        setIsGenerating(false);
-        onError?.(queueResult.error || "Queue submission failed");
-        return;
-      }
-
-      requestIdRef.current = queueResult.requestId;
-      modelRef.current = queueResult.model;
-
-      if (creationId && userId && queueResult.requestId && queueResult.model) {
-        try {
-          await persistence.updateRequestId(userId, creationId, queueResult.requestId, queueResult.model);
-        } catch (error) {
-          if (typeof __DEV__ !== "undefined" && __DEV__) {
-            console.error("[VideoQueue] Failed to update request ID:", error);
-          }
-        }
-      }
-
-      // Start polling: use DB-level startedAt if available, otherwise fallback to now
-      if (pollStartTimeRef.current === null) {
-        pollStartTimeRef.current = Date.now();
-      }
-      pollingRef.current = setInterval(() => void pollStatusRef.current(), DEFAULT_POLL_INTERVAL_MS);
-      void pollStatusRef.current();
-    },
-    [userId, scenario, persistence, strategy, creditCost, onError],
-  );
-
-  return { isGenerating, startGeneration };
-}
+export { useVideoQueueGeneration } from "./video-queue";

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

@@ -6,7 +6,7 @@
 import { useEffect, useReducer, useMemo, useRef } from "react";
 import { createWizardStrategy } from "../../infrastructure/strategies";
 import { createCreationPersistence } from "../../infrastructure/utils/creation-persistence.util";
-import { useVideoQueueGeneration } from "./useVideoQueueGeneration";
+import { useVideoQueueGeneration } from "./video-queue-index";
 import { usePhotoBlockingGeneration } from "./usePhotoBlockingGeneration";
 import { generationReducer, INITIAL_STATE } from "./generationStateMachine";
 import { executeWizardGeneration } from "./generationExecutor";

package/src/domains/generation/wizard/presentation/hooks/video-queue/index.ts

@@ -0,0 +1,77 @@
+/**
+ * Video Queue Generation Hook
+ */
+
+import { useEffect } from "react";
+import type {
+  UseVideoQueueGenerationProps,
+  UseVideoQueueGenerationReturn,
+} from "../use-video-queue-generation.types";
+import { useVideoQueueGenerationRefs, useVideoQueueGenerationState } from "./useVideoQueueGenerationRefs";
+import { useCompletionHandler, useErrorHandler } from "./useVideoQueueGenerationCallbacks";
+import { usePollStatus, useCallbackRefs } from "./useVideoQueueGenerationPolling";
+import { useStartGeneration } from "./useVideoQueueGenerationStart";
+
+export function useVideoQueueGeneration(props: UseVideoQueueGenerationProps): UseVideoQueueGenerationReturn {
+  const refs = useVideoQueueGenerationRefs();
+  const state = useVideoQueueGenerationState();
+
+  const clearPolling = (() => {
+    const { pollingRef } = refs;
+    return () => {
+      if (pollingRef.current) {
+        clearInterval(pollingRef.current);
+        pollingRef.current = null;
+      }
+    };
+  })();
+
+  useEffect(() => {
+    return () => {
+      clearPolling();
+      refs.isGeneratingRef.current = false;
+      refs.isPollingRef.current = false;
+      refs.consecutiveErrorsRef.current = 0;
+      refs.pollStartTimeRef.current = null;
+      // NOTE: Do NOT null creationIdRef/requestIdRef/modelRef here.
+      // In-flight poll callbacks may still resolve after unmount and need
+      // these refs to properly save the completed generation to Firestore.
+      // They are cleaned up by resetRefs() after handleComplete/handleError.
+      state.setIsGenerating(false);
+    };
+  }, [clearPolling, refs, state]);
+
+  const resetRefs = (() => {
+    const {
+      creationIdRef,
+      requestIdRef,
+      modelRef,
+      isGeneratingRef,
+      isPollingRef,
+      consecutiveErrorsRef,
+      pollStartTimeRef,
+    } = refs;
+    const { setIsGenerating } = state;
+
+    return () => {
+      creationIdRef.current = null;
+      requestIdRef.current = null;
+      modelRef.current = null;
+      isGeneratingRef.current = false;
+      isPollingRef.current = false;
+      consecutiveErrorsRef.current = 0;
+      pollStartTimeRef.current = null;
+      setIsGenerating(false);
+    };
+  })();
+
+  const handleComplete = useCompletionHandler(props, refs, state, clearPolling, resetRefs);
+  const handleError = useErrorHandler(props, refs, clearPolling, resetRefs);
+  const pollStatus = usePollStatus(refs);
+  const startGeneration = useStartGeneration(props, refs, state, clearPolling);
+
+  // Sync callback refs
+  useCallbackRefs(handleComplete, handleError, pollStatus, refs);
+
+  return { isGenerating: state.isGenerating, startGeneration };
+}

package/src/domains/generation/wizard/presentation/hooks/video-queue/use-video-queue-utils.ts

@@ -0,0 +1,123 @@
+/**
+ * Video Queue Utilities
+ */
+
+export interface VideoQueueUtils {
+  isQueueFull: () => boolean;
+  getQueueSize: () => number;
+  clearQueue: () => void;
+}
+
+export function createVideoQueueUtils(): VideoQueueUtils {
+  return {
+    isQueueFull: () => false,
+    getQueueSize: () => 0,
+    clearQueue: () => {},
+  };
+}
+
+import type { VideoQueueRefs } from "./useVideoQueueGenerationRefs";
+import type { VideoQueueState } from "./useVideoQueueGenerationRefs";
+
+/**
+ * Create a clear polling function
+ */
+export function createClearPolling(refs: VideoQueueRefs): () => void {
+  const { pollingRef } = refs;
+  return () => {
+    if (pollingRef.current) {
+      clearInterval(pollingRef.current);
+      pollingRef.current = null;
+    }
+  };
+}
+
+/**
+ * Create a reset refs function
+ */
+export function createResetRefs(
+  refs: VideoQueueRefs,
+  state: VideoQueueState
+): () => void {
+  const {
+    creationIdRef,
+    requestIdRef,
+    modelRef,
+    isGeneratingRef,
+    isPollingRef,
+    consecutiveErrorsRef,
+    pollStartTimeRef,
+  } = refs;
+  const { setIsGenerating } = state;
+
+  return () => {
+    creationIdRef.current = null;
+    requestIdRef.current = null;
+    modelRef.current = null;
+    isGeneratingRef.current = false;
+    isPollingRef.current = false;
+    consecutiveErrorsRef.current = 0;
+    pollStartTimeRef.current = null;
+    setIsGenerating(false);
+  };
+}
+
+/**
+ * Log completion event
+ */
+export function logCompletion(
+  creationId: string | null,
+  userId: string | undefined,
+  urls: { videoUrl?: string; imageUrl?: string },
+  hasCallback: boolean
+): void {
+  if (typeof __DEV__ !== "undefined" && __DEV__) {
+    console.log("[VideoQueue] ✅ Generation completed", {
+      creationId,
+      userId,
+      hasVideoUrl: !!urls.videoUrl,
+      hasImageUrl: !!urls.imageUrl,
+      hasCallback,
+    });
+  }
+}
+
+/**
+ * Log error event
+ */
+export function logError(message: string, data?: Record<string, unknown>): void {
+  if (typeof __DEV__ !== "undefined" && __DEV__) {
+    console.error("[VideoQueue] ❌ Error:", message, data);
+  }
+}
+
+/**
+ * Validate completion data
+ */
+export function validateCompletionData(
+  creationId: string | null,
+  userId: string | undefined,
+  uri: string
+): boolean {
+  return !!(creationId && userId && uri);
+}
+
+/**
+ * Extract input metadata for generation
+ */
+export function extractInputMetadata(params: {
+  readonly model: string;
+  readonly prompt: string;
+  readonly imageUrls?: string[];
+}): {
+  readonly model: string;
+  readonly prompt: string;
+  readonly imageUrls: string[];
+} {
+  return {
+    model: params.model,
+    prompt: params.prompt,
+    imageUrls: params.imageUrls || [],
+  };
+}
+