@chem-po/firebase-native 0.0.16 → 0.0.18

package/src/adapter/auth.ts

@@ -0,0 +1,474 @@
+import {
+  AuthAdapter,
+  BaseAuthProvider,
+  BaseUserData,
+  BaseUserRole,
+  EnrollmentFactor,
+  EnrollmentFactorsResult,
+  LoginResult,
+  MultiFactorVerification,
+  WithMultiFactorVerified,
+} from '@chem-po/core'
+import {
+  FirebaseAuthTypes,
+  getIdTokenResult,
+  getMultiFactorResolver,
+  GoogleAuthProvider,
+  onAuthStateChanged,
+  PhoneAuthProvider,
+  PhoneMultiFactorGenerator,
+  sendPasswordResetEmail,
+  signInWithCredential,
+  signInWithCustomToken,
+  signInWithEmailAndPassword,
+  signOut,
+} from '@react-native-firebase/auth'
+
+import { GoogleSignin } from '@react-native-google-signin/google-signin'
+import { Auth, User } from '../types/auth'
+
+const isDebug = (
+  typeof process !== 'undefined' && 
+  process.env?.EXPO_PUBLIC_DEBUG === 'true'
+) || false
+
+const debugLog = (message: string, data?: any) => {
+  if (isDebug) {
+    console.log(`[FirebaseAuth Debug] ${message}`, data || '')
+  }
+}
+
+const providerInitialized: Record<string, boolean> = {}
+
+const getUserWithRole = async <UserData extends BaseUserData>(
+  user: FirebaseAuthTypes.User
+): Promise<WithMultiFactorVerified<UserData>> => {
+  debugLog('Getting user with role', { uid: user.uid, email: user.email })
+  
+  try {
+    const { claims } = await getIdTokenResult(user)
+    debugLog('Retrieved ID token claims', { role: claims.role, customClaims: Object.keys(claims) })
+    
+    const userWithRole = {
+      ...(user as any),
+      role: claims.role ?? ('user' as BaseUserRole),
+      multiFactorVerified: !!user.multiFactor?.enrolledFactors.length
+    } as WithMultiFactorVerified<UserData>
+    
+    debugLog('User with role created', { 
+      uid: userWithRole.uid, 
+      role: userWithRole.role, 
+      multiFactorVerified: userWithRole.multiFactorVerified,
+      enrolledFactorsCount: user.multiFactor?.enrolledFactors.length || 0
+    })
+    
+    return userWithRole
+  } catch (error) {
+    debugLog('Error getting user with role', error)
+    throw error
+  }
+}
+
+const toEnrollmentFactor = (hint: FirebaseAuthTypes.MultiFactorInfo): EnrollmentFactor => {
+  if (hint.factorId === PhoneMultiFactorGenerator.FACTOR_ID) {
+    return {
+      type: 'phone',
+      phoneNumber: (hint as FirebaseAuthTypes.PhoneMultiFactorInfo).phoneNumber,
+      enrollmentTime: hint.enrollmentTime,
+      displayName: (hint as FirebaseAuthTypes.PhoneMultiFactorInfo).displayName,
+      uid: hint.uid,
+    }
+  }
+  if (hint.factorId === 'totp') {
+    return {
+      type: 'totp',
+      enrollmentTime: hint.enrollmentTime,
+      displayName: hint.displayName,
+      uid: hint.uid,
+    }
+  }
+  throw new Error('Unsupported factor type: ' + hint.factorId)
+}
+
+const toFirebaseFactor = (factor: EnrollmentFactor): FirebaseAuthTypes.MultiFactorInfo => {
+  if (factor.type === 'phone') {
+    return {
+      factorId: PhoneMultiFactorGenerator.FACTOR_ID,
+      phoneNumber: factor.phoneNumber,
+      enrollmentTime: factor.enrollmentTime,
+      uid: factor.uid,
+      displayName: factor.displayName,
+    }
+  }
+  if (factor.type === 'totp') {
+    return {
+      factorId: 'totp',
+      enrollmentTime: factor.enrollmentTime,
+      uid: factor.uid,
+      displayName: factor.displayName,
+    }
+  }
+  throw new Error(
+    `Unsupported factor type: ${(factor as FirebaseAuthTypes.MultiFactorInfo).factorId ?? 'Missing factor type'}`
+  )
+}
+
+const sendMultiFactorCode = async (
+  auth: Auth,
+  factor: EnrollmentFactor,
+  resolver: FirebaseAuthTypes.MultiFactorResolver
+): Promise<MultiFactorVerification> => {
+  debugLog('Sending multi-factor code', { factorType: factor.type, factorUid: factor.uid })
+  
+  const sessionId = resolver.session
+  // const verificationId = await new PhoneAuthProvider(auth).verifyPhoneNumber(phoneSignInFactor, sessionId)
+  if (factor.type === 'phone') {
+    try {
+      const verificationId = await auth.verifyPhoneNumberWithMultiFactorInfo(
+        toFirebaseFactor(factor),
+        sessionId
+      )
+      debugLog('Multi-factor code sent successfully', { verificationId: verificationId.substring(0, 10) + '...' })
+      return {
+        verificationId,
+        factor,
+        resolver,
+      }
+    } catch (error) {
+      debugLog('Error sending multi-factor code', error)
+      throw error
+    }
+  }
+  throw new Error(`Unsupported factor type: ${factor.type ?? 'Missing factor type'}`)
+}
+
+const getEnrolledFactors = async (auth: Auth, error: any): Promise<EnrollmentFactorsResult> => {
+  debugLog('Getting enrolled factors from error', { errorCode: error?.code })
+  
+  try {
+    const resolver = getMultiFactorResolver(auth, error)
+    debugLog('Multi-factor resolver created', { hintsCount: resolver.hints.length })
+    
+    if (resolver.hints.length === 0) {
+      debugLog('No enrolled factors found')
+      throw new Error('No multi-factor verification methods found, please enroll one on the website')
+    }
+    
+    const enrollmentFactors = resolver.hints.map(toEnrollmentFactor)
+    debugLog('Enrollment factors mapped', { factors: enrollmentFactors.map(f => ({ type: f.type, uid: f.uid })) })
+    
+    return {
+      enrollmentFactors,
+      multiFactorResolver: resolver,
+    }
+  } catch (error) {
+    debugLog('Error getting enrolled factors', error)
+    throw error
+  }
+}
+
+const verifyMultiFactor = async (
+  verification: MultiFactorVerification,
+  code: string
+): Promise<LoginResult<User>> => {
+  debugLog('Verifying multi-factor code', { 
+    factorType: verification.factor.type, 
+    codeLength: code.length 
+  })
+  
+  try {
+    const credential = await PhoneAuthProvider.credential(verification.verificationId, code)
+    debugLog('Phone credential created')
+    
+    const assertion = PhoneMultiFactorGenerator.assertion(credential)
+    debugLog('Multi-factor assertion created')
+    
+    const resolver = (verification as any).resolver
+    if (!resolver) {
+      debugLog('Multi-factor resolver not found')
+      throw new Error('Internal error signing in with two factor: resolver not found')
+    }
+    
+    const userCredential = await resolver.resolveSignIn(assertion)
+    debugLog('Multi-factor sign-in resolved', { uid: userCredential.user?.uid })
+    
+    const user = userCredential.user
+    if (!user) {
+      debugLog('No user found after multi-factor resolution')
+      throw new Error('No user found')
+    }
+    
+    const userWithRole = await getUserWithRole(user)
+    debugLog('Multi-factor verification completed successfully')
+    
+    return { user: userWithRole }
+  } catch (error) {
+    debugLog('Error verifying multi-factor', error)
+    throw error
+  }
+}
+
+const handleSignInError = async (error: any): Promise<LoginResult<User>> => {
+  debugLog('Handling sign-in error', { code: error?.code, message: error?.message })
+  
+  if (error.code === 'auth/multi-factor-auth-required') {
+    debugLog('Multi-factor authentication required')
+    return { requestArgs: error }
+  }
+  
+  debugLog('Re-throwing sign-in error')
+  throw error
+}
+
+const initializeProvider = async (provider: BaseAuthProvider) => {
+  debugLog('Initializing provider', { name: provider.name, alreadyInitialized: providerInitialized[provider.name] })
+  
+  if (providerInitialized[provider.name]) {
+    debugLog('Provider already initialized, skipping')
+    return
+  }
+  
+  switch (provider.name) {
+    case 'google':
+      debugLog('Initializing Google provider', { webClientId: !!(provider as GoogleAuthProvider).webClientId })
+      
+      if (!(provider as GoogleAuthProvider).webClientId) {
+        debugLog('Google web client ID missing')
+        throw new Error(
+          'Google web client ID is required when using Google Auth. ' +
+          'Get your webClientId from Firebase Console > Authentication > Sign-in method > Google > Web SDK configuration. ' +
+          'Then provide it in your GoogleAuthProvider: { name: "google", webClientId: "YOUR_CLIENT_ID" }'
+        )
+      }
+      
+      try {
+        await GoogleSignin.hasPlayServices({ showPlayServicesUpdateDialog: true })
+        debugLog('Google Play Services available')
+        
+        GoogleSignin.configure({
+          webClientId: (provider as any).webClientId,
+        })
+        debugLog('Google Sign-In configured successfully')
+      } catch (error) {
+        debugLog('Error initializing Google provider', error)
+        if (error instanceof Error && error.message.includes('UNAVAILABLE')) {
+          throw new Error(
+            'Google Play Services is not available or needs to be updated. ' +
+            'Please ensure Google Play Services is installed and up to date on this device.'
+          )
+        }
+        throw error
+      }
+      break
+    case 'email':
+      debugLog('Email provider initialization (no special setup required)')
+      // Native SDK doesn't need special initialization
+      break
+    default:
+      debugLog('Unsupported provider', { name: provider.name })
+      throw new Error(`Unsupported provider: ${provider.name}`)
+  }
+
+  providerInitialized[provider.name] = true
+  debugLog('Provider initialization completed', { name: provider.name })
+}
+
+const handleInitialLogin = async (
+  userCredential: FirebaseAuthTypes.UserCredential,
+  twoFactorRequired: boolean
+): Promise<LoginResult<User>> => {
+  debugLog('Handling initial login', { 
+    uid: userCredential.user?.uid, 
+    twoFactorRequired,
+    enrolledFactorsCount: userCredential.user?.multiFactor?.enrolledFactors.length || 0
+  })
+  
+  const user = userCredential.user
+  if (!user) {
+    debugLog('No user found in credential')
+    throw new Error('No user found')
+  }
+  
+  if (twoFactorRequired) {
+    debugLog('Two-factor authentication is required but user has no enrolled factors')
+    throw new Error(
+      'This app requires two factor authentication, please enroll a factor on the website and try again'
+    )
+  }
+  
+  const userWithRole = await getUserWithRole(user)
+  debugLog('Initial login completed successfully')
+  
+  return { user: userWithRole }
+}
+
+const loginWithGoogle = async (
+  auth: Auth,
+  twoFactorRequired: boolean
+): Promise<LoginResult<User>> => {
+  debugLog('Starting Google sign-in', { twoFactorRequired })
+  
+  try {
+    debugLog('Calling GoogleSignin.signIn()')
+    const signInResult = await GoogleSignin.signIn()
+    debugLog('Google sign-in result received', { hasIdToken: !!signInResult.data?.idToken })
+    
+    const idToken = signInResult.data?.idToken
+    if (!idToken) {
+      debugLog('No ID token found in Google sign-in result')
+      throw new Error('No ID token found')
+    }
+    
+    debugLog('Creating Google credential')
+    const googleCredential = GoogleAuthProvider.credential(idToken)
+    
+    debugLog('Signing in with Google credential')
+    const userCredential = await signInWithCredential(auth, googleCredential)
+    
+    return await handleInitialLogin(userCredential, twoFactorRequired)
+  } catch (error) {
+    debugLog('Error in Google sign-in', error)
+    return await handleSignInError(error)
+  }
+}
+
+const getLoginWithPassword =
+  (auth: Auth, twoFactorRequired: boolean) =>
+  async (
+    provider: BaseAuthProvider,
+    { email, password }: { email: string; password: string }
+  ): Promise<LoginResult<User>> => {
+    debugLog('Starting email/password sign-in', { 
+      provider: provider.name, 
+      email, 
+      twoFactorRequired 
+    })
+    
+    await initializeProvider(provider)
+    try {
+      debugLog('Calling signInWithEmailAndPassword')
+      const userCredential = await signInWithEmailAndPassword(auth, email, password)
+      debugLog('Email/password sign-in successful', { uid: userCredential.user?.uid })
+      
+      return await handleInitialLogin(userCredential, twoFactorRequired)
+    } catch (error) {
+      debugLog('Error in email/password sign-in', error)
+      return await handleSignInError(error)
+    }
+  }
+
+const getLoginWithPopup =
+  (auth: Auth, twoFactorRequired: boolean) =>
+  async (provider: BaseAuthProvider): Promise<LoginResult<User>> => {
+    debugLog('Starting popup sign-in', { provider: provider.name, twoFactorRequired })
+    
+    await initializeProvider(provider)
+    switch (provider.name) {
+      case 'google':
+        return loginWithGoogle(auth, twoFactorRequired)
+      default:
+        debugLog('Unsupported popup provider', { name: provider.name })
+        throw new Error(`Unsupported provider: ${provider.name}`)
+    }
+  }
+
+const getLoginWithToken =
+  (auth: Auth, twoFactorRequired: boolean) =>
+  async (provider: BaseAuthProvider, token: string): Promise<LoginResult<User>> => {
+    debugLog('Starting token sign-in', { 
+      provider: provider.name, 
+      tokenLength: token.length,
+      twoFactorRequired 
+    })
+    
+    await initializeProvider(provider)
+    try {
+      debugLog('Calling signInWithCustomToken')
+      const userCredential = await signInWithCustomToken(auth, token)
+      debugLog('Token sign-in successful', { uid: userCredential.user?.uid })
+      
+      return await handleInitialLogin(userCredential, twoFactorRequired)
+    } catch (error) {
+      debugLog('Error in token sign-in', error)
+      return await handleSignInError(error)
+    }
+  }
+
+const resetPassword = async (
+  auth: Auth,
+  provider: BaseAuthProvider,
+  usernameOrEmail: string
+): Promise<void> => {
+  debugLog('Starting password reset', { provider: provider.name, email: usernameOrEmail })
+  
+  await initializeProvider(provider)
+  try {
+    await sendPasswordResetEmail(auth, usernameOrEmail)
+    debugLog('Password reset email sent successfully')
+  } catch (error) {
+    debugLog('Error sending password reset email', error)
+    throw error
+  }
+}
+
+export const getFirebaseAuthAdapter = (
+  auth: Auth,
+  twoFactorRequired: boolean
+): AuthAdapter<BaseAuthProvider, User, { email: string; password: string }> => {
+  debugLog('Creating Firebase Auth Adapter', { twoFactorRequired })
+  
+  return {
+    twoFactorRequired,
+    getCurrentUser: async () => {
+      debugLog('Getting current user')
+      const user = auth.currentUser
+      if (!user) {
+        debugLog('No current user found')
+        return null
+      }
+      debugLog('Current user found', { uid: user.uid, email: user.email })
+      return getUserWithRole(user)
+    },
+    loginWithPassword: getLoginWithPassword(auth, twoFactorRequired),
+    loginWithPopup: getLoginWithPopup(auth, twoFactorRequired),
+    loginWithToken: getLoginWithToken(auth, twoFactorRequired),
+    resetPassword: (...args) => {
+      return resetPassword(auth, ...args)
+    },
+    verifyMultiFactor,
+    sendMultiFactorCode: (...args) => {
+      return sendMultiFactorCode(auth, ...args)
+    },
+    getEnrolledFactors: (...args) => {
+      return getEnrolledFactors(auth, ...args)
+    },
+    logout: async () => {
+      debugLog('Starting logout')
+      try {
+        await signOut(auth)
+        debugLog('Logout completed successfully')
+      } catch (error) {
+        debugLog('Error during logout', error)
+        throw error
+      }
+    },
+    subscribeToUser: (callback) => {
+      debugLog('Setting up user subscription')
+      return onAuthStateChanged(auth, (user) => {
+        if (!user) {
+          debugLog('User state changed: signed out')
+          callback(null)
+          return
+        }
+        debugLog('User state changed: user signed in', { uid: user.uid, email: user.email })
+        getUserWithRole(user).then((result) => {
+          debugLog('User subscription callback completed', { uid: result.uid, role: result.role })
+          callback(result)
+        }).catch((error) => {
+          debugLog('Error in user subscription callback', error)
+          callback(null)
+        })
+      })
+    },
+  }
+}

package/src/adapter/db.ts

@@ -0,0 +1,146 @@
+import {
+  addMetadata,
+  AnyObject,
+  BaseError,
+  DatabaseAdapter,
+  DBItem,
+  OnError,
+  OnItemData,
+  Unsubscribe,
+  WithMetadata,
+} from '@chem-po/core'
+import { useAuth } from '@chem-po/react'
+import {
+  deleteDoc,
+  doc,
+  FirebaseFirestoreTypes,
+  getDoc,
+  getDocs,
+  onSnapshot,
+  setDoc,
+} from '@react-native-firebase/firestore'
+import { httpsCallable } from '@react-native-firebase/functions'
+import { toCursorQuery, toFirestoreQuery } from '../db/utils'
+import { Firestore, FirestoreBaseQuery, FirestoreCursor, FirestoreOnItemsData } from '../types/db'
+import { Functions } from '../types/functions'
+// import { BaseQuery, FirestoreCursor } from '../types/db'
+
+const handleFirestoreError = (error: any): BaseError => ({
+  code: error?.code ?? 'unknown',
+  message: error?.name ?? 'Unknown Error',
+  description: error?.message ?? 'An unknown error occurred',
+})
+
+const toDBItem = <T extends AnyObject>(
+  doc: FirebaseFirestoreTypes.DocumentSnapshot<T>,
+): DBItem<T> => ({
+  ...(doc.data() as WithMetadata<T>),
+  id: doc.id,
+})
+
+const getSubscribeToQuery =
+  (db: Firestore) =>
+  <T extends AnyObject>(
+    baseQuery: FirestoreBaseQuery<T>,
+    onData: FirestoreOnItemsData<T>,
+    onError: OnError,
+  ): Unsubscribe => {
+    const q = toFirestoreQuery<T>(db, baseQuery)
+    return onSnapshot(
+      q,
+      snapshot => {
+        const items = snapshot.docs.map(doc => toDBItem(doc))
+        onData(items, snapshot.docs[snapshot.docs.length - 1] as FirestoreCursor)
+      },
+      error => onError(handleFirestoreError(error)),
+    )
+  }
+
+const getFetchNextCursor =
+  (db: Firestore) =>
+  async <T extends AnyObject>(
+    baseQuery: FirestoreBaseQuery<T>,
+  ): Promise<FirestoreCursor | null> => {
+    const { cursor } = baseQuery
+    const cursorDoc = cursor ? await getDoc(doc(db, baseQuery.collection, cursor.id)) : null
+    const q = toCursorQuery<T>(db, baseQuery, cursorDoc as FirestoreCursor | null)
+    const snapshot = await getDocs(q)
+    return (snapshot.docs[0] ?? null) as FirestoreCursor | null
+  }
+
+const getFetchCount =
+  (functions: Functions) =>
+  async <T extends AnyObject>(baseQuery: FirestoreBaseQuery<T>): Promise<number> => {
+    const fetchCountFunc = httpsCallable(functions, 'getQueryCount')
+    const { data } = await fetchCountFunc(baseQuery)
+    return (data as { count: number }).count
+  }
+
+const getFetchItem =
+  (db: Firestore) =>
+  async <T extends AnyObject>(path: string): Promise<DBItem<T> | null> => {
+    const docRef = doc(db, path)
+    const docSnap = await getDoc(docRef)
+    const data = docSnap.data()
+    return data ? ({ ...data, id: docSnap.id } as DBItem<T>) : null
+  }
+
+const getFetchItems =
+  (db: Firestore) =>
+  async <T extends AnyObject>(baseQuery: FirestoreBaseQuery<T>): Promise<DBItem<T>[]> => {
+    const q = toFirestoreQuery<T>(db, baseQuery)
+    const snapshot = await getDocs(q)
+    return snapshot.docs.map(doc => ({ ...doc.data(), id: doc.id }) as DBItem<T>)
+  }
+
+const getCreateItem =
+  (db: Firestore) =>
+  async (path: string, item: AnyObject): Promise<string> => {
+    const docRef = doc(db, path)
+    const data = addMetadata(useAuth.getState().user, item, true)
+    await setDoc(docRef, data, { merge: true })
+    return docRef.id
+  }
+
+const getDeleteItem =
+  (db: Firestore) =>
+  async (path: string): Promise<void> => {
+    const docRef = doc(db, path)
+    await deleteDoc(docRef)
+  }
+
+const getUpdateItem =
+  (db: Firestore) =>
+  async <T extends AnyObject>(path: string, item: Partial<T>): Promise<void> => {
+    const docRef = doc(db, path)
+    await setDoc(docRef, item, { merge: true })
+  }
+
+const getSubscribeToItem =
+  (db: Firestore) =>
+  <T extends AnyObject>(path: string, onData: OnItemData<T>, onError: OnError): Unsubscribe => {
+    const docRef = doc(db, path)
+    return onSnapshot(
+      docRef,
+      snapshot => {
+        const data = snapshot.data()
+        onData(data ? ({ ...data, id: snapshot.id } as DBItem<T>) : null)
+      },
+      error => onError(handleFirestoreError(error)),
+    )
+  }
+
+export const getFirebaseDatabaseAdapter = (
+  db: Firestore,
+  functions: Functions,
+): DatabaseAdapter<FirestoreCursor> => ({
+  fetchNextCursor: getFetchNextCursor(db),
+  fetchCount: getFetchCount(functions),
+  fetchItem: getFetchItem(db),
+  fetchItems: getFetchItems(db),
+  createItem: getCreateItem(db),
+  deleteItem: getDeleteItem(db),
+  updateItem: getUpdateItem(db),
+  subscribeToItem: getSubscribeToItem(db),
+  subscribeToQuery: getSubscribeToQuery(db),
+})

package/src/adapter/index.ts

@@ -0,0 +1,30 @@
+import { BackendAdapter, BaseAuthProvider } from '@chem-po/core'
+import { FirebaseStorageTypes } from '@react-native-firebase/storage'
+import { Auth, EmailPasswordLogin, User } from '../types/auth'
+import { Firestore, FirestoreCursor } from '../types/db'
+import { Functions } from '../types/functions'
+import { Storage } from '../types/storage'
+import { getFirebaseAuthAdapter } from './auth'
+import { getFirebaseDatabaseAdapter } from './db'
+import { getFirebaseStorageAdapter } from './storage'
+
+export type FirebaseAdapter<AuthProvider extends BaseAuthProvider> = BackendAdapter<
+  AuthProvider,
+  User,
+  EmailPasswordLogin,
+  FirestoreCursor,
+  Blob,
+  FirebaseStorageTypes.FullMetadata
+>
+
+export const getFirebaseAdapter = <AuthProvider extends BaseAuthProvider>(
+  auth: Auth,
+  db: Firestore,
+  storage: Storage,
+  functions: Functions,
+  twoFactorRequired: boolean,
+): FirebaseAdapter<AuthProvider> => ({
+  auth: getFirebaseAuthAdapter(auth, twoFactorRequired),
+  db: getFirebaseDatabaseAdapter(db, functions),
+  storage: getFirebaseStorageAdapter(storage),
+})

package/src/adapter/storage.ts

@@ -0,0 +1,58 @@
+import { StorageAdapter, UploadedFileValue } from '@chem-po/core'
+import {
+  deleteObject,
+  getDownloadURL,
+  getMetadata,
+  ref,
+  uploadBytesResumable,
+} from '@react-native-firebase/storage'
+import { Storage } from '../types/storage'
+
+export const getFirebaseStorageAdapter = (storage: Storage): StorageAdapter<Blob, any> => ({
+  delete: async path => {
+    const storageRef = ref(storage, path)
+    await deleteObject(storageRef)
+  },
+  fetchObject: async path => {
+    const storageRef = ref(storage, path)
+    const url = await getDownloadURL(storageRef)
+    const response = await fetch(url)
+    return await response.blob()
+  },
+  fetchMetadata: async path => {
+    const storageRef = ref(storage, path)
+    return await getMetadata(storageRef)
+  },
+  getObjectUrl: async path => {
+    const storageRef = ref(storage, path)
+    return await getDownloadURL(storageRef)
+  },
+  upload: async (path, data, onUploadProgress) => {
+    const storageRef = ref(storage, path)
+    // Convert dataUrl to Blob
+    const blob = await fetch(data.dataUrl).then(res => res.blob())
+    const uploadTask = uploadBytesResumable(storageRef, blob)
+    return new Promise<UploadedFileValue>((resolve, reject) => {
+      uploadTask.on(
+        'state_changed',
+        snapshot => {
+          const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100
+          onUploadProgress({
+            loaded: snapshot.bytesTransferred,
+            total: snapshot.totalBytes,
+            percent: progress,
+          })
+        },
+        error => reject(error),
+        () => {
+          const fileValue: UploadedFileValue = {
+            filename: data.filename,
+            type: data.type,
+            storagePath: path,
+          }
+          resolve(fileValue)
+        },
+      )
+    })
+  },
+})