+ )
+}
export default enhance(Post)
```
diff --git a/docs/api/firebaseInstance.md b/docs/api/firebaseInstance.md
index de2f29718..aedd5447d 100644
--- a/docs/api/firebaseInstance.md
+++ b/docs/api/firebaseInstance.md
@@ -1,498 +1,3 @@
### Table of Contents
-
-- [set](#set)
-- [setWithMeta](#setwithmeta)
-- [push](#push)
-- [pushWithMeta](#pushwithmeta)
-- [update](#update)
-- [updateWithMeta](#updatewithmeta)
-- [remove](#remove)
-- [uniqueSet](#uniqueset)
-- [uploadFile](#uploadfile)
-- [uploadFiles](#uploadfiles)
-- [deleteFile](#deletefile)
-- [watchEvent](#watchevent)
-- [unWatchEvent](#unwatchevent)
-- [promiseEvents](#promiseevents)
-- [login](#login)
-- [handleRedirectResult](#handleredirectresult)
-- [logout](#logout)
-- [createUser](#createuser)
-- [resetPassword](#resetpassword)
-- [confirmPasswordReset](#confirmpasswordreset)
-- [verifyPasswordResetCode](#verifypasswordresetcode)
-- [updateProfile](#updateprofile)
-- [updateAuth](#updateauth)
-- [updateEmail](#updateemail)
-- [reloadAuth](#reloadauth)
-- [linkWithCredential](#linkwithcredential)
-- [signInWithPhoneNumber](#signinwithphonenumber)
-- [initializeAuth](#initializeauth)
-- [ref](#ref)
-- [database](#database)
-- [storage](#storage)
-- [auth](#auth)
-
-## set
-
-Sets data to Firebase.
-
-**Parameters**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to write to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { firebaseConnect } from 'react-redux-firebase'
-const Example = ({ firebase: { set } }) => (
-
-)
-export default firebaseConnect()(Example)
-```
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to write to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing reference snapshot
-
-## push
-
-Pushes data to Firebase.
-
-**Parameters**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to push
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to push to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { firebaseConnect } from 'react-redux-firebase'
-const Example = ({ firebase: { push } }) => (
-
-)
-export default firebaseConnect()(Example)
-```
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing reference snapshot
-
-## pushWithMeta
-
-Pushes data to Firebase along with meta data. Currently,
-this includes createdAt and createdBy.
-
-**Parameters**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to write to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing reference snapshot
-
-## update
-
-Updates data on Firebase and sends new data.
-
-**Parameters**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to update
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to update to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { firebaseConnect } from 'react-redux-firebase'
-const Example = ({ firebase: { update } }) => (
-
-)
-export default firebaseConnect()(Example)
-```
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to update
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to update to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to remove
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-- `options`
-
-**Examples**
-
-_Basic_
-
-```javascript
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { firebaseConnect } from 'react-redux-firebase'
-const Example = ({ firebase: { remove } }) => (
-
-)
-export default firebaseConnect()(Example)
-```
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set
-- `value` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [Number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))** Value to write to Firebase
-- `onComplete` **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Function to run on complete (`not required`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { firebaseConnect } from 'react-redux-firebase'
-const Example = ({ firebase: { uniqueSet } }) => (
-
-)
-export default firebaseConnect()(Example)
-```
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing reference snapshot
-
-## uploadFile
-
-Upload a file to Firebase Storage with the option to store
-its metadata in Firebase Database
-
-**Parameters**
-
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Database path to place uploaded file metadata
-- `options` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Options
- - `options.name` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of the file
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set
-- `files` **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)** Array of File objects to upload (usually from
- a select-file or a drag/drop `onDrop`)
-- `dbPath` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Database path to place uploaded files metadata.
-- `options` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Options
- - `options.name` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of the file
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set
-- `dbPath` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Database path to place uploaded file metadata
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Type of watch event
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to set listener
-- `storeAs` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of listener results within redux store
-- `options` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Event options object (optional, default `{}`)
- - `options.queryParams` **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)** List of parameters for the query
- - `options.queryId` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** id of the query
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## 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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Type of watch event
-- `path` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path to location on Firebase which to unset listener
-- `queryId` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Id of the listener
-- `options` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Event options object (optional, default `{}`)
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## 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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** The options object that you would like to pass to
- your watchArray generating function.
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## login
-
-Logs user into Firebase. For examples, visit the
-[auth section](/docs/auth.md)
-
-**Parameters**
-
-- `credentials` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Credentials for authenticating
- - `credentials.provider` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** External provider (google |
- facebook | twitter)
- - `credentials.type` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Type of external authentication
- (popup | redirect) (only used with provider)
- - `credentials.email` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Credentials for authenticating
- - `credentials.password` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Credentials for authenticating (only used with email)
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing user's auth data
-
-## handleRedirectResult
-
-Logs user into Firebase using external. For examples, visit the
-[auth section](/docs/recipes/auth.md)
-
-**Parameters**
-
-- `authData` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Auth data from Firebase's getRedirectResult
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing user's profile
-
-## logout
-
-Logs user out of Firebase and empties firebase state from
-redux store
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## 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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Credentials for authenticating
- - `credentials.email` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Credentials for authenticating
- - `credentials.password` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Credentials for authenticating (only used with email)
-- `profile` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Data to include within new user profile
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing user's auth data
-
-## resetPassword
-
-Sends password reset email
-
-**Parameters**
-
-- `credentials` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Credentials for authenticating
- - `credentials.email` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Credentials for authenticating
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## confirmPasswordReset
-
-Confirm that a user's password has been reset
-
-**Parameters**
-
-- `code` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Password reset code to verify
-- `password` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** New Password to confirm reset to
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## verifyPasswordResetCode
-
-Verify that a password reset code from a password reset
-email is valid
-
-**Parameters**
-
-- `code` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Password reset code to verify
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing user auth info
-
-## updateProfile
-
-Update user profile on Firebase Real Time Database or
-Firestore (if `useFirestoreForProfile: true` config passed to
-reactReduxFirebase). Real Time Database update uses `update` method
-internally while updating profile on Firestore uses `set` with
-
-**Parameters**
-
-- `profileUpdate` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Profile data to place in new profile
-- `options` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Options object (used to change how profile
- update occurs)
- - `options.useSet` **[Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/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](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Whether or not to use merge when
- setting profile. Note: Only used when updating profile on Firestore (optional, default `true`)
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## updateAuth
-
-Update Auth Object
-
-**Parameters**
-
-- `authUpdate` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Update to be auth object
-- `updateInProfile` **[Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Update in profile
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## updateEmail
-
-Update user's email
-
-**Parameters**
-
-- `newEmail` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Update to be auth object
-- `updateInProfile` **[Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Update in profile
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## reloadAuth
-
-Reload user's auth object. Must be authenticated.
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## linkWithCredential
-
-Links the user account with the given credentials.
-
-**Parameters**
-
-- `credential` **firebase.auth.AuthCredential** The auth credential
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## signInWithPhoneNumber
-
-Asynchronously signs in using a phone number. This method
-sends a code via SMS to the given phone number, and returns a modified
-firebase.auth.ConfirmationResult. The `confirm` method
-authenticates and does profile handling.
-
-**Parameters**
-
-- `credential` **firebase.auth.ConfirmationResult** The auth credential
-
-Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**
-
-## initializeAuth
-
-Initialize auth to work with build in profile support
-
-## 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**
diff --git a/docs/api/firestoreConnect.md b/docs/api/firestoreConnect.md
index d128e3390..37f015c61 100644
--- a/docs/api/firestoreConnect.md
+++ b/docs/api/firestoreConnect.md
@@ -7,7 +7,7 @@
## createFirestoreConnect
-Function that creates a Higher Order Component that
+Function that creates a Higher Order Component which
automatically listens/unListens to provided firebase paths using
React's Lifecycle hooks.
**WARNING!!** This is an advanced feature, and should only be used when
diff --git a/docs/api/helpers.md b/docs/api/helpers.md
index 1e8839ebc..1b637d6b8 100644
--- a/docs/api/helpers.md
+++ b/docs/api/helpers.md
@@ -82,7 +82,7 @@ Returns **Any** Data located at path within firebase.
## isLoaded
-Detect whether items are loaded yet or not
+Detect whether data from redux state is loaded yet or not
**Parameters**
@@ -97,7 +97,8 @@ import React from 'react'
import PropTypes from 'prop-types'
import { compose } from 'redux'
import { connect } from 'react-redux'
-import { firebaseConnect, isLoaded, isEmpty } from 'react-redux-firebase'
+import firebaseConnect from 'react-redux-firebase/lib/firebaseConnect'
+import { isLoaded, isEmpty } from 'react-redux-firebase/lib/utils'
const enhance = compose(
firebaseConnect(['todos']),
@@ -106,7 +107,7 @@ const enhance = compose(
}))
)
-const Todos = ({ todos }) => {
+function Todos({ todos }) {
// Message for if todos are loading
if(!isLoaded(todos)) {
return Loading...
diff --git a/docs/api/useFirebase.md b/docs/api/useFirebase.md
new file mode 100644
index 000000000..7575a2612
--- /dev/null
+++ b/docs/api/useFirebase.md
@@ -0,0 +1,57 @@
+
+
+### Table of Contents
+
+- [createUseFirebase](#createusefirebase)
+- [useFirebase](#usefirebase)
+
+## createUseFirebase
+
+Function that creates a react hook which provides `firebase` object.
+
+**WARNING!!** This is an advanced feature, and should only be used when
+needing to access a firebase instance created under a different store key.
+Firebase state (`state.firebase`)
+
+**Examples**
+
+_Basic_
+
+```javascript
+import { createUseFirebase } from 'react-redux-firebase'
+
+// create useFirebase
+const useFirebase = createUseFirebase()
+```
+
+Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** A hook fucntion that return firebase object.
+
+## useFirebase
+
+React hook that provides `firebase` object.
+Firebase is gathered from `store.firebase`, which is attached to store
+by the store enhancer (`reactReduxFirebase`) during setup.
+**NOTE**: This version of the Firebase library has extra methods, config,
+and functionality which give it it's capabilities such as dispatching
+actions.
+
+**Examples**
+
+_Basic_
+
+```javascript
+import { useFirebase } from 'react-redux-firebase'
+
+function AddData() {
+ const firebase = useFirebase()
+ return (
+
+
+
+ )
+}
+```
+
+Returns **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Firebase instance
diff --git a/docs/api/useFirebaseConnect.md b/docs/api/useFirebaseConnect.md
new file mode 100644
index 000000000..cd951eae6
--- /dev/null
+++ b/docs/api/useFirebaseConnect.md
@@ -0,0 +1,92 @@
+
+
+### Table of Contents
+
+- [createUseFirebaseConnect](#createusefirebaseconnect)
+- [useFirebaseConnect](#usefirebaseconnect)
+
+## createUseFirebaseConnect
+
+Function that creates a hook that
+automatically listens/unListens to provided firebase paths using
+React's useEffect hooks.
+**WARNING!!** This is an advanced feature, and should only be used when
+needing to access a firebase instance created under a different store key.
+
+**Examples**
+
+_Basic_
+
+```javascript
+// this.props.firebase set on App component as firebase object with helpers
+import { createUseFirebaseConnect } from 'react-redux-firebase'
+// create firebase connect that uses another redux store
+const useFirebaseConnect = createUseFirebaseConnect()
+```
+
+Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** HOC that accepts a watchArray and wraps a component
+
+## useFirebaseConnect
+
+Hook that automatically listens/unListens
+to provided firebase paths using React's useEffect hook.
+**Note** Only single path is allowed per one hook
+
+**Parameters**
+
+- `queriesConfig` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String))** Object or string for path to sync
+ from Firebase or null if hook doesn't need to sync.
+ Can also be a function that returns an object or a path string.
+
+**Examples**
+
+_Ordered Data_
+
+```javascript
+import { compose } from 'redux'
+import { connect } from 'react-redux'
+import { firebaseUseConnect } from 'react-redux-firebase'
+
+const enhance = compose(
+ connect((state) => ({
+ todos: state.firebase.ordered.todos
+ })
+)
+
+// use enhnace to pass todos list as props.todos
+const Todos = enhance(({ todos })) => {
+ useFirebaseConnect('todos') // sync /todos from firebase into redux
+ return (
+
+ {JSON.stringify(todos, null, 2)}
+
+ )
+}
+
+export default enhance(Todos)
+```
+
+_Data that depends on props_
+
+```javascript
+import { compose } from 'redux'
+import { connect } from 'react-redux'
+import { firebaseUseConnect, getVal } from 'react-redux-firebase'
+
+const enhance = compose(
+ connect((state, props) => ({
+ post: getVal(state.firebase.data, `posts/${props.postId}`),
+ })
+)
+
+const Post = ({ post, postId }) => {
+ useFirebaseConnect(`posts/${postId}`) // sync /posts/postId from firebase into redux
+ return (
+
+ {JSON.stringify(post, null, 2)}
+
+ )
+}
+
+export default enhance(Post)
+```
diff --git a/docs/api/useFirestore.md b/docs/api/useFirestore.md
new file mode 100644
index 000000000..dfcd6edfa
--- /dev/null
+++ b/docs/api/useFirestore.md
@@ -0,0 +1,72 @@
+
+
+### Table of Contents
+
+- [createUseFirestore](#createusefirestore)
+- [useFirestore](#usefirestore)
+
+## createUseFirestore
+
+Function that creates a hook that which provides
+`firestore` object.
+
+**WARNING!!** This is an advanced feature, and should only be used when
+needing to access a firebase instance created under a different store key.
+
+**Parameters**
+
+- `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
+ Firestore state (`state.firestore`) (optional, default `'store'`)
+
+**Examples**
+
+_Basic_
+
+```javascript
+import { createUseFirestore } from 'react-redux-firebase'
+
+// create useFirestore that uses another redux store
+const useFirestore = createUseFirestore()
+
+// use the useFirestore to wrap a component
+export default useFirestore(SomeComponent)
+```
+
+Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Higher Order Component which accepts an array of
+watchers config and wraps a React Component
+
+## useFirestore
+
+**Extends React.Component**
+
+React hook that return firestore object.
+Firestore instance is gathered from `store.firestore`, which is attached
+to store by the store enhancer (`reduxFirestore`) during setup of
+[`redux-firestore`](https://github.com/prescottprue/redux-firestore)
+
+**Examples**
+
+_Basic_
+
+```javascript
+import React from 'react'
+import { useFirestore } from 'react-redux-firebase'
+
+function AddData({ firebase: { add } }) {
+ const firestore = useFirestore()
+ const add = todo => {
+ firestore.collection('todos').add(todo)
+ }
+ return (
+
+
+
+ )
+}
+
+export default AddTodo
+```
+
+Returns **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Firestore instance
diff --git a/docs/api/useFirestoreConnect.md b/docs/api/useFirestoreConnect.md
new file mode 100644
index 000000000..f6d06fa2e
--- /dev/null
+++ b/docs/api/useFirestoreConnect.md
@@ -0,0 +1,95 @@
+
+
+### Table of Contents
+
+- [createUseFirestoreConnect](#createusefirestoreconnect)
+- [useFirestoreConnect](#usefirestoreconnect)
+
+## createUseFirestoreConnect
+
+React hook that automatically listens/unListens to provided
+firestore paths.
+**WARNING!!** This is an advanced feature, and should only be used when
+needing to access a firebase instance created under a different store key.
+Firestore state (state.firestore)
+
+**Examples**
+
+_Basic_
+
+```javascript
+// props.firestore set on App component as firebase object with helpers
+import { createUseFirestoreConnect } from 'react-redux-firebase'
+
+const firestoreConnect = createUseFirestoreConnect()
+
+export default useFirestoreConnect()
+```
+
+Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** React hook that accepts watch query
+
+## useFirestoreConnect
+
+React hook that automatically listens/unListens
+to provided Cloud Firestore paths. Make sure you have required/imported
+Cloud Firestore, including it's reducer, before attempting to use.
+**Note** Populate is not yet supported.
+**Note2** Only single path is allowed per one hook
+
+**Parameters**
+
+- `queriesConfig` **([Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object) \| [String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String))** An object or string for paths to sync
+ from firestore. Can also be a function that returns the object or string.
+
+**Examples**
+
+_Basic_
+
+```javascript
+import React from 'react'
+import { map } from 'lodash'
+import { connect } from 'react-redux'
+import { useFirestoreConnect } from 'react-redux-firebase'
+
+function TodosList({ todosList }) {
+ useFirestoreConnect('todos') // sync todos collection from Firestore into redux
+
+ return
{_.map(todosList, todo =>
{todo}
)}
+}
+
+// pass todos list from redux as props.todosList
+export default compose(
+ connect((state) => ({
+ todosList: state.firestore.data.todos
+ })
+)(TodosList)
+```
+
+_Object as query_
+
+```javascript
+import React, { useMemo } from 'react'
+import { get } from 'lodash'
+import { connect } from 'react-redux'
+import { useFirestoreConnect } from 'react-redux-firebase'
+
+function TodoItem({ todoId, todoData }) {
+ const query = useMemo( // Make sure that everytime component rerender will not create a new query object which cause unnecessary set/unset listener
+ () => ({
+ collection: 'todos',
+ doc: todoId
+ }),
+ [todoId] // useMemo's dependency
+ )
+ useFirestoreConnect(query) // sync todos collection from Firestore into redux
+
+ return
{JSON.stringify(todoData)}
+}
+
+// pass todo data from redux as props.todosList
+export default compose(
+ connect((state) => ({
+ todoData: get(state, ['firestore', 'data', 'todos', todoId])
+ })
+)(TodoItem)
+```
diff --git a/docs/recipes/auth.md b/docs/recipes/auth.md
index 0de4d7595..1fba06297 100644
--- a/docs/recipes/auth.md
+++ b/docs/recipes/auth.md
@@ -114,81 +114,6 @@ export default compose(
)(LoginPage)
```
-
-## Wait For Auth To Be Ready
-
-```js
-import firebase from 'firebase'
-import { compose, createStore, applyMiddleware } from 'redux'
-import { reactReduxFirebase } from 'react-redux-firebase'
-
-// Firebase config
-const fbConfig = {
- apiKey: '',
- authDomain: '',
- databaseURL: '',
- storageBucket: ''
-}
-// react-redux-firebase options
-const rrfConfig = {
- userProfile: 'users', // firebase root where user profiles are stored
- attachAuthIsReady: true, // attaches auth is ready promise to store
- firebaseStateName: 'firebase' // should match the reducer name ('firebase' is default)
-}
-
-const createStore = (initialState = {}) => {
- // Initialize Firebase instance
- firebase.initializeApp(fbConfig)
-
- // Add redux Firebase to compose
- const createStoreWithFirebase = createStore(
- rootReducer,
- initialState,
- compose(
- reactReduxFirebase(firebase, rrfConfig),
- applyMiddleware(thunk)
- )
- )
-
- // Create store with reducers and initial state
- const store = createStoreWithFirebase(rootReducer, initialState)
-
- // Listen for auth ready (promise available on store thanks to attachAuthIsReady: true config option)
- store.firebaseAuthIsReady.then(() => {
- console.log('Auth has loaded') // eslint-disable-line no-console
- })
- return store;
-}
-```
-
-In order for this to work, the promise must know the name of the location within redux that the state is being stored, which is the function of the `firebaseStateName` config option. By default the `firebaseStateName` parameter is `'firebase'` to match the getting started guide. If you are storing your firebase state under a different place within redux (i.e. the name given to the `firebaseStateReducer`) such as `'firebaseState'` you must pass that name as `firebaseStateName` in your config.
-
-#### Custom Auth Ready Logic
-
-If you want to write your own custom logic for the promise that actually confirms that auth is ready, you can pass a promise as the `authIsReady` config option.
-
-Here is an example showing the default logic:
-
-```js
-import { get } from 'lodash'
-
-const config = {
- authIsReady: (store, firebaseStateName) => new Promise((resolve) => {
- const firebaseAuthState = && state[firebaseStateName].auth
- if (get(store.getState(), `${firebaseStateName}.auth.isLoaded`)) {
- resolve()
- } else {
- const unsubscribe = store.subscribe(() => {
- if (get(store.getState(), `${firebaseStateName}.auth.isLoaded`)) {
- unsubscribe()
- resolve()
- }
- })
- }
- })
-}
-```
-
## List of Online Users (Presence)
Presence keeps a list of which users are currently online as well as a history of all user sessions.
diff --git a/examples/complete/typescript/package.json b/examples/complete/typescript/package.json
index 2fc6e3d3b..d584cae21 100644
--- a/examples/complete/typescript/package.json
+++ b/examples/complete/typescript/package.json
@@ -7,19 +7,23 @@
"@types/node": "11.13.0",
"@types/react": "16.8.12",
"@types/react-dom": "16.8.3",
- "@types/react-redux": "^7.0.6",
+ "@types/react-redux": "^7.1.1",
"react": "^16.8.6",
"react-dom": "^16.8.6",
- "react-redux": "^6.0.1",
- "react-redux-firebase": "^3.0.0-alpha.11",
+ "react-redux": "^7.1.0",
+ "react-redux-firebase": "next",
"react-scripts": "2.1.8",
+ "redux": "^4.0.4",
+ "tslint": "^5.18.0",
"typescript": "3.4.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
- "eject": "react-scripts eject"
+ "eject": "react-scripts eject",
+ "lint": "tslint 'src/**/*.ts'",
+ "lint:fix": "npm run lint -- --fix"
},
"eslintConfig": {
"extends": "react-app"
diff --git a/examples/complete/typescript/src/AddTodo.tsx b/examples/complete/typescript/src/AddTodo.tsx
new file mode 100644
index 000000000..e6f2eb62d
--- /dev/null
+++ b/examples/complete/typescript/src/AddTodo.tsx
@@ -0,0 +1,16 @@
+import React from "react";
+import { ExtendedFirebaseInstance, useFirebase} from "react-redux-firebase";
+
+function AddTodo() {
+ const firebase: ExtendedFirebaseInstance = useFirebase();
+ function handleAddClick() {
+ firebase.push("todos", { done: false, text: "Example todo" });
+ }
+ return (
+
+
+
+ );
+}
+
+export default AddTodo;
diff --git a/examples/complete/typescript/src/App.tsx b/examples/complete/typescript/src/App.tsx
index dd885bc6b..be0cffb22 100644
--- a/examples/complete/typescript/src/App.tsx
+++ b/examples/complete/typescript/src/App.tsx
@@ -1,18 +1,18 @@
-import React from 'react'
-import { Provider } from 'react-redux'
-import Home from './Home'
-import configureStore from './store'
-import { ReactReduxFirebaseProvider } from 'react-redux-firebase';
-import firebase from 'firebase/app'
-import 'firebase/auth'
-import 'firebase/database'
-import 'firebase/firestore' // make sure you add this for firestore
-import { firebase as fbConfig, reduxFirebase as rfConfig } from './config'
+import firebase from "firebase/app";
+import "firebase/auth";
+import "firebase/database";
+import "firebase/firestore"; // make sure you add this for firestore
+import React from "react";
+import { Provider } from "react-redux";
+import { ReactReduxFirebaseProvider } from "react-redux-firebase";
+import { firebase as fbConfig, reduxFirebase as rfConfig } from "./config";
+import Home from "./Home";
+import configureStore from "./store";
-const initialState = {}
-const store = configureStore(initialState)
+const initialState = {};
+const store = configureStore(initialState);
// Initialize Firebase instance
-firebase.initializeApp(fbConfig)
+firebase.initializeApp(fbConfig);
export default () => (
@@ -23,5 +23,5 @@ export default () => (
-)
+);
diff --git a/examples/complete/typescript/src/Home.tsx b/examples/complete/typescript/src/Home.tsx
index 80cc77782..d8431dfc7 100644
--- a/examples/complete/typescript/src/Home.tsx
+++ b/examples/complete/typescript/src/Home.tsx
@@ -1,10 +1,9 @@
-import React from 'react'
-import logo from './logo.svg';
-import './App.css';
-import { withFirebase } from 'react-redux-firebase'
+import React from "react";
+import AddTodo from "./AddTodo";
+import "./App.css";
+import logo from "./logo.svg";
-function Home({ firebase }) {
- console.log('firebase', firebase)
+function Home() {
return (
- )
+ );
}
-export default withFirebase(Home);
+export default Home;
diff --git a/examples/complete/typescript/src/List.tsx b/examples/complete/typescript/src/List.tsx
new file mode 100644
index 000000000..4d2ad43d8
--- /dev/null
+++ b/examples/complete/typescript/src/List.tsx
@@ -0,0 +1,22 @@
+import React from "react";
+import { useSelector } from "react-redux";
+import { isEmpty, isLoaded, useFirestoreConnect } from "react-redux-firebase";
+import { RootState } from "./store";
+
+function List() {
+ useFirestoreConnect([{
+ collection: "todos",
+ }]);
+ const todos = useSelector((state: RootState) => state.firebase.data.todos);
+ if (!isLoaded(todos)) { return "Loading..."; }
+ if (isEmpty(todos)) { return null; }
+ return (
+
+ {todos.map((todo: any) => (
+
{todo.name}
+ ))}
+
+ );
+}
+
+export default List;
diff --git a/examples/complete/typescript/src/serviceWorker.ts b/examples/complete/typescript/src/serviceWorker.ts
index 15d90cb81..1b81f377c 100644
--- a/examples/complete/typescript/src/serviceWorker.ts
+++ b/examples/complete/typescript/src/serviceWorker.ts
@@ -1,3 +1,4 @@
+/* tslint:disable */
// This optional code is used to register a service worker.
// register() is not called by default.
@@ -11,26 +12,26 @@
// opt-in, read https://bit.ly/CRA-PWA
const isLocalhost = Boolean(
- window.location.hostname === 'localhost' ||
+ window.location.hostname === "localhost" ||
// [::1] is the IPv6 localhost address.
- window.location.hostname === '[::1]' ||
+ window.location.hostname === "[::1]" ||
// 127.0.0.1/8 is considered localhost for IPv4.
window.location.hostname.match(
- /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
- )
+ /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/,
+ ),
);
-type Config = {
+interface Config {
onSuccess?: (registration: ServiceWorkerRegistration) => void;
onUpdate?: (registration: ServiceWorkerRegistration) => void;
-};
+}
export function register(config?: Config) {
- if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+ if (process.env.NODE_ENV === "production" && "serviceWorker" in navigator) {
// The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(
(process as { env: { [key: string]: string } }).env.PUBLIC_URL,
- window.location.href
+ window.location.href,
);
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
@@ -39,7 +40,7 @@ export function register(config?: Config) {
return;
}
- window.addEventListener('load', () => {
+ window.addEventListener("load", () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
if (isLocalhost) {
@@ -50,8 +51,8 @@ export function register(config?: Config) {
// service worker/PWA documentation.
navigator.serviceWorker.ready.then(() => {
console.log(
- 'This web app is being served cache-first by a service ' +
- 'worker. To learn more, visit https://bit.ly/CRA-PWA'
+ "This web app is being served cache-first by a service " +
+ "worker. To learn more, visit https://bit.ly/CRA-PWA",
);
});
} else {
@@ -65,21 +66,21 @@ export function register(config?: Config) {
function registerValidSW(swUrl: string, config?: Config) {
navigator.serviceWorker
.register(swUrl)
- .then(registration => {
+ .then((registration) => {
registration.onupdatefound = () => {
const installingWorker = registration.installing;
if (installingWorker == null) {
return;
}
installingWorker.onstatechange = () => {
- if (installingWorker.state === 'installed') {
+ if (installingWorker.state === "installed") {
if (navigator.serviceWorker.controller) {
// At this point, the updated precached content has been fetched,
// but the previous service worker will still serve the older
// content until all client tabs are closed.
console.log(
- 'New content is available and will be used when all ' +
- 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
+ "New content is available and will be used when all " +
+ "tabs for this page are closed. See https://bit.ly/CRA-PWA.",
);
// Execute callback
@@ -90,7 +91,7 @@ function registerValidSW(swUrl: string, config?: Config) {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
- console.log('Content is cached for offline use.');
+ console.log("Content is cached for offline use.");
// Execute callback
if (config && config.onSuccess) {
@@ -101,23 +102,23 @@ function registerValidSW(swUrl: string, config?: Config) {
};
};
})
- .catch(error => {
- console.error('Error during service worker registration:', error);
+ .catch((error) => {
+ console.error("Error during service worker registration:", error);
});
}
function checkValidServiceWorker(swUrl: string, config?: Config) {
// Check if the service worker can be found. If it can't reload the page.
fetch(swUrl)
- .then(response => {
+ .then((response) => {
// Ensure service worker exists, and that we really are getting a JS file.
- const contentType = response.headers.get('content-type');
+ const contentType = response.headers.get("content-type");
if (
response.status === 404 ||
- (contentType != null && contentType.indexOf('javascript') === -1)
+ (contentType != null && contentType.indexOf("javascript") === -1)
) {
// No service worker found. Probably a different app. Reload the page.
- navigator.serviceWorker.ready.then(registration => {
+ navigator.serviceWorker.ready.then((registration) => {
registration.unregister().then(() => {
window.location.reload();
});
@@ -129,14 +130,14 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
})
.catch(() => {
console.log(
- 'No internet connection found. App is running in offline mode.'
+ "No internet connection found. App is running in offline mode.",
);
});
}
export function unregister() {
- if ('serviceWorker' in navigator) {
- navigator.serviceWorker.ready.then(registration => {
+ if ("serviceWorker" in navigator) {
+ navigator.serviceWorker.ready.then((registration) => {
registration.unregister();
});
}
diff --git a/examples/complete/typescript/src/store.js b/examples/complete/typescript/src/store.js
index 4905f116a..8d1b5d21f 100644
--- a/examples/complete/typescript/src/store.js
+++ b/examples/complete/typescript/src/store.js
@@ -1,11 +1,16 @@
import { createStore, compose } from 'redux'
import rootReducer from './reducer.js'
+import { FirebaseReducer } from 'react-redux-firebase'
+
+export interface RootState {
+ firebase: FirebaseReducer.Reducer
+}
export default function configureStore (initialState, history) {
const createStoreWithMiddleware = compose(
typeof window === 'object' && typeof window.devToolsExtension !== 'undefined' ? () => window.__REDUX_DEVTOOLS_EXTENSION__ : f => f
)(createStore)
- const store = createStoreWithMiddleware(rootReducer)
+ const store: RootState = createStoreWithMiddleware(rootReducer)
if (module.hot) {
// Enable Webpack hot module replacement for reducers
diff --git a/examples/complete/typescript/tslint.json b/examples/complete/typescript/tslint.json
new file mode 100644
index 000000000..32fa6e5e8
--- /dev/null
+++ b/examples/complete/typescript/tslint.json
@@ -0,0 +1,9 @@
+{
+ "defaultSeverity": "error",
+ "extends": [
+ "tslint:recommended"
+ ],
+ "jsRules": {},
+ "rules": {},
+ "rulesDirectory": []
+}
\ No newline at end of file
diff --git a/examples/complete/typescript/yarn.lock b/examples/complete/typescript/yarn.lock
index 64d08a4aa..8eeef5c3d 100755
--- a/examples/complete/typescript/yarn.lock
+++ b/examples/complete/typescript/yarn.lock
@@ -1039,10 +1039,10 @@
dependencies:
regenerator-runtime "^0.12.0"
-"@babel/runtime@^7.3.1":
- version "7.4.3"
- resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.4.3.tgz#79888e452034223ad9609187a0ad1fe0d2ad4bdc"
- integrity sha512-9lsJwJLxDh/T3Q3SZszfWOTkk3pHbkmH+3KY+zwIDmsNlxsumuhS2TH3NIpktU4kNvfzy+k3eLT7aTJSPTo0OA==
+"@babel/runtime@^7.4.5":
+ version "7.5.4"
+ resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.5.4.tgz#cb7d1ad7c6d65676e66b47186577930465b5271b"
+ integrity sha512-Na84uwyImZZc3FKf4aUF1tysApzwf3p2yuFBIyBfbzT5glzKTdvYI4KVW4kcgjrzoGUjC7w3YyCHcJKaRxsr2Q==
dependencies:
regenerator-runtime "^0.13.2"
@@ -1276,13 +1276,14 @@
dependencies:
"@types/react" "*"
-"@types/react-redux@^7.0.6":
- version "7.0.6"
- resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.0.6.tgz#992271450e0d3bf61130ad9e356ad018841c7f78"
- integrity sha512-Nlofk/xq8oVWpylvrFayezNb/HONsYJfjlSmTmZ7xoMDe+Muf6c1qHMVRZ7C5S2W1+iVcY21ggZwlUgLv+66hQ==
+"@types/react-redux@^7.1.1":
+ version "7.1.1"
+ resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.1.tgz#eb01e89cf71cad77df9f442b819d5db692b997cb"
+ integrity sha512-owqNahzE8en/jR4NtrUJDJya3tKru7CIEGSRL/pVS84LtSCdSoT7qZTkrbBd3S4Lp11sAp+7LsvxIeONJVKMnw==
dependencies:
"@types/hoist-non-react-statics" "^3.3.0"
"@types/react" "*"
+ hoist-non-react-statics "^3.3.0"
redux "^4.0.0"
"@types/react@*", "@types/react@16.8.12":
@@ -2380,7 +2381,7 @@ buffer@^4.3.0:
ieee754 "^1.1.4"
isarray "^1.0.0"
-builtin-modules@^1.0.0:
+builtin-modules@^1.0.0, builtin-modules@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
integrity sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=
@@ -2519,7 +2520,7 @@ ccount@^1.0.3:
resolved "https://registry.yarnpkg.com/ccount/-/ccount-1.0.3.tgz#f1cec43f332e2ea5a569fd46f9f5bde4e6102aff"
integrity sha512-Jt9tIBkRc9POUof7QA/VwWd+58fKkEEfI+/t1/eOlxKM7ZhrczNzMFefge7Ai+39y1pR/pP6cI19guHy3FSLmw==
-chalk@2.4.2, chalk@^2.4.2:
+chalk@2.4.2, chalk@^2.3.0, chalk@^2.4.2:
version "2.4.2"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
@@ -2756,7 +2757,7 @@ commander@^2.11.0:
resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
integrity sha512-6tvAOO+D6OENvRAh524Dh9jcfKTYDQAqvqezbCW82xj5X0pSrcpxtvRKHLG0yBY6SD7PSDrJaj+0AiOcKVd1Xg==
-commander@^2.19.0:
+commander@^2.12.1, commander@^2.19.0:
version "2.20.0"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.0.tgz#d58bb2b5c1ee8f87b0d340027e9e94e222c5a422"
integrity sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==
@@ -5986,6 +5987,14 @@ js-yaml@^3.13.0:
argparse "^1.0.7"
esprima "^4.0.0"
+js-yaml@^3.13.1:
+ version "3.13.1"
+ resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847"
+ integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==
+ dependencies:
+ argparse "^1.0.7"
+ esprima "^4.0.0"
+
jsbn@~0.1.0:
version "0.1.1"
resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
@@ -8366,31 +8375,31 @@ react-error-overlay@^5.1.4:
resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-5.1.4.tgz#88dfb88857c18ceb3b9f95076f850d7121776991"
integrity sha512-fp+U98OMZcnduQ+NSEiQa4s/XMsbp+5KlydmkbESOw4P69iWZ68ZMFM5a2BuE0FgqPBKApJyRuYHR95jM8lAmg==
-react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.2:
+react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6:
version "16.8.6"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.6.tgz#5bbc1e2d29141c9fbdfed456343fe2bc430a6a16"
integrity sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==
-react-redux-firebase@^3.0.0-alpha.11:
- version "3.0.0-alpha.11"
- resolved "https://registry.yarnpkg.com/react-redux-firebase/-/react-redux-firebase-3.0.0-alpha.11.tgz#1c1a5f9018c9170dc99f5a8a8e4f397d66249f29"
- integrity sha512-n/fTIxezrxFUmBt0/S2nB0vB6tZntp8fVu3erOZBA4cp07WCxmhkaFmFi3b1dV0oxwoBjbXxni05oSWawyOuRQ==
+react-redux-firebase@next:
+ version "3.0.0-alpha.12"
+ resolved "https://registry.yarnpkg.com/react-redux-firebase/-/react-redux-firebase-3.0.0-alpha.12.tgz#de855adb03728538d43e33b1dd183dc1f9849b25"
+ integrity sha512-jew2oYg3KDUYTwPDadtOELM6+ErsjH+WLEghdaQZLj++wGmO4dcMhVNw2A9sbsOQw77eXaNqVoRfAltKsK2uzw==
dependencies:
hoist-non-react-statics "^3.2.1"
lodash "^4.17.11"
prop-types "^15.6.2"
-react-redux@^6.0.1:
- version "6.0.1"
- resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-6.0.1.tgz#0d423e2c1cb10ada87293d47e7de7c329623ba4d"
- integrity sha512-T52I52Kxhbqy/6TEfBv85rQSDz6+Y28V/pf52vDWs1YRXG19mcFOGfHnY2HsNFHyhP+ST34Aih98fvt6tqwVcQ==
+react-redux@^7.1.0:
+ version "7.1.0"
+ resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-7.1.0.tgz#72af7cf490a74acdc516ea9c1dd80e25af9ea0b2"
+ integrity sha512-hyu/PoFK3vZgdLTg9ozbt7WF3GgX5+Yn3pZm5/96/o4UueXA+zj08aiSC9Mfj2WtD1bvpIb3C5yvskzZySzzaw==
dependencies:
- "@babel/runtime" "^7.3.1"
+ "@babel/runtime" "^7.4.5"
hoist-non-react-statics "^3.3.0"
invariant "^2.2.4"
loose-envify "^1.4.0"
prop-types "^15.7.2"
- react-is "^16.8.2"
+ react-is "^16.8.6"
react-scripts@2.1.8:
version "2.1.8"
@@ -8553,6 +8562,14 @@ redux@^4.0.0:
loose-envify "^1.4.0"
symbol-observable "^1.2.0"
+redux@^4.0.4:
+ version "4.0.4"
+ resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796"
+ integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q==
+ dependencies:
+ loose-envify "^1.4.0"
+ symbol-observable "^1.2.0"
+
regenerate-unicode-properties@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-7.0.0.tgz#107405afcc4a190ec5ed450ecaa00ed0cafa7a4c"
@@ -9861,11 +9878,42 @@ ts-pnp@^1.0.0:
resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.0.1.tgz#fde74a6371676a167abaeda1ffc0fdb423520098"
integrity sha512-Zzg9XH0anaqhNSlDRibNC8Kp+B9KNM0uRIpLpGkGyrgRIttA7zZBhotTSEoEyuDrz3QW2LGtu2dxuk34HzIGnQ==
+tslib@^1.8.0, tslib@^1.8.1:
+ version "1.10.0"
+ resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.10.0.tgz#c3c19f95973fb0a62973fb09d90d961ee43e5c8a"
+ integrity sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ==
+
tslib@^1.9.0:
version "1.9.3"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.3.tgz#d7e4dd79245d85428c4d7e4822a79917954ca286"
integrity sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ==
+tslint@^5.18.0:
+ version "5.18.0"
+ resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.18.0.tgz#f61a6ddcf372344ac5e41708095bbf043a147ac6"
+ integrity sha512-Q3kXkuDEijQ37nXZZLKErssQVnwCV/+23gFEMROi8IlbaBG6tXqLPQJ5Wjcyt/yHPKBC+hD5SzuGaMora+ZS6w==
+ dependencies:
+ "@babel/code-frame" "^7.0.0"
+ builtin-modules "^1.1.1"
+ chalk "^2.3.0"
+ commander "^2.12.1"
+ diff "^3.2.0"
+ glob "^7.1.1"
+ js-yaml "^3.13.1"
+ minimatch "^3.0.4"
+ mkdirp "^0.5.1"
+ resolve "^1.3.2"
+ semver "^5.3.0"
+ tslib "^1.8.0"
+ tsutils "^2.29.0"
+
+tsutils@^2.29.0:
+ version "2.29.0"
+ resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-2.29.0.tgz#32b488501467acbedd4b85498673a0812aca0b99"
+ integrity sha512-g5JVHCIJwzfISaXpXE1qvNalca5Jwob6FjI4AoPlqMusJ6ftFE7IkkFoMhVLRgK+4Kx3gkzb8UZK5t5yTTvEmA==
+ dependencies:
+ tslib "^1.8.1"
+
tty-browserify@0.0.0:
version "0.0.0"
resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
diff --git a/index.d.ts b/index.d.ts
index 4a44e8b29..d80456eea 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -121,37 +121,253 @@ export const constants: {
*/
export function authIsReady(store: object, ...args: any[]): any
+interface RemoveOptions {
+ dispatchAction: boolean
+}
+
/**
- * Factory function for creating a firebaseConnect Higher Order Component
+ * Firestore instance extended with methods which dispatch
+ * redux actions. More info available in
+ * [firebaseInstance section of the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/firebaseInstance.html).
*/
-export function createFirebaseConnect(...args: any[]): any
+interface ExtendedFirebaseInstance extends Firebase.database {
+ initializeAuth: VoidFunction
+
+ firestore: ExtendedFirestoreInstance
+
+ dispatch: Dispatch
+
+ /**
+ * Sets data to Firebase. More info available [in the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#set).
+ * @param {String} path - Path to location on Firebase which to set
+ * @param {Object|String|Boolean|Number} value - Value to write to Firebase
+ * @param {Function} onComplete - Function to run on complete (`not required`)
+ * @return {Promise} Containing reference snapshot
+ */
+ set: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete?: Function
+ ) => Promise
+
+ /**
+ * 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)
+ * @param path - Path to location on Firebase which to set
+ * @param value - Value to write to Firebase
+ * @param onComplete - Function to run on complete (`not required`)
+ */
+ setWithMeta: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete?: Function
+ ) => Promise
+
+ /**
+ * Pushes data to Firebase. More info available
+ * in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#push).
+ * @param path - Path to location on Firebase which to push
+ * @param value - Value to push to Firebase
+ * @param onComplete - Function to run on complete
+ */
+ push: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete?: Function
+ ) => Promise
+
+ /**
+ * Pushes data to Firebase along with meta data. Currently,
+ * this includes createdAt and createdBy.
+ * @param path - Path to location on Firebase which to set
+ * @param value - Value to write to Firebase
+ * @param onComplete - Function to run on complete
+ */
+ pushWithMeta: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete: Function
+ ) => Promise
+
+ /**
+ * 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.
+ * @param watchArray - 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.
+ * @param options - The options object that you would like to pass to
+ * your watchArray generating function.
+ */
+ promiseEvents: (
+ watchArray: (string | object)[],
+ options: object
+ ) => Promise
+
+ /**
+ * Updates data on Firebase and sends new data. More info available
+ * in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#update).
+ * @param path - Path to location on Firebase which to update
+ * @param value - Value to update to Firebase
+ * @param onComplete - Function to run on complete (`not required`)
+ */
+ update: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete?: Function
+ ) => Promise
+
+ /**
+ * Updates data on Firebase along with meta. *Warning*
+ * using this function may have unintented consequences (setting
+ * createdAt even if data already exists)
+ * @param path - Path to location on Firebase which to update
+ * @param value - Value to update to Firebase
+ * @param onComplete - Function to run on complete
+ */
+ updateWithMeta: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete?: Function
+ ) => Promise
+
+ /**
+ * 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. More info
+ * available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#remove).
+ * @param path - Path to location on Firebase which to remove
+ * @param onComplete - Function to run on complete
+ * @param options - Configuration for removal
+ * @param [options.dispatchAction=true] - Whether or not to dispatch REMOVE action
+ */
+ remove: (
+ path: string,
+ onComplete?: Function,
+ options?: RemoveOptions
+ ) => Promise
+
+ /**
+ * 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. More
+ * info available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#uniqueset).
+ * @param path - Path to location on Firebase which to set
+ * @param value - Value to write to Firebase
+ * @param onComplete - Function to run on complete (`not required`)
+ */
+ uniqueSet: (
+ path: string,
+ value: object | string | boolean | number,
+ onComplete?: Function
+ ) => Promise
+
+ /**
+ * Watch a path in Firebase Real Time Database. More info
+ * available in the [docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#watchevent).
+ * @param type - Type of event to watch for (defaults to value)
+ * @param path - Path to watch with watcher
+ * @param storeAs - Location within redux to store value
+ * @param options - List of parameters for the query
+ */
+ watchEvent: (
+ type: string,
+ path: string,
+ storeAs: string,
+ options?: object
+ ) => Promise
+
+ /**
+ * 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. More info available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#unwatchevent).
+ * @param type - Type of watch event
+ * @param path - Path to location on Firebase which to unset listener
+ * @param queryId - Id of the listener
+ * @param options - Event options object
+ */
+ unWatchEvent: (
+ type: string,
+ path: string,
+ queryId: string,
+ options?: string
+ ) => Promise
+}
/**
- * Create a firebase instance that has helpers attached for dispatching actions
+ * Create an extended firebase instance that has methods attached
+ * which dispatch redux actions.
+ * @param firebase - Firebase instance which to extend
+ * @param configs - Configuration object
+ * @param dispatch - Action dispatch function
*/
export function createFirebaseInstance(
firebase: typeof Firebase,
configs: Partial,
- dispatch: Dispatch,
- ...args: any[]
-): any
+ dispatch: Dispatch
+): ExtendedFirebaseInstance & Auth & Storage
+
+
+/**
+ * Function that creates a Higher Order Component which
+ * automatically listens/unListens to provided firebase paths using
+ * React's Lifecycle hooks.
+ * **WARNING!!** This is an advanced feature, and should only be used when
+ * needing to access a firebase instance created under a different store key.
+ * @param [storeKey='store'] - Name of redux store which contains
+ * Firebase state (state.firebase)
+ */
+export function createFirebaseConnect(storeKey: string): typeof firebaseConnect
+
+/**
+ * Function that creates a Higher Order Component which
+ * automatically listens/unListens to provided firebase paths using
+ * React's Lifecycle hooks.
+ * **WARNING!!** This is an advanced feature, and should only be used when
+ * needing to access a firebase instance created under a different store key.
+ * @param {String} [storeKey='store'] - Name of redux store which contains
+ * Firebase state (state.firebase)
+ */
+export function createFirestoreConnect(storeKey: string): typeof firestoreConnect
+
+export function createWithFirebase(storeKey: string): typeof withFirebase
-export function createFirestoreConnect(...args: any[]): any
+export function createWithFirestore(storeKey: string): typeof withFirestore
-export function createWithFirebase(storeKey: any): any
+export type QueryParamOption = 'orderByKey' | 'orderByChild' | 'orderByPriority' | 'limitToFirst' | 'limitToLast' | 'notParsed' | 'parsed'
+
+export type QueryParamOptions = QueryParamOption|string[]
+
+export interface ReactReduxFirebaseQuerySetting {
+ path: string
+ type?: 'value' | 'once' | 'child_added' | 'child_removed' | 'child_changed' | 'child_moved'
+ queryParams?: QueryParamOptions
+ storeAs?: string
+}
+
+ export type ReactReduxFirebaseQueries = (ReactReduxFirebaseQuerySetting | string)[]
-export function createWithFirestore(storeKey: any): any
// https://github.com/prescottprue/redux-firestore#query-options
type WhereOptions = [string, FirestoreTypes.WhereFilterOp, any]
type OrderByOptions = [string, FirestoreTypes.OrderByDirection]
-export interface FirestoreQueryOptions {
+
+/**
+ * Options which can be passed to firestore query through
+ * redux-firestore or react-redux-firebase
+ */
+export interface ReduxFirestoreQuerySetting {
// https://github.com/prescottprue/redux-firestore#collection
collection: string
// https://github.com/prescottprue/redux-firestore#document
doc?: string
// https://github.com/prescottprue/redux-firestore#sub-collections
- subcollections?: FirestoreQueryOptions[]
+ subcollections?: ReduxFirestoreQuerySetting[]
// https://github.com/prescottprue/redux-firestore#where
where?: WhereOptions | WhereOptions[]
// https://github.com/prescottprue/redux-firestore#orderby
@@ -170,43 +386,48 @@ export interface FirestoreQueryOptions {
endBefore?: FirestoreTypes.DocumentSnapshot | any | any[]
}
-// https://github.com/prescottprue/redux-firestore#api
-interface ReduxFirestoreApi {
- // https://github.com/prescottprue/redux-firestore#get
- // https://github.com/prescottprue/redux-firestore#get-1
- get: (docPath: string | FirestoreQueryOptions) => Promise
+export type ReduxFirestoreQueries = (ReduxFirestoreQuerySetting | string)[]
+
+
+/**
+ * Firestore instance extended with methods which dispatch redux actions.
+ * More info available in the [API section of the redux-firestore docs](https://github.com/prescottprue/redux-firestore#api).
+ */
+interface ExtendedFirestoreInstance extends FirestoreTypes.FirebaseFirestore {
+ // Get data from firestore. More info available [in the docs](https://github.com/prescottprue/redux-firestore#get).
+ get: (docPath: string | ReduxFirestoreQuerySetting) => Promise
- // https://github.com/prescottprue/redux-firestore#set
- set: (docPath: string | FirestoreQueryOptions, data: Object) => Promise
+ // Set data to firestore. More info available [in the docs](https://github.com/prescottprue/redux-firestore#set).
+ set: (docPath: string | ReduxFirestoreQuerySetting, data: Object) => Promise
// https://github.com/prescottprue/redux-firestore#add
add: (
- collectionPath: string | FirestoreQueryOptions,
+ collectionPath: string | ReduxFirestoreQuerySetting,
data: Object
) => Promise<{ id: string }>
// https://github.com/prescottprue/redux-firestore#update
update: (
- docPath: string | FirestoreQueryOptions,
+ docPath: string | ReduxFirestoreQuerySetting,
data: Object
) => Promise
// https://github.com/prescottprue/redux-firestore#delete
- delete: (docPath: string | FirestoreQueryOptions) => void
+ delete: (docPath: string | ReduxFirestoreQuerySetting) => void
// https://github.com/prescottprue/redux-firestore#runtransaction
- runTransaction: (transaction: WithFirestoreProps['firestore']) => Promise
+ // runTransaction: (transaction: WithFirestoreProps['firestore']) => Promise
// https://github.com/prescottprue/redux-firestore#onsnapshotsetlistener
- onSnapshot: (options: FirestoreQueryOptions) => Promise
- setListener: (options: FirestoreQueryOptions) => Promise
+ onSnapshot: (options: ReduxFirestoreQuerySetting) => Promise
+ setListener: (options: ReduxFirestoreQuerySetting) => Promise
//https://github.com/prescottprue/redux-firestore#setlisteners
- setListeners: (optionsArray: FirestoreQueryOptions[]) => Promise
+ setListeners: (optionsArray: ReduxFirestoreQuerySetting[]) => Promise
// https://github.com/prescottprue/redux-firestore#unsetlistener--unsetlisteners
- unsetListener: (options: FirestoreQueryOptions) => void
- unsetListeners: (options: FirestoreQueryOptions[]) => void
+ unsetListener: (options: ReduxFirestoreQuerySetting) => void
+ unsetListeners: (options: ReduxFirestoreQuerySetting[]) => void
}
// https://github.com/prescottprue/redux-firestore#other-firebase-statics
@@ -229,21 +450,24 @@ interface FirestoreStatics {
export interface WithFirestoreProps {
firestore: FirestoreTypes.FirebaseFirestore &
- ReduxFirestoreApi &
+ ExtendedFirestoreInstance &
FirestoreStatics
firebase: typeof Firebase
dispatch: Dispatch
}
+interface CreateUserCredentials {
+ email: string
+ password: string
+ signIn?: boolean // default true
+}
+
type Credentials =
- | {
- email: string
- password: string
- }
+ | CreateUserCredentials
| {
provider: 'facebook' | 'google' | 'twitter'
type: 'popup' | 'redirect'
- scopes: string[]
+ scopes?: string[]
}
| AuthTypes.AuthCredential
| {
@@ -255,12 +479,6 @@ type Credentials =
applicationVerifier: AuthTypes.ApplicationVerifier
}
-interface CreateUserCredentials {
- email: string
- password: string
- signIn?: boolean // default true
-}
-
interface UserProfile {
email: string
username: string
@@ -361,98 +579,14 @@ interface Storage {
export interface WithFirebaseProps {
firebase: Auth &
- Storage & {
- initializeApp: (options: Object, name?: string) => firebase.app.App
-
- initializeAuth: VoidFunction
-
- ref: (path: string | DatabaseTypes.Reference) => DatabaseTypes.Reference
-
- firestore: DatabaseTypes.FirebaseDatabase
-
- promiseEvents: (
- watchArray: (string | object)[],
- options: object
- ) => Promise
-
- dispatch: Dispatch
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#set
- set: (
- path: string,
- value: object | string | boolean | number,
- onComplete?: Function
- ) => Promise
-
- setWithMeta: (
- path: string,
- value: object | string | boolean | number,
- onComplete: Function
- ) => Promise
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#push
- push: (
- path: string,
- value: object | string | boolean | number,
- onComplete?: Function
- ) => Promise
-
- pushWithMeta: (
- path: string,
- value: object | string | boolean | number,
- onComplete: Function
- ) => Promise
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#update
- update: (
- path: string,
- value: object | string | boolean | number,
- onComplete?: Function
- ) => Promise
-
- updateWithMeta: (
- path: string,
- value: object | string | boolean | number,
- onComplete: Function
- ) => Promise
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#remove
- remove: (
- path: string,
- value: object | string | boolean | number,
- onComplete?: Function
- ) => Promise
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#uniqueset
- uniqueSet: (
- path: string,
- value: object | string | boolean | number,
- onComplete?: Function
- ) => Promise
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#watchevent
- watchEvent: (
- type: string,
- path: string,
- storeAs: string,
- options?: object
- ) => Promise
-
- // http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#unwatchevent
- unWatchEvent: (
- type: string,
- path: string,
- queryId: string,
- options?: string
- ) => Promise
- }
+ Storage & ExtendedFirebaseInstance
}
/**
* React HOC that attaches/detaches Firebase Real Time Database listeners on mount/unmount
*/
export function firebaseConnect(
- connect?: mapper | string[]
+ connect?: mapper | ReactReduxFirebaseQueries
): InferableComponentEnhancerWithProps<
TInner & WithFirebaseProps,
WithFirebaseProps
@@ -474,10 +608,7 @@ export function firebaseStateReducer(...args: any[]): FirestoreReducer.Reducer
* React HOC that attaches/detaches Cloud Firestore listeners on mount/unmount
*/
export function firestoreConnect(
- connect?:
- | mapper
- | FirestoreQueryOptions[]
- | string[]
+ connect?: mapper | ReduxFirestoreQueries
): InferableComponentEnhancerWithProps<
TInner & WithFirestoreProps,
WithFirestoreProps
@@ -492,10 +623,56 @@ export function fixPath(path: string): string
export function getVal(firebase: object, path: string, notSetValue?: any): any
+/**
+ * Detect whether data from redux state is loaded yet or not
+ */
export function isEmpty(...args: any[]): boolean
+/**
+ * Detect whether data from redux state is loaded yet or not
+ */
export function isLoaded(...args: any[]): boolean
+/**
+ * React hook that provides `firebase` object.
+ * Firebase is gathered from `store.firebase`, which is attached to store
+ * by the store enhancer (`reactReduxFirebase`) during setup.
+ */
+export function useFirebase(): ExtendedFirebaseInstance
+
+/**
+ * React hook that automatically listens/unListens
+ * to provided Cloud Firestore paths. Make sure you have required/imported
+ * Cloud Firestore, including it's reducer, before attempting to use.
+ * @param queriesConfig - An object or string for paths to sync
+ * from firestore. Can also be a function that returns the object or string.
+ */
+export function useFirebaseConnect(
+ connect?: mapper | ReactReduxFirebaseQueries
+): void
+
+/**
+ * React hook that return firestore object.
+ * Firestore instance is gathered from `store.firestore`, which is attached
+ * to store by the store enhancer (`reduxFirestore`) during setup of
+ * [`redux-firestore`](https://github.com/prescottprue/redux-firestore)
+ */
+export function useFirestore(): ExtendedFirestoreInstance
+
+/**
+ * React hook that automatically listens/unListens
+ * to provided Cloud Firestore paths. Make sure you have required/imported
+ * Cloud Firestore, including it's reducer, before attempting to use.
+ * @param queriesConfig - An object or string for paths to sync
+ * from firestore. Can also be a function that returns the object or string.
+ */
+export function useFirestoreConnect(
+ connect?:
+ | mapper
+ | ReduxFirestoreQuerySetting[]
+ | string[]
+): void
+
export function populate(
state: object,
path: string,
@@ -519,7 +696,7 @@ export interface ReactReduxFirebaseProviderProps {
config: Partial
dispatch: Dispatch
children?: React.ReactNode
- initalizeAuth?: boolean
+ initializeAuth?: boolean
createFirestoreInstance?: (
firebase: typeof Firebase,
configs: Partial,
@@ -604,7 +781,7 @@ export interface ReduxFirestoreProviderProps {
dispatch: Dispatch
) => object
children?: React.ReactNode
- initalizeAuth?: boolean
+ initializeAuth?: boolean
}
/**
@@ -615,19 +792,19 @@ export function ReduxFirestoreProvider(props: ReduxFirestoreProviderProps): any
/**
* React Higher Order Component that passes firebase as a prop (comes from context.store.firebase)
- * http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/withFirebase.html
+ * More info available in the [withFirebase section of the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/withFirebase.html).
*/
-export function withFirebase(
- ...args: any[]
-): React.ComponentType>
+export function withFirebase
(
+ componentToWrap: React.ComponentType
+): React.FC
>
/**
* React Higher Order Component that passes firestore as a prop (comes from context.store.firestore)
* http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/withFirestore.html
*/
-export function withFirestore(
- ...args: any[]
-): React.ComponentType
+export function withFirestore
- * import React, { Component } from 'react'
+ * import React from 'react'
* import PropTypes from 'prop-types'
* import { firebaseConnect } from 'react-redux-firebase'
- * const Example = ({ firebase: { push } }) => (
- *
- * )
+ *
+ * function Example({ firebase: { push } }) {
+ * return (
+ *
+ * )
+ * }
* export default firebaseConnect()(Example)
*/
const push = (path, value, onComplete) =>
@@ -125,8 +133,9 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
.push(value, onComplete)
/**
- * @description Pushes data to Firebase along with meta data. Currently,
- * this includes createdAt and createdBy.
+ * Pushes data to Firebase along with meta data. Currently,
+ * this includes createdAt and createdBy. More info
+ * available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#pushWithMeta).
* @param {String} path - Path to location on Firebase which to set
* @param {Object|String|Boolean|Number} value - Value to write to Firebase
* @param {Function} onComplete - Function to run on complete (`not required`)
@@ -136,20 +145,28 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
withMeta('push', path, value, onComplete)
/**
- * @description Updates data on Firebase and sends new data.
+ * Updates data on Firebase and sends new data. More info
+ * available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#update).
* @param {String} path - Path to location on Firebase which to update
* @param {Object|String|Boolean|Number} value - Value to update to Firebase
* @param {Function} onComplete - Function to run on complete (`not required`)
* @return {Promise} Containing reference snapshot
* @example
Basic
- * import React, { Component } from 'react'
+ * import React from 'react'
* import PropTypes from 'prop-types'
* import { firebaseConnect } from 'react-redux-firebase'
- * const Example = ({ firebase: { update } }) => (
- *
- * )
+ *
+ * function Example({ firebase: { update } }) {
+ * function updateData() {
+ * update('some/path', { here: 'is a value' })
+ * }
+ * }
+ * return (
+ *
+ * )
+ * }
* export default firebaseConnect()(Example)
*/
const update = (path, value, onComplete) =>
@@ -159,9 +176,10 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
.update(value, onComplete)
/**
- * @description Updates data on Firebase along with meta. *Warning*
+ * Updates data on Firebase along with meta. *Warning*
* using this function may have unintented consequences (setting
- * createdAt even if data already exists)
+ * createdAt even if data already exists). More info available
+ * in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#updateWithMeta).
* @param {String} path - Path to location on Firebase which to update
* @param {Object|String|Boolean|Number} value - Value to update to Firebase
* @param {Function} onComplete - Function to run on complete (`not required`)
@@ -171,22 +189,26 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
withMeta('update', path, value, onComplete)
/**
- * @description Removes data from Firebase at a given path. **NOTE** A
+ * 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.
+ * More info available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#remove).
* @param {String} path - Path to location on Firebase which to remove
* @param {Function} onComplete - Function to run on complete (`not required`)
* @return {Promise} Containing reference snapshot
* @example
Basic
- * import React, { Component } from 'react'
+ * import React from 'react'
* import PropTypes from 'prop-types'
* import { firebaseConnect } from 'react-redux-firebase'
- * const Example = ({ firebase: { remove } }) => (
- *
- * )
+ *
+ * function Example({ firebase: { remove } }) {
+ * return (
+ *
+ * )
+ * }
* export default firebaseConnect()(Example)
*/
const remove = (path, onComplete, options) =>
@@ -196,9 +218,10 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
})
/**
- * @description Sets data to Firebase only if the path does not already
+ * 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.
+ * More info available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#uniqueSet).
* @param {String} path - Path to location on Firebase which to set
* @param {Object|String|Boolean|Number} value - Value to write to Firebase
* @param {Function} onComplete - Function to run on complete (`not required`)
@@ -207,11 +230,14 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
* import React, { Component } from 'react'
* import PropTypes from 'prop-types'
* import { firebaseConnect } from 'react-redux-firebase'
- * const Example = ({ firebase: { uniqueSet } }) => (
- *
- * )
+ *
+ * function Example({ firebase: { uniqueSet } }) {
+ * return (
+ *
+ * )
+ * }
* export default firebaseConnect()(Example)
*/
const uniqueSet = (path, value, onComplete) =>
@@ -230,8 +256,9 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
})
/**
- * @description Upload a file to Firebase Storage with the option to store
- * its metadata in Firebase Database
+ * Upload a file to Firebase Storage with the option to store
+ * its metadata in Firebase Database. More info available
+ * in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#uploadFile).
* @param {String} path - Path to location on Firebase which to set
* @param {File} file - File object to upload (usually first element from
* array output of select-file or a drag/drop `onDrop`)
@@ -249,8 +276,9 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
})
/**
- * @description Upload multiple files to Firebase Storage with the option
- * to store their metadata in Firebase Database
+ * Upload multiple files to Firebase Storage with the option
+ * to store their metadata in Firebase Database. More info available
+ * in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#uploadFiles).
* @param {String} path - Path to location on Firebase which to set
* @param {Array} files - Array of File objects to upload (usually from
* a select-file or a drag/drop `onDrop`)
@@ -268,8 +296,9 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
})
/**
- * @description Delete a file from Firebase Storage with the option to
- * remove its metadata in Firebase Database
+ * Delete a file from Firebase Storage with the option to
+ * remove its metadata in Firebase Database. More info available
+ * in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#deleteFile).
* @param {String} path - Path to location on Firebase which to set
* @param {String} dbPath - Database path to place uploaded file metadata
* @return {Promise} Containing the File object
@@ -278,8 +307,9 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
storageActions.deleteFile(dispatch, firebase, { path, dbPath })
/**
- * @description Watch event. **Note:** this method is used internally
+ * Watch event. **Note:** this method is used internally
* so examples have not yet been created, and it may not work as expected.
+ * More info available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#watchEvent).
* @param {String} type - Type of watch event
* @param {String} path - Path to location on Firebase which to set listener
* @param {String} storeAs - Name of listener results within redux store
@@ -297,9 +327,9 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
})
/**
- * @description Unset a listener watch event. **Note:** this method is used
+ * 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.
+ * as expected. More info available in [the docs](http://docs.react-redux-firebase.com/history/v3.0.0/docs/api/props-firebase.html#unwatchevent).
* @param {String} type - Type of watch event
* @param {String} path - Path to location on Firebase which to unset listener
* @param {String} queryId - Id of the listener
@@ -315,7 +345,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
})
/**
- * @description Similar to the firebaseConnect Higher Order Component but
+ * 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
@@ -340,8 +370,8 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
}
/**
- * @description Logs user into Firebase. For examples, visit the
- * [auth section](/docs/auth.md)
+ * Logs user into Firebase. For examples, visit the
+ * [auth section of the docs](/docs/auth.md)
* @param {Object} credentials - Credentials for authenticating
* @param {String} credentials.provider - External provider (google |
* facebook | twitter)
@@ -355,7 +385,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.login(dispatch, firebase, credentials)
/**
- * @description Logs user into Firebase using external. For examples, visit the
+ * Logs user into Firebase using external. For examples, visit the
* [auth section](/docs/recipes/auth.md)
* @param {Object} authData - Auth data from Firebase's getRedirectResult
* @return {Promise} Containing user's profile
@@ -364,14 +394,14 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.handleRedirectResult(dispatch, firebase, authData)
/**
- * @description Logs user out of Firebase and empties firebase state from
+ * Logs user out of Firebase and empties firebase state from
* redux store
* @return {Promise}
*/
const logout = () => authActions.logout(dispatch, firebase)
/**
- * @description Creates a new user in Firebase authentication. If
+ * Creates a new user in Firebase authentication. If
* `userProfile` config option is set, user profiles will be set to this
* location.
* @param {Object} credentials - Credentials for authenticating
@@ -384,7 +414,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.createUser(dispatch, firebase, credentials, profile)
/**
- * @description Sends password reset email
+ * Sends password reset email
* @param {Object} credentials - Credentials for authenticating
* @param {String} credentials.email - Credentials for authenticating
* @return {Promise}
@@ -393,7 +423,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.resetPassword(dispatch, firebase, credentials)
/**
- * @description Confirm that a user's password has been reset
+ * Confirm that a user's password has been reset
* @param {String} code - Password reset code to verify
* @param {String} password - New Password to confirm reset to
* @return {Promise}
@@ -402,7 +432,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.confirmPasswordReset(dispatch, firebase, code, password)
/**
- * @description Verify that a password reset code from a password reset
+ * Verify that a password reset code from a password reset
* email is valid
* @param {String} code - Password reset code to verify
* @return {Promise} Containing user auth info
@@ -411,7 +441,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.verifyPasswordResetCode(dispatch, firebase, code)
/**
- * @description Update user profile on Firebase Real Time Database or
+ * Update user profile on Firebase Real Time Database or
* Firestore (if `useFirestoreForProfile: true` config passed to
* reactReduxFirebase). Real Time Database update uses `update` method
* internally while updating profile on Firestore uses `set` with
@@ -429,7 +459,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.updateProfile(dispatch, firebase, profileUpdate, options)
/**
- * @description Update Auth Object
+ * Update Auth Object
* @param {Object} authUpdate - Update to be auth object
* @param {Boolean} updateInProfile - Update in profile
* @return {Promise}
@@ -438,7 +468,7 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.updateAuth(dispatch, firebase, authUpdate, updateInProfile)
/**
- * @description Update user's email
+ * Update user's email
* @param {String} newEmail - Update to be auth object
* @param {Boolean} updateInProfile - Update in profile
* @return {Promise}
@@ -447,13 +477,13 @@ export default function createFirebaseInstance(firebase, configs, dispatch) {
authActions.updateEmail(dispatch, firebase, newEmail, updateInProfile)
/**
- * @description Reload user's auth object. Must be authenticated.
+ * Reload user's auth object. Must be authenticated.
* @return {Promise}
*/
const reloadAuth = () => authActions.reloadAuth(dispatch, firebase)
/**
- * @description Links the user account with the given credentials.
+ * Links the user account with the given credentials.
* @param {firebase.auth.AuthCredential} credential - The auth credential
* @return {Promise}
*/
diff --git a/src/firebaseConnect.js b/src/firebaseConnect.js
index a35e1a5f5..b86a61c88 100644
--- a/src/firebaseConnect.js
+++ b/src/firebaseConnect.js
@@ -6,13 +6,8 @@ import { watchEvents, unWatchEvents } from './actions/query'
import { getEventsFromInput, createCallable, wrapDisplayName } from './utils'
import ReactReduxFirebaseContext from './ReactReduxFirebaseContext'
-// Reserved props that should not be passed into a firebaseConnect wrapped
-// component. Will throw an error if they are.
-const RESERVED_PROPS = ['firebase', 'dispatch']
-
/**
- * @name createFirebaseConnect
- * @description Function that creates a Higher Order Component that
+ * Function that creates a Higher Order Component which
* automatically listens/unListens to provided firebase paths using
* React's Lifecycle hooks.
* **WARNING!!** This is an advanced feature, and should only be used when
@@ -103,13 +98,9 @@ export const createFirebaseConnect = (storeKey = 'store') => (
// Check that reserved props are not supplied to a FirebaseConnected
// component and if they are, throw an error so the developer can rectify
// this issue.
- const clashes = Object.keys(props).filter(k => RESERVED_PROPS.includes(k))
-
- if (clashes.length > 0) {
+ if (Object.keys(props).includes('firebase')) {
throw new Error(
- `Supplied prop/s "${clashes.join(
- '", "'
- )}" are reserved for internal firebaseConnect() usage.`
+ `Supplied prop "firebase" is reserved for internal firebaseConnect() usage.`
)
}
@@ -117,9 +108,9 @@ export const createFirebaseConnect = (storeKey = 'store') => (
{_internalFirebase => (
)}
@@ -161,7 +152,7 @@ export const createFirebaseConnect = (storeKey = 'store') => (
* ]),
* connect((state) => ({
* todos: state.firebase.ordered.todos
- * })
+ * }))
* )
*
* // use enhnace to pass todos list as props.todos
@@ -180,17 +171,19 @@ export const createFirebaseConnect = (storeKey = 'store') => (
* const enhance = compose(
* firebaseConnect((props) => ([
* `posts/${props.postId}` // sync /posts/postId from firebase into redux
- * ]),
+ * ])),
* connect((state, props) => ({
* post: getVal(state.firebase.data, `posts/${props.postId}`),
- * })
+ * }))
* )
*
- * const Post = ({ post }) => (
- *
- * {JSON.stringify(post, null, 2)}
- *
- * )
+ * function Post({ post }) {
+ * return (
+ *
+ * {JSON.stringify(post, null, 2)}
+ *
+ * )
+ * }
*
* export default enhance(Post)
*/
diff --git a/src/firestoreConnect.js b/src/firestoreConnect.js
index 0dc04d752..c82802f43 100644
--- a/src/firestoreConnect.js
+++ b/src/firestoreConnect.js
@@ -6,9 +6,12 @@ import { createCallable, wrapDisplayName } from './utils'
import ReduxFirestoreContext from './ReduxFirestoreContext'
import ReactReduxFirebaseContext from './ReactReduxFirebaseContext'
+// Reserved props that should not be passed into a firebaseConnect wrapped
+// component. Will throw an error if they are.
+const RESERVED_PROPS = ['firebase', 'firestore']
+
/**
- * @name createFirestoreConnect
- * @description Function that creates a Higher Order Component that
+ * Function that creates a Higher Order Component which
* automatically listens/unListens to provided firebase paths using
* React's Lifecycle hooks.
* **WARNING!!** This is an advanced feature, and should only be used when
@@ -95,22 +98,38 @@ export const createFirestoreConnect = (storeKey = 'store') => (
const HoistedComp = hoistStatics(FirestoreConnectWrapped, WrappedComponent)
- const FirestoreConnect = props => (
-
- {firebase => (
-
- {firestore => (
-
- )}
-
- )}
-
- )
+ const FirestoreConnect = props => {
+ // Check that reserved props are not supplied to a FirebaseConnected
+ // component and if they are, throw an error so the developer can rectify
+ // this issue.
+ const clashes = Object.keys(props).filter(k => RESERVED_PROPS.includes(k))
+
+ if (clashes.length > 0) {
+ const moreThanOne = clashes.length > 1
+ throw new Error(
+ `Supplied prop${moreThanOne ? 's' : ''} "${clashes.join('", "')}" ${
+ moreThanOne ? 'are' : 'is'
+ } reserved for internal firestoreConnect() usage.`
+ )
+ }
+
+ return (
+
+ {firebase => (
+
+ {firestore => (
+
+ )}
+
+ )}
+
+ )
+ }
FirestoreConnect.displayName = wrapDisplayName(
WrappedComponent,
diff --git a/src/helpers.js b/src/helpers.js
index aaeb697d3..234ffd0a8 100644
--- a/src/helpers.js
+++ b/src/helpers.js
@@ -85,7 +85,7 @@ export function getVal(firebase, path, notSetValue) {
}
/**
- * @description Detect whether items are loaded yet or not
+ * @description Detect whether data from redux state is loaded yet or not
* @param {Object} item - Item to check loaded status of. A comma separated
* list is also acceptable.
* @return {Boolean} Whether or not item is loaded
@@ -94,7 +94,8 @@ export function getVal(firebase, path, notSetValue) {
* import PropTypes from 'prop-types'
* import { compose } from 'redux'
* import { connect } from 'react-redux'
- * import { firebaseConnect, isLoaded, isEmpty } from 'react-redux-firebase'
+ * import firebaseConnect from 'react-redux-firebase/lib/firebaseConnect'
+ * import { isLoaded, isEmpty } from 'react-redux-firebase/lib/utils'
*
* const enhance = compose(
* firebaseConnect(['todos']),
@@ -103,7 +104,7 @@ export function getVal(firebase, path, notSetValue) {
* }))
* )
*
- * const Todos = ({ todos }) => {
+ * function Todos({ todos }) {
* // Message for if todos are loading
* if(!isLoaded(todos)) {
* return Loading...
diff --git a/src/useFirestore.js b/src/useFirestore.js
index 9c275dbe9..a6b70acc7 100644
--- a/src/useFirestore.js
+++ b/src/useFirestore.js
@@ -32,7 +32,7 @@ export const createUseFirestore = () => () => {
* Firestore instance is gathered from `store.firestore`, which is attached
* to store by the store enhancer (`reduxFirestore`) during setup of
* [`redux-firestore`](https://github.com/prescottprue/redux-firestore)
- * @return {Function} - Firestore instance
+ * @return {Object} - Firestore instance
* @example
Basic
* import React from 'react'
* import { useFirestore } from 'react-redux-firebase'
diff --git a/src/useFirestoreConnect.js b/src/useFirestoreConnect.js
index 19d3eaea4..9c7ca8ad2 100644
--- a/src/useFirestoreConnect.js
+++ b/src/useFirestoreConnect.js
@@ -4,15 +4,14 @@ import { createCallable } from './utils'
import useFirestore from './useFirestore'
/**
- * @name createUseFirestoreConnect
* @description React hook that automatically listens/unListens to provided
- * firebase paths.
+ * firestore paths.
* **WARNING!!** This is an advanced feature, and should only be used when
* needing to access a firebase instance created under a different store key.
- * Firebase state (state.firebase)
+ * Firestore state (state.firestore)
* @return {Function} - React hook that accepts watch query
* @example
Basic
- * // props.firebase set on App component as firebase object with helpers
+ * // props.firestore set on App component as firebase object with helpers
* import { createUseFirestoreConnect } from 'react-redux-firebase'
*
* const firestoreConnect = createUseFirestoreConnect()
@@ -65,10 +64,10 @@ export const createUseFirestoreConnect = () => dataOrFn => {
* import React from 'react'
* import { map } from 'lodash'
* import { connect } from 'react-redux'
- * import { useFirebaseConnect } from 'react-redux-firebase'
+ * import { useFirestoreConnect } from 'react-redux-firebase'
*
- * const TodosList = ({ todosList }) => {
- * useFirebaseConnect('todos') // sync todos collection from Firestore into redux
+ * function TodosList({ todosList }) {
+ * useFirestoreConnect('todos') // sync todos collection from Firestore into redux
*
* return
{_.map(todosList, todo =>
{todo}
)}
* }
@@ -83,17 +82,17 @@ export const createUseFirestoreConnect = () => dataOrFn => {
* import React, { useMemo } from 'react'
* import { get } from 'lodash'
* import { connect } from 'react-redux'
- * import { useFirebaseConnect } from 'react-redux-firebase'
+ * import { useFirestoreConnect } from 'react-redux-firebase'
*
- * const TodoItem = ({ todoId, todoData }) => {
- * cosnt query = useMemo( // Make sure that everytime component rerender will not create a new query object which cause unnecessary set/unset listener
+ * function TodoItem({ todoId, todoData }) {
+ * const query = useMemo( // Make sure that everytime component rerender will not create a new query object which cause unnecessary set/unset listener
* () => ({
* collection: 'todos',
* doc: todoId
* }),
* [todoId] // useMemo's dependency
* )
- * useFirebaseConnect(query) // sync todos collection from Firestore into redux
+ * useFirestoreConnect(query) // sync todos collection from Firestore into redux
*
* return