docs: fix the beforeAuthStateChanged import and the Imagen removal note (#3817)

The auth guide's cookie sync and the sample app imported
beforeAuthStateChanged from firebase/auth, because AngularFire's version
kept the app unstable until the first sign-in or sign-out (#3748). The
fix (#3770) shipped in 20.1.1 and 21.0.0-rc.2, so both now import it
from @angular/fire/auth, and the guide's note lists the releases that
still need the workaround.

The v21 upgrade guide covered only getImagenModel. firebase 12.18
removed every Imagen export, and the migration warns about
getImagenModel only in files that imported an old Vertex AI entry point.

Fixes #3815
Fixes #3816

Author: armando-navarro

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
 

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
 

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