@umituz/react-native-design-system 4.23.104 → 4.23.106

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-design-system",
-  "version": "4.23.104",
+  "version": "4.23.106",
   "description": "Universal design system for React Native apps - Consolidated package with atoms, molecules, organisms, theme, typography, responsive, safe area, exception, infinite scroll, UUID, image, timezone, offline, onboarding, and loading utilities",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/filesystem/infrastructure/services/download.service.ts

@@ -30,7 +30,12 @@ export async function downloadFile(url: string, dest?: string): Promise<FileOper
   } catch (e: unknown) { return { success: false, error: e instanceof Error ? e.message : String(e) }; }
 }
 
-export async function downloadFileWithProgress(url: string, cacheDir: string, onProgress?: DownloadProgressCallback): Promise<DownloadWithProgressResult> {
+export async function downloadFileWithProgress(
+  url: string,
+  cacheDir: string,
+  onProgress?: DownloadProgressCallback,
+  signal?: AbortSignal
+): Promise<DownloadWithProgressResult> {
   try {
     const dir = new Directory(cacheDir);
     if (!dir.exists) dir.create({ intermediates: true, idempotent: true });
@@ -38,9 +43,9 @@ export async function downloadFileWithProgress(url: string, cacheDir: string, on
     const destUri = getCacheUri(url, cacheDir);
     if (new File(destUri).exists) return { success: true, uri: destUri, fromCache: true };
 
-    const response = await fetch(url);
+    const response = await fetch(url, { signal });
     if (!response.ok) throw new Error(`HTTP ${response.status}`);
-    
+
     const totalBytes = parseInt(response.headers.get("content-length") || "0", 10);
     if (!response.body) return { ...(await downloadFile(url, destUri)), fromCache: false };
 
@@ -48,20 +53,29 @@ export async function downloadFileWithProgress(url: string, cacheDir: string, on
     const chunks: Uint8Array[] = [];
     let received = 0;
 
-    while (true) {
-      const { done, value } = await reader.read();
-      if (done) break;
-      chunks.push(value);
-      received += value.length;
-      onProgress?.({ totalBytesWritten: received, totalBytesExpectedToWrite: totalBytes || received });
-    }
+    try {
+      while (true) {
+        if (signal?.aborted) {
+          await reader.cancel();
+          throw new Error("Download aborted");
+        }
 
-    const all = new Uint8Array(received);
-    let pos = 0;
-    for (const c of chunks) { all.set(c, pos); pos += c.length; }
-    new File(destUri).write(all);
+        const { done, value } = await reader.read();
+        if (done) break;
+        chunks.push(value);
+        received += value.length;
+        onProgress?.({ totalBytesWritten: received, totalBytesExpectedToWrite: totalBytes || received });
+      }
 
-    return { success: true, uri: destUri, fromCache: false };
+      const all = new Uint8Array(received);
+      let pos = 0;
+      for (const c of chunks) { all.set(c, pos); pos += c.length; }
+      new File(destUri).write(all);
+
+      return { success: true, uri: destUri, fromCache: false };
+    } finally {
+      reader.releaseLock();
+    }
   } catch (e: unknown) { return { success: false, error: e instanceof Error ? e.message : String(e) }; }
 }
 

package/src/image/presentation/hooks/useImageGallery.ts

@@ -2,7 +2,7 @@
  * Presentation - Image Gallery Hook
  */
 
-import { useState, useCallback, useMemo } from 'react';
+import { useState, useCallback, useMemo, useRef, useEffect } from 'react';
 import { ImageViewerService } from '../../infrastructure/services/ImageViewerService';
 import type {
   ImageViewerItem,
@@ -29,6 +29,13 @@ export const useImageGallery = (
     defaultOptions || ImageViewerService.getDefaultOptions()
   );
 
+  // Use ref to track latest options and avoid stale closures
+  const optionsRef = useRef(galleryOptions);
+
+  useEffect(() => {
+    optionsRef.current = galleryOptions;
+  }, [galleryOptions]);
+
   const open = useCallback(
     (
       imageData: ImageViewerItem[] | string[],
@@ -44,32 +51,32 @@ export const useImageGallery = (
       setCurrentIndex(options?.index ?? startIndex);
 
       if (options) {
-        setGalleryOptions({
-          ...galleryOptions,
+        setGalleryOptions(prev => ({
+          ...prev,
           ...options,
-        });
+        }));
       }
 
       setVisible(true);
     },
-    [galleryOptions]
+    []
   );
 
   const close = useCallback(() => {
     setVisible(false);
 
-    if (galleryOptions.onDismiss) {
-      galleryOptions.onDismiss();
+    if (optionsRef.current.onDismiss) {
+      optionsRef.current.onDismiss();
     }
-  }, [galleryOptions]);
+  }, []);
 
   const setIndex = useCallback((index: number) => {
     setCurrentIndex(index);
 
-    if (galleryOptions.onIndexChange) {
-      galleryOptions.onIndexChange(index);
+    if (optionsRef.current.onIndexChange) {
+      optionsRef.current.onIndexChange(index);
     }
-  }, [galleryOptions]);
+  }, []);
 
   const options = useMemo(() => ({
     backgroundColor: galleryOptions.backgroundColor || '#000000',

package/src/init/useAppInitialization.ts

@@ -40,7 +40,7 @@ export function useAppInitialization(
   useEffect(() => {
     onReadyRef.current = onReady;
     onErrorRef.current = onError;
-  });
+  }, [onReady, onError]);
 
   useEffect(() => {
     if (skip) {

package/src/molecules/calendar/presentation/hooks/useCalendar.ts

@@ -88,18 +88,24 @@ export const useCalendarPresentation = (): UseCalendarReturn => {
   // Load events on mount
   useEffect(() => {
     actions.loadEvents();
-  }, []);
+  }, [actions.loadEvents]);
 
   // Get events for selected date
   const selectedDateEvents = useMemo(() => {
-    return actions.getEventsForDate(selectedDate);
+    return events.filter(event => {
+      const eventDate = new Date(event.date);
+      return eventDate.toDateString() === selectedDate.toDateString();
+    });
   }, [selectedDate, events]);
 
   // Get events for current month
   const currentMonthEvents = useMemo(() => {
     const year = currentMonth.getFullYear();
     const month = currentMonth.getMonth();
-    return actions.getEventsForMonth(year, month);
+    return events.filter(event => {
+      const eventDate = new Date(event.date);
+      return eventDate.getFullYear() === year && eventDate.getMonth() === month;
+    });
   }, [currentMonth, events]);
 
   return {

package/src/onboarding/infrastructure/hooks/useOnboardingNavigation.ts

@@ -33,16 +33,22 @@ export const useOnboardingNavigation = (
   const [currentIndex, setCurrentIndex] = useState(0);
 
   const goToNext = useCallback(() => {
-    if (currentIndex < totalSlides - 1) {
-      setCurrentIndex(currentIndex + 1);
-    }
-  }, [currentIndex, totalSlides]);
+    setCurrentIndex(prev => {
+      if (prev < totalSlides - 1) {
+        return prev + 1;
+      }
+      return prev;
+    });
+  }, [totalSlides]);
 
   const goToPrevious = useCallback(() => {
-    if (currentIndex > 0) {
-      setCurrentIndex(currentIndex - 1);
-    }
-  }, [currentIndex]);
+    setCurrentIndex(prev => {
+      if (prev > 0) {
+        return prev - 1;
+      }
+      return prev;
+    });
+  }, []);
 
   const complete = useCallback(async () => {
     if (onComplete) {

package/src/onboarding/presentation/hooks/useOnboardingGestures.ts

@@ -3,7 +3,7 @@
  * Handles swipe gestures for onboarding navigation
  */
 
-import { useRef } from "react";
+import { useRef, useEffect } from "react";
 import { PanResponder } from "react-native";
 
 interface UseOnboardingGesturesProps {
@@ -19,6 +19,24 @@ export const useOnboardingGestures = ({
   onNext,
   onBack,
 }: UseOnboardingGesturesProps) => {
+  // Use refs to track latest values and avoid stale closures
+  const latestPropsRef = useRef({
+    isFirstSlide,
+    isAnswerValid,
+    onNext,
+    onBack,
+  });
+
+  // Update refs on every render to ensure PanResponder has fresh values
+  useEffect(() => {
+    latestPropsRef.current = {
+      isFirstSlide,
+      isAnswerValid,
+      onNext,
+      onBack,
+    };
+  });
+
   const panResponder = useRef(
     PanResponder.create({
       onMoveShouldSetPanResponder: (_, gestureState) => {
@@ -26,6 +44,9 @@ export const useOnboardingGestures = ({
         return Math.abs(gestureState.dx) > 20 && Math.abs(gestureState.dy) < 40;
       },
       onPanResponderRelease: (_, gestureState) => {
+        // Read from ref to get latest values
+        const { isFirstSlide, isAnswerValid, onNext, onBack } = latestPropsRef.current;
+
         if (gestureState.dx > 50) {
           // Swipe Right -> Previous
           if (!isFirstSlide) {

package/src/tanstack/presentation/hooks/usePrefetch.ts

@@ -86,8 +86,12 @@ export function usePrefetchOnMount<TData = unknown>(
   options: PrefetchOptions = {},
 ) {
   const queryClient = useQueryClient();
+  const hasPrefetchedRef = useRef(false);
 
   useEffect(() => {
+    if (hasPrefetchedRef.current) return;
+
+    hasPrefetchedRef.current = true;
     queryClient.prefetchQuery({
       queryKey,
       queryFn,