diff --git a/docs/auth.md b/docs/auth.md index 31f6056c2..ca0123790 100644 --- a/docs/auth.md +++ b/docs/auth.md @@ -93,8 +93,8 @@ Add the cookie sync to your `app.config.ts`. AngularFire's `idToken` observable import { DestroyRef, PLATFORM_ID, inject, provideAppInitializer } from '@angular/core'; import { isPlatformBrowser } from '@angular/common'; import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; -import { Auth, idToken } from '@angular/fire/auth'; -import { beforeAuthStateChanged } from 'firebase/auth'; +// on AngularFire 20.1.0 and earlier, or 21.0.0-rc.0 and rc.1, import beforeAuthStateChanged from firebase/auth (see note below) +import { Auth, beforeAuthStateChanged, idToken } from '@angular/fire/auth'; import cookies from 'js-cookie'; // add to appConfig.providers @@ -151,9 +151,9 @@ This cookie carries a short-lived ID token that scripts on your page can read. F If you need a session the browser cannot read, use Firebase's [session cookies](https://firebase.google.com/docs/auth/admin/manage-cookies) with the Admin SDK instead. Those cannot be handed to `initializeServerApp`, so that approach means verifying the cookie yourself and building your own server-side Auth context. -#### `beforeAuthStateChanged` from `firebase/auth` +#### On AngularFire 20.1.0 and earlier, or 21.0.0-rc.0 and rc.1 -One import in the code above is deliberately different from the rest of this guide. `beforeAuthStateChanged` comes from `firebase/auth` rather than `@angular/fire/auth`. In AngularFire 21.0.0-rc.1 and earlier, AngularFire's version keeps the app marked as busy until its callback first runs, and this callback only runs when someone signs in or out ([#3748](https://github.com/angular/angularfire/issues/3748)). +On these releases, import `beforeAuthStateChanged` from `firebase/auth` instead of `@angular/fire/auth`. Otherwise it keeps the app marked as busy until its callback first runs, and this callback only runs when someone signs in or out ([#3748](https://github.com/angular/angularfire/issues/3748)). The fix shipped in AngularFire 20.1.1 and 21.0.0-rc.2. ### 3. Pass the cookie into the render diff --git a/docs/version-21-upgrade.md b/docs/version-21-upgrade.md index 474884423..004ed61e1 100644 --- a/docs/version-21-upgrade.md +++ b/docs/version-21-upgrade.md @@ -77,6 +77,8 @@ Two symbols were removed rather than renamed. The migration leaves their imports - `VertexAIOptions`: the new `AIOptions` takes a `backend` instead of a `location`, so rebuild the options by hand using the table above. - `getImagenModel`: Firebase shut the Imagen models down in August 2026 and removed the API in firebase 12.18 (`@firebase/ai` 2.15), so move image generation to the Gemini image models through [`getGenerativeModel`](https://firebase.google.com/docs/ai-logic/generate-images-gemini). + - The same release removed every other `Imagen*` export too, such as `ImagenModel`, `ImagenAspectRatio` and `ImagenGenerationConfig`. + - The migration does not warn about those. It warns about `getImagenModel` only in files that imported an old Vertex AI entry point, so check imports from `@angular/fire/ai` and `firebase/ai` by hand. ## Other notes diff --git a/sample/src/app/auth/auth.component.ts b/sample/src/app/auth/auth.component.ts index 92ba70b45..a42d643c2 100644 --- a/sample/src/app/auth/auth.component.ts +++ b/sample/src/app/auth/auth.component.ts @@ -1,10 +1,10 @@ import { Component, EnvironmentInjector, inject, makeStateKey, OnDestroy, PLATFORM_ID, runInInjectionContext, TransferState } from '@angular/core'; -import { Auth, signInAnonymously, signOut, User } from '@angular/fire/auth'; +import { Auth, beforeAuthStateChanged, signInAnonymously, signOut, User } from '@angular/fire/auth'; import { map, startWith, switchMap, tap } from 'rxjs/operators'; import { AsyncPipe, isPlatformBrowser, isPlatformServer } from '@angular/common'; import cookies from 'js-cookie'; import { from, Observable } from 'rxjs'; -import { GoogleAuthProvider, onAuthStateChanged, signInWithPopup, beforeAuthStateChanged, onIdTokenChanged } from "firebase/auth"; +import { GoogleAuthProvider, onAuthStateChanged, signInWithPopup, onIdTokenChanged } from "firebase/auth"; import { ɵzoneWrap } from "@angular/fire"; // TODO bring this to RxFire