@angular/fire 16.0.0-canary.596e208 → 16.0.0-canary.78407bc

package/compat/remote-config/remote-config.d.ts

@@ -1,14 +1,12 @@
 import { InjectionToken, NgZone } from '@angular/core';
-import { MonoTypeOperatorFunction, Observable, OperatorFunction } from 'rxjs';
 import { ɵAngularFireSchedulers } from '@angular/fire';
 import { ɵPromiseProxy } from '@angular/fire/compat';
 import { FirebaseOptions } from 'firebase/app';
 import firebase from 'firebase/compat/app';
+import { MonoTypeOperatorFunction, Observable, OperatorFunction } from 'rxjs';
 import { Settings } from './interfaces';
 import * as i0 from "@angular/core";
-export interface ConfigTemplate {
-    [key: string]: string | number | boolean;
-}
+export type ConfigTemplate = Record<string, string | number | boolean>;
 export declare const SETTINGS: InjectionToken<firebase.remoteConfig.Settings>;
 export declare const DEFAULTS: InjectionToken<ConfigTemplate>;
 export interface AngularFireRemoteConfig extends ɵPromiseProxy<firebase.remoteConfig.RemoteConfig> {
@@ -33,53 +31,21 @@ export declare class AngularFireRemoteConfig {
     private zone;
     readonly changes: Observable<Parameter>;
     readonly parameters: Observable<Parameter[]>;
-    readonly numbers: Observable<{
-        [key: string]: number | undefined;
-    }> & {
-        [key: string]: Observable<number>;
-    };
-    readonly booleans: Observable<{
-        [key: string]: boolean | undefined;
-    }> & {
-        [key: string]: Observable<boolean>;
-    };
-    readonly strings: Observable<{
-        [key: string]: string | undefined;
-    }> & {
-        [key: string]: Observable<string | undefined>;
-    };
+    readonly numbers: Observable<Record<string, number | undefined>> & Record<string, Observable<number>>;
+    readonly booleans: Observable<Record<string, boolean | undefined>> & Record<string, Observable<boolean>>;
+    readonly strings: Observable<Record<string, string | undefined>> & Record<string, Observable<string | undefined>>;
     constructor(options: FirebaseOptions, name: string | null | undefined, settings: Settings | null, defaultConfig: ConfigTemplate | null, zone: NgZone, schedulers: ɵAngularFireSchedulers, platformId: Object);
     static ɵfac: i0.ɵɵFactoryDeclaration<AngularFireRemoteConfig, [null, { optional: true; }, { optional: true; }, { optional: true; }, null, null, null]>;
     static ɵprov: i0.ɵɵInjectableDeclaration<AngularFireRemoteConfig>;
 }
 export declare const budget: <T>(interval: number) => MonoTypeOperatorFunction<T>;
-export declare function scanToObject(): OperatorFunction<Parameter, {
-    [key: string]: string | undefined;
-}>;
-export declare function scanToObject(to: 'numbers'): OperatorFunction<Parameter, {
-    [key: string]: number | undefined;
-}>;
-export declare function scanToObject(to: 'booleans'): OperatorFunction<Parameter, {
-    [key: string]: boolean | undefined;
-}>;
-export declare function scanToObject(to: 'strings'): OperatorFunction<Parameter, {
-    [key: string]: string | undefined;
-}>;
-export declare function scanToObject<T extends ConfigTemplate>(template: T): OperatorFunction<Parameter, T & {
-    [key: string]: string | undefined;
-}>;
-export declare function mapToObject(): OperatorFunction<Parameter[], {
-    [key: string]: string | undefined;
-}>;
-export declare function mapToObject(to: 'numbers'): OperatorFunction<Parameter[], {
-    [key: string]: number | undefined;
-}>;
-export declare function mapToObject(to: 'booleans'): OperatorFunction<Parameter[], {
-    [key: string]: boolean | undefined;
-}>;
-export declare function mapToObject(to: 'strings'): OperatorFunction<Parameter[], {
-    [key: string]: string | undefined;
-}>;
-export declare function mapToObject<T extends ConfigTemplate>(template: T): OperatorFunction<Parameter[], T & {
-    [key: string]: string | undefined;
-}>;
+export declare function scanToObject(): OperatorFunction<Parameter, Record<string, string | undefined>>;
+export declare function scanToObject(to: 'numbers'): OperatorFunction<Parameter, Record<string, number | undefined>>;
+export declare function scanToObject(to: 'booleans'): OperatorFunction<Parameter, Record<string, boolean | undefined>>;
+export declare function scanToObject(to: 'strings'): OperatorFunction<Parameter, Record<string, string | undefined>>;
+export declare function scanToObject<T extends ConfigTemplate>(template: T): OperatorFunction<Parameter, T & Record<string, string | undefined>>;
+export declare function mapToObject(): OperatorFunction<Parameter[], Record<string, string | undefined>>;
+export declare function mapToObject(to: 'numbers'): OperatorFunction<Parameter[], Record<string, number | undefined>>;
+export declare function mapToObject(to: 'booleans'): OperatorFunction<Parameter[], Record<string, boolean | undefined>>;
+export declare function mapToObject(to: 'strings'): OperatorFunction<Parameter[], Record<string, string | undefined>>;
+export declare function mapToObject<T extends ConfigTemplate>(template: T): OperatorFunction<Parameter[], T & Record<string, string | undefined>>;

package/compat/storage/observable/fromTask.d.ts

@@ -1,4 +1,3 @@
 import { Observable } from 'rxjs';
 import { UploadTask } from '../interfaces';
-import firebase from 'firebase/compat/app';
-export declare function fromTask(task: UploadTask): Observable<firebase.storage.UploadTaskSnapshot>;
+export declare function fromTask(task: UploadTask): Observable<import("firebase/compat").default.storage.UploadTaskSnapshot>;

package/compat/storage/ref.d.ts

@@ -1,6 +1,6 @@
+import { Observable } from 'rxjs';
 import { ListOptions, ListResult, Reference, SettableMetadata, UploadMetadata } from './interfaces';
 import { AngularFireUploadTask } from './task';
-import { Observable } from 'rxjs';
 export interface AngularFireStorageReference {
     getDownloadURL(): Observable<any>;
     getMetadata(): Observable<any>;

package/compat/storage/storage.d.ts

@@ -1,10 +1,10 @@
 import { InjectionToken, NgZone } from '@angular/core';
 import { ɵAngularFireSchedulers } from '@angular/fire';
+import { AppCheckInstances } from '@angular/fire/app-check';
 import { FirebaseOptions } from 'firebase/app';
+import firebase from 'firebase/compat/app';
 import { UploadMetadata } from './interfaces';
 import 'firebase/compat/storage';
-import firebase from 'firebase/compat/app';
-import { AppCheckInstances } from '@angular/fire/app-check';
 import * as i0 from "@angular/core";
 export declare const BUCKET: InjectionToken<string>;
 export declare const MAX_UPLOAD_RETRY_TIME: InjectionToken<number>;
@@ -21,7 +21,7 @@ export declare const USE_EMULATOR: InjectionToken<[host: string, port: number, o
  */
 export declare class AngularFireStorage {
     readonly storage: firebase.storage.Storage;
-    constructor(options: FirebaseOptions, name: string | null | undefined, storageBucket: string | null, platformId: Object, zone: NgZone, schedulers: ɵAngularFireSchedulers, maxUploadRetryTime: number | any, maxOperationRetryTime: number | any, _useEmulator: any, _appCheckInstances: AppCheckInstances);
+    constructor(options: FirebaseOptions, name: string | null | undefined, storageBucket: string | null, platformId: Object, zone: NgZone, schedulers: ɵAngularFireSchedulers, maxUploadRetryTime: any, maxOperationRetryTime: any, _useEmulator: any, _appCheckInstances: AppCheckInstances);
     ref(path: string): import("./ref").AngularFireStorageReference;
     refFromURL(path: string): import("./ref").AngularFireStorageReference;
     upload(path: string, data: any, metadata?: UploadMetadata): import("@angular/fire/compat/storage").AngularFireUploadTask;

package/compat/storage/task.d.ts

@@ -1,5 +1,5 @@
-import { UploadTask, UploadTaskSnapshot } from './interfaces';
 import { Observable } from 'rxjs';
+import { UploadTask, UploadTaskSnapshot } from './interfaces';
 export interface AngularFireUploadTask {
     task: UploadTask;
     snapshotChanges(): Observable<UploadTaskSnapshot | undefined>;

package/database/database.module.d.ts

@@ -1,7 +1,7 @@
-import { NgZone, InjectionToken, ModuleWithProviders, Injector } from '@angular/core';
+import { InjectionToken, Injector, ModuleWithProviders, NgZone } from '@angular/core';
+import { FirebaseApp } from '@angular/fire/app';
 import { Database as FirebaseDatabase } from 'firebase/database';
 import { Database } from './database';
-import { FirebaseApp } from '@angular/fire/app';
 import * as i0 from "@angular/core";
 export declare const PROVIDED_DATABASE_INSTANCES: InjectionToken<Database[]>;
 export declare function defaultDatabaseInstanceFactory(provided: FirebaseDatabase[] | undefined, defaultApp: FirebaseApp): Database;

package/docs/analytics.md

@@ -0,0 +1,67 @@
+<img align="right" width="30%" src="images/analytics-illo_1x.png">
+
+<small>
+<a href="https://github.com/angular/angularfire">AngularFire</a> &#10097; <a href="../README.md#developer-guide">Developer Guide</a> &#10097; Analytics
+</small>
+
+# Analytics
+
+Google Analytics is an app measurement solution, available at no charge, that provides insight on app usage and user engagement.
+
+[Learn more](https://firebase.google.com/docs/analytics)
+## Dependency Injection
+
+As a prerequisite, ensure that `AngularFire` has been added to your project via
+```bash
+ng add @angular/fire
+```
+
+Provide a Google Analytics instance in the application's `NgModule` (`app.module.ts`):
+
+```ts
+@NgModule({
+  declarations: [
+    ...
+  ],
+  imports: [
+    ...
+    // App initialization
+    provideFirebaseApp(() => initializeApp(environment.firebase)),
+    provideAnalytics(() => getAnalytics())
+  ],
+  providers: [],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }
+```
+
+In your component class, for example `user-profile.component.ts` import and inject `Firestore`:
+
+```typescript
+import { Component, inject } from '@angular/core';
+import { Analytics } from '@angular/fire/analytics';
+
+@Component({
+    standalone: true,
+    selector: 'app-user-profile',
+    ...
+})
+export class UserProfileComponent {
+    private analytics: Analytics = inject(Analytics);
+    ...
+}
+```
+
+## Firebase API
+
+The [Firebase API for Google Analytics documentation](https://firebase.google.com/docs/reference/js/analytics.md#analytics_package) is available on the Firebase website.
+
+## Services
+
+### ScreenTrackingService
+
+Coming soon, for now [please review the documentation](https://firebase.google.com/docs/analytics/screenviews)
+
+### UserTrackingService
+Coming soon
+

package/docs/app-check.md

@@ -0,0 +1,53 @@
+<small>
+<a href="https://github.com/angular/angularfire">AngularFire</a> &#10097; <a href="../README.md#developer-guide">Developer Guide</a> &#10097; Realtime App Check
+</small>
+
+<img align="right" width="30%" src="images/reCAPTCHA-logo@1x.png">
+
+# App Check
+
+App Check helps protect your API resources from abuse by preventing unauthorized clients from accessing your backend resources. It works with both Firebase services, Google Cloud services, and your own APIs to keep your resources safe.
+
+[Learn More](https://firebase.google.com/docs/app-check)
+
+## Dependency Injection
+As a prerequisite, ensure that `AngularFire` has been added to your project via
+```bash
+ng add @angular/fire
+```
+
+Provide an App Check instance and configuration in the application's `NgModule` (`app.module.ts`):
+
+```ts
+import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
+import { provideAppCheck } from '@angular/fire/app-check';
+
+@NgModule({
+  imports: [
+    provideFirebaseApp(() => initializeApp(environment.firebase)),
+    provideAppCheck(() => initializeAppCheck(getApp(), {
+        provider: new ReCaptchaV3Provider(/* configuration */),
+      })),
+  ]
+})
+```
+
+Next inject it into your component:
+
+```ts
+import { Component, inject} from '@angular/core';
+import { AppCheck } from '@angular/fire/app-check';
+
+@Component({ ... })
+export class AppCheckComponent {
+  private appCheck: AppCheck = inject(AppCheck);
+  ...
+}
+```
+
+## Firebase API
+
+The [AppCheck documentation](https://firebase.google.com/docs/reference/js/app-check) is available on the Firebase website.
+
+## Convenience observables
+Coming soon.

package/docs/auth.md

@@ -0,0 +1,165 @@
+<img align="right" width="30%" src="images/auth-illo_1x.png">
+
+<small>
+<a href="https://github.com/angular/angularfire">AngularFire</a> &#10097; <a href="../README.md#developer-guide">Developer Guide</a> &#10097; Authentication
+</small>
+
+# Authentication
+
+Most apps need to know the identity of a user. Knowing a user's identity allows an app to securely save user data in the cloud and provide the same personalized experience across all of the user's devices.
+Firebase Authentication provides backend services, easy-to-use SDKs, and ready-made UI libraries to authenticate users to your app. It supports authentication using passwords, phone numbers, popular federated identity providers like Google, Facebook and Twitter, and more.
+
+Firebase Authentication integrates tightly with other Firebase services, and it leverages industry standards like OAuth 2.0 and OpenID Connect, so it can be easily integrated with your custom backend.
+
+[Learn more about Firebase Authentication](https://firebase.google.com/docs/auth)
+
+## Dependency Injection
+
+As a prerequisite, ensure that `AngularFire` has been added to your project via
+```bash
+ng add @angular/fire
+```
+
+Provide an auth instance in the application's `NgModule` (`app.module.ts`):
+
+```ts
+import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
+import { getAuth, provideAuth } from '@angular/fire/auth';
+
+@NgModule({
+  imports: [
+    provideFirebaseApp(() => initializeApp(environment.firebase)),
+    provideAuth(() => getAuth()),
+  ]
+})
+```
+
+Next inject it into your component:
+
+```ts
+import { Component, inject} from '@angular/core';
+import { Auth } from '@angular/fire/auth';
+
+@Component({ ... })
+export class LoginComponent {
+  private auth: Auth = inject(Auth);
+  ...
+}
+```
+
+## Firebase API
+
+AngularFire wraps the Firebase JS SDK to ensure proper functionality in Angular, while providing the same API.
+
+Update the imports from `import { ... } from 'firebase/auth'` to `import { ... } from '@angular/fire/auth'` and follow the offical documentation.
+
+[Getting Started](https://firebase.google.com/docs/auth/web/start) | [API Reference](https://firebase.google.com/docs/reference/js/auth)
+
+## Convenience observables
+
+AngularFire provides observables to allow convenient use of the Firebase Authentication with RXJS.
+
+### user
+
+The `user` observable streams events triggered by sign-in, sign-out, and token refresh events.
+
+Example code:
+
+```ts
+import { Auth, User, user } from '@angular/fire/auth';
+...
+
+export class UserComponent implements OnDestroy {
+  private auth: Auth = inject(Auth);
+  user$ = user(auth);
+  userSubscription: Subscription;
+  ...
+
+  constructor() {
+    this.userSubscription = this.user$.subscribe((aUser: User | null) => {
+        //handle user state changes here. Note, that user will be null if there is no currently logged in user.
+     console.log(aUser);
+    })
+  }
+
+  ngOnDestroy() {
+    // when manually subscribing to an observable remember to unsubscribe in ngOnDestroy
+    this.userSubscription.unsubscribe();
+  }
+}
+
+```
+
+### authState
+
+The `authState` observable streams events triggered by sign-in and sign-out events.
+
+Example code:
+```ts
+import { Auth, authState } from '@angular/fire/auth';
+...
+
+export class UserComponent implements OnDestroy {
+  private auth: Auth = inject(Auth);
+  authState$ = authState(auth);
+  authStateSubscription: Subscription;
+  ...
+
+  constructor() {
+    this.authStateSubscription = this.authState$.subscribe((aUser: User | null) => {
+        //handle auth state changes here. Note, that user will be null if there is no currently logged in user.
+     console.log(aUser);
+    })
+  }
+
+  ngOnDestroy() {
+    // when manually subscribing to an observable remember to unsubscribe in ngOnDestroy
+    this.authStateSubscription.unsubscribe();
+  }
+}
+```
+
+### idToken
+
+The `idToken` observable streams events triggered by sign-in, sign-out and token refresh events.
+
+Example code:
+```ts
+import { Auth, idToken } from '@angular/fire/auth';
+...
+
+export class UserComponent implements OnDestroy {
+  private auth: Auth = inject(Auth);
+  idToken$ = idToken(auth);
+  idTokenSubscription: Subscription;
+  ...
+
+  constructor() {
+    this.idTokenSubscription = this.idToken$.subscribe((token: string | null) => {
+        //handle idToken changes here. Note, that user will be null if there is no currently logged in user.
+     console.log(string);
+    })
+  }
+
+  ngOnDestroy() {
+    // when manually subscribing to an observable remember to unsubscribe in ngOnDestroy
+    this.idTokenSubscription.unsubscribe();
+  }
+}
+```
+
+## Connecting the emulator suite
+
+```ts
+import { connectAuthEmulator, getAuth, provideAuth } from '@angular/fire/auth';
+
+@NgModule({
+  imports: [
+    provideAuth(() => {
+      const auth = getAuth();
+      connectAuthEmulator(auth, 'http://localhost:9099', { disableWarnings: true });
+      return auth;
+    }),
+  ]
+})
+```

package/docs/compat/analytics/getting-started.md

@@ -0,0 +1,137 @@
+# Getting started with Google Analytics
+
+`AngularFireAnalytics` dynamically imports the `firebase/analytics` library and provides a promisified version of the [Firebase Analytics SDK (`firebase.analytics.Analytics`)](https://firebase.google.com/docs/reference/js/firebase.analytics.Analytics.html).
+
+> **NOTE**: [AngularFire has a new tree-shakable API](../../../README.md#developer-guide), you're looking at the documentation for the compatability version of the library. [See the v7 upgrade guide for more information on this change.](../../version-7-upgrade.md).
+
+### API:
+
+```ts
+class AngularFireAnalytics {
+  updateConfig(options: {[key:string]: any}): Promise<void>;
+
+  // from firebase.analytics() proxy:
+  logEvent(eventName: string, eventParams?: {[key: string]: any}, options?: analytics.AnalyticsCallOptions): Promise<void>;
+  setCurrentScreen(screenName: string, options?: analytics.AnalyticsCallOptions): Promise<void>;
+  setUserId(id: string, options?: analytics.AnalyticsCallOptions): Promise<void>;
+  setUserProperties(properties: analytics.CustomParams, options?: analytics.AnalyticsCallOptions): Promise<void>;
+  setAnalyticsCollectionEnabled(enabled: boolean): Promise<void>;
+  app: Promise<app.App>;
+}
+
+COLLECTION_ENABLED = InjectionToken<boolean>;
+APP_VERSION = InjectionToken<string>;
+APP_NAME = InjectionToken<string>;
+DEBUG_MODE = InjectionToken<boolean>;
+CONFIG = InjectionToken<Config>;
+```
+
+### Usage:
+
+```ts
+import { AngularFireAnalyticsModule } from '@angular/fire/compat/analytics';
+
+@NgModule({
+  imports: [
+    AngularFireModule.initializeApp(environment.firebase),
+    AngularFireAnalyticsModule
+  ]
+})
+export class AppModule { }
+```
+
+`AngularFireAnalyticsModule` will dynamically import and configure `firebase/analytics`. A `page_view` event will automatically be logged (see `CONFIG` below if you wish to disable this behavior.)
+
+In your component you can then dependency inject `AngularFireAnalytics` and make calls against the SDK:
+
+```ts
+import { AngularFireAnalytics } from '@angular/fire/compat/analytics';
+
+constructor(analytics: AngularFireAnalytics) {
+  analytics.logEvent('custom_event', { ... });
+}
+```
+
+## Tracking Screen Views
+
+You can log [`screen_view` events](https://firebase.google.com/docs/reference/js/firebase.analytics.Analytics.html#parameters_10) yourself of course, but AngularFire provides the `ScreenTrackingService` which automatically integrates with the Angular Router to provide Firebase with screen view tracking. You simply can integrate like so:
+
+```ts
+import { AngularFireAnalyticsModule, ScreenTrackingService } from '@angular/fire/compat/analytics';
+
+@NgModule({
+  imports: [
+    AngularFireModule.initializeApp(environment.firebase),
+    AngularFireAnalyticsModule
+  ],
+  providers: [
+    ScreenTrackingService
+  ]
+})
+export class AppModule { }
+```
+
+`AngularFireAnalyticsModule` will initialize `ScreenTrackingService` if it is provided.
+
+## Tracking User Identifiers
+
+To enrich your Analytics data you can track the currently signed in user by setting [`setuserid`](https://firebase.google.com/docs/reference/js/firebase.analytics.Analytics.html#setuserid) and [`setUserProperties`](https://firebase.google.com/docs/reference/js/firebase.analytics.Analytics.html#set-user-properties). AngularFire provides a `UserTrackingService` which will dynamically import `firebase/auth`, monitor for changes in the logged in user, and call `setuserid` for you automatically.
+
+
+```ts
+import { AngularFireAnalyticsModule, UserTrackingService } from '@angular/fire/compat/analytics';
+
+@NgModule({
+  imports: [
+    AngularFireModule.initializeApp(environment.firebase),
+    AngularFireAnalyticsModule
+  ],
+  providers: [
+    UserTrackingService
+  ]
+})
+export class AppModule { }
+```
+
+`AngularFireAnalyticsModule` will initialize `UserTrackingService` if it is provided.
+
+## Configuration with Dependency Injection
+
+### Configure Google Analtyics with `CONFIG`
+
+Using the `CONFIG` DI Token (*default: {}*) will allow you to configure Google Analytics. E.g, you could skip sending the initial `page_view` event, anonymize IP addresses, and disallow ads personalization signals for all events like so:
+
+```ts
+import { AngularFireAnalyticsModule, CONFIG } from '@angular/fire/compat/analytics';
+
+@NgModule({
+  imports: [
+    AngularFireModule.initializeApp(environment.firebase),
+    AngularFireAnalyticsModule
+  ],
+  providers: [
+    { provide: CONFIG, useValue: {
+      send_page_view: false,
+      allow_ad_personalization_signals: false,
+      anonymize_ip: true
+    } }
+  ]
+})
+export class AppModule { }
+```
+
+See the gtag.js documentation to learn of the different configuration options at your disposal.
+
+### Use DebugView `DEBUG_MODE`
+
+To use [DebugView in Analytics](https://console.firebase.google.com/project/_/analytics/debugview) set `DEBUG_MODE` to `true` (*default: false*).
+
+### Track deployments with `APP_NAME` and `APP_VERSION`
+
+If you provide `APP_NAME` and `APP_VERSION` (*default: undefined*) you will be able to [track version adoption](https://console.firebase.google.com/project/_/analytics/latestrelease) of your PWA.
+
+### Disable analytics collection via `COLLECTION_ENABLED`
+
+If you set `COLLECTION_ENABLED` (*default: true*) to `false` then analytics collection will be disabled for this app on this device. To opt back in to analytics collection you could then call `setAnalyticsCollectionEnabled(true)`.
+
+Putting these APIs to use with cookies would allow you to create a flexible analytics collection scheme that would respect your user's desire for privacy.