Support for the modular Firebase 9

[atanaskanchev]

The modular Firebase v9 is in the final beta stages and it's quite stable. I am looking forward to adding support for it to the Firebase adapter.

[balazsorban44]

I don't oppose it, but since the adapter is server-side only, it won't really have a big effect in my opinion. Or is there any other reason for version 9 to be better than modularity?

[atanaskanchev]

The main shtick of v9 is the reduced bundle size on the both client/server side. This is what they say

The fully modularized version 9 has these advantages over earlier versions:

Version 9 enables a dramatically reduced app size. It adopts the modern JavaScript Module format, allowing for "tree shaking" practices in which you import only the artifacts your app needs. Depending on your app, tree-shaking with version 9 can result in 80% less kilobytes than a comparable app built using version 8.
Version 9 will continue to benefit from ongoing feature development, while version 8 will be frozen at a point in the future.

[wobsoriano]

v9 is gonna be a refactor I suppose. Things like:

async createUser(profile) {
  const userRef = await client.collection("users").add(newUser)
  const snapshot = await userRef.get()
  const user = docSnapshotToObject(snapshot)
  return user
}

is going to be

import { collection, doc, addDoc } from "firebase/firestore"; 

async createUser(profile) {
  const userRef = await addDoc(collection("users", newUser));
  const snapshot = await getDoc(userRef)
  const user = docSnapshotToObject(snapshot)
  return user
}

[balazsorban44]

would like to land #2361 first, but yeah. it will need a refractor.

[balazsorban44]

@atanaskanchev, @wobsoriano the refactored version is available at nextauthjs/adapters#183. I would appreciate it if you could look and help to think through how we could utilize Firebase 9.

My biggest question is how to provide all the necessary methods because I would like to keep the adapter APIs for different adapters similar. Meaning most adapters pass a client object, which contains all the necessary methods. I am thinking we will have to require the users to write some boilerplate and create a FirebaseClient object that is passed as an argument to FirebaseAdapter.

Taking the above example by @wobsoriano for createUser, something like this:

// [...nextauth].js

import { FirebaseAdapter } from "@next-auth/firebase-adapter"
import { collection, doc, addDoc } from "firebase/firestore"

const firebaseClient = { collection, doc, addDoc } // Add any necessary methods here
export default NextAuth({
  ...
  adapter: FirebaseAdapter(firebaseClient)
})

[wobsoriano]

Oh wait... looks like web only has the modular update. Not sure

[balazsorban44]

So it might not be necessary to upgrade after all? 😁

We are using the package simply called "firebase".

[wobsoriano]

Just tried "firebase": "9.0.0-beta.7" in a node environment and it's actually supported too.

So yeah, your example will do 😁

import { FirebaseAdapter } from '@next-auth/firebase-adapter'
import { initializeApp } from 'firebase/app'

import {
  getFirestore,
  collection,
  query,
  getDocs,
  where,
  limit,
  doc,
  getDoc,
  addDoc,
  updateDoc,
  deleteDoc
} from 'firebase/firestore'

const firebaseApp = initializeApp({ /* config */ });

const db = getFirestore(firebaseApp)

const firebaseClient = {
  db,
  collection,
  query,
  getDocs,
  where,
  limit,
  doc,
  getDoc,
  addDoc,
  updateDoc,
  deleteDoc
}

export default NextAuth({
  adapter: FirebaseAdapter(firebaseClient)
})

// somewhere
async createUser(profile) {
  const userRef = await addDoc(collection(db, 'users'), newUser);
  const snapshot = await getDoc(userRef)
  const user = docSnapshotToObject(snapshot)
  return user
}

[balazsorban44]

Thanks, I will have a look then!

The question is, are people ready for Firebase 9 yet, or should we publish the next version with 8, and when 9 gets to stable, we refactor then?

I don't want to maintain 2 different versions of the adapter.

[balazsorban44]

@atanaskanchev, @wobsoriano I did the rewrite, @next-auth/firebase-adapter@0.1.2-pr.183-638762fe.8 requires at least Firebase 9. All tests pass, but could any of you test it out? You will need next-auth@4.0.0-next.23 at least.

[abhinav-TB]

@balazsorban44 I am facing some issues while using firebase 9, what I passed into the firebase adapter function is the instance of firestore returned by geFirestore()

the error I am getting is

here is my next_auth.js file

firebase config

[ceevie]

@atanaskanchev, @wobsoriano I did the rewrite, @next-auth/firebase-adapter@0.1.2-pr.183-638762fe.8 requires at least Firebase 9. All tests pass, but could any of you test it out? You will need next-auth@4.0.0-next.23 at least.

Will there be a new official update to the Firebase Adapter Docs?
Because the current version of the docs isn't compatible with firebase v9.
I had to add the FirebaseClient like mentioned above in order to work.

[balazsorban44]

Still haven't decided. See nextauthjs/adapters#183 What's the status of Firebase 9? Is it stable yet?

[michalscislowski]

import { initializeApp } from 'firebase/app'

import {
  getFirestore,
  collection,
  query,
  getDocs,
  where,
  limit,
  doc,
  getDoc,
  addDoc,
  updateDoc,
  deleteDoc
} from 'firebase/firestore'

const firebaseApp = initializeApp({ /* config */ });

const db = getFirestore(firebaseApp)

const firebaseClient = {
  db,
  collection,
  query,
  getDocs,
  where,
  limit,
  doc,
  getDoc,
  addDoc,
  updateDoc,
  deleteDoc
}

export default NextAuth({
  adapter: FirebaseAdapter(firebaseClient)
})

async createUser(profile) {
  const userRef = await addDoc(collection(db, 'users'), newUser);
  const snapshot = await getDoc(userRef)
  const user = docSnapshotToObject(snapshot)
  return user
}

I'm getting FirebaseError: Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore this way. Anyone had similar issue?

[greendesertsnow]

Yes Firebase is stable. It's version ^9.4.1

Still haven't decided. See nextauthjs/adapters#183 What's the status of Firebase 9? Is it stable yet?

[balazsorban44]

We should go for v9 then I think. I'm not able to work on the PR, so if anyone is interested in picking up, please do 🙏. Would be awesome to figure out if we can integrate with Firebase Auth as well.

[SahilAujla]

Please add support for v9 as soon as possible. It's a humble request.

[balazsorban44]

"as soon as possible" is not really humble. 😕 Please read #3827. Feel free to work on it.

Useful links:

https://next-auth.js.org/adapters/overview
https://next-auth.js.org/adapters/models
https://next-auth.js.org/tutorials/creating-a-database-adapter

See other adapters for example on testing, TypeScript etc.:
https://github.com/nextauthjs/adapters/tree/main/packages

[SahilAujla]

I am not good with words. I am sorry if that was rude in any way. It's just I am stuck on a project where I am using Firebase v9.

It's my first time using any adapter, I don't even know what an adapter is properly, I was just following a tutorial.

But I will definitely try to work on it, whatever I can.

[balazsorban44]

No hard feelings! 💚

Hopefully, the above links should give you a proper introduction. When you've read through all of them and still have questions, don't hesitate to ask.

[srijans38]

Please see https://github.com/nextauthjs/adapters/issues/180#issuecomment-1004126562 with regards to firebase auth. The issue seems to be closed. I have also got it in a basic working state here nextauthjs/adapters#363

[greendesertsnow]

React-Query-Firebase is pretty much working like a firebase adapter right now @srijans38 @SahilAujla
I'm using it until I see a stable fb v9 for next-auth.
I'm sure there's things next-auth does better with SSR by the way.

[ndom91]

nextauthjs/next-auth has been migrated to a monorepository. The adapters code can now be found there under packages/adapter-*. Thanks for your interest in the project!