How to use Firebase 9 in latest Angular

Take a look at https://github.com/angular/angularfire/blob/master/samples/modular/src/app/app.module.ts

I made some adjustments to my usage.

   ...
    import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
    import { environment } from '../environments/environment';

    import { getDatabase, provideDatabase } from '@angular/fire/database';
    import { getFirestore, provideFirestore, enableMultiTabIndexedDbPersistence } from '@angular/fire/firestore';
    import { getStorage, provideStorage } from '@angular/fire/storage';
    import { getAuth, provideAuth } from '@angular/fire/auth';
    import { FunctionsModule, getFunctions, provideFunctions } from '@angular/fire/functions';

    // import { getMessaging, provideMessaging } from '@angular/fire/messaging';
    // import { getRemoteConfig, provideRemoteConfig } from '@angular/fire/remote-config';
    // import { getAnalytics, provideAnalytics, ScreenTrackingService, UserTrackingService } from '@angular/fire/analytics';
    // import { ServiceWorkerModule } from '@angular/service-worker';

    let resolvePersistenceEnabled: (enabled: boolean) => void;

    export const persistenceEnabled = new Promise<boolean>(resolve => {
      resolvePersistenceEnabled = resolve;
    });

    ...
    @NgModule({
      ...
      imports: [
        ...
        provideFirebaseApp(() => initializeApp(environment.firebase)),

        provideDatabase(() => {
          const database = getDatabase();
          return database;
        }),

        provideFirestore(() => {
          const firestore = getFirestore();
          enableMultiTabIndexedDbPersistence(firestore).then(
            () => resolvePersistenceEnabled(true),
            () => resolvePersistenceEnabled(false)
          );
          return firestore;
        }),

        provideStorage(() => {
          const storage = getStorage();
          return storage;
        }),

        provideAuth(() => {
          const auth = getAuth();
          return auth;
        }),

        FunctionsModule,
        provideFunctions(() => {
          const functions = getFunctions();
          return functions;
        }),

        // provideMessaging(() => getMessaging()),
        // provideRemoteConfig(() => getRemoteConfig()),
        // provideAnalytics(() => getAnalytics()),
        // ServiceWorkerModule.register('ngsw-worker.js', {
        //   enabled: environment.production,
        //   registrationStrategy: 'registerWhenStable:30000'
        // }),

        ...
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    ...

Hope it helps ;)

Edited: I found here a better example https://dev.to/jdgamble555/angular-12-with-firebase-9-49a0

Based on the docs here Firebase is not yet supported. as I have read Firebase 9 will support modular import which I think is not yet supported in angular/fire yet.
So, there is no way to get them work together.

Also, check this link talking about v9 of firebase