@umituz/react-native-design-system 4.23.116 → 4.23.118

package/src/storage/cache/presentation/useCachedValue.ts

@@ -2,9 +2,10 @@
  * useCachedValue Hook
  */
 
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useRef, useMemo } from 'react';
 import { cacheManager } from '../domain/CacheManager';
 import type { CacheConfig } from '../domain/types/Cache';
+import { useAsyncOperation } from '../../../utils/hooks';
 
 export function useCachedValue<T>(
   cacheName: string,
@@ -12,95 +13,53 @@ export function useCachedValue<T>(
   fetcher: () => Promise<T>,
   config?: CacheConfig & { ttl?: number }
 ) {
-  const [value, setValue] = useState<T | undefined>(undefined);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<Error | null>(null);
-
   const fetcherRef = useRef(fetcher);
   const configRef = useRef(config);
 
-  const loadValue = useCallback(async () => {
-    const cache = cacheManager.getCache<T>(cacheName, configRef.current);
-    const cached = cache.get(key);
-
-    if (cached !== undefined) {
-      setValue(cached);
-      return;
-    }
-
-    setIsLoading(true);
-    setError(null);
-
-    try {
-      const data = await fetcherRef.current!();
-      cache.set(key, data, configRef.current?.ttl);
-      setValue(data);
-    } catch (err) {
-      setError(err as Error);
-    } finally {
-      setIsLoading(false);
-    }
-  }, [cacheName, key]);
-
-  useEffect(() => {
-    let isMounted = true;
-
-    const doLoad = async () => {
+  const { data: value, isLoading, error, execute, setData } = useAsyncOperation<T | undefined, Error>(
+    async () => {
       const cache = cacheManager.getCache<T>(cacheName, configRef.current);
       const cached = cache.get(key);
 
       if (cached !== undefined) {
-        if (isMounted) setValue(cached);
-        return;
-      }
-
-      if (isMounted) {
-        setIsLoading(true);
-        setError(null);
-      }
-
-      try {
-        const data = await fetcherRef.current!();
-        cache.set(key, data, configRef.current?.ttl);
-        if (isMounted) setValue(data);
-      } catch (err) {
-        if (isMounted) setError(err as Error);
-      } finally {
-        if (isMounted) setIsLoading(false);
+        return cached;
       }
-    };
 
-    doLoad();
-
-    return () => {
-      isMounted = false;
-    };
-  }, [cacheName, key]);
+      const data = await fetcherRef.current!();
+      cache.set(key, data, configRef.current?.ttl);
+      return data;
+    },
+    {
+      immediate: true,
+      initialData: undefined,
+      errorHandler: (err) => err as Error,
+    }
+  );
 
   const invalidate = useCallback(() => {
     const cache = cacheManager.getCache<T>(cacheName);
     cache.delete(key);
-    setValue(undefined);
-  }, [cacheName, key]);
+    setData(undefined);
+  }, [cacheName, key, setData]);
 
   const invalidatePattern = useCallback((pattern: string): number => {
     const cache = cacheManager.getCache<T>(cacheName);
     const count = cache.invalidatePattern(pattern);
-    setValue(undefined);
+    setData(undefined);
     return count;
-  }, [cacheName]);
+  }, [cacheName, setData]);
 
   const refetch = useCallback(() => {
-    setValue(undefined);
-    loadValue();
-  }, [loadValue]);
+    setData(undefined);
+    execute();
+  }, [execute, setData]);
 
-  return {
+  return useMemo(() => ({
     value,
     isLoading,
     error,
     invalidate,
     invalidatePattern,
     refetch,
-  };
+  }), [value, isLoading, error, invalidate, invalidatePattern, refetch]);
 }

package/src/storage/presentation/hooks/useStorageState.ts

@@ -5,10 +5,11 @@
  * Combines React state with automatic storage persistence
  */
 
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useCallback, useEffect } from 'react';
 import { storageRepository } from '../../infrastructure/repositories/AsyncStorageRepository';
 import { unwrap } from '../../domain/entities/StorageResult';
 import type { StorageKey } from '../../domain/value-objects/StorageKey';
+import { useAsyncOperation } from '../../../utils/hooks';
 
 /**
  * Storage State Hook
@@ -26,37 +27,27 @@ export const useStorageState = <T>(
 ): [T, (value: T) => Promise<void>, boolean] => {
   const keyString = typeof key === 'string' ? key : String(key);
   const [state, setState] = useState<T>(defaultValue);
-  const [isLoading, setIsLoading] = useState(true);
 
   // Load initial value from storage
-  useEffect(() => {
-    let isMounted = true;
-    
-    const loadFromStorage = async () => {
-      try {
-        const result = await storageRepository.getItem(keyString, defaultValue);
-        const value = unwrap(result, defaultValue);
-        
-        // Memory leak önlemek için component mount kontrolü
-        if (isMounted) {
-          setState(value);
-          setIsLoading(false);
-        }
-      } catch {
-        // Hata durumunda bile cleanup yap
-        if (isMounted) {
-          setIsLoading(false);
-        }
-      }
-    };
-
-    loadFromStorage();
+  const { data, isLoading } = useAsyncOperation<T, Error>(
+    async () => {
+      const result = await storageRepository.getItem(keyString, defaultValue);
+      return unwrap(result, defaultValue);
+    },
+    {
+      immediate: true,
+      initialData: defaultValue,
+      errorHandler: (err) => err as Error,
+      onSuccess: (value) => setState(value),
+    }
+  );
 
-    // Cleanup function
-    return () => {
-      isMounted = false;
-    };
-  }, [keyString]); // defaultValue'ı dependency array'den çıkar
+  // Sync state with loaded data
+  useEffect(() => {
+    if (data !== undefined && data !== null) {
+      setState(data);
+    }
+  }, [data]);
 
   // Update state and persist to storage
   const updateState = useCallback(

package/src/utilities/sharing/presentation/hooks/useSharing.ts

@@ -8,174 +8,109 @@
  * @layer presentation/hooks
  */
 
-import { useState, useCallback, useEffect, useMemo, useRef } from 'react';
+import { useCallback, useMemo } from 'react';
 import { SharingService } from '../../infrastructure/services/SharingService';
 import type { ShareOptions } from '../../domain/entities/Share';
+import { useAsyncOperation } from '../../../../utils/hooks';
 
 /**
  * useSharing hook for sharing files via system share sheet
- *
- * USAGE:
- * ```typescript
- * const { share, shareWithAutoType, isAvailable, isSharing } = useSharing();
- *
- * // Check availability
- * if (!isAvailable) {
- *   return <Text>Sharing not available</Text>;
- * }
- *
- * // Basic share
- * const handleShare = async () => {
- *   await share('file:///path/to/file.jpg', {
- *     dialogTitle: 'Share Photo',
- *     mimeType: 'image/jpeg',
- *   });
- * };
- *
- * // Auto-detect MIME type
- * const handleShareAuto = async () => {
- *   await shareWithAutoType(
- *     'file:///path/to/document.pdf',
- *     'document.pdf',
- *     'Share Document'
- *   );
- * };
- * ```
  */
 export const useSharing = () => {
-  const [isAvailable, setIsAvailable] = useState(false);
-  const [isSharing, setIsSharing] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  // Track mounted state to prevent setState on unmounted component
-  const isMountedRef = useRef(true);
-
-  /**
-   * Check sharing availability on mount
-   */
-  useEffect(() => {
-    const checkAvailability = async () => {
-      const available = await SharingService.isAvailable();
-      if (isMountedRef.current) {
-        setIsAvailable(available);
-      }
-    };
-
-    checkAvailability();
-
-    return () => {
-      isMountedRef.current = false;
-    };
-  }, []);
-
-  /**
-   * Share a file via system share sheet
-   */
-  const share = useCallback(async (uri: string, options?: ShareOptions): Promise<boolean> => {
-    if (isMountedRef.current) {
-      setIsSharing(true);
-      setError(null);
+  // Check availability on mount
+  const availabilityOp = useAsyncOperation<boolean, string>(
+    () => SharingService.isAvailable(),
+    {
+      immediate: true,
+      initialData: false,
+      errorHandler: () => 'Failed to check sharing availability',
     }
+  );
 
-    try {
+  // Share operations
+  const shareOp = useAsyncOperation<boolean, string>(
+    async (uri: string, options?: ShareOptions) => {
       const result = await SharingService.shareFile(uri, options);
-
-      if (!result.success && isMountedRef.current) {
-        setError(result.error || 'Failed to share file');
-        return false;
+      if (!result.success) {
+        throw new Error(result.error || 'Failed to share file');
       }
-
       return true;
-    } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Failed to share file';
-      if (isMountedRef.current) {
-        setError(errorMessage);
-      }
-      return false;
-    } finally {
-      if (isMountedRef.current) {
-        setIsSharing(false);
-      }
+    },
+    {
+      immediate: false,
+      errorHandler: (err) => err instanceof Error ? err.message : 'Failed to share file',
     }
-  }, []);
+  );
 
-  /**
-   * Share file with automatic MIME type detection
-   */
-  const shareWithAutoType = useCallback(
-    async (uri: string, filename: string, dialogTitle?: string): Promise<boolean> => {
-      if (isMountedRef.current) {
-        setIsSharing(true);
-        setError(null);
+  const shareWithAutoTypeOp = useAsyncOperation<boolean, string>(
+    async (uri: string, filename: string, dialogTitle?: string) => {
+      const result = await SharingService.shareWithAutoType(uri, filename, dialogTitle);
+      if (!result.success) {
+        throw new Error(result.error || 'Failed to share file');
       }
+      return true;
+    },
+    {
+      immediate: false,
+      errorHandler: (err) => err instanceof Error ? err.message : 'Failed to share file',
+    }
+  );
 
-      try {
-        const result = await SharingService.shareWithAutoType(uri, filename, dialogTitle);
+  const shareMultipleOp = useAsyncOperation<boolean, string>(
+    async (uris: string[], options?: ShareOptions) => {
+      const result = await SharingService.shareMultipleFiles(uris, options);
+      if (!result.success) {
+        throw new Error(result.error || 'Failed to share files');
+      }
+      return true;
+    },
+    {
+      immediate: false,
+      errorHandler: (err) => err instanceof Error ? err.message : 'Failed to share files',
+    }
+  );
 
-        if (!result.success && isMountedRef.current) {
-          setError(result.error || 'Failed to share file');
-          return false;
-        }
+  const share = useCallback(
+    async (uri: string, options?: ShareOptions): Promise<boolean> => {
+      const result = await shareOp.execute(uri, options);
+      return result ?? false;
+    },
+    [shareOp]
+  );
 
-        return true;
-      } catch (err) {
-        const errorMessage = err instanceof Error ? err.message : 'Failed to share file';
-        if (isMountedRef.current) {
-          setError(errorMessage);
-        }
-        return false;
-      } finally {
-        if (isMountedRef.current) {
-          setIsSharing(false);
-        }
-      }
+  const shareWithAutoType = useCallback(
+    async (uri: string, filename: string, dialogTitle?: string): Promise<boolean> => {
+      const result = await shareWithAutoTypeOp.execute(uri, filename, dialogTitle);
+      return result ?? false;
     },
-    []
+    [shareWithAutoTypeOp]
   );
 
-  /**
-   * Share multiple files
-   */
   const shareMultiple = useCallback(
     async (uris: string[], options?: ShareOptions): Promise<boolean> => {
-      if (isMountedRef.current) {
-        setIsSharing(true);
-        setError(null);
-      }
-
-      try {
-        const result = await SharingService.shareMultipleFiles(uris, options);
-
-        if (!result.success && isMountedRef.current) {
-          setError(result.error || 'Failed to share files');
-          return false;
-        }
-
-        return true;
-      } catch (err) {
-        const errorMessage = err instanceof Error ? err.message : 'Failed to share files';
-        if (isMountedRef.current) {
-          setError(errorMessage);
-        }
-        return false;
-      } finally {
-        if (isMountedRef.current) {
-          setIsSharing(false);
-        }
-      }
+      const result = await shareMultipleOp.execute(uris, options);
+      return result ?? false;
     },
-    []
+    [shareMultipleOp]
   );
 
   return useMemo(() => ({
-    // Functions
     share,
     shareWithAutoType,
     shareMultiple,
-
-    // State
-    isAvailable,
-    isSharing,
-    error,
-  }), [share, shareWithAutoType, shareMultiple, isAvailable, isSharing, error]);
+    isAvailable: availabilityOp.data ?? false,
+    isSharing: shareOp.isLoading || shareWithAutoTypeOp.isLoading || shareMultipleOp.isLoading,
+    error: shareOp.error || shareWithAutoTypeOp.error || shareMultipleOp.error,
+  }), [
+    share,
+    shareWithAutoType,
+    shareMultiple,
+    availabilityOp.data,
+    shareOp.isLoading,
+    shareWithAutoTypeOp.isLoading,
+    shareMultipleOp.isLoading,
+    shareOp.error,
+    shareWithAutoTypeOp.error,
+    shareMultipleOp.error,
+  ]);
 };

package/src/utils/errors/DesignSystemError.ts

@@ -21,10 +21,31 @@ export class DesignSystemError extends Error {
    */
   public readonly timestamp: Date;
 
+  /**
+   * Error category for grouping
+   */
+  public readonly category: ErrorCategory;
+
+  /**
+   * Operation that failed
+   */
+  public readonly operation?: string;
+
+  /**
+   * Original error cause
+   */
+  public readonly cause?: unknown;
+
+  /**
+   * Whether operation can be retried
+   */
+  public readonly retryable: boolean;
+
   constructor(
     message: string,
     code: string,
-    context?: Record<string, any>
+    context?: Record<string, any>,
+    metadata?: ErrorMetadata
   ) {
     super(message);
     this.name = 'DesignSystemError';
@@ -32,6 +53,12 @@ export class DesignSystemError extends Error {
     this.context = context;
     this.timestamp = new Date();
 
+    // Extract metadata
+    this.category = metadata?.category ?? ErrorCategory.UNKNOWN;
+    this.operation = metadata?.operation;
+    this.cause = metadata?.cause;
+    this.retryable = metadata?.retryable ?? false;
+
     // Maintains proper stack trace for where our error was thrown (only available on V8)
     if (Error.captureStackTrace) {
       Error.captureStackTrace(this, DesignSystemError);
@@ -115,3 +142,32 @@ export const ErrorCodes = {
 } as const;
 
 export type ErrorCode = typeof ErrorCodes[keyof typeof ErrorCodes];
+
+/**
+ * Error Categories for grouping related errors
+ */
+export enum ErrorCategory {
+  FILESYSTEM = 'FILESYSTEM',
+  NETWORK = 'NETWORK',
+  MEDIA = 'MEDIA',
+  STORAGE = 'STORAGE',
+  CACHE = 'CACHE',
+  IMAGE = 'IMAGE',
+  VALIDATION = 'VALIDATION',
+  THEME = 'THEME',
+  PERMISSION = 'PERMISSION',
+  INITIALIZATION = 'INITIALIZATION',
+  UNKNOWN = 'UNKNOWN',
+}
+
+/**
+ * Error metadata for rich context
+ */
+export interface ErrorMetadata {
+  category?: ErrorCategory;
+  operation?: string;
+  key?: string;
+  cause?: unknown;
+  retryable?: boolean;
+  userMessage?: string;
+}

package/src/utils/errors/ErrorHandler.ts

@@ -5,7 +5,9 @@
  * Provides consistent error handling, logging, and reporting.
  */
 
-import { DesignSystemError, ErrorCodes } from './DesignSystemError';
+import { DesignSystemError, ErrorCodes, ErrorCategory, type ErrorMetadata } from './DesignSystemError';
+import type { Result } from './types/Result';
+import { ok, err } from './types/Result';
 
 export class ErrorHandler {
   /**
@@ -134,4 +136,106 @@ export class ErrorHandler {
       return [handled, null];
     }
   }
+
+  /**
+   * Normalize any error to DesignSystemError with metadata
+   */
+  static normalize(
+    error: unknown,
+    code: string,
+    metadata?: ErrorMetadata
+  ): DesignSystemError {
+    if (error instanceof DesignSystemError) {
+      return error;
+    }
+
+    if (error instanceof Error) {
+      return new DesignSystemError(
+        error.message,
+        code,
+        {
+          originalError: error.name,
+          stack: error.stack,
+        },
+        {
+          ...metadata,
+          cause: error,
+        }
+      );
+    }
+
+    if (typeof error === 'string') {
+      return new DesignSystemError(error, code, undefined, metadata);
+    }
+
+    return new DesignSystemError(
+      'An unknown error occurred',
+      code,
+      { originalError: String(error) },
+      metadata
+    );
+  }
+
+  /**
+   * Wrap async function with timeout
+   */
+  static async withTimeout<T>(
+    promise: Promise<T>,
+    timeoutMs: number,
+    context?: string
+  ): Promise<T> {
+    const timeoutPromise = new Promise<never>((_, reject) => {
+      setTimeout(() => {
+        reject(
+          new DesignSystemError(
+            `${context || 'Operation'} timed out after ${timeoutMs}ms`,
+            ErrorCodes.TIMEOUT_ERROR,
+            { timeoutMs, context },
+            {
+              category: ErrorCategory.NETWORK,
+              retryable: true,
+            }
+          )
+        );
+      }, timeoutMs);
+    });
+
+    return Promise.race([promise, timeoutPromise]);
+  }
+
+  /**
+   * Wrap async function returning Result type
+   */
+  static async tryAsyncResult<T>(
+    fn: () => Promise<T>,
+    code: string,
+    metadata?: ErrorMetadata
+  ): Promise<Result<T, DesignSystemError>> {
+    try {
+      const result = await fn();
+      return ok(result);
+    } catch (error) {
+      const normalized = this.normalize(error, code, metadata);
+      this.log(normalized);
+      return err(normalized);
+    }
+  }
+
+  /**
+   * Wrap sync function returning Result type
+   */
+  static tryResult<T>(
+    fn: () => T,
+    code: string,
+    metadata?: ErrorMetadata
+  ): Result<T, DesignSystemError> {
+    try {
+      const result = fn();
+      return ok(result);
+    } catch (error) {
+      const normalized = this.normalize(error, code, metadata);
+      this.log(normalized);
+      return err(normalized);
+    }
+  }
 }