v2.0.5

v2.0.5

Author: prescottprue

.prettierrc

@@ -0,0 +1,3 @@
+singleQuote: true
+semi: false
+trailingComma: 'none'

README.md

@@ -30,12 +30,16 @@ The [Material Example](https://github.com/prescottprue/react-redux-firebase/tree
 - Server Side Rendering Support
 - [`react-native` support](/docs/recipes/react-native.md) using [native modules](http://docs.react-redux-firebase.com/history/v2.0.0/docs/recipes/react-native.html#native-modules) or [web sdk](/docs/recipes/react-native.md#jsweb)
 
-## Install
+## Installation
 
 ```bash
 npm install --save react-redux-firebase
 ```
 
+This assumes you are using [npm](https://www.npmjs.com/) as your package manager.
+
+If you're not, you can access the library on [unpkg](https://unpkg.com/redux-firestore@latest/dist/redux-firestore.min.js), download it, or point your package manager to it. Theres more on this in the [Builds section below](#builds).
+
 ## Use
 
 Include `reactReduxFirebase` (store enhancer) and  `firebaseReducer` (reducer) while creating your redux store:
@@ -58,7 +62,7 @@ const rrfConfig = {
 }
 
 // initialize firebase instance
-firebase.initializeApp(config) // <- new to v2.*.*
+firebase.initializeApp(firebaseConfig)
 
 // initialize firestore
 // firebase.firestore() // <- needed if using firestore
@@ -116,7 +120,7 @@ const Todos = ({ firebase }) => {
 }
 
 export default withFirebase(Todos)
-// or firebaseConnect()(Todos) if attaching listeners
+// or firebaseConnect()(Todos)
 ```
 
 **Load Data (listeners automatically managed on mount/unmount)**
@@ -157,12 +161,10 @@ export default compose(
   firebaseConnect([
     'todos' // { path: '/todos' } // object notation
   ]),
-  connect(
-    (state) => ({
-      todos: state.firebase.data.todos,
-      // profile: state.firebase.profile // load profile
-    })
-  )
+  connect((state) => ({
+    todos: state.firebase.data.todos,
+    // profile: state.firebase.profile // load profile
+  }))
 )(Todos)
 ```
 
@@ -250,6 +252,14 @@ export default compose(
 )(Todos)
 ```
 
+## Firestore
+
+If you plan to use Firestore, you should checkout [`redux-firestore`][redux-firestore]. It integrates nicely with `react-redux-firebase` and it allows you to run Real Time Database and Firestore along side each other.
+
+`react-redux-firebase` provides the `firestoreConnect` HOC (similar to `firebaseConnect`) for easy setting/unsetting of listeners.
+
+Currently `react-redux-firebase` still handles auth when using [`redux-firestore`][redux-firestore] - The future plan is to also have auth standalone auth library that will allow the developer to choose which pieces they do/do not want.
+
 ## [Docs](http://react-redux-firebase.com)
 See full documentation at [react-redux-firebase.com](http://react-redux-firebase.com)
 
@@ -262,11 +272,18 @@ See full documentation at [react-redux-firebase.com](http://react-redux-firebase
 
 ## [Examples](examples)
 
-Examples folder is broken into two categories [complete](https://github.com/prescottprue/react-redux-firebase/tree/master/examples/complete) and [snippets](https://github.com/prescottprue/react-redux-firebase/tree/master/examples/snippets). `/complete` contains full applications that can be run as is, while `/snippets` contains small amounts of code to show functionality (dev tools and deps not included).
+### Real World Applications
+* [fireadmin.io](http://fireadmin.io) - Firebase Instance Management Tool (source [available here](https://github.com/prescottprue/fireadmin))
+
+If you would like a project added to this section please reach out [over gitter][gitter-url]
+
+### [Examples Folder](examples)
+
+Examples folder is broken into two categories [snippets](examples/snippets) and [complete](examples/complete). `/complete` contains full applications that can be run as is, where as `/snippets` contains small amounts of code to highlight specific functionality (dev tools and deps not included).
 
 #### [State Based Query Snippet](examples/snippets/stateBasedQuery)
 
-Snippet showing querying based on data in redux state. One of the most common examples of this is querying based on the current users auth UID.
+Snippet showing querying based on data in redux state. One of the more common examples is querying based on the current users auth UID.
 
 #### [Decorators Snippet](examples/snippets/decorators)
 
@@ -294,17 +311,9 @@ View docs for recipes on integrations with:
 * [redux-saga](http://react-redux-firebase.com/docs/integrations/redux-saga.md)
 * [redux-form](http://react-redux-firebase.com/docs/integrations/redux-form.md)
 * [redux-auth-wrapper](http://react-redux-firebase.com/docs/integrations/routing.md#advanced)
-* [redux-persist](http://react-redux-firebase.com/docs/integrations/redux-persist.md) - [improved integration with `v2.0.0`](http://react-redux-firebase.com/docs/integrations/redux-persist.html)
+* [redux-persist](http://react-redux-firebase.com/docs/integrations/redux-persist.md)
 * [react-native](/docs/integrations/react-native.md)
-* [react-native-firebase](http://react-redux-firebase.com/docs/integrations/react-native.html#native-modules) - requires `v2.0.0`
-
-## Firestore
-
-If you plan to use Firestore, you should checkout [`redux-firestore`][redux-firestore]. It integrates nicely with `react-redux-firebase` (v2 only) and it allows you to run Real Time Database and Firestore along side each other.
-
-`react-redux-firebase` provides the `firestoreConnect` HOC (similar to `firebaseConnect`) for easy setting/unsetting of listeners.
-
-Currently `react-redux-firebase` still handles auth when using [`redux-firestore`][redux-firestore] - The future plan is to also have auth standalone auth library that will allow the developer to choose which pieces they do/do not want.
+* [react-native-firebase](http://react-redux-firebase.com/docs/integrations/react-native.html#native-modules)
 
 ## Starting A Project
 
@@ -316,10 +325,26 @@ Currently `react-redux-firebase` still handles auth when using [`redux-firestore
 
 The [examples folder](/examples) contains full applications that can be copied/adapted and used as a new project.
 
-### FAQ
+## FAQ
 
 Please visit the [FAQ section of the docs](http://docs.react-redux-firebase.com/history/v2.0.0/docs/FAQ.html)
 
+## Builds
+
+Most commonly people consume Redux Firestore as a [CommonJS module](http://webpack.github.io/docs/commonjs.html). This module is what you get when you import redux in a Webpack, Browserify, or a Node environment.
+
+If you don't use a module bundler, it's also fine. The redux-firestore npm package includes precompiled production and development [UMD builds](https://github.com/umdjs/umd) in the [dist folder](https://unpkg.com/redux-firestore@latest/dist/). They can be used directly without a bundler and are thus compatible with many popular JavaScript module loaders and environments. For example, you can drop a UMD build as a `<script>` tag on the page. The UMD builds make Redux Firestore available as a `window.ReduxFirestore` global variable.
+
+It can be imported like so:
+
+```html
+<script src="../node_modules/react-redux-firebase/dist/react-redux-firebase.min.js"></script>
+<!-- or through cdn: <script src="https://unpkg.com/react-redux-firebase@latest/dist/react-redux-firebase.min.js"></script> -->
+<script>console.log('react redux firebase:', window.ReactReduxFirebase)</script>
+```
+
+Note: In an effort to keep things simple, the wording from this explanation was modeled after [the installation section of the Redux Docs](https://redux.js.org/#installation).
+
 ## Contributors
 
 This project exists thanks to all the people who contribute.

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "react-redux-firebase",
-  "version": "2.0.4",
+  "version": "2.0.5",
   "description": "Redux integration for Firebase. Comes with a Higher Order Components for use with React.",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -11,7 +11,7 @@
     "clean": "rimraf es lib dist coverage",
     "lint": "eslint src/** test/unit/** test/setup.js",
     "lint:fix": "npm run lint -- --fix",
-    "format": "prettier --single-quote --no-semi --trailing-comma none --write \"src/**/*.js\" \"test/**/*.js\"",
+    "format": "prettier --write \"src/**/*.js\" \"test/**/*.js\"",
     "test": "mocha -R spec ./test/unit/**",
     "test:cov": "istanbul cover ./node_modules/mocha/bin/_mocha ./test/unit/**",
     "codecov": "cat coverage/lcov.info | codecov",

package.json

@@ -53,7 +53,6 @@ export const createFirestoreConnect = (storeKey = 'store') => (
       }
     }
 
-    // TODO: Re-attach listeners on query path change
     componentWillReceiveProps(np) {
       const { firebase, firestore } = this.store
       const inputAsFunc = createCallable(dataOrFn)

src/firestoreConnect.js

@@ -189,7 +189,7 @@ const buildChildList = (state, list, p) =>
   mapValues(list, (val, key) => {
     let getKey = val
     // Handle key: true lists
-    if (val === true) {
+    if (val === true || p.populateByKey) {
       getKey = key
     }
     // Allow for aliasing populated data see #126 for more details
@@ -210,7 +210,7 @@ const buildChildList = (state, list, p) =>
         : get(state.data, pathString)
     }
     // Populate child does not exist
-    return val === true ? val : getKey
+    return val === true || p.populateByKey ? val : getKey
   })
 
 /**

src/helpers.js

@@ -108,7 +108,7 @@ export const populateList = (firebase, list, p, results) => {
   return Promise.all(
     map(list, (id, childKey) => {
       // handle list of keys
-      const populateKey = id === true ? childKey : id
+      const populateKey = id === true || p.populateByKey ? childKey : id
       return getPopulateChild(firebase, p, populateKey).then(pc => {
         if (pc) {
           // write child to result object under root name if it is found

src/utils/populate.js

@@ -25,6 +25,10 @@ export const exampleData = {
         collaborators: {
           ABC: true,
           abc: true
+        },
+        nonKeyTrue: {
+          ABC: 10,
+          abc: 'testing'
         }
       },
       QRS: {
@@ -77,6 +81,10 @@ export const exampleData = {
       tester: {
         somePermission: true
       }
+    },
+    nonKeyTrue: {
+      ABC: 10,
+      abc: 'testing'
     }
   },
   ordered: {

test/mockData.js

@@ -17,6 +17,7 @@ import {
   confirmPasswordReset,
   verifyPasswordResetCode
 } from '../../../src/actions/auth'
+import { cloneDeep } from 'lodash'
 import { actionTypes } from '../../../src/constants'
 import {
   fakeFirebase,
@@ -50,7 +51,11 @@ const addSpyWithArgsToAuthMethod = (methodName, spyFunc, args = []) => ({
     [methodName]: () => spyFunc(args)
   })
 })
-const fakeLogin = { email: '[email protected]', password: 'asdfasdf', role: 'admin' }
+const fakeLogin = {
+  email: '[email protected]',
+  password: 'asdfasdf',
+  role: 'admin'
+}
 
 describe('Actions: Auth -', () => {
   beforeEach(() => {
@@ -72,6 +77,19 @@ describe('Actions: Auth -', () => {
       unWatchUserProfile(fakeFirebase)
       expect(fakeFirebase._.profileWatch).to.equal(null)
     })
+
+    it('calls profile watch then sets to null when useFirestoreForProfile: true', () => {
+      let profileCalled
+      let currentFake = cloneDeep(fakeFirebase)
+      currentFake._.profileWatch = () => {
+        profileCalled = true
+      }
+      currentFake._.config.useFirestoreForProfile = true
+      currentFake.firestore = {}
+      unWatchUserProfile(currentFake)
+      expect(currentFake._.profileWatch).to.equal(null)
+      expect(profileCalled).to.equal(true)
+    })
   })
 
   describe('handleProfileWatchResponse -', () => {
@@ -82,7 +100,46 @@ describe('Actions: Auth -', () => {
       profile = { email: '[email protected]' }
       profileSnap = { val: () => profile }
     })
+
+    describe('dispatches SET_PROFILE with profile', () => {
+      it('from RTDB data', () => {
+        firebase._.config.profileParamsToPopulate = undefined
+        handleProfileWatchResponse(dispatchSpy, firebase, profileSnap)
+        expect(dispatchSpy).to.be.calledWith({
+          type: actionTypes.SET_PROFILE,
+          profile
+        })
+      })
+
+      it('from Firestore data', () => {
+        firebase._.config.profileParamsToPopulate = undefined
+        const firestoreProfileSnap = { data: () => profile, exists: true }
+        handleProfileWatchResponse(dispatchSpy, firebase, firestoreProfileSnap)
+        expect(dispatchSpy).to.be.calledWith({
+          type: actionTypes.SET_PROFILE,
+          profile
+        })
+      })
+
+      it('that is an empty object (sets profile to null)', () => {
+        firebase._.config.profileParamsToPopulate = undefined
+        handleProfileWatchResponse(dispatchSpy, firebase, {})
+        expect(dispatchSpy).to.be.calledWith({
+          type: actionTypes.SET_PROFILE,
+          profile: null
+        })
+      })
+    })
+
     describe('profileParamsToPopulate setting -', () => {
+      let consoleWarnSpy
+
+      beforeEach(() => {
+        consoleWarnSpy = sinon.spy(console, 'warn')
+      })
+      afterEach(() => {
+        consoleWarnSpy.restore()
+      })
       it('undefined - dispatches SET_PROFILE with profile', () => {
         firebase._.config.profileParamsToPopulate = undefined
         handleProfileWatchResponse(dispatchSpy, firebase, profileSnap)
@@ -109,6 +166,18 @@ describe('Actions: Auth -', () => {
         // expect(dispatchSpy)
         //   .to.be.calledWith({ type: actionTypes.SET_PROFILE })
       })
+
+      it('Any when useFirestoreForProfile: true - calls console.warn', () => {
+        let currentFake = cloneDeep(fakeFirebase)
+        currentFake._.profileWatch = () => {}
+        currentFake._.config.useFirestoreForProfile = true
+        currentFake._.config.profileParamsToPopulate = ['some']
+        currentFake.firestore = {}
+        handleProfileWatchResponse(dispatchSpy, currentFake)
+        expect(consoleWarnSpy).to.be.calledWith(
+          'Profile population is not yet supported for Firestore'
+        )
+      })
     })
   })