v3.0.0-beta

* feat(auth): remove `signIn` option from createUser (new user is automatically signed in through Firebase SDK) - #513
* feat(core): new pattern for getting extended firebase instance in thunks (added back `getFirebase` to api) - #635
* fix(HOCs): switch to `UNSAFE_componentWillReceiveProps` in class based HOCs to prevent warnings with 16.9.0 - #755
* fix(HOCs): switch `withFirebase` and `withFirestore` back to pre-hooks compatible logic
* fix(core): replace lodash methods such as `isArray`, `isBoolean`, `isString`, `size`, `compact` and `isFunction` with native methods in a number of places
* chore(deps): update lodash to 4.17.15
* chore(docs): add docs for how to reference data from state for reselect selectors - #614
* chore(docs): update client side role assign example in roles recipes - #699
* chore(docs): add example for assigning role in cloud function - #699

Author: prescottprue

SUMMARY.md

@@ -19,6 +19,7 @@
 * [Integrations](/docs/integrations/README.md)
   * [Redux Thunk](/docs/integrations/thunks.md)
   * [Redux Form](/docs/integrations/redux-form.md)
+  * [Reselect](/docs/integrations/reselect.md)
   * [Redux Persist](/docs/integrations/redux-persist.md)
   * [Redux Saga](/docs/integrations/redux-saga.md)
   * [Redux Observable](/docs/integrations/redux-observable.md)
@@ -46,7 +47,7 @@
     * [dataReducer](/docs/api/reducers.md#datareducer)
     * [orderedReducer](/docs/api/reducers.md#orderedreducer)
   * [props.firebase](/docs/api/props-firebase.md)
-  * [firebaseInstance](/docs/api/firebaseInstance.md)
+  * [getFirebase](/docs/api/getFirebase.md)
   * [ReactReduxFirebaseContext](/docs/api/ReactReduxFirebaseContext.md)
   * [ReactReduxFirebaseProvider](/docs/api/ReactReduxFirebaseProvider.md)
   * [ReduxFirestoreContext](/docs/api/ReduxFirestoreContext.md)

docs/api/getFirebase.md

@@ -0,0 +1,40 @@
+# getFirebase
+
+Expose Firebase instance created internally, which is the same as [props.firebase](/docs/api/props-firebase.md). Useful for
+integrations into external libraries such as redux-thunk and redux-observable.
+
+The methods which are available are documented in [firebaseInstance](/docs/api/firebaseInstance.md)
+
+**Examples**
+
+_redux-thunk integration_
+
+```javascript
+import { applyMiddleware, compose, createStore } from 'redux';
+import thunk from 'redux-thunk';
+import { getFirebase } from 'react-redux-firebase';
+import makeRootReducer from './reducers';
+
+const store = createStore(
+  makeRootReducer(),
+  initialState,
+  compose(
+    applyMiddleware([
+      // Pass getFirebase function as extra argument
+      thunk.withExtraArgument(getFirebase)
+    ])
+  )
+);
+
+// then later
+export function addTodo(newTodo) {
+  return (dispatch, getState, getFirebase) => {
+    const firebase = getFirebase()
+    firebase
+      .push('todos', newTodo)
+      .then(() => {
+        dispatch({ type: 'SOME_ACTION' })
+      })
+  }
+}
+```

docs/api/helpers.md

@@ -180,7 +180,7 @@ Returns **[Boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/
 
 ## populate
 
-Populate with data from redux.
+Populate with data from multiple locations of redux state.
 
 **Parameters**
 

docs/auth.md

@@ -185,7 +185,6 @@ Similar to Firebase's `ref.createUser(credentials)` but with support for automat
 * `credentials` [**Object**][object-url]
   * `credentials.email` [**String**][string-url] - User's email
   * `credentials.password` [**String**][string-url] - User's password
-  * `credentials.signIn` [**String**][string-url] - Whether or not to sign in when user is signing up (defaults to `true`)
 
 * `profile` [**Object**][object-url]
   * `profile.username` [**String**][string-url]

docs/integrations/reselect.md

@@ -0,0 +1,32 @@
+# Reselect
+
+There are a number of reasons to use state selectors, as mentioned in the [relesect docs](https://github.com/reduxjs/reselect):
+
+> * Selectors can compute derived data, allowing Redux to store the minimal possible state.
+> * Selectors are efficient. A selector is not recomputed unless one of its arguments changes.
+> * Selectors are composable. They can be used as input to other selectors.
+
+For more information, about why this is important, checkout the [motivation for memoized selectors sections of the reselect docs](https://github.com/reduxjs/reselect#motivation-for-memoized-selectors)
+
+## State Selectors
+
+Select only what you need from state in your selectors instead of the whole firebase/firestore state object:
+
+```js
+import { createSelector } from 'reselect';
+import { connect } from 'react-redux'
+import { get, sumBy } from 'lodash'
+
+const netTotalSelector  = createSelector(
+  state => get(state, 'firestore.data.products'),
+  products => sumBy(products, 'price')
+)
+
+connect((state) => ({
+  netTotal: netTotalSelector(state)
+}))(Component)
+```
+
+In this case Reselect will memoize the products object. That means that even if there's any update to other parts of redux state (including firebase/firestore), the memoized products object will stay the same until there is an update to the products themselves.
+
+See [issue #614](https://github.com/prescottprue/react-redux-firebase/issues/614) for more info.

docs/integrations/thunks.md

@@ -1,44 +1,81 @@
-# Thunks
+# redux-thunk Integration
 
-### redux-thunk integration
+## getFirebase As Extra Argument
 
 In order to get the most out of writing your thunks, make sure to set up your thunk middleware using its redux-thunk's `withExtraArgument` method like so:
 
+**createStore.js**
+
 ```javascript
 import { applyMiddleware, compose, createStore } from 'redux';
 import thunk from 'redux-thunk';
-import { reactReduxFirebase } from 'react-redux-firebase';
+import { getFirebase } from 'react-redux-firebase'
 import makeRootReducer from './reducers';
 
 const fbConfig = {} // your firebase config
-
+const middlewares = [
+  thunk.withExtraArgument(getFirebase)
+]
 const store = createStore(
   makeRootReducer(),
   initialState,
   compose(
-    applyMiddleware(thunk),
-    reactReduxFirebase(fbConfig, { userProfile: 'users', enableLogging: false })
+    applyMiddleware(...middlewares),
   )
 );
+```
+
+**App.js**
+```js
+import React from 'react'
+import { Provider } from 'react-redux'
+import firebase from 'firebase/app'
+import 'firebase/auth'
+import 'firebase/database'
+import 'firebase/firestore' // make sure you add this for firestore
+import { ReactReduxFirebaseProvider } from 'react-redux-firebase';
+import { createFirestoreInstance } from 'redux-firestore';
+import Home from './Home'
+import createStore from './createStore'
+import { firebase as fbConfig, reduxFirebase as rfConfig } from './config'
+import './App.css'
 
+// Initialize Firebase instance
+firebase.initializeApp(fbConfig)
+
+const initialState = window && window.__INITIAL_STATE__ // set initial state here
+const store = createStore(initialState)
+
+export default () => (
+  <Provider store={store}>
+    <ReactReduxFirebaseProvider
+      firebase={firebase}
+      config={rfConfig}
+      dispatch={store.dispatch}
+      createFirestoreInstance={createFirestoreInstance}>
+      <Home />
+    </ReactReduxFirebaseProvider>
+  </Provider>
+)
 ```
 
 ## Example Thunk
 
 ```javascript
-const sendNotification = (payload) => ({
-  type: NOTIFICATION,
-  payload
-})
-
-export const addTodo = (newTodo) =>
-  (dispatch, getState) => {
-    return firebase
+function sendNotification(payload) {
+  return {
+    type: NOTIFICATION,
+    payload
+  }
+}
+
+export function addTodo(newTodo) {
+  return (dispatch, getState, getFirebase) => {
+    return getFirebase()
       .ref('todos')
       .push(newTodo)
       .then(() => {
         dispatch(sendNotification('Todo Added'))
       })
-  };
-
+}
 ```

docs/recipes/auth.md

@@ -60,11 +60,8 @@ import StyledFirebaseAuth from 'react-firebaseui/StyledFirebaseAuth';
 // import { withRouter } from 'react-router-dom'; // if you use react-router
 // import GoogleButton from 'react-google-button' // optional
 
-export const LoginPage = ({
-  firebase,
-  auth,
-  //history if you use react-router
-  }) => (
+function LoginPage({ firebase, auth }) {
+  return (
   <div className={classes.container}>
     <StyledFirebaseAuth
       uiConfig={{

docs/recipes/roles.md

@@ -82,7 +82,9 @@ reactReduxFirebase(
 
 ## Automatically assign role when user signs up
 
-If you want to assign a role by default when users sign up, you can add a profileFactory to your config:+
+### Client Side
+
+If you want to assign a role by default when users sign up, you can add a profileFactory to your config:
 
 ```js
 reactReduxFirebase(
@@ -92,15 +94,39 @@ reactReduxFirebase(
     profileParamsToPopulate: [
       { child: 'role', root: 'roles' }, // populates user's role with matching role object from roles
     ],
-    profileFactory: user => ({
-      email: user.email || user.providerData[0].email,
-      role: 'user',
-      providerData: user.providerData
-    })
+    profileFactory: user => {
+      const profile = {
+        email: user.email || user.providerData[0].email,
+        role: 'user', 
+      }
+      if (user.providerData && user.providerData.length) {
+        profile.providerData = user.providerData
+      }
+    }
   }
 )
 ```
 
+**NOTE**: Your security rules should be set to only allow for users to be setting their role to user. For more granular control of this, you can move role assigning to a cloud function that is trigger on user create
+
+### Cloud Function
+
+Having cloud function contain logic about which users get assigned certain roles means that you do not need any write access for clients on the role parameter.
+
+```js
+const adminEmails = ['[email protected]'] // list of emails to automatically assign admin role to
+
+async function assignUserRole(user) {
+  const { uid, email, displayName } = user; // The email of the user.
+  const newRole = adminEmails.includes(email) ? 'admin' : 'user'
+  await admin.firestore().collection('users').doc(uid).set({ role: 'user' }, { merge: true })
+}
+
+exports.assignUserRole = functions.auth.user().onCreate(assignUserRole);
+```
+
+More info is available about doing this in the [extend auth with functions section of the firebase docs](https://firebase.google.com/docs/auth/extend-with-functions).
+
 ## The higher order component (where the actual verification happens)
 
 Using redux-auth-wrapper you can create higher order components that will make it easy to verify a user has a specific role or permission before rendering a page or component.

docs/v3-migration-guide.md

@@ -2,12 +2,22 @@
 
 ## What Changed
 
+### Features
+
 * Support `react-redux` v6 and new React Context API - [#581](https://github.com/prescottprue/react-redux-firebase/issues/581). This mean no more `reactReduxFirebase` and `reduxFirestore` store enhancers (instance is passed through the new React context API) - [#581](https://github.com/prescottprue/react-redux-firebase/issues/581)
+* React hooks (requires react `^16.8.0`) `useFirebase`, `useFirestore`, `useFirestoreConnect`, and `useFirebaseConnect` - (Tons of work by [@illuminist](https://github.com/illuminist))
+
+### Breaking Changes
+
+* Removed from API:
+  * `reactReduxFirebase` store enhancer (firebase instance is now created by context providers)
+  * `createFirebaseConnect` and `createFirestoreConnect` (see [below](#remove-createFirebaseConnect-and-createFirestoreConnect))
+  * `signIn` option from `createUser` (new user is automatically signed in through Firebase SDK) - #513
 * `componentDidMount` used in place of `componentWillMount` for data loading in `firebaseConnect` and `firestoreConnect`
-* `getFirebase` no longer part of the API
-* `createFirebaseConnect` and `createFirestoreConnect` are no longer part of the API
 
-### Remove createFirebaseConnect and createFirestoreConnect
+### Change Snippets
+
+#### Remove createFirebaseConnect and createFirestoreConnect
 
 These are no longer needed since the extended firebase instance is now loaded through react context instead of through `store.firebase`.
 
@@ -16,23 +26,23 @@ These are no longer needed since the extended firebase instance is now loaded th
 -  const firestoreConnect = createFirestoreConnect('otherStoreKey')
 ```
 
-### Remove Store Enhancer
+#### Remove Store Enhancer
 
 Replace store enhancer with `ReactReduxFirebaseProvider`
 
-#### Diff
+##### Diff
 
 _RTDB Diff_
 ```diff
-+ import { ReactReduxFirebaseProvider } from 'react-redux-firebase'
++ import { ReactReduxFirebaseProvider, getFirebase } from 'react-redux-firebase'
 - import { reactReduxFirebase, getFirebase } from 'react-redux-firebase'
 
 const store = createStore(
   rootReducer,
   initialState,
 -  compose(
 -    reactReduxFirebase(firebase, rrfConfig), // pass in firebase instance instead of config
--    applyMiddleware([ thunk.withExtraArgument(getFirebase) ]) // to add other middleware
+     applyMiddleware([ thunk.withExtraArgument(getFirebase) ]) // to add other middleware
 -  )
 )
 
@@ -82,7 +92,7 @@ const App = () => (
 );
 ```
 
-#### Full Examples
+## Code Examples
 
 **`v2.*.*`**
 

examples/complete/simple/package.json

@@ -16,7 +16,8 @@
     "react-redux-firebase": "next",
     "recompose": "^0.30.0",
     "redux": "^4.0.4",
-    "redux-firestore": "^0.8.0"
+    "redux-firestore": "^0.8.0",
+    "redux-thunk": "^2.3.0"
   },
   "devDependencies": {
     "react-scripts": "3.1.0"