Skip to content

firebaseInstance.md

Latest commit

 

History

History
729 lines (541 loc) · 20.9 KB

firebaseInstance.md

File metadata and controls

729 lines (541 loc) · 20.9 KB

Table of Contents

createFirebaseInstance

Create an extended firebase instance that has methods attached which dispatch redux actions.

Parameters

  • firebase object Firebase instance which to extend
  • configs object Configuration object
  • dispatch Function Action dispatch function

Returns object Extended Firebase instance

set

import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { firebaseConnect } from 'react-redux-firebase'
function Example({ firebase: { set } }) {
  return (
    <button onClick={() => set('some/path', { here: 'is a value' })}>
    Set To Firebase
    </button>
  )
}
export default firebaseConnect()(Example)**

Sets data to Firebase.

Parameters

Returns Promise Containing reference snapshot

setWithMeta

Sets data to Firebase along with meta data. Currently, this includes createdAt and createdBy. Warning using this function may have unintented consequences (setting createdAt even if data already exists).

Parameters

Returns Promise Containing reference snapshot

push

Pushes data to Firebase.

Parameters

Examples

Basic

import React from 'react'
import PropTypes from 'prop-types'
import { firebaseConnect } from 'react-redux-firebase'

function Example({ firebase: { push } }) {
  return (
    <button onClick={() => push('some/path', true)}>Push To Firebase</button>
  )
}
export default firebaseConnect()(Example)

Returns Promise Containing reference snapshot

pushWithMeta

Pushes data to Firebase along with meta data. Currently, this includes createdAt and createdBy.

Parameters

Returns Promise Containing reference snapshot

update

Updates data on Firebase and sends new data. More info available in the docs.

Parameters

Examples

Basic

import React from 'react'
import PropTypes from 'prop-types'
import { firebaseConnect } from 'react-redux-firebase'

function Example({ firebase: { update } }) {
  function updateData() {
    update('some/path', { here: 'is a value' })
  }
}
  return (
    <button onClick={updateData}>
      Update To Firebase
    </button>
  )
}
export default firebaseConnect()(Example)

Returns Promise Containing reference snapshot

updateWithMeta

Updates data on Firebase along with meta. Warning using this function may have unintented consequences (setting createdAt even if data already exists).

Parameters

Returns Promise Containing reference snapshot

remove

Removes data from Firebase at a given path. NOTE A seperate action is not dispatched unless dispatchRemoveAction: true is provided to config on store creation. That means that a listener must be attached in order for state to be updated when calling remove.

Parameters

  • path string Path to location on Firebase which to remove
  • onComplete Function Function to run on complete (not required)
  • options Function Options object

Examples

Basic

import React from 'react'
import PropTypes from 'prop-types'
import { firebaseConnect } from 'react-redux-firebase'

function Example({ firebase: { remove } }) {
  return (
    <button onClick={() => remove('some/path')}>Remove From Firebase</button>
  )
}
export default firebaseConnect()(Example)

Returns Promise Containing reference snapshot

uniqueSet

Sets data to Firebase only if the path does not already exist, otherwise it rejects. Internally uses a Firebase transaction to prevent a race condition between seperate clients calling uniqueSet.

Parameters

Examples

Basic

import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { firebaseConnect } from 'react-redux-firebase'

function Example({ firebase: { uniqueSet } }) {
  return (
    <button onClick={() => uniqueSet('some/unique/path', true)}>
      Unique Set To Firebase
    </button>
  )
}
export default firebaseConnect()(Example)

Returns Promise Containing reference snapshot

uploadFile

Upload a file to Firebase Storage with the option to store its metadata in Firebase Database. More info available in the docs.

Parameters

  • path string Path to location on Firebase which to set
  • file File File object to upload (usually first element from array output of select-file or a drag/drop onDrop)
  • dbPath string Database path to place uploaded file metadata
  • options object Options
    • options.name string Name of the file
    • options.metdata object Metadata for the file (passed as second argument to storage.put calls)

Returns Promise Containing the File object

uploadFiles

Upload multiple files to Firebase Storage with the option to store their metadata in Firebase Database.

Parameters

  • path string Path to location on Firebase which to set
  • files Array Array of File objects to upload (usually from a select-file or a drag/drop onDrop)
  • dbPath string Database path to place uploaded files metadata.
  • options object Options
    • options.name string Name of the file

Returns Promise Containing an array of File objects

deleteFile

Delete a file from Firebase Storage with the option to remove its metadata in Firebase Database.

Parameters

  • path string Path to location on Firebase which to set
  • dbPath string Database path to place uploaded file metadata

Returns Promise Containing the File object

watchEvent

Watch event. Note: this method is used internally so examples have not yet been created, and it may not work as expected.

Parameters

  • type string Type of watch event
  • path string Path to location on Firebase which to set listener
  • storeAs string Name of listener results within redux store
  • options object Event options object (optional, default {})
    • options.queryParams Array List of parameters for the query
    • options.queryId string id of the query

Returns (Promise | void) Results of calling watch event

unWatchEvent

Unset a listener watch event. Note: this method is used internally so examples have not yet been created, and it may not work as expected.

Parameters

  • type string Type of watch event
  • path string Path to location on Firebase which to unset listener
  • queryId string Id of the listener
  • options object Event options object (optional, default {})

Returns void

promiseEvents

Similar to the firebaseConnect Higher Order Component but presented as a function (not a React Component). Useful for populating your redux state without React, e.g., for server side rendering. Only once type should be used as other query types such as value do not return a Promise.

Parameters

  • watchArray Array Array of objects or strings for paths to sync from Firebase. Can also be a function that returns the array. The function is passed the props object specified as the next parameter.
  • options object The options object that you would like to pass to your watchArray generating function.

Returns Promise Resolves with an array of watchEvent results

login

Logs user into Firebase. For examples, visit the auth section of the docs or the auth recipes section.

Parameters

  • credentials object Credentials for authenticating
    • credentials.provider string External provider (google | facebook | twitter)
    • credentials.type string Type of external authentication (popup | redirect) (only used with provider)
    • credentials.email string Credentials for authenticating
    • credentials.password string Credentials for authenticating (only used with email)

Returns Promise Containing user's auth data

reauthenticate

Reauthenticate user into Firebase. For examples, visit the auth section of the docs or the auth recipes section.

Parameters

  • credentials object Credentials for authenticating
    • credentials.provider string External provider (google | facebook | twitter)
    • credentials.type string Type of external authentication (popup | redirect) (only used with provider)

Returns Promise Containing user's auth data

handleRedirectResult

Logs user into Firebase using external. For examples, visit the auth section

Parameters

  • authData object Auth data from Firebase's getRedirectResult

Returns Promise Containing user's profile

logout

Logs user out of Firebase and empties firebase state from redux store

Returns Promise Resolves after logout is complete

createUser

Creates a new user in Firebase authentication. If userProfile config option is set, user profiles will be set to this location.

Parameters

  • credentials object Credentials for authenticating
    • credentials.email string Credentials for authenticating
    • credentials.password string Credentials for authenticating (only used with email)
  • profile object Data to include within new user profile

Returns Promise Containing user's auth data

resetPassword

Sends password reset email

Parameters

  • email string Email to send recovery email to

Returns Promise Resolves after password reset email is sent

confirmPasswordReset

Confirm that a user's password has been reset

Parameters

  • code string Password reset code to verify
  • password string New Password to confirm reset to

Returns Promise Resolves after password reset is confirmed

verifyPasswordResetCode

Verify that a password reset code from a password reset email is valid

Parameters

  • code string Password reset code to verify

Returns Promise Containing user auth info

applyActionCode

Apply verification code

Parameters

  • code string Verification code

Returns Promise Resolves on success

updateProfile

Update user profile on Firebase Real Time Database or Firestore (if useFirestoreForProfile: true config included). Real Time Database update uses update method internally while updating profile on Firestore uses set.

Parameters

  • profileUpdate object Profile data to place in new profile
  • options object Options object (used to change how profile update occurs)
    • options.useSet boolean Use set with merge instead of update. Setting to false uses update (can cause issue of profile document does not exist). Note: Only used when updating profile on Firestore (optional, default true)
    • options.merge boolean Whether or not to use merge when setting profile. Note: Only used when updating profile on Firestore (optional, default true)

Returns Promise Returns after updating profile within database

updateAuth

Update Auth profile object

Parameters

  • authUpdate object Update to be auth object
  • updateInProfile boolean Update in profile

Returns Promise Returns after updating auth profile

updateEmail

Update user's email

Parameters

  • newEmail string Update to be auth object
  • updateInProfile boolean Update in profile

Returns Promise Resolves after email is updated in user's auth

reloadAuth

Reload user's auth object. Must be authenticated.

Returns Promise Resolves after reloading firebase auth

linkWithCredential

Links the user account with the given credentials.

Parameters

  • credential firebase.auth.AuthCredential The auth credential

Returns Promise Resolves after linking auth with a credential

actionCreators

Parameters

  • credential firebase.auth.ConfirmationResult The auth credential

Returns Promise

actionCreators

ref

Firebase ref function

Returns firebase.database.Reference

database

Firebase database service instance including all Firebase storage methods

Returns firebase.database.Database Firebase database service

storage

Firebase storage service instance including all Firebase storage methods

Returns firebase.database.Storage Firebase storage service

auth

Firebase auth service instance including all Firebase auth methods

Returns firebase.database.Auth

getFirebase

Get internal Firebase instance with methods which are wrapped with action dispatches. Useful for integrations into external libraries such as redux-thunk and redux-observable.

Examples

redux-thunk integration

import { applyMiddleware, compose, createStore } from 'redux'
import thunk from 'redux-thunk'
import { getFirebase } from 'react-redux-firebase'
import makeRootReducer from './reducers'

const fbConfig = {} // your firebase config

const store = createStore(
  makeRootReducer(),
  initialState,
  compose(
    applyMiddleware([
      // Pass getFirebase function as extra argument
      thunk.withExtraArgument(getFirebase)
    ])
  )
)
// then later
export function addTodo(newTodo) {
  return (dispatch, getState, getFirebase) => {
    const firebase = getFirebase()
    firebase.push('todos', newTodo).then(() => {
      dispatch({ type: 'SOME_ACTION' })
    })
  }
}

Returns object Firebase instance with methods which dispatch redux actions