(undefined);
- private readonly yadaFunction = httpsCallableData(this.functions, 'yada', { timeout: 3_000 });
+ private readonly yadaFunction = httpsCallableData(this.functions, 'yada', {
+ timeout: 3_000,
+ });
async request() {
this.yadaFunction({}).subscribe({
@@ -29,16 +34,21 @@ export class FunctionsComponent {
});
}
- protected readonly className = signal("is-deferred");
+ protected readonly className = signal('is-deferred');
constructor() {
if (environment.emulatorPorts?.functions) {
- connectFunctionsEmulator(this.functions, "localhost", environment.emulatorPorts.functions);
+ connectFunctionsEmulator(
+ this.functions,
+ 'localhost',
+ environment.emulatorPorts.functions
+ );
}
afterNextRender(() => {
- if (this.className) this.className.set("");
+ if (this.className) {
+ this.className.set('');
+ }
});
}
-
}
diff --git a/sample/src/app/messaging/messaging.component.ts b/sample/src/app/messaging/messaging.component.ts
index 063abf8b2..8d8ea75ed 100644
--- a/sample/src/app/messaging/messaging.component.ts
+++ b/sample/src/app/messaging/messaging.component.ts
@@ -8,17 +8,19 @@ import { EMPTY } from 'rxjs';
template: `
Messaging!
- {{ token$ | async | slice:0:12 }} @if (token$ | async) { … }
+ {{ token$ | async | slice : 0 : 12 }} @if (token$ | async) { …
+ }
{{ message$ | async | json }}
@if (showRequest()) {
-
+
}
`,
- imports: [AsyncPipe, SlicePipe, JsonPipe]
+ imports: [AsyncPipe, SlicePipe, JsonPipe],
})
export class MessagingComponent {
-
private readonly messaging = inject(Messaging, { optional: true });
protected readonly token$ = EMPTY;
protected readonly message$ = EMPTY;
@@ -28,5 +30,4 @@ export class MessagingComponent {
async request() {
await Notification.requestPermission();
}
-
}
diff --git a/sample/src/app/remote-config/remote-config.component.ts b/sample/src/app/remote-config/remote-config.component.ts
index 0c9a64152..3a864ca9b 100644
--- a/sample/src/app/remote-config/remote-config.component.ts
+++ b/sample/src/app/remote-config/remote-config.component.ts
@@ -1,22 +1,22 @@
-import { Component, inject, PLATFORM_ID } from '@angular/core';
-import { getAllChanges, getRemoteConfig } from '@angular/fire/remote-config';
+import { AsyncPipe, JsonPipe, isPlatformServer } from '@angular/common';
+import { Component, PLATFORM_ID, inject } from '@angular/core';
+import { FirebaseApp } from '@angular/fire/app';
import { traceUntilFirst } from '@angular/fire/performance';
+import { getAllChanges, getRemoteConfig } from '@angular/fire/remote-config';
import { EMPTY } from 'rxjs';
-import { AsyncPipe, isPlatformServer, JsonPipe } from '@angular/common';
-import { FirebaseApp } from '@angular/fire/app';
@Component({
selector: 'app-remote-config',
- template: `Remote Config! {{ config$ | async | json }}
`,
+ template: `
+ Remote Config! {{ config$ | async | json }}
+
`,
imports: [AsyncPipe, JsonPipe],
})
export class RemoteConfigComponent {
-
- private readonly remoteConfig = isPlatformServer(inject(PLATFORM_ID)) ? undefined : getRemoteConfig(inject(FirebaseApp));
- protected readonly config$ = this.remoteConfig ?
- getAllChanges(this.remoteConfig).pipe(
- traceUntilFirst('remote-config'),
- ) :
- EMPTY;
-
+ private readonly remoteConfig = isPlatformServer(inject(PLATFORM_ID))
+ ? undefined
+ : getRemoteConfig(inject(FirebaseApp));
+ protected readonly config$ = this.remoteConfig
+ ? getAllChanges(this.remoteConfig).pipe(traceUntilFirst('remote-config'))
+ : EMPTY;
}
diff --git a/sample/src/app/storage/storage.component.ts b/sample/src/app/storage/storage.component.ts
index 56ddbb247..b5d99f62b 100644
--- a/sample/src/app/storage/storage.component.ts
+++ b/sample/src/app/storage/storage.component.ts
@@ -1,13 +1,24 @@
-import { Component, inject, makeStateKey, PLATFORM_ID, TransferState } from '@angular/core';
-import { from, startWith, tap } from 'rxjs';
-import { traceUntilFirst } from '@angular/fire/performance';
-import { connectStorageEmulator, getDownloadURL, getStorage, ref } from '@angular/fire/storage';
import { AsyncPipe, isPlatformServer } from '@angular/common';
+import {
+ Component,
+ PLATFORM_ID,
+ TransferState,
+ inject,
+ makeStateKey,
+} from '@angular/core';
import { FirebaseApp } from '@angular/fire/app';
+import { traceUntilFirst } from '@angular/fire/performance';
+import {
+ connectStorageEmulator,
+ getDownloadURL,
+ getStorage,
+ ref,
+} from '@angular/fire/storage';
+import { from, startWith, tap } from 'rxjs';
import { environment } from '../../environments/environment';
-const TRANSPARENT_PNG
- = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
+const TRANSPARENT_PNG =
+ 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
@Component({
selector: 'app-storage',
@@ -17,28 +28,34 @@ const TRANSPARENT_PNG
![]()
`,
- imports: [AsyncPipe]
+ imports: [AsyncPipe],
})
export class StorageComponent {
-
private readonly storage = getStorage(inject(FirebaseApp));
private readonly transferState = inject(TransferState);
- private readonly transferStateKey = makeStateKey("storage:google-g.png");
-
+ private readonly transferStateKey = makeStateKey(
+ 'storage:google-g.png'
+ );
+
private readonly icon = ref(this.storage, 'google-g.png');
protected readonly downloadUrl$ = from(getDownloadURL(this.icon)).pipe(
traceUntilFirst('storage'),
- isPlatformServer(inject(PLATFORM_ID)) ?
- tap(it => this.transferState.set(this.transferStateKey, it)) :
- startWith(this.transferState.get(this.transferStateKey, TRANSPARENT_PNG))
+ isPlatformServer(inject(PLATFORM_ID))
+ ? tap((it) => this.transferState.set(this.transferStateKey, it))
+ : startWith(
+ this.transferState.get(this.transferStateKey, TRANSPARENT_PNG)
+ )
);
constructor() {
if (environment.emulatorPorts?.storage) {
- connectStorageEmulator(this.storage, "localhost", environment.emulatorPorts.storage);
+ connectStorageEmulator(
+ this.storage,
+ 'localhost',
+ environment.emulatorPorts.storage
+ );
}
}
-
}
diff --git a/sample/src/app/upboats/upboats.component.ts b/sample/src/app/upboats/upboats.component.ts
index 5e5378142..3af9b85b0 100644
--- a/sample/src/app/upboats/upboats.component.ts
+++ b/sample/src/app/upboats/upboats.component.ts
@@ -1,55 +1,88 @@
-import { Component, inject, makeStateKey, OnInit, PLATFORM_ID, TransferState } from '@angular/core';
-import { Observable } from 'rxjs';
-import { map, startWith, tap } from 'rxjs/operators';
-import { traceUntilFirst } from '@angular/fire/performance';
-import { Auth } from '@angular/fire/auth';
-import { addDoc, collection, collectionData, connectFirestoreEmulator, doc, getFirestore, increment, orderBy, query, serverTimestamp, updateDoc } from '@angular/fire/firestore';
import { AsyncPipe, isPlatformServer } from '@angular/common';
-import { authState } from '../auth/auth.component';
+import {
+ Component,
+ PLATFORM_ID,
+ TransferState,
+ inject,
+ makeStateKey,
+} from '@angular/core';
import { FirebaseApp } from '@angular/fire/app';
+import { Auth } from '@angular/fire/auth';
+import {
+ addDoc,
+ collection,
+ collectionData,
+ connectFirestoreEmulator,
+ doc,
+ getFirestore,
+ increment,
+ orderBy,
+ query,
+ serverTimestamp,
+ updateDoc,
+} from '@angular/fire/firestore';
+import { traceUntilFirst } from '@angular/fire/performance';
+import { Observable } from 'rxjs';
+import { map, startWith, tap } from 'rxjs/operators';
import { environment } from '../../environments/environment';
+import { authState } from '../auth/auth.component';
-export type Animal = {
- name: string,
- upboats: number,
- id: string,
- hasPendingWrites: boolean,
-};
+export interface Animal {
+ name: string;
+ upboats: number;
+ id: string;
+ hasPendingWrites: boolean;
+}
@Component({
selector: 'app-upboats',
template: `
-
-
- @for (animal of (animals | async); track animal.id) {
+
+
+ @for (animal of (animals | async); track animal.id) {
-
{{ animal.name }}
-
+
{{ animal.upboats }}
-
+
@if (animal.hasPendingWrites) { 🕒 }
- }
-
-
-
+
+