From bcdd834a8ca872c13c88578ed9f1347381097a17 Mon Sep 17 00:00:00 2001 From: David East Date: Mon, 30 Jul 2018 14:35:03 -0600 Subject: [PATCH 1/2] api changes and doc updates --- packages/rxfire/docs/storage.md | 172 ++++++++++++++++++ packages/rxfire/firestore/collection/index.ts | 6 +- 2 files changed, 175 insertions(+), 3 deletions(-) create mode 100644 packages/rxfire/docs/storage.md diff --git a/packages/rxfire/docs/storage.md b/packages/rxfire/docs/storage.md new file mode 100644 index 00000000000..9f8482ca461 --- /dev/null +++ b/packages/rxfire/docs/storage.md @@ -0,0 +1,172 @@ +# RxFire Storage + +## Task Observables + +### `fromTask()` +The `fromTask()` function creates an observable that emits progress changes. + +| | | +|-----------------|--------------------------------------------| +| **function** | `fromTask()` | +| **params** | `storage.UploadTask` | +| **import path** | `rxfire/storage` | +| **return** | `Observable` | + +#### TypeScript Example +```ts +import { fromTask } from 'rxfire/firestore'; +import * as firebase from 'firebase'; +import 'firebase/storage'; + +// Set up Firebase +const app = initializeApp({ /* config */ }); +const storage = app.storage(); +const davidRef = db.ref('users/david.png'); + +// Upload a transparent 1x1 pixel image +const task = davidDoc.putString('R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7', 'base64'); + +fromTask(task) + .subscribe(snap => { console.log(snap.bytesTransferred); }); +``` + +### `percentage()` +The `percentage()` function creates an observable that emits percentage of the uploaded bytes. + +| | | +|-----------------|--------------------------------------------| +| **function** | `fromTask()` | +| **params** | `storage.UploadTask` | +| **import path** | `rxfire/storage` | +| **return** | `Observable` | + +#### TypeScript Example +```ts +import { percentage } from 'rxfire/firestore'; +import * as firebase from 'firebase'; +import 'firebase/storage'; + +// Set up Firebase +const app = initializeApp({ /* config */ }); +const storage = app.storage(); +const davidRef = db.ref('users/david.png'); + +// Upload a transparent 1x1 pixel image +const task = davidDoc.putString('R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7', 'base64'); + +percentage(task) + .subscribe(uploadProgress => { console.log(uploadProgress); }); +``` + +## Reference Observables + +### `getDownloadURL()` +The `getDownloadURL()` function creates an observable that emits the URL of the file. + +| | | +|-----------------|------------------------------------------| +| **function** | `getDownloadURL()` | +| **params** | `storage.Reference` | +| **import path** | `rxfire/storage` | +| **return** | `Observable` | + +#### TypeScript Example +```ts +import { getDownloadURL } from 'rxfire/storage'; +import * as firebase from 'firebase'; +import 'firebase/storage'; + +// Set up Firebase +const app = initializeApp({ /* config */ }); +const storage = app.storage(); + +// Assume this exists +const davidRef = storage.doc('users/david.png'); + +getDownloadURL(davidRef) + .subscribe(url => { console.log(url) }); +``` + +### `getMetadata()` +The `getMetadata()` function creates an observable that emits the URL of the file's metadta. + +| | | +|-----------------|------------------------------------------| +| **function** | `getMetadata()` | +| **params** | `storage.Reference` | +| **import path** | `rxfire/storage` | +| **return** | `Observable` | + +#### TypeScript Example +```ts +import { getMetadata } from 'rxfire/storage'; +import * as firebase from 'firebase'; +import 'firebase/storage'; + +// Set up Firebase +const app = initializeApp({ /* config */ }); +const storage = app.storage(); + +// Assume this exists +const davidRef = storage.doc('users/david.png'); + +getMetadata(davidRef) + .subscribe(meta => { console.log(meta) }); +``` + +### `put()` +The `put()` function creates an observable that emits the upload progress of a file. + +| | | +|-----------------|------------------------------------------| +| **function** | `put()` | +| **params** | ref: `storage.Reference`, data: `any`, metadata?: `storage.UploadMetadata` | +| **import path** | `rxfire/storage` | +| **return** | `Observable` | + +#### TypeScript Example +```ts +import { put } from 'rxfire/storage'; +import * as firebase from 'firebase'; +import 'firebase/storage'; + +// Set up Firebase +const app = initializeApp({ /* config */ }); +const storage = app.storage(); +const dataRef = storage.doc('users/david.json'); + +const blob = new Blob( + [JSON.stringify({ name: 'david'}, null, 2)], + { type : 'application/json' } +); + +put(davidRef, blob, { type : 'application/json' }) + .subscribe(snap => { console.log(snap.bytesTransferred) }); +``` + +### `putString()` +The `putString()` function creates an observable that emits the upload progress of a file. + +| | | +|-----------------|------------------------------------------| +| **function** | `putString()` | +| **params** | ref: `storage.Reference`, data: `string`, metadata?: `storage.UploadMetadata` | +| **import path** | `rxfire/storage` | +| **return** | `Observable` | + +#### TypeScript Example +```ts +import { putString } from 'rxfire/storage'; +import * as firebase from 'firebase'; +import 'firebase/storage'; + +// Set up Firebase +const app = initializeApp({ /* config */ }); +const storage = app.storage(); +const davidRef = storage.doc('users/david.png'); + +const base64 = 'R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'; + +putString(davidRef, base64, { type : 'application/json' }) + .subscribe(snap => { console.log(snap.bytesTransferred) }); +``` diff --git a/packages/rxfire/firestore/collection/index.ts b/packages/rxfire/firestore/collection/index.ts index 817de03722b..ecc647ad66c 100644 --- a/packages/rxfire/firestore/collection/index.ts +++ b/packages/rxfire/firestore/collection/index.ts @@ -117,7 +117,7 @@ function processDocumentChanges( * order of occurence. * @param query */ -export function docChanges( +export function collectionChanges( query: firestore.Query, events: firestore.DocumentChangeType[] = ALL_EVENTS ) { @@ -144,7 +144,7 @@ export function sortedChanges( query: firestore.Query, events?: firestore.DocumentChangeType[] ) { - return docChanges(query, events).pipe( + return collectionChanges(query, events).pipe( scan( ( current: firestore.DocumentChange[], @@ -163,7 +163,7 @@ export function auditTrail( query: firestore.Query, events?: firestore.DocumentChangeType[] ): Observable { - return docChanges(query, events).pipe( + return collectionChanges(query, events).pipe( scan((current, action) => [...current, ...action], []) ); } From 4bd3e24a1cb9107dd91ba1dd44f1f592b0cdb05a Mon Sep 17 00:00:00 2001 From: David East Date: Mon, 30 Jul 2018 15:05:54 -0600 Subject: [PATCH 2/2] fixes --- packages/rxfire/docs/storage.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/rxfire/docs/storage.md b/packages/rxfire/docs/storage.md index 9f8482ca461..0f99640ca27 100644 --- a/packages/rxfire/docs/storage.md +++ b/packages/rxfire/docs/storage.md @@ -21,10 +21,10 @@ import 'firebase/storage'; // Set up Firebase const app = initializeApp({ /* config */ }); const storage = app.storage(); -const davidRef = db.ref('users/david.png'); +const davidRef = storage.ref('users/david.png'); // Upload a transparent 1x1 pixel image -const task = davidDoc.putString('R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7', 'base64'); +const task = davidRef.putString('R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7', 'base64'); fromTask(task) .subscribe(snap => { console.log(snap.bytesTransferred); }); @@ -49,10 +49,10 @@ import 'firebase/storage'; // Set up Firebase const app = initializeApp({ /* config */ }); const storage = app.storage(); -const davidRef = db.ref('users/david.png'); +const davidRef = storage.ref('users/david.png'); // Upload a transparent 1x1 pixel image -const task = davidDoc.putString('R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7', 'base64'); +const task = davidRef.putString('R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7', 'base64'); percentage(task) .subscribe(uploadProgress => { console.log(uploadProgress); }); @@ -81,7 +81,7 @@ const app = initializeApp({ /* config */ }); const storage = app.storage(); // Assume this exists -const davidRef = storage.doc('users/david.png'); +const davidRef = storage.ref('users/david.png'); getDownloadURL(davidRef) .subscribe(url => { console.log(url) }); @@ -108,7 +108,7 @@ const app = initializeApp({ /* config */ }); const storage = app.storage(); // Assume this exists -const davidRef = storage.doc('users/david.png'); +const davidRef = storage.ref('users/david.png'); getMetadata(davidRef) .subscribe(meta => { console.log(meta) }); @@ -133,7 +133,7 @@ import 'firebase/storage'; // Set up Firebase const app = initializeApp({ /* config */ }); const storage = app.storage(); -const dataRef = storage.doc('users/david.json'); +const dataRef = storage.ref('users/david.json'); const blob = new Blob( [JSON.stringify({ name: 'david'}, null, 2)], @@ -163,7 +163,7 @@ import 'firebase/storage'; // Set up Firebase const app = initializeApp({ /* config */ }); const storage = app.storage(); -const davidRef = storage.doc('users/david.png'); +const davidRef = storage.ref('users/david.png'); const base64 = 'R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';