v2.0.0-beta.13 (#306)

* fix(reducers): add `EMPTY_AUTH_CHANGE` case to Profile Reducer - #305 
* feat(constants): `enableEmptyAuthChanges` config option replaced by `preserveOnEmptyAuthChange`  - #305 
* feat(profile): `autoPopulateProfile` support for v2 (still `disabled` by default)
* fix(presence): support presence option on `react-native-firebase` versions without `setPriority` on `RNFirebase.database.ThenableReference` - #267
* fix(core): withFirebase now works for all main methods
* feat(examples): material example updated to be much more simple (uses mostly functional components over classes)
* feat(docs): `promiseEvents` added to SSR docs - #299

Author: prescottprue

.codeclimate.yml

@@ -3,7 +3,7 @@ languages:
 
 exclude_paths:
 - "lib/**"
-- "test/**"
+- "tests/**"
 - "examples/**"
 - "LICENSE"
 - "LICENSE.md"

README.md

@@ -36,25 +36,20 @@ The [Material Example](https://github.com/prescottprue/react-redux-firebase/tree
 ## Install
 
 ```bash
-npm install --save react-redux-firebase
+npm install --save react-redux-firebase@next
 ```
 
 ## Use
 
-Include `reactReduxFirebase` in your store compose function and  `firebaseStateReducer` in your reducers:
+Include `reactReduxFirebase` in your store compose function and  `firebaseReducer` in your reducers:
 
 ```javascript
 import { createStore, combineReducers, compose } from 'redux'
-import { reactReduxFirebase, firebaseStateReducer } from 'react-redux-firebase'
+import { reactReduxFirebase, firebaseReducer } from 'react-redux-firebase'
 import firebase from 'firebase'
 // import 'firebase/firestore' // <- needed if using firestore
 
-const firebaseConfig = {
-  apiKey: '<your-api-key>',
-  authDomain: '<your-auth-domain>',
-  databaseURL: '<your-database-url>',
-  storageBucket: '<your-storage-bucket>'
-}
+const firebaseConfig = {}
 
 // react-redux-firebase config
 const rrfConfig = {
@@ -279,8 +274,6 @@ Thank you to all our backers! 🙏
 
 * [Reside Network Inc.](https://github.com/reside-eng)
 
-<a href="https://opencollective.com/react-redux-firebase#backers" target="_blank"><img src="https://opencollective.com/react-redux-firebase/backers.svg?width=890"></a>
-
 [npm-image]: https://img.shields.io/npm/v/react-redux-firebase.svg?style=flat-square
 [npm-url]: https://npmjs.org/package/react-redux-firebase
 [npm-downloads-image]: https://img.shields.io/npm/dm/react-redux-firebase.svg?style=flat-square

SUMMARY.md

@@ -17,7 +17,6 @@
   * [Populate](/docs/recipes/populate.md)
   * [Upload](/docs/recipes/upload.md)
   * [Server Side Rendering](/docs/recipes/ssr.md)
-  * [Performance](/docs/recipes/performance.md)
 * [Integrations](/docs/integrations/README.md)
   * [Redux Thunk](/docs/integrations/thunks.md)
   * [Redux Form](/docs/integrations/redux-form.md)

docs/api/constants.md

@@ -92,8 +92,12 @@ Default configuration options
 -   `preserveOnLogout` **([Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) \| [Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object))** `null` Data parameters to
     preserve when logging out. If Array is passed, each item represents keys
     within state.firebase.data preserve. If an object is passed, Keys associate
-    with parts of state to preserve, and the values are Arrays which
-    associate with which keys to preserve form that section of state.
+    with parts of state to preserve, and the values are Arrays contain keys
+    for keys within that slice of state to preserve.
+-   `preserveOnEmptyAuthChange` **[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)** `null` Data parameters to
+    preserve when logging out. Keys associate with parts of state to preserve,
+    and the values are Arrays contain keys for keys within that slice of state
+    to preserve.
 -   `updateProfileOnLogin` **[Boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** `true` Whether or not to update
     user profile when logging in.
 -   `resetBeforeLogin` **[Boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** `true` Whether or not to reset auth

docs/api/enhancer.md

@@ -35,15 +35,14 @@ along side applyMiddleware.
         with parts of state to preserve, and the values are Arrays which
         associate with which keys to preserve form that section of state.
         (default: `null`)
+    -   `config.preserveOnEmptyAuthChange` **[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)** `null` Data parameters to
+        preserve when logging out. Keys associate with parts of state to preserve,
+        and the values are Arrays contain keys for keys within that slice of state
+        to preserve.
     -   `config.enableRedirectHandling` **[Boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Whether or not to enable
         auth redirect handling listener. (default: `true`)
     -   `config.onAuthStateChanged` **[Function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function)** Function run when auth state
         changes. Argument Pattern: `(authData, firebase, dispatch)`
-    -   `config.enableEmptyAuthChanges` **[Boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Whether or not to enable
-        empty auth changes. When set to true, `onAuthStateChanged` will be fired with,
-        empty auth changes such as undefined on initialization. See
-        [#137](https://github.com/prescottprue/react-redux-firebase/issues/137) for
-        more details. (default: `false`)
     -   `config.onRedirectResult` **[Function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function)** Function run when redirect
         result is returned. Argument Pattern: `(authData, firebase, dispatch)`
     -   `config.customAuthParameters` **[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)** Object for setting which

docs/api/helpers.md

@@ -66,7 +66,7 @@ const defaultValue = {
  }
 }
 const enhance = compose(
-  firebaseConnect(['/todos/user1'])
+  firebaseConnect(['/todos/user1']),
   connect(({ firebase }) => ({
     // this.props.todos loaded from state.firebase.data.todos
     todos: getVal(firebase, 'data/todos/user1', defaultValue)

docs/integrations/redux-saga.md

@@ -45,5 +45,4 @@ export default (initialState = {}, history) => {
 
 // when calling saga, pass getFirebase
 sagaMiddleware.run(helloSaga, getFirebase)
-
 ```

docs/recipes/thunks.md renamed to docs/integrations/thunks.md

@@ -2,23 +2,31 @@
 
 Populate allows you to replace IDs within your data with other data from Firebase. This is very useful when trying to keep your data flat. Some would call it a _join_, but it was modeled after [the mongo populate method](http://mongoosejs.com/docs/populate.html).
 
-Initial data from populate is placed into redux in a normalized pattern [following defined redux practice of normalizing](http://redux.js.org/docs/recipes/reducers/NormalizingStateShape.html). `populatedDataToJS` helper used in the `connect` function then builds populated data out of normalized data within redux (**NOTE:** This does not apply if you are using `v1.1.5` or earlier).
+Initial data from populate is placed into redux in a normalized pattern [following defined redux practice of normalizing](http://redux.js.org/docs/recipes/reducers/NormalizingStateShape.html). `populate` helper used within the `connect` function then builds populated data out of normalized data within redux (**NOTE:** This does not apply if you are using `v1.1.5` or earlier).
 
 A basic implementation can look like so:
 ```javascript
+import { compose } from 'redux'
+import { connect } from 'react-redux'
+import { firebaseConnect } from 'react-redux-firebase'
+
 const populates = [
   { child: 'owner', root: 'users' } // replace owner with user object
 ]
 
-@firebaseConnect([
-  // passing populates parameter also creates all necessary child queries
-  { path: 'todos', populates }
-])
-@connect(({ firebase }) => ({
-  // populate original from data within separate paths redux
-  todos: populate(firebase, 'todos', populates),
-  // dataToJS(firebase, 'todos') for unpopulated todos
-}))
+const enhance = compose(
+  firebaseConnect([
+    // passing populates parameter also creates all necessary child queries
+    { path: 'todos', populates }
+  ]),
+  connect(({ firebase }) => ({
+    // populate original from data within separate paths redux
+    todos: populate(firebase, 'todos', populates),
+    // firebase.ordered.todos or firebase.data.todos for unpopulated todos
+  }))
+)
+
+export default enhance(SomeComponent)
 ```
 
 ## Some Things To Note
@@ -73,14 +81,16 @@ When trying to replace the owner parameter with a string such as a displayName f
 const populates = [
   { child: 'owner', root: 'displayNames' }
 ]
-@firebaseConnect([
-  { path: '/todos', populates }
-  // '/todos#populate=owner:displayNames', // equivalent string notation
-])
-@connect(
-  ({ firebase }) => ({
-    todos: populate(firebase, 'todos', populates),
-  })
+const enhance = compose(
+  firebaseConnect([
+    { path: '/todos', populates }
+    // '/todos#populate=owner:displayNames', // equivalent string notation
+  ]),
+  connect(
+    ({ firebase }) => ({
+      todos: populate(firebase, 'todos', populates),
+    })
+  )
 )
 ```
 
@@ -100,14 +110,16 @@ Population can also be used to populate a parameter with an object. An example o
 const populates = [
   { child: 'owner', root: 'users' }
 ]
-@firebaseConnect([
-  { path: '/todos', populates }
-  // '/todos#populate=owner:users' // equivalent string notation
-])
-@connect(
-  ({ firebase }) => ({
-    todos: populate(firebase, 'todos', populates),
-  })
+const enhance = compose(
+  firebaseConnect([
+    { path: '/todos', populates }
+    // '/todos#populate=owner:users' // equivalent string notation
+  ]),
+  connect(
+    ({ firebase }) => ({
+      todos: populate(firebase, 'todos', populates),
+    })
+  )
 )
 ```
 
@@ -132,14 +144,16 @@ Often when populating, you will want to keep the key that was originally there (
 const populates = [
   { child: 'owner', root: 'users', keyProp: 'key' }
 ]
-@firebaseConnect([
-  { path: '/todos', populates }
-  // '/todos#populate=owner:users' // equivalent string notation
-])
-@connect(
-  ({ firebase }) => ({
-    todos: populatedDataToJS(firebase, 'todos', populates),
-  })
+
+const enhance = compose(
+  firebaseConnect([
+    { path: '/todos', populates }
+  ]),
+  connect(
+    ({ firebase }) => ({
+      todos: populate(firebase, 'todos', populates),
+    })
+  )
 )
 ```
 
@@ -165,14 +179,17 @@ There is also the option to load a parameter from within a population object. An
 const populates = [
   { child: 'owner', root: 'users', childParam: 'email' }
 ]
-@firebaseConnect([
- { path: '/todos', populates }
- // '/todos#populate=owner:users:email' // equivalent string notation
-])
-@connect(
-  ({ firebase }) => ({
-    todos: populate(firebase, 'todos', populates),
-  })
+
+const enhance = compose(
+  firebaseConnect([
+   { path: '/todos', populates }
+   // '/todos#populate=owner:users:email' // equivalent string notation
+  ]),
+  connect(
+    ({ firebase }) => ({
+      todos: populate(firebase, 'todos', populates),
+    })
+  )
 )
 ```
 
@@ -197,8 +214,7 @@ Populating username with username from usernames ref.
 const config = {
   userProfile: 'users',
   profileParamsToPopulate: [
-    'displayName:displayNames',
-    // { child: 'displayName', root: 'displayNames' } // object notation
+    { child: 'displayName', root: 'displayNames' } // object notation
   ]
 }
 ```
@@ -215,6 +231,7 @@ const config = {
   }
 }
 ```
+
 ##### Example Result
 
 ```javascript

docs/populate.md

@@ -4,45 +4,10 @@
 
 Firebase Real Time Database queries can be created in two ways:
 
-* Automatically - Using `firebaseConnect` HOC (manages mounting/unmounting)
-* Manually - Using `watchEvents` or `watchEvent` (requires managing of listeners)
+* [Manually](#manual) - Using `watchEvents` or `watchEvent` (requires managing of listeners)
+* [Automatically](#auto) - Using `firebaseConnect` HOC (manages mounting/unmounting)
 
-### Automatically
-
-`firebaseConnect` accepts an array of paths for which to create queries. When listening to paths, it is possible to modify the query with any of [Firebase's included query methods](https://firebase.google.com/docs/reference/js/firebase.database.Query).
-
-**NOTE:**
-By default the results of queries are stored in redux under the path of the query. If you would like to change where the query results are stored in redux, use [`storeAs` (more below)](#storeAs).
-
-Below are examples using Firebase query methods as well as other methods that are included (such as 'populate').
-
-`firebaseConnect` is a Higher Order Component (wraps a provided component) that attaches listeners to relevant paths on Firebase when mounting, and removes them when unmounting.
-
-**storeAs**
-
-Data is stored in redux under the path of the query for convince. This means that two different queries to the same path (i.e. `todos`) will both place data into `state.data.todos` even if their query parameters are different. If you would like to store your query somewhere else in redux, use `storeAs`:
-
-```js
-compose(
-  firebaseConnect([
-    {
-      path: 'todos',
-      storeAs: 'myTodos', // place in redux under "myTodos"
-      queryParams: ['orderByChild=createdBy', 'equalTo=123someuid'],
-    }
-    {
-      path: 'todos',
-      queryParams: ['limitToFirst=20'],
-    }
-  ]),
-  connect((state) => ({
-    myTodos: state.firebase.data.myTodos, // due to storeAs
-    allTodos: state.firebase.data.todos // state.firebase.data.todos since no storeAs
-  }))
-)
-```
-
-### Manually
+### Manually {#manual}
 
 Queries can be created manually by using `watchEvent` or `watchEvents`. This is useful to load data on some event such as a button click.
 
@@ -88,6 +53,43 @@ export default compose(
 
 **Fun Fact** - `firebaseConnect` actually calls `watchEvents` internally on component mount/unmount and when props change
 
+Though doing things manually is great to understand what is going on, it comes with the need to manage these listeners yourself.
+
+### Automatically {#auto}
+
+`firebaseConnect` accepts an array of paths for which to create queries. When listening to paths, it is possible to modify the query with any of [Firebase's included query methods](https://firebase.google.com/docs/reference/js/firebase.database.Query).
+
+**NOTE:**
+By default the results of queries are stored in redux under the path of the query. If you would like to change where the query results are stored in redux, use [`storeAs` (more below)](#storeAs).
+
+Below are examples using Firebase query methods as well as other methods that are included (such as 'populate').
+
+`firebaseConnect` is a Higher Order Component (wraps a provided component) that attaches listeners to relevant paths on Firebase when mounting, and removes them when unmounting.
+
+**storeAs**
+
+Data is stored in redux under the path of the query for convince. This means that two different queries to the same path (i.e. `todos`) will both place data into `state.data.todos` even if their query parameters are different. If you would like to store your query somewhere else in redux, use `storeAs`:
+
+```js
+compose(
+  firebaseConnect([
+    {
+      path: 'todos',
+      storeAs: 'myTodos', // place in redux under "myTodos"
+      queryParams: ['orderByChild=createdBy', 'equalTo=123someuid'],
+    }
+    {
+      path: 'todos',
+      queryParams: ['limitToFirst=20'],
+    }
+  ]),
+  connect((state) => ({
+    myTodos: state.firebase.data.myTodos, // due to storeAs
+    allTodos: state.firebase.data.todos // state.firebase.data.todos since no storeAs
+  }))
+)
+```
+
 ## Ordered vs Data (by key)
 
 ### data {#data}
@@ -280,10 +282,10 @@ Start query at a specific location by providing the specific number or value
   ```
 3. Non-number values
 ```js
-@firebaseConnect([
+firebaseConnect([
   'todos#startAt=val1&limitToFirst=10'
   // { path: '/todos', queryParams: [ 'startAt=5', 'limitToFirst=10' ] } // object notation
-])
+])(SomeComponent)
 ```
 
 ## endAt
@@ -361,3 +363,23 @@ compose(
   }))
 )
 ```
+
+## storeAs {#storeAs}
+
+By default the results of queries are stored in redux under the path of the query. If you would like to change where the query results are stored in redux, use `storeAs`:
+
+#### Examples
+1. Querying the same path with different query parameters
+
+```js
+compose(
+  firebaseConnect(props => [
+    { path: 'projects' }
+    { path: 'projects', storeAs: 'myProjects', queryParams: ['orderByChild=uid', '123'] }
+  ]),
+  connect(({ firebase }, props) => ({
+    projects: populatedDataToJS(firebase, 'projects'),
+    myProjects: populatedDataToJS(firebase, 'myProjects'), // use storeAs path to gather from redux
+  }))
+)
+```