Skip to content

Commit e8e93b8

Browse files
prescottprueprescottprue
authoredAug 15, 2019
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)
·
v3.11.0v3.0.0-alpha.16
1 parent eb5efe2 commit e8e93b8

27 files changed

+11737
-16350
lines changed
 

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ examples/**/node_modules
1818
_book/**
1919
_site/**
2020
coverage
21+
.nyc_output
2122
dist
2223
es
2324
lib

‎docs/api/firebaseConnect.md

+2-30
Original file line numberDiff line numberDiff line change
@@ -2,37 +2,8 @@
22

33
### Table of Contents
44

5-
- [createFirebaseConnect](#createfirebaseconnect)
65
- [firebaseConnect](#firebaseconnect)
76

8-
## createFirebaseConnect
9-
10-
Function that creates a Higher Order Component which
11-
automatically listens/unListens to provided firebase paths using
12-
React's Lifecycle hooks.
13-
**WARNING!!** This is an advanced feature, and should only be used when
14-
needing to access a firebase instance created under a different store key.
15-
16-
**Parameters**
17-
18-
- `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
19-
Firebase state (state.firebase) (optional, default `'store'`)
20-
21-
**Examples**
22-
23-
_Basic_
24-
25-
```javascript
26-
// props.firebase set on App component as firebase object with helpers
27-
import { createFirebaseConnect } from 'react-redux-firebase'
28-
// create firebase connect that uses another redux store
29-
const firebaseConnect = createFirebaseConnect('anotherStore')
30-
// use the firebaseConnect to wrap a component
31-
export default firebaseConnect()(SomeComponent)
32-
```
33-
34-
Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** HOC that accepts a watchArray and wraps a component
35-
367
## firebaseConnect
378

389
**Extends React.Component**
@@ -42,6 +13,7 @@ to provided firebase paths using React's Lifecycle hooks.
4213

4314
**Parameters**
4415

16+
- `dataOrFn` (optional, default `[]`)
4517
- `watchArray` **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)** Array of objects or strings for paths to sync
4618
from Firebase. Can also be a function that returns the array. The function
4719
is passed the current props and the firebase object.
@@ -99,7 +71,7 @@ const enhance = compose(
9971
])),
10072
connect((state, props) => ({
10173
post: get(state.firebase.data, `posts.${props.postId}`),
102-
})
74+
}))
10375
)
10476

10577
function Post({ post }) {

‎docs/api/firestoreConnect.md

+1-29
Original file line numberDiff line numberDiff line change
@@ -2,37 +2,8 @@
22

33
### Table of Contents
44

5-
- [createFirestoreConnect](#createfirestoreconnect)
65
- [firestoreConnect](#firestoreconnect)
76

8-
## createFirestoreConnect
9-
10-
Function that creates a Higher Order Component which
11-
automatically listens/unListens to provided firebase paths using
12-
React's Lifecycle hooks.
13-
**WARNING!!** This is an advanced feature, and should only be used when
14-
needing to access a firebase instance created under a different store key.
15-
16-
**Parameters**
17-
18-
- `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
19-
Firebase state (state.firebase) (optional, default `'store'`)
20-
21-
**Examples**
22-
23-
_Basic_
24-
25-
```javascript
26-
// props.firebase set on App component as firebase object with helpers
27-
import { createFirestoreConnect } from 'react-redux-firebase'
28-
// create firebase connect that uses another redux store
29-
const firestoreConnect = createFirestoreConnect('anotherStore')
30-
// use the firebaseConnect to wrap a component
31-
export default firestoreConnect()(SomeComponent)
32-
```
33-
34-
Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** HOC that accepts a watchArray and wraps a component
35-
367
## firestoreConnect
378

389
**Extends React.Component**
@@ -44,6 +15,7 @@ attempting to use. **Note** Populate is not yet supported.
4415

4516
**Parameters**
4617

18+
- `dataOrFn` (optional, default `[]`)
4719
- `queriesConfig` **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)** Array of objects or strings for paths to sync
4820
from Firebase. Can also be a function that returns the array. The function
4921
is passed the current props and the firebase object.

‎docs/api/helpers.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ const enhance = compose(
7171
connect(({ firebase }) => ({
7272
// this.props.todos loaded from state.firebase.data.todos
7373
todos: getVal(firebase, 'data/todos/user1', defaultValue)
74-
})
74+
}))
7575
)
7676

7777
export default enhance(SomeComponent)

‎docs/api/useFirebaseConnect.md

+9-39
Original file line numberDiff line numberDiff line change
@@ -2,30 +2,8 @@
22

33
### Table of Contents
44

5-
- [createUseFirebaseConnect](#createusefirebaseconnect)
65
- [useFirebaseConnect](#usefirebaseconnect)
76

8-
## createUseFirebaseConnect
9-
10-
Function that creates a hook that
11-
automatically listens/unListens to provided firebase paths using
12-
React's useEffect hooks.
13-
**WARNING!!** This is an advanced feature, and should only be used when
14-
needing to access a firebase instance created under a different store key.
15-
16-
**Examples**
17-
18-
_Basic_
19-
20-
```javascript
21-
// this.props.firebase set on App component as firebase object with helpers
22-
import { createUseFirebaseConnect } from 'react-redux-firebase'
23-
// create firebase connect that uses another redux store
24-
const useFirebaseConnect = createUseFirebaseConnect()
25-
```
26-
27-
Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** HOC that accepts a watchArray and wraps a component
28-
297
## useFirebaseConnect
308

319
Hook that automatically listens/unListens
@@ -70,17 +48,12 @@ _Data that depends on props_
7048

7149
```javascript
7250
import { compose } from 'redux'
73-
import { connect } from 'react-redux'
74-
import { firebaseUseConnect, getVal } from 'react-redux-firebase'
75-
76-
const enhance = compose(
77-
connect((state, props) => ({
78-
post: getVal(state.firebase.data, `posts/${props.postId}`),
79-
}))
80-
)
51+
import { useSelector } from 'react-redux'
52+
import { firebaseUseConnect } from 'react-redux-firebase'
8153

82-
function Post({ post, postId }) {
54+
function Post({ postId }) {
8355
useFirebaseConnect(`posts/${postId}`) // sync /posts/postId from firebase into redux
56+
const post = useSelector(({ firebase }) => state.firebase.ordered.posts && state.firebase.ordered.posts[postId])
8457
return (
8558
<div>
8659
{JSON.stringify(post, null, 2)}
@@ -95,23 +68,20 @@ _Data that depends on props, an array as a query_
9568

9669
```javascript
9770
import { compose } from 'redux'
98-
import { connect } from 'react-redux'
71+
import { useSelector } from 'react-redux'
9972
import { firebaseUseConnect, getVal } from 'react-redux-firebase'
10073

101-
const enhance = compose(
102-
connect((state, props) => ({
103-
post: getVal(state.firebase.data, `posts/${props.postId}`),
104-
}))
105-
)
106-
10774
function Post({ post, postId }) {
10875
useFirebaseConnect([`posts/${postId}`], [postId]) // sync /posts/postId from firebase into redux
76+
const post = useSelector(state => {
77+
return state.firebase.ordered.posts && state.firebase.ordered.posts[postId]
78+
})
10979
return (
11080
<div>
11181
{JSON.stringify(post, null, 2)}
11282
</div>
11383
)
11484
}
11585

116-
export default enhance(Post)
86+
export default Post
11787
```

‎docs/api/useFirestoreConnect.md

+11-35
Original file line numberDiff line numberDiff line change
@@ -2,32 +2,8 @@
22

33
### Table of Contents
44

5-
- [createUseFirestoreConnect](#createusefirestoreconnect)
65
- [useFirestoreConnect](#usefirestoreconnect)
76

8-
## createUseFirestoreConnect
9-
10-
React hook that automatically listens/unListens to provided
11-
firestore paths.
12-
**WARNING!!** This is an advanced feature, and should only be used when
13-
needing to access a firebase instance created under a different store key.
14-
Firebase state (state.firestore)
15-
16-
**Examples**
17-
18-
_Basic_
19-
20-
```javascript
21-
// props.firestore set on App component as firestore object with helpers
22-
import { createUseFirestoreConnect } from 'react-redux-firebase'
23-
24-
const firestoreConnect = createUseFirestoreConnect()
25-
26-
export default useFirestoreConnect()
27-
```
28-
29-
Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** React hook that accepts watch query
30-
317
## useFirestoreConnect
328

339
React hook that automatically listens/unListens
@@ -48,21 +24,21 @@ _Basic_
4824
```javascript
4925
import React from 'react'
5026
import { map } from 'lodash'
51-
import { connect } from 'react-redux'
27+
import { useSelector } from 'react-redux'
5228
import { useFirebaseConnect } from 'react-redux-firebase'
5329

54-
function TodosList({ todosList }) {
30+
function TodosList() {
5531
useFirebaseConnect('todos') // sync todos collection from Firestore into redux
56-
57-
return <ul>{_.map(todosList, todo => <li>{todo}</li>)}</ul>
32+
const todos = useSelector(state => state.firebase.data.todos)
33+
return (
34+
<ul>
35+
{map(todos, (todo, todoId) => (
36+
<li>id: {todoId} todo: {JSON.stringify(todo)}</li>
37+
))}
38+
</ul>
39+
)
5840
}
59-
60-
// pass todos list from redux as props.todosList
61-
export default compose(
62-
connect((state) => ({
63-
todosList: state.firestore.data.todos
64-
})
65-
)(TodosList)
41+
export default TodosList
6642
```
6743

6844
_Object as query_

‎docs/api/withFirebase.md

-32
Original file line numberDiff line numberDiff line change
@@ -2,40 +2,8 @@
22

33
### Table of Contents
44

5-
- [createWithFirebase](#createwithfirebase)
65
- [withFirebase](#withfirebase)
76

8-
## createWithFirebase
9-
10-
Function that creates a Higher Order Component that
11-
which provides `firebase` and `dispatch` as a props to React Components.
12-
13-
**WARNING!!** This is an advanced feature, and should only be used when
14-
needing to access a firebase instance created under a different store key.
15-
16-
**Parameters**
17-
18-
- `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
19-
Firebase state (`state.firebase`) (optional, default `'store'`)
20-
21-
**Examples**
22-
23-
_Basic_
24-
25-
```javascript
26-
// props.firebase set on App component as firebase object with helpers
27-
import { createWithFirebase } from 'react-redux-firebase'
28-
29-
// create withFirebase that uses another redux store
30-
const withFirebase = createWithFirebase('anotherStore')
31-
32-
// use the withFirebase to wrap a component
33-
export default withFirebase(SomeComponent)
34-
```
35-
36-
Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Higher Order Component which accepts an array of
37-
watchers config and wraps a React Component
38-
397
## withFirebase
408

419
**Extends React.Component**

‎docs/api/withFirestore.md

-31
Original file line numberDiff line numberDiff line change
@@ -2,39 +2,8 @@
22

33
### Table of Contents
44

5-
- [createWithFirestore](#createwithfirestore)
65
- [withFirestore](#withfirestore)
76

8-
## createWithFirestore
9-
10-
Function that creates a Higher Order Component that
11-
which provides `firebase`, `firestore`, and `dispatch` to React Components.
12-
13-
**WARNING!!** This is an advanced feature, and should only be used when
14-
needing to access a firebase instance created under a different store key.
15-
16-
**Parameters**
17-
18-
- `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
19-
Firestore state (`state.firestore`) (optional, default `'store'`)
20-
21-
**Examples**
22-
23-
_Basic_
24-
25-
```javascript
26-
import { createWithFirestore } from 'react-redux-firebase'
27-
28-
// create withFirestore that uses another redux store
29-
const withFirestore = createWithFirestore('anotherStore')
30-
31-
// use the withFirestore to wrap a component
32-
export default withFirestore(SomeComponent)
33-
```
34-
35-
Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Higher Order Component which accepts an array of
36-
watchers config and wraps a React Component
37-
387
## withFirestore
398

409
**Extends React.Component**

‎docs/v3-migration-guide.md

+11-1
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,18 @@
33
## What Changed
44

55
* 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)
6-
* `componentDidMount` used in place of `componentWillMount` for data loading
6+
* `componentDidMount` used in place of `componentWillMount` for data loading in `firebaseConnect` and `firestoreConnect`
77
* `getFirebase` no longer part of the API
8+
* `createFirebaseConnect` and `createFirestoreConnect` are no longer part of the API
9+
10+
### Remove createFirebaseConnect and createFirestoreConnect
11+
12+
These are no longer needed since the extended firebase instance is now loaded through react context instead of through `store.firebase`.
13+
14+
```diff
15+
- const firebaseConnect = createFirebaseConnect('otherStoreKey')
16+
- const firestoreConnect = createFirestoreConnect('otherStoreKey')
17+
```
818

919
### Remove Store Enhancer
1020

0 commit comments

Comments
 (0)
Please sign in to comment.