@chem-po/firebase-native 0.0.16 → 0.0.18

package/src/db/utils.ts

@@ -0,0 +1,142 @@
+import { AnyObject, BaseQuery, isInequalityOperator, stringTransforms } from '@chem-po/core'
+import {
+  collection,
+  collectionGroup,
+  limit as limitTo,
+  orderBy,
+  query,
+  startAfter,
+  where,
+} from '@react-native-firebase/firestore'
+import { Firestore, FirestoreBaseQuery, FirestoreCursor, FirestoreQuery } from '../types/db'
+
+export const toFirestoreQuery = <T extends AnyObject>(
+  db: Firestore,
+  baseQuery: FirestoreBaseQuery<T>,
+): FirestoreQuery<T> => {
+  const {
+    collection: collectionPath,
+    filters,
+    limit,
+    search,
+    sort,
+    isCollectionGroup,
+    cursor: startAfterDoc,
+  } = baseQuery
+
+  let q: FirestoreQuery<T> = (
+    isCollectionGroup ? collectionGroup(db, collectionPath) : collection(db, collectionPath)
+  ) as FirestoreQuery<T>
+
+  if (filters) {
+    filters.forEach(({ key, operator, value }) => {
+      q = query(q, where(key, operator, value))
+    })
+  }
+
+  if (sort) {
+    q = query(q, orderBy(sort.key, sort.direction))
+  }
+
+  if (startAfterDoc) {
+    q = query(q, startAfter(startAfterDoc))
+  }
+
+  if (search?.paths?.length && search.query) {
+    const trimmed = (search.query || '').trim()
+    if (trimmed) {
+      q = query(
+        q,
+        where(search.paths[0].prop, '>=', trimmed),
+        where(search.paths[0].prop, '<=', `${trimmed}\uf8ff`),
+      )
+    }
+  }
+
+  return limit ? query(q, limitTo(limit)) : q
+}
+
+export const toCursorQuery = <T extends AnyObject>(
+  db: Firestore,
+  baseQuery: FirestoreBaseQuery<T>,
+  cursor: FirestoreCursor | null,
+): FirestoreQuery<T> => {
+  const { collection: collectionPath, filters, sort, isCollectionGroup, search, limit } = baseQuery
+
+  let q: FirestoreQuery<T> = (
+    isCollectionGroup ? collectionGroup(db, collectionPath) : collection(db, collectionPath)
+  ) as FirestoreQuery<T>
+
+  if (filters) {
+    filters.forEach(({ key, operator, value }) => {
+      q = query(q, where(key, operator, value))
+    })
+  }
+
+  if (sort) {
+    q = query(q, orderBy(sort.key, sort.direction))
+  }
+
+  if (search?.paths?.length && search.query) {
+    const trimmed = (search.query || '').trim()
+    if (trimmed) {
+      q = query(
+        q,
+        where(search.paths[0].prop, '>=', trimmed),
+        where(search.paths[0].prop, '<=', `${trimmed}\uf8ff`),
+      )
+    }
+  }
+
+  if (cursor) {
+    q = query(q, startAfter(cursor))
+  }
+
+  return limit ? query(q, limitTo(limit), limitTo(1)) : q
+}
+
+export const toFirestoreQueries = <T extends AnyObject>(
+  db: Firestore,
+  baseQuery: BaseQuery<T>,
+  cursors: Array<FirestoreCursor | null> | null,
+): Array<FirestoreQuery<T>> => {
+  const { collection: collectionPath, filters, limit, search, sort, isCollectionGroup } = baseQuery
+
+  let q: FirestoreQuery<T> = (
+    isCollectionGroup ? collectionGroup(db, collectionPath) : collection(db, collectionPath)
+  ) as FirestoreQuery<T>
+  if (filters) {
+    let filterSortKey: string | null = null
+    filters.forEach(({ key, operator, value }) => {
+      q = query(q, where(key, operator, value))
+      if (!filterSortKey && isInequalityOperator(operator) && (!sort || sort.key !== key)) {
+        filterSortKey = key
+        q = query(q, orderBy(key, 'asc'))
+      }
+    })
+  }
+
+  if (sort) {
+    q = query(q, orderBy(sort.key, sort.direction))
+  }
+
+  if (cursors?.length) {
+    q = query(q, startAfter(cursors[cursors.length - 1]))
+  }
+
+  const queries =
+    search?.paths?.length && search.query
+      ? search.paths.map(path => {
+          let trimmed = (search.query ?? '').trim()
+          if (!trimmed) return q
+          if (path.transform) trimmed = stringTransforms[path.transform](trimmed)
+          return query(
+            q,
+            where(path.prop, '>=', trimmed),
+            where(path.prop, '<=', `${trimmed}\uf8ff`),
+          )
+        })
+      : [q]
+
+  return queries.map(q0 => (limit ? query(q0, limitTo(limit)) : q0))
+}

package/src/hooks/backend.ts

@@ -0,0 +1,4 @@
+import { useBackendBase } from '@chem-po/react'
+// import { FirebaseBackendAdapter } from '../types/adapter'
+
+export const useBackend = () => useBackendBase()

package/src/hooks/index.ts

@@ -0,0 +1 @@
+export * from './backend'

package/src/hooks/useAuthenticatorVerify.ts

@@ -0,0 +1,45 @@
+import { useAuth } from '@chem-po/react'
+import { FirebaseAuthTypes } from '@react-native-firebase/auth'
+import { useCallback, useState } from 'react'
+import { useBackend } from './backend'
+
+export const useAuthenticatorVerify = () => {
+  const [code, setCode] = useState('')
+  const [verifying, setVerifying] = useState(false)
+  const [error, setError] = useState('')
+  const twoFactorVerification = useAuth(s => s.multiFactorVerification)
+  const { auth } = useBackend()
+  // const { showSuccess, showError, showInfo } = useToast()
+
+  const handleVerify = useCallback(async () => {
+    const verify = auth.verifyMultiFactor
+    if (!verify) {
+      setError('Error - Two factor verification is not supported')
+      return
+    }
+    if (!code) return
+    if (!twoFactorVerification) {
+      setError('Error - No session found')
+      return
+    }
+    const resolver = twoFactorVerification.resolver as FirebaseAuthTypes.MultiFactorResolver
+    if (!resolver) {
+      setError('Error - No session found')
+      return
+    }
+    setVerifying(true)
+    try {
+      await verify(twoFactorVerification, code)
+    } catch (error) {
+      setError(error instanceof Error ? error.message : 'An unknown error occurred')
+    }
+  }, [code, auth, twoFactorVerification])
+
+  return {
+    code,
+    setCode,
+    verifying,
+    error,
+    handleVerify,
+  }
+}

package/src/hooks/usePhoneVerify.ts

@@ -0,0 +1,76 @@
+import { PhoneEnrollmentFactor } from '@chem-po/core'
+import { useAuth, useToast } from '@chem-po/react'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import { useBackend } from './backend'
+
+export const usePhoneVerify = (factor: PhoneEnrollmentFactor, automaticallySendSmsCode: boolean) => {
+  const [code, setCode] = useState('')
+  const [verifying, setVerifying] = useState(false)
+  const [error, setError] = useState('')
+
+  const { auth } = useBackend()
+  const {multiFactorVerification: twoFactorVerification, enrollmentFactors} = useAuth()
+
+  // const [{ automaticallySendSmsCode }, setCookie] = useCookies(['automaticallySendSmsCode'])
+
+  const initSendCode = useRef(!!automaticallySendSmsCode)
+
+  const { showSuccess, showError, showInfo } = useToast()
+
+  const sendCode = useCallback(async () => {
+    if (!enrollmentFactors) {
+      showError('Error - No session found')
+      return
+    }
+    await auth.sendMultiFactorCode(factor, enrollmentFactors.multiFactorResolver)
+  }, [auth, factor, twoFactorVerification, showError])
+
+  const initSendCodeFunc = useRef(sendCode)
+  useEffect(() => {
+    if (initSendCode.current) {
+      initSendCodeFunc.current()
+    }
+  }, [])
+
+  const handleVerify = useCallback(() => {
+    setVerifying(true)
+    setError('')
+    if (!twoFactorVerification) {
+      showError('Error - No session found')
+      return
+    }
+    const resolver = twoFactorVerification.resolver
+    if (!resolver) {
+      showError('Error - No resolver found')
+      return
+    }
+    const verificationId = twoFactorVerification.verificationId
+    if (!verificationId) {
+      showError('Error - No verification ID found')
+      return
+    }
+    const verify = auth.verifyMultiFactor
+    if (!verify) {
+      showError('Error - Two factor verification is not supported')
+      return
+    }
+    verify(twoFactorVerification, code)
+      .then(() => {
+        setVerifying(false)
+        setCode('')
+        showSuccess('Verification successful')
+      })
+      .catch(e => {
+        setVerifying(false)
+        setError(e.message || 'An error occurred')
+      })
+  }, [code, auth, showSuccess, showError])
+
+  return {
+    code,
+    setCode,
+    verifying,
+    error,
+    handleVerify,
+  }
+}

package/src/icons/Google.tsx

@@ -0,0 +1,24 @@
+import * as React from 'react'
+import Svg, { Path, SvgProps } from 'react-native-svg'
+
+const SvgGoogle = (props: SvgProps) => (
+  <Svg width={24} height={24} viewBox="0 0 24 24" {...props}>
+    <Path
+      fill="#4285F4"
+      d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
+    />
+    <Path
+      fill="#34A853"
+      d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
+    />
+    <Path
+      fill="#FBBC05"
+      d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
+    />
+    <Path
+      fill="#EA4335"
+      d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
+    />
+  </Svg>
+)
+export default SvgGoogle

package/src/index.ts

@@ -0,0 +1,9 @@
+export * from './adapter'
+export * from './auth'
+export * from './components'
+export * from './contexts'
+export * from './db'
+export * from './hooks'
+export * from './storage'
+export * from './types'
+export * from './utils/validation'

package/src/storage/index.ts

@@ -0,0 +1 @@
+export * from './utils'

package/src/storage/utils.ts

@@ -0,0 +1,29 @@
+import { FileValue, LocalFileValue, OnUploadProgress } from '@chem-po/core'
+import { FirebaseStorageTypes, ref, uploadString } from '@react-native-firebase/storage'
+
+export const uploadFileValue = async (
+  storage: FirebaseStorageTypes.Module,
+  path: string,
+  file: LocalFileValue | FileValue | null | undefined,
+  onUploadProgress: OnUploadProgress,
+): Promise<FileValue | null> => {
+  if (!file) return null
+  const { dataUrl, type, filename } = file as LocalFileValue
+  if (!dataUrl) return file
+
+  const storageRef = ref(storage, path)
+  const uploadTask = uploadString(storageRef, dataUrl, 'data_url')
+
+  uploadTask.on('state_changed', snapshot => {
+    const percent = snapshot.bytesTransferred / snapshot.totalBytes
+    onUploadProgress({ total: snapshot.totalBytes, loaded: snapshot.bytesTransferred, percent })
+  })
+
+  return new Promise((resolve, reject) => {
+    uploadTask
+      .then(() => {
+        resolve({ storagePath: path, type, filename })
+      })
+      .catch(reject)
+  })
+}

package/src/types/adapter.ts

@@ -0,0 +1,13 @@
+import { BackendAdapterInterface, BaseAuthProvider } from '@chem-po/core'
+import { FirebaseStorageTypes } from '@react-native-firebase/storage'
+import { EmailPasswordLogin, User } from './auth'
+import { FirestoreCursor } from './db'
+
+export type FirebaseBackendAdapter<AuthProvider extends BaseAuthProvider> = BackendAdapterInterface<
+  AuthProvider,
+  User,
+  EmailPasswordLogin,
+  FirestoreCursor,
+  Blob,
+  FirebaseStorageTypes.FullMetadata
+>

package/src/types/auth.ts

@@ -0,0 +1,13 @@
+import { BaseUserRole } from '@chem-po/core'
+import { getAuth } from '@react-native-firebase/auth'
+
+export type Auth = ReturnType<typeof getAuth>
+export interface User {
+  uid: string
+  role: BaseUserRole
+}
+
+export interface EmailPasswordLogin {
+  email: string
+  password: string
+}

package/src/types/db.ts

@@ -0,0 +1,10 @@
+// import { AnyObject } from '@chem-po/core'
+import { AnyObject, BaseQuery, OnItemsData } from '@chem-po/core'
+import { FirebaseFirestoreTypes } from '@react-native-firebase/firestore'
+
+export type Firestore = FirebaseFirestoreTypes.Module
+export type FirestoreCursor = FirebaseFirestoreTypes.QueryDocumentSnapshot
+export type FirestoreBaseQuery<T extends AnyObject> = BaseQuery<T, FirestoreCursor>
+export type FirestoreQuery<T extends AnyObject> = FirebaseFirestoreTypes.Query<T>
+// export type FirestoreQuery<T extends AnyObject> = BaseQuery<T, FirestoreCursor>
+export type FirestoreOnItemsData<T extends AnyObject> = OnItemsData<T, FirestoreCursor>

package/src/types/functions.ts

@@ -0,0 +1,3 @@
+import { getFunctions } from '@react-native-firebase/functions'
+
+export type Functions = ReturnType<typeof getFunctions>

package/src/types/index.ts

@@ -0,0 +1,26 @@
+import { ReactNativeFirebase } from '@react-native-firebase/app'
+import { FirebaseAuthTypes } from '@react-native-firebase/auth'
+import { FirebaseFirestoreTypes } from '@react-native-firebase/firestore'
+import { FirebaseStorageTypes } from '@react-native-firebase/storage'
+
+export type FirebaseAuth = FirebaseAuthTypes.Module
+export type FirebaseFirestore = FirebaseFirestoreTypes.Module
+export type FirebaseStorage = FirebaseStorageTypes.Module
+
+export interface FirebaseConfig {
+  apiKey: string
+  authDomain: string
+  projectId: string
+  storageBucket: string
+  messagingSenderId: string
+  appId: string
+  measurementId?: string
+}
+
+export interface FirebaseContextValue {
+  loading: boolean
+  app: ReactNativeFirebase.FirebaseApp | null
+  auth: FirebaseAuth
+  firestore: FirebaseFirestore
+  storage: FirebaseStorage
+}

package/src/types/storage.ts

@@ -0,0 +1,3 @@
+import { getStorage } from '@react-native-firebase/storage'
+
+export type Storage = ReturnType<typeof getStorage>

package/src/utils/validation.ts

@@ -0,0 +1,85 @@
+import { BaseAuthProvider, GoogleAuthProvider } from '@chem-po/core'
+
+interface ValidationResult {
+  isValid: boolean
+  errors: string[]
+  warnings: string[]
+}
+
+/**
+ * Validates Firebase authentication configuration to help identify common setup issues
+ */
+export const validateAuthConfiguration = (providers: BaseAuthProvider[]): ValidationResult => {
+  const errors: string[] = []
+  const warnings: string[] = []
+
+  // Check for Google provider configuration
+  const googleProvider = providers.find(p => p.name === 'google') as GoogleAuthProvider | undefined
+
+  if (googleProvider) {
+    if (!googleProvider.webClientId) {
+      errors.push(
+        'Google provider is missing webClientId. ' +
+          'Get this from Firebase Console > Authentication > Sign-in method > Google > Web SDK configuration',
+      )
+    } else if (!googleProvider.webClientId.includes('.apps.googleusercontent.com')) {
+      warnings.push(
+        'Google webClientId format looks incorrect. Expected format: "xxx.apps.googleusercontent.com"',
+      )
+    }
+  }
+
+  // Check environment
+  if (typeof process === 'undefined') {
+    warnings.push('Process environment is not available - some features may not work as expected')
+  }
+
+  // Check for Firebase configuration files (platform-specific warnings)
+  const isExpo =
+    typeof process !== 'undefined' && process.env?.EXPO_PUBLIC_ENVIRONMENT !== undefined
+  if (!isExpo) {
+    warnings.push(
+      'Ensure Firebase configuration files are present:\n' +
+        '- iOS: GoogleService-Info.plist in ios/ directory\n' +
+        '- Android: google-services.json in android/app/ directory',
+    )
+  }
+
+  return {
+    isValid: errors.length === 0,
+    errors,
+    warnings,
+  }
+}
+
+/**
+ * Logs validation results with appropriate console methods
+ */
+export const logValidationResults = (
+  result: ValidationResult,
+  packageName = '@chem-po/firebase-native',
+) => {
+  if (result.errors.length > 0) {
+    console.error(`[${packageName}] Configuration errors found:`)
+    result.errors.forEach(error => console.error(`  ❌ ${error}`))
+  }
+
+  if (result.warnings.length > 0) {
+    console.warn(`[${packageName}] Configuration warnings:`)
+    result.warnings.forEach(warning => console.warn(`  ⚠️  ${warning}`))
+  }
+
+  if (result.isValid && result.warnings.length === 0) {
+    console.log(`[${packageName}] ✅ Configuration validation passed`)
+  }
+}
+
+/**
+ * Validates and logs Firebase auth configuration
+ * Call this during development to identify setup issues early
+ */
+export const validateAndLogAuthConfig = (providers: BaseAuthProvider[]) => {
+  const result = validateAuthConfiguration(providers)
+  logValidationResults(result)
+  return result
+}