@oxyhq/services 5.10.16 → 5.11.1

package/src/ui/hooks/useAssets.ts

@@ -0,0 +1,306 @@
+import { useCallback } from 'react';
+import { useAssetStore } from '../stores/assetStore';
+import { OxyServices } from '../../core/OxyServices';
+import { 
+  Asset, 
+  AssetLinkRequest, 
+  AssetUnlinkRequest, 
+  AssetUploadProgress 
+} from '../../models/interfaces';
+
+// Create a singleton instance for the hook
+let oxyInstance: OxyServices | null = null;
+
+export const setOxyAssetInstance = (instance: OxyServices) => {
+  oxyInstance = instance;
+};
+
+/**
+ * Hook for managing assets with Zustand store integration
+ */
+export const useAssets = () => {
+  const {
+    assets,
+    uploadProgress,
+    loading,
+    errors,
+    setAsset,
+    setAssets,
+    removeAsset,
+    setUploadProgress,
+    removeUploadProgress,
+    addLink,
+    removeLink,
+    setUploading,
+    setLinking,
+    setDeleting,
+    setUploadError,
+    setLinkError,
+    setDeleteError,
+    clearErrors,
+    getAssetsByApp,
+    getAssetsByEntity,
+    getAssetUsageCount,
+    isAssetLinked,
+    reset
+  } = useAssetStore();
+
+  // Upload asset with progress tracking
+  const upload = useCallback(async (
+    file: File, 
+    metadata?: Record<string, any>
+  ): Promise<Asset | null> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      clearErrors();
+      setUploading(true);
+      
+      // Calculate SHA256 for progress tracking
+      const sha256 = await oxyInstance.calculateSHA256(file);
+      
+      // Initialize progress tracking
+      const initialProgress: AssetUploadProgress = {
+        fileId: '', // Will be set after init
+        uploaded: 0,
+        total: file.size,
+        percentage: 0,
+        status: 'uploading'
+      };
+      
+      // Upload with progress callback
+      const result = await oxyInstance.assetUpload(file, metadata, (percentage) => {
+        if (initialProgress.fileId) {
+          setUploadProgress(initialProgress.fileId, {
+            ...initialProgress,
+            uploaded: Math.round((percentage / 100) * file.size),
+            percentage,
+            status: percentage < 100 ? 'uploading' : 'processing'
+          });
+        }
+      });
+
+      // Update progress with final status
+      if (result.file && initialProgress.fileId) {
+        setUploadProgress(initialProgress.fileId, {
+          ...initialProgress,
+          fileId: result.file.id,
+          uploaded: file.size,
+          percentage: 100,
+          status: 'complete'
+        });
+        
+        // Remove progress after a short delay
+        setTimeout(() => {
+          removeUploadProgress(result.file.id);
+        }, 2000);
+      }
+
+      // Add asset to store
+      if (result.file) {
+        setAsset(result.file);
+        return result.file;
+      }
+      
+      return null;
+    } catch (error: any) {
+      setUploadError(error.message || 'Upload failed');
+      throw error;
+    } finally {
+      setUploading(false);
+    }
+  }, [
+    clearErrors, 
+    setUploading, 
+    setUploadProgress, 
+    removeUploadProgress, 
+    setAsset, 
+    setUploadError
+  ]);
+
+  // Link asset to entity
+  const link = useCallback(async (
+    assetId: string, 
+    app: string, 
+    entityType: string, 
+    entityId: string
+  ): Promise<void> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      clearErrors();
+      setLinking(true);
+      
+      const result = await oxyInstance.assetLink(assetId, app, entityType, entityId);
+      
+      if (result.file) {
+        setAsset(result.file);
+      } else {
+        // If API doesn't return full file, update store optimistically
+        addLink(assetId, {
+          app,
+          entityType,
+          entityId,
+          createdBy: '', // Will be filled by server
+          createdAt: new Date().toISOString()
+        });
+      }
+    } catch (error: any) {
+      setLinkError(error.message || 'Link failed');
+      throw error;
+    } finally {
+      setLinking(false);
+    }
+  }, [clearErrors, setLinking, setAsset, addLink, setLinkError]);
+
+  // Unlink asset from entity
+  const unlink = useCallback(async (
+    assetId: string, 
+    app: string, 
+    entityType: string, 
+    entityId: string
+  ): Promise<void> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      clearErrors();
+      setLinking(true);
+      
+      const result = await oxyInstance.assetUnlink(assetId, app, entityType, entityId);
+      
+      if (result.file) {
+        setAsset(result.file);
+      } else {
+        // Update store optimistically
+        removeLink(assetId, app, entityType, entityId);
+      }
+    } catch (error: any) {
+      setLinkError(error.message || 'Unlink failed');
+      throw error;
+    } finally {
+      setLinking(false);
+    }
+  }, [clearErrors, setLinking, setAsset, removeLink, setLinkError]);
+
+  // Get asset URL
+  const getUrl = useCallback(async (
+    assetId: string, 
+    variant?: string, 
+    expiresIn?: number
+  ): Promise<string> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      const result = await oxyInstance.assetGetUrl(assetId, variant, expiresIn);
+      return result.url;
+    } catch (error: any) {
+      throw error;
+    }
+  }, []);
+
+  // Get asset metadata
+  const getAsset = useCallback(async (assetId: string): Promise<Asset> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      const result = await oxyInstance.assetGet(assetId);
+      if (result.file) {
+        setAsset(result.file);
+        return result.file;
+      }
+      throw new Error('Asset not found');
+    } catch (error: any) {
+      throw error;
+    }
+  }, [setAsset]);
+
+  // Delete asset
+  const deleteAsset = useCallback(async (
+    assetId: string, 
+    force: boolean = false
+  ): Promise<void> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      clearErrors();
+      setDeleting(true);
+      
+      await oxyInstance.assetDelete(assetId, force);
+      removeAsset(assetId);
+    } catch (error: any) {
+      setDeleteError(error.message || 'Delete failed');
+      throw error;
+    } finally {
+      setDeleting(false);
+    }
+  }, [clearErrors, setDeleting, removeAsset, setDeleteError]);
+
+  // Restore asset from trash
+  const restore = useCallback(async (assetId: string): Promise<void> => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      const result = await oxyInstance.assetRestore(assetId);
+      if (result.file) {
+        setAsset(result.file);
+      }
+    } catch (error: any) {
+      throw error;
+    }
+  }, [setAsset]);
+
+  // Get variants
+  const getVariants = useCallback(async (assetId: string) => {
+    if (!oxyInstance) {
+      throw new Error('OxyServices instance not configured. Call setOxyAssetInstance first.');
+    }
+
+    try {
+      return await oxyInstance.assetGetVariants(assetId);
+    } catch (error: any) {
+      throw error;
+    }
+  }, []);
+
+  return {
+    // State
+    assets: Object.values(assets),
+    uploadProgress,
+    loading,
+    errors,
+    
+    // Actions
+    upload,
+    link,
+    unlink,
+    getUrl,
+    getAsset,
+    deleteAsset,
+    restore,
+    getVariants,
+    
+    // Utility methods
+    getAssetsByApp,
+    getAssetsByEntity,
+    getAssetUsageCount,
+    isAssetLinked,
+    
+    // Store management
+    clearErrors,
+    reset
+  };
+};

package/src/ui/navigation/OxyRouter.tsx

@@ -1,4 +1,5 @@
-import React, { useState, useEffect, useCallback } from 'react';
+import type React from 'react';
+import { useState, useEffect, useCallback } from 'react';
 import { View, StyleSheet } from 'react-native';
 import { OxyServices } from '../../core';
 
@@ -26,7 +27,7 @@ import RecoverAccountScreen from '../screens/RecoverAccountScreen';
 import PaymentGatewayScreen from '../screens/PaymentGatewayScreen';
 
 // Import types
-import { OxyRouterProps, RouteConfig } from './types';
+import type { OxyRouterProps, RouteConfig } from './types';
 
 // Define route configuration with screen components and default snap points
 const routes: Record<string, RouteConfig> = {

package/src/ui/navigation/types.ts

@@ -1,13 +1,13 @@
-import { OxyServices } from '../../core';
-import { User } from '../../models/interfaces';
-import { ComponentType, ReactNode } from 'react';
+import type { OxyServices } from '../../core';
+import type { User } from '../../models/interfaces';
+import type { ComponentType, ReactNode } from 'react';
 
 /**
  * Base props for all screens in the Oxy UI system
  */
 export interface BaseScreenProps {
   oxyServices: OxyServices;
-  navigate: (screen: string, props?: any) => void;
+  navigate: (screen: string, props?: Record<string, unknown>) => void;
   goBack: () => void;
   onClose?: () => void;
   onAuthenticated?: (user: User) => void;
@@ -15,14 +15,14 @@ export interface BaseScreenProps {
   containerWidth?: number;
   initialStep?: number;
   username?: string;
-  userProfile?: any;
+  userProfile?: User;
 }
 
 /**
  * Route configuration for OxyRouter
  */
 export interface RouteConfig {
-  component: ComponentType<any>;
+  component: ComponentType<any>; // Allow any component type for flexibility
   snapPoints: string[];
 }
 
@@ -36,7 +36,7 @@ export interface OxyRouterProps {
   onAuthenticated?: (user: User) => void;
   theme: 'light' | 'dark';
   adjustSnapPoints?: (snapPoints: string[]) => void;
-  navigationRef?: React.MutableRefObject<((screen: string, props?: Record<string, any>) => void) | null>;
+  navigationRef?: React.MutableRefObject<((screen: string, props?: Record<string, unknown>) => void) | null>;
   containerWidth?: number;
 }
 
@@ -82,7 +82,7 @@ export interface OxyProviderProps {
    * @deprecated External bottom sheet ref is no longer required as OxyProvider handles the bottom sheet internally
    * @hidden
    */
-  bottomSheetRef?: React.RefObject<any>;
+  bottomSheetRef?: React.RefObject<unknown>;
   
   /**
    * Whether to automatically present the bottom sheet when component mounts

package/src/ui/screens/AccountCenterScreen.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import {
     View,
     Text,
@@ -9,7 +9,7 @@ import {
     Alert,
     Platform,
 } from 'react-native';
-import { BaseScreenProps } from '../navigation/types';
+import type { BaseScreenProps } from '../navigation/types';
 import { useOxy } from '../context/OxyContext';
 import { packageInfo } from '../../constants/version';
 import { toast } from '../../lib/sonner';

package/src/ui/screens/AccountManagementDemo.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import { View, Text, TouchableOpacity, StyleSheet, ScrollView } from 'react-native';
 import OxyProvider from '../components/OxyProvider';
 import { OxyServices } from '../../core';

package/src/ui/screens/AccountOverviewScreen.tsx

@@ -11,7 +11,7 @@ import {
     Image,
     TextStyle,
 } from 'react-native';
-import { BaseScreenProps } from '../navigation/types';
+import type { BaseScreenProps } from '../navigation/types';
 import { useOxy } from '../context/OxyContext';
 import OxyLogo from '../components/OxyLogo';
 import Avatar from '../components/Avatar';

package/src/ui/screens/AccountSettingsScreen.tsx

@@ -12,7 +12,7 @@ import {
     Platform,
     Image,
 } from 'react-native';
-import { BaseScreenProps } from '../navigation/types';
+import type { BaseScreenProps } from '../navigation/types';
 import { useOxy } from '../context/OxyContext';
 import Avatar from '../components/Avatar';
 import OxyIcon from '../components/icon/OxyIcon';
@@ -363,8 +363,8 @@ const AccountSettingsScreen: React.FC<BaseScreenProps> = ({
                 locationData.type === 'country' ? 'Country' :
                     locationData.type === 'state' ? 'State' : 'Location',
             coordinates: {
-                lat: parseFloat(locationData.lat),
-                lon: parseFloat(locationData.lon)
+                lat: Number.parseFloat(locationData.lat),
+                lon: Number.parseFloat(locationData.lon)
             }
         };
 

package/src/ui/screens/AccountSwitcherScreen.tsx

@@ -1,4 +1,5 @@
-import React, { useState, useEffect } from 'react';
+import type React from 'react';
+import { useState, useEffect } from 'react';
 import {
     View,
     Text,
@@ -11,11 +12,11 @@ import {
     Image,
     Dimensions,
 } from 'react-native';
-import { BaseScreenProps } from '../navigation/types';
+import type { BaseScreenProps } from '../navigation/types';
 import { useOxy } from '../context/OxyContext';
-import { ClientSession } from '../../models/session';
+import type { ClientSession } from '../../models/session';
 import { fontFamilies } from '../styles/fonts';
-import { User } from '../../models/interfaces';
+import type { User } from '../../models/interfaces';
 import { toast } from '../../lib/sonner';
 import { confirmAction } from '../utils/confirmAction';
 import OxyIcon from '../components/icon/OxyIcon';
@@ -196,12 +197,12 @@ const ModernAccountSwitcherScreen: React.FC<BaseScreenProps> = ({
 
     // Device session management functions
     const loadAllDeviceSessions = async () => {
-        if (!oxyServices || !user?.sessionId) return;
+        if (!oxyServices || !activeSessionId) return;
 
         setLoadingDeviceSessions(true);
         try {
             // This would call the API to get all device sessions for the current user
-            const allSessions = await oxyServices.getDeviceSessions(user.sessionId);
+            const allSessions = await oxyServices.getDeviceSessions(activeSessionId);
             setDeviceSessions(allSessions || []);
         } catch (error) {
             console.error('Failed to load device sessions:', error);
@@ -217,7 +218,7 @@ const ModernAccountSwitcherScreen: React.FC<BaseScreenProps> = ({
             async () => {
                 setRemoteLogoutSessionId(sessionId);
                 try {
-                    await oxyServices?.logoutSession(user?.sessionId || '', sessionId);
+                    await oxyServices?.logoutSession(activeSessionId || '', sessionId);
                     // Refresh device sessions list
                     await loadAllDeviceSessions();
                     toast.success(`Signed out from ${deviceName} successfully!`);
@@ -244,7 +245,7 @@ const ModernAccountSwitcherScreen: React.FC<BaseScreenProps> = ({
             async () => {
                 setLoggingOutAllDevices(true);
                 try {
-                    await oxyServices?.logoutAllDeviceSessions(user?.sessionId || '');
+                    await oxyServices?.logoutAllDeviceSessions(activeSessionId || '');
                     // Refresh device sessions list
                     await loadAllDeviceSessions();
                     toast.success('Signed out from all other devices successfully!');

package/src/ui/screens/AppInfoScreen.tsx

@@ -1,4 +1,5 @@
-import React, { useState, useEffect } from 'react';
+import type React from 'react';
+import { useState, useEffect } from 'react';
 import {
     View,
     Text,
@@ -12,7 +13,7 @@ import {
     ScrollView,
     ActivityIndicator,
 } from 'react-native';
-import { BaseScreenProps } from '../navigation/types';
+import type { BaseScreenProps } from '../navigation/types';
 import { useOxy } from '../context/OxyContext';
 import { fontFamilies } from '../styles/fonts';
 import { packageInfo } from '../../constants/version';

package/src/ui/screens/FeedbackScreen.tsx

@@ -14,7 +14,7 @@ import {
     Alert,
     Dimensions,
 } from 'react-native';
-import { BaseScreenProps } from '../navigation/types';
+import type { BaseScreenProps } from '../navigation/types';
 import { useOxy } from '../context/OxyContext';
 import { useThemeColors } from '../styles';
 import { Ionicons } from '@expo/vector-icons';