v3.0.0-alpha.16

* fix(examples): switch to next in simple example with new version of react-redux * fix(types): make options param optional in `updateProfile` - #749 - @rscotten * feat(HOCs): remove `createFirestoreConnect` and `createFirebaseConnect` - store selection is no longer necessary * fix(types): add descriptions for main methods * fix(types): remove no longer exported functions from types * feat(tests): replace [`istanbul`](https://www.npmjs.com/package/istanbul) with [`nyc`](https://www.npmjs.com/package/nyc)
prescottprue · Aug 15, 2019 · e8e93b8 · e8e93b8
1 parent eb5efe2
commit e8e93b8
Show file tree

Hide file tree

Showing 27 changed files with 11,737 additions and 16,350 deletions.
diff --git a/.gitignore b/.gitignore
@@ -18,6 +18,7 @@ examples/**/node_modules
 _book/**
 _site/**
 coverage
+.nyc_output
 dist
 es
 lib

diff --git a/docs/api/firebaseConnect.md b/docs/api/firebaseConnect.md
@@ -2,37 +2,8 @@
 
 ### Table of Contents
 
--   [createFirebaseConnect](#createfirebaseconnect)
 -   [firebaseConnect](#firebaseconnect)
 
-## createFirebaseConnect
-
-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.
-
-**Parameters**
-
--   `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
-    Firebase state (state.firebase) (optional, default `'store'`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-// props.firebase set on App component as firebase object with helpers
-import { createFirebaseConnect } from 'react-redux-firebase'
-// create firebase connect that uses another redux store
-const firebaseConnect = createFirebaseConnect('anotherStore')
-// use the firebaseConnect to wrap a component
-export default firebaseConnect()(SomeComponent)
-```
-
-Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** HOC that accepts a watchArray and wraps a component
-
 ## firebaseConnect
 
 **Extends React.Component**
@@ -42,6 +13,7 @@ to provided firebase paths using React's Lifecycle hooks.
 
 **Parameters**
 
+-   `dataOrFn`   (optional, default `[]`)
 -   `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 current props and the firebase object.
@@ -99,7 +71,7 @@ const enhance = compose(
   ])),
   connect((state, props) => ({
     post: get(state.firebase.data, `posts.${props.postId}`),
-  })
+  }))
 )
 
 function Post({ post }) {

diff --git a/docs/api/firestoreConnect.md b/docs/api/firestoreConnect.md
@@ -2,37 +2,8 @@
 
 ### Table of Contents
 
--   [createFirestoreConnect](#createfirestoreconnect)
 -   [firestoreConnect](#firestoreconnect)
 
-## createFirestoreConnect
-
-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.
-
-**Parameters**
-
--   `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
-    Firebase state (state.firebase) (optional, default `'store'`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-// props.firebase set on App component as firebase object with helpers
-import { createFirestoreConnect } from 'react-redux-firebase'
-// create firebase connect that uses another redux store
-const firestoreConnect = createFirestoreConnect('anotherStore')
-// use the firebaseConnect to wrap a component
-export default firestoreConnect()(SomeComponent)
-```
-
-Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** HOC that accepts a watchArray and wraps a component
-
 ## firestoreConnect
 
 **Extends React.Component**
@@ -44,6 +15,7 @@ attempting to use. **Note** Populate is not yet supported.
 
 **Parameters**
 
+-   `dataOrFn`   (optional, default `[]`)
 -   `queriesConfig` **[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 current props and the firebase object.

diff --git a/docs/api/helpers.md b/docs/api/helpers.md
@@ -71,7 +71,7 @@ const enhance = compose(
   connect(({ firebase }) => ({
     // this.props.todos loaded from state.firebase.data.todos
     todos: getVal(firebase, 'data/todos/user1', defaultValue)
-  })
+  }))
 )
 
 export default enhance(SomeComponent)

diff --git a/docs/api/useFirebaseConnect.md b/docs/api/useFirebaseConnect.md
@@ -2,30 +2,8 @@
 
 ### 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
@@ -70,17 +48,12 @@ _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}`),
-  }))
-)
+import { useSelector } from 'react-redux'
+import { firebaseUseConnect } from 'react-redux-firebase'
 
-function Post({ post, postId }) {
+function Post({ postId }) {
   useFirebaseConnect(`posts/${postId}`) // sync /posts/postId from firebase into redux
+  const post = useSelector(({ firebase }) => state.firebase.ordered.posts && state.firebase.ordered.posts[postId])
   return (
     <div>
       {JSON.stringify(post, null, 2)}
@@ -95,23 +68,20 @@ _Data that depends on props, an array as a query_
 
 ```javascript
 import { compose } from 'redux'
-import { connect } from 'react-redux'
+import { useSelector } from 'react-redux'
 import { firebaseUseConnect, getVal } from 'react-redux-firebase'
 
-const enhance = compose(
-  connect((state, props) => ({
-    post: getVal(state.firebase.data, `posts/${props.postId}`),
-  }))
-)
-
 function Post({ post, postId }) {
   useFirebaseConnect([`posts/${postId}`], [postId]) // sync /posts/postId from firebase into redux
+  const post = useSelector(state => {
+    return state.firebase.ordered.posts && state.firebase.ordered.posts[postId]
+  })
   return (
     <div>
       {JSON.stringify(post, null, 2)}
     </div>
   )
 }
 
-export default enhance(Post)
+export default Post
 ```
diff --git a/docs/api/useFirestoreConnect.md b/docs/api/useFirestoreConnect.md
@@ -2,32 +2,8 @@
 
 ### 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.
-Firebase state (state.firestore)
-
-**Examples**
-
-_Basic_
-
-```javascript
-// props.firestore set on App component as firestore 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
@@ -48,21 +24,21 @@ _Basic_
 ```javascript
 import React from 'react'
 import { map } from 'lodash'
-import { connect } from 'react-redux'
+import { useSelector } from 'react-redux'
 import { useFirebaseConnect } from 'react-redux-firebase'
 
-function TodosList({ todosList }) {
+function TodosList() {
   useFirebaseConnect('todos') // sync todos collection from Firestore into redux
-
-  return <ul>{_.map(todosList, todo => <li>{todo}</li>)}</ul>
+  const todos = useSelector(state => state.firebase.data.todos)
+  return (
+    <ul>
+      {map(todos, (todo, todoId) => (
+       <li>id: {todoId} todo: {JSON.stringify(todo)}</li>
+      ))}
+   </ul>
+  )
 }
-
-// pass todos list from redux as props.todosList
-export default compose(
-  connect((state) => ({
-    todosList: state.firestore.data.todos
-  })
-)(TodosList)
+export default TodosList
 ```
 
 _Object as query_

diff --git a/docs/api/withFirebase.md b/docs/api/withFirebase.md
@@ -2,40 +2,8 @@
 
 ### Table of Contents
 
--   [createWithFirebase](#createwithfirebase)
 -   [withFirebase](#withfirebase)
 
-## createWithFirebase
-
-Function that creates a Higher Order Component that
-which provides `firebase` and `dispatch` as a props to React Components.
-
-**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
-    Firebase state (`state.firebase`) (optional, default `'store'`)
-
-**Examples**
-
-_Basic_
-
-```javascript
-// props.firebase set on App component as firebase object with helpers
-import { createWithFirebase } from 'react-redux-firebase'
-
-// create withFirebase that uses another redux store
-const withFirebase = createWithFirebase('anotherStore')
-
-// use the withFirebase to wrap a component
-export default withFirebase(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
-
 ## withFirebase
 
 **Extends React.Component**

diff --git a/docs/api/withFirestore.md b/docs/api/withFirestore.md
@@ -2,39 +2,8 @@
 
 ### Table of Contents
 
--   [createWithFirestore](#createwithfirestore)
 -   [withFirestore](#withfirestore)
 
-## createWithFirestore
-
-Function that creates a Higher Order Component that
-which provides `firebase`, `firestore`, and `dispatch` to React Components.
-
-**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 { createWithFirestore } from 'react-redux-firebase'
-
-// create withFirestore that uses another redux store
-const withFirestore = createWithFirestore('anotherStore')
-
-// use the withFirestore to wrap a component
-export default withFirestore(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
-
 ## withFirestore
 
 **Extends React.Component**

diff --git a/docs/v3-migration-guide.md b/docs/v3-migration-guide.md
@@ -3,8 +3,18 @@
 ## What Changed
 
 * 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)
-* `componentDidMount` used in place of `componentWillMount` for data loading
+* `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
+
+These are no longer needed since the extended firebase instance is now loaded through react context instead of through `store.firebase`.
+
+```diff
+-  const firebaseConnect = createFirebaseConnect('otherStoreKey')
+-  const firestoreConnect = createFirestoreConnect('otherStoreKey')
+```
 
 ### Remove Store Enhancer