Skip to content

Commit ff53387

Browse files
authored
Clean up rxfire API documentation (#2584)
* Fixed markdown so parameters are visible in displayed tables for each function. * Updated function descriptions. * Updated examples.
1 parent 174521a commit ff53387

File tree

1 file changed

+56
-72
lines changed

1 file changed

+56
-72
lines changed

packages/rxfire/docs/firestore.md

Lines changed: 56 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
# RxFire Firestore
22

3-
## Document Observables
43

54
### `doc()`
6-
The `doc()` function creates an observable that emits document changes.
5+
The `doc()` function creates an observable that emits document changes. Returns snapshot of the data each time the document changes.
76

87
| | |
98
|-----------------|------------------------------------------|
109
| **function** | `doc()` |
11-
| **params** | `firestore.DocumentReference` |
10+
| **params** | `ref:firestore.DocumentReference` |
1211
| **import path** | `rxfire/firestore` |
1312
| **return** | `Observable<firestore.DocumentSnapshot>` |
1413

@@ -17,24 +16,23 @@ The `doc()` function creates an observable that emits document changes.
1716
import { doc } from 'rxfire/firestore';
1817
import { firestore, initializeApp } from 'firebase';
1918
import 'firebase/firestore';
20-
import { map } from 'rxjs/operators';
2119

2220
// Set up Firebase
2321
const app = initializeApp({ /* config */ });
2422
const db = app.firestore();
25-
const davidDoc = db.doc('users/david');
23+
const davidDocRef = db.doc('users/david');
2624

2725
// Seed the firestore
28-
davidDoc.set({ name: 'David' });
26+
davidDocRef.set({ name: 'David' });
2927

30-
doc(davidDoc).subscribe(snapshot => {
28+
doc(davidDocRef).subscribe(snapshot => {
3129
console.log(snapshot.id);
3230
console.log(snapshot.data());
3331
});
3432
```
3533

3634
### `docData()`
37-
The `docData()` function returns a stream of a document, mapped to its data payload and optionally the document ID.
35+
The `docData()` function creates an observable that returns a stream of a document, mapped to its data field values and, optionally, the document ID.
3836

3937
| | |
4038
|-----------------|------------------------------------------|
@@ -65,12 +63,12 @@ docData(davidDocRef,'uid').subscribe(userData => {
6563
## Collection Observables
6664

6765
### `collection()`
68-
The `collection()` function creates an observable that emits collection changes.
66+
The `collection()` function creates an observable that emits changes to the specified collection based on the input query. Any time updates are made, the function returns all documents in the collection that match the query.
6967

7068
| | |
7169
|-----------------|------------------------------------------|
7270
| **function** | `collection()` |
73-
| **params** | `firestore.CollectionReference` | `firestore.Query` |
71+
| **params** | query: `firestore.CollectionReference | firestore.Query` |
7472
| **import path** | `rxfire/firestore` |
7573
| **return** | `Observable<firestore.QueryDocumentSnapshot[]>` |
7674

@@ -79,28 +77,24 @@ The `collection()` function creates an observable that emits collection changes.
7977
import { collection } from 'rxfire/firestore';
8078
import { firestore, initializeApp } from 'firebase';
8179
import 'firebase/firestore';
82-
import { map } from 'rxjs/operators';
8380

8481
// Set up Firebase
8582
const app = initializeApp({ /* config */ });
8683
const db = app.firestore();
87-
const davidDoc = db.doc('users/david');
84+
const collectionRef = db.collection('users');
8885

89-
// Seed the firestore
90-
davidDoc.set({ name: 'David' });
91-
92-
collection(db.collection('users'))
86+
collection(collectionRef)
9387
.pipe(map(docs => docs.map(d => d.data())))
9488
.subscribe(users => { console.log(users) });
9589
```
9690

9791
### `collectionData()`
98-
The `collectionData()` function creates an observable that emits a stream of collection documents payload with optional document ID.
92+
The `collectionData()` function creates an observable that emits a stream of documents for the specified collection based on the input query. When updates are made, returns all documents (field values and optional document ID) in the collection that match the query.
9993

10094
| | |
10195
|-----------------|------------------------------------------|
102-
| **function** | `collection()` |
103-
| **params** | query: `firestore.CollectionReference` | `firestore.Query`, idField?: `string` |
96+
| **function** | `collectionData()` |
97+
| **params** | query: `firestore.CollectionReference | firestore.Query` <br> idField?: `string` |
10498
| **import path** | `rxfire/firestore` |
10599
| **return** | `Observable<T[]>` |
106100

@@ -113,22 +107,19 @@ import 'firebase/firestore';
113107
// Set up Firebase
114108
const app = initializeApp({ /* config */ });
115109
const db = app.firestore();
116-
const davidDoc = db.doc('users/david');
110+
const collectionRef = db.collection('users');
117111

118-
// Seed the firestore
119-
davidDoc.set({ name: 'David' });
120-
121-
collectionData(db.collection('users'), 'uid')
112+
collectionData(collectionRef, 'uid')
122113
.subscribe(users => { console.log(users) });
123114
```
124115

125116
### `collectionChanges()`
126-
The `collectionChanges()` function creates an observable that emits the event changes on a collection. This is different than the collection function in that it does not contain the state of your application but only the individual changes. The optional `events` parameter will filter which child events populate the array.
117+
The `collectionChanges()` function creates an observable that emits the changes on the specified collection based on the input query. This is different than the collection function in that it does not contain the state of your application but only the individual changes. The optional `events` parameter filters which the type of change populate the array. By default, all changes are emitted. Returns the affected documents and the type of change that occurred (added, modified, or removed).
127118

128119
| | |
129120
|-----------------|------------------------------------------|
130121
| **function** | `collectionChanges()` |
131-
| **params** | query: `firestore.CollectionReference` | `firestore.Query`, events?: `firestore.DocumentChangeType[]` |
122+
| **params** | query: `firestore.CollectionReference | firestore.Query` <br> events?: `firestore.DocumentChangeType[]` |
132123
| **import path** | `rxfire/firestore` |
133124
| **return** | `Observable<firestore.DocumentChange[]>` |
134125

@@ -142,16 +133,14 @@ import { map } from 'rxjs/operators';
142133
// Set up Firebase
143134
const app = initializeApp({ /* config */ });
144135
const db = app.firestore();
145-
const davidDoc = db.doc('users/david');
146-
147-
// Seed the firestore
148-
davidDoc.set({ name: 'David' });
136+
const collectionRef = db.collection('users');
149137

150-
collectionChanges(db.collection('users'))
151-
.subscribe(changes => { console.log(users) });
138+
// Listen to all events
139+
collectionChanges(collectionRef)
140+
.subscribe(changes => { console.log(changes) });
152141

153142
// Listen to only 'added' events
154-
collectionChanges(db.collection('users'), ['added'])
143+
collectionChanges(collectionRef, ['added'])
155144
.subscribe(addedEvents => { console.log(addedEvents) });
156145
```
157146

@@ -161,7 +150,7 @@ The `sortedChanges()` function creates an observable that emits the reduced stat
161150
| | |
162151
|-----------------|------------------------------------------|
163152
| **function** | `sortedChanges()` |
164-
| **params** | query: `firestore.CollectionReference` | `firestore.Query`, events?: `firestore.DocumentChangeType[]` |
153+
| **params** | query: `firestore.CollectionReference | firestore.Query`<br> events?: `firestore.DocumentChangeType[]` |
165154
| **import path** | `rxfire/firestore` |
166155
| **return** | `Observable<firestore.DocumentChange[]>` |
167156

@@ -175,26 +164,24 @@ import { map } from 'rxjs/operators';
175164
// Set up Firebase
176165
const app = initializeApp({ /* config */ });
177166
const db = app.firestore();
178-
const davidDoc = db.doc('users/david');
167+
const collectionRef = db.collection('users');
179168

180-
// Seed the firestore
181-
davidDoc.set({ name: 'David' });
182-
183-
sortedChanges(db.collection('users'))
184-
.subscribe(changes => { console.log(users) });
169+
// Listen to all events
170+
sortedChanges(collectionRef)
171+
.subscribe(changes => { console.log(changes) });
185172

186173
// Listen to only 'added' events
187-
docChanges(db.collection('users'), ['added'])
174+
docChanges(collectionRef, ['added'])
188175
.subscribe(addedEvents => { console.log(addedEvents) });
189176
```
190177

191178
### `auditTrail()`
192-
The `auditTrail()` function creates an observable that emits the entire state trail. This is useful for debugging or replaying the state of a list in your app. The optional `events` parameter will filter which child events populate the array.
179+
The `auditTrail()` function creates an observable that emits the entire state trail on the specified collection based on the input query. This is useful for debugging or replaying the changes to the database. The optional `events` parameter filters which the type of change populate the array. By default, all changes are emitted.
193180

194181
| | |
195182
|-----------------|------------------------------------------------------|
196183
| **function** | `auditTrail()` |
197-
| **params** | ref: `firestore.Reference` or `firestore.Query`, events?: `firestore.DocumentChangeType[]` |
184+
| **params** | ref: `firestore.Reference | firestore.Query`<br> events?: `firestore.DocumentChangeType[]` |
198185
| **import path** | `rxfire/firestore` |
199186
| **return** | `Observable<firestore.DocumentChange[]>` |
200187

@@ -208,39 +195,40 @@ import { map } from 'rxjs/operators';
208195
// Set up Firebase
209196
const app = initializeApp({ /* config */ });
210197
const db = app.firestore();
211-
const collection = db.collection('users');
212-
213-
// Seed Firestore
214-
const davidDoc = collection.doc('users/david');
215-
davidDoc.set({ name: 'David' });
198+
const collectionRef = db.collection('users');
199+
const davidDocRef = collectionRef.doc('david');
216200

217-
auditTrail(collection).pipe(
201+
// Start the audit trail
202+
auditTrail(collectionRef).pipe(
218203
map(change => {
219204
return {
220205
_key: change.snapshot.key,
221206
event: change.event,
222-
...change.snapshot.val();
207+
...change.snapshot.val()
223208
};
224209
})
225210
).subscribe(stateTrail => {
226211
console.log(stateTrail);
227-
/**
228-
first emission:
212+
});
213+
214+
// Seed Firestore
215+
davidDocRef.set({ name: 'David' });
216+
217+
// Remove the document
218+
davidDocRef.delete();
219+
220+
/**
221+
First emission:
229222
[{ _key: '3qtWqaKga8jA; name: 'David', event: 'added' }]
230223
231-
second emission:
224+
When more events occur, the trail still contains the previous events.
225+
226+
Second emission:
232227
[
233228
{ _key: '3qtWqaKga8jA; name: 'David', event: 'added' },
234229
{ _key: '3qtWqaKga8jA; name: 'David', event: 'removed' }
235230
]
236231
*/
237-
});
238-
239-
// When more events occur the trail still contains the previous events
240-
// In this case we'll remove the only item
241-
davidDoc.delete();
242-
243-
// Now this will trigger the subscribe function above
244232
```
245233

246234
## Event Observables
@@ -251,7 +239,7 @@ The `fromDocRef()` function creates an observable that emits document changes. T
251239
| | |
252240
|-----------------|------------------------------------------|
253241
| **function** | `fromDocRef()` |
254-
| **params** | ref: `firestore.Reference` |
242+
| **params** | ref: `firestore.DocumentReference` <br> options?: `firestore.SnapshotListenOptions` |
255243
| **import path** | `rxfire/firestore` |
256244
| **return** | `Observable<firestore.DocumentSnapshot>` |
257245

@@ -265,21 +253,21 @@ import { map } from 'rxjs/operators';
265253
// Set up Firebase
266254
const app = initializeApp({ /* config */ });
267255
const db = app.firestore();
268-
const davidDoc = db.doc('users/david');
256+
const davidDocRef = db.doc('users/david');
269257

270258
// Seed Firestore
271-
davidDoc.set({ name: 'David' });
259+
davidDocRef.set({ name: 'David' });
272260

273-
fromDocRef(davidDoc).subscribe(snap => { console.log(snap); })
261+
fromDocRef(davidDocRef).subscribe(snap => { console.log(snap); })
274262
```
275263

276264
### `fromCollectionRef()`
277-
The `fromCollectionRef()` function creates an observable that emits document changes. This is different than the `collection()` function in that it returns the full `QuerySnapshot` instead of plucking off the `QueryDocumentSnapshot[]` array.
265+
The `fromCollectionRef()` function creates an observable that emits changes to the specified collection based on the input query and, optionally, the listen options. This is different than the `collection()` function in that it returns the full `QuerySnapshot` representing the results of the query.
278266

279267
| | |
280268
|-----------------|------------------------------------------|
281269
| **function** | `fromCollectionRef()` |
282-
| **params** | ref: `firestore.CollectionReference` or `firestore.Query` |
270+
| **params** | ref: `firestore.Reference | firestore.Query`<br> options?: `firestore.SnapshotListenOptions` |
283271
| **import path** | `rxfire/firestore` |
284272
| **return** | `Observable<firestore.QuerySnapshot>` |
285273

@@ -293,11 +281,7 @@ import { map } from 'rxjs/operators';
293281
// Set up Firebase
294282
const app = initializeApp({ /* config */ });
295283
const db = app.firestore();
296-
const collection = db.collection('users');
297-
const davidDoc = collection.doc('david');
298-
299-
// Seed Firestore
300-
davidDoc.set({ name: 'David' });
284+
const collectionRef = db.collection('users');
301285

302-
fromCollectionRef(collection).subscribe(snap => { console.log(snap.docs); })
286+
fromCollectionRef(collectionRef).subscribe(snap => { console.log(snap.docs); })
303287
```

0 commit comments

Comments
 (0)