next-auth error: 'Adapter' is not assignable to type 'Adapter | undefined'

Question

I'm following this documentation: https://authjs.dev/reference/adapter/mongodb to use next-auth. This is the relevant code:

import NextAuth from "next-auth"
import { MongoDBAdapter } from "@auth/mongodb-adapter"
import clientPromise from "../../../lib/mongodb"

...

export default NextAuth({
    providers,
    adapter: MongoDBAdapter(clientPromise),
})

I get the following error, which makes no sense to me:

Type 'Adapter' is not assignable to type 'Adapter | undefined'.
  Type 'Adapter' is not assignable to type 'DefaultAdapter & { createVerificationToken: (verificationToken: VerificationToken) => Awaitable<VerificationToken | null | undefined>; useVerificationToken: (params: { ...; }) => Awaitable<...>; }'.
    Type 'Adapter' is not assignable to type 'DefaultAdapter'.
      Types of property 'createUser' are incompatible.
        Type '((user: Omit<AdapterUser, "id">) => Awaitable<AdapterUser>) | undefined' is not assignable to type '(user: Omit<AdapterUser, "id">) => Awaitable<AdapterUser>'.
          Type 'undefined' is not assignable to type '(user: Omit<AdapterUser, "id">) => Awaitable<AdapterUser>'.ts(2322)
types.d.ts(106, 5): The expected type comes from property 'adapter' which is declared here on type 'AuthOptions'
(property) AuthOptions.adapter?: Adapter | undefined
You can use the adapter option to pass in your database adapter.

Required: No

Unconcern

Answer 1

I ran into the same issue today. I was importing MongoDBAdapter from @auth/mongodb-adapter, but actually needed to import from the next-auth adapter.

I ran:

npm install @next-auth/mongodb-adapter

Then changed my import to:

import { MongoDBAdapter } from "@next-auth/mongodb-adapter";

I have no clue what the actual issue is, just that installing the right adapter and changing the import fixed it for me.

Hope this helps!

Tribromoethanol

Thanks! So the point was that there are two different objects called both "Adapter". – Unconcern

I was having the same issue with the Dgraph Adapter. This solution works for it as well, just substitute 'mongodb' for 'dgraph' and you're good to go. I imagine this is the case for the other adapters as well. – Whithersoever

This migration to @auth vs @next-auth is very frustrating - half the documentation has disappeared for v4 of NextAuth.js and can only be found for Auth.js, but the Auth.js documentation doesn't consistently work for NextAuth.js. – Phox

I have done those, but the problem is still there, until I did the following: <code>adapter: MongoDBAdapter(clientPromise) as Adapter,</code> . I am using "mongodb": "^6.3.0", "@auth/mongodb-adapter": "^2.0.10", – Foyer

Try the solution from this issue here: github.com/nextauthjs/next-auth/discussions/3320, I'm posting the code just for future reference. – Indenture

Had the same issue with prisma. Followed the same steps but replacing "mongodb" with "prisma" and it worked like a charm – Lawhorn

Answer 2

I got the same type error with @auth/firebase-adapter.

ype error: Type 'Adapter' is not assignable to type 'Adapter | undefined'.
  Type 'Adapter' is not assignable to type 'DefaultAdapter & { createVerificationToken: (verificationToken: VerificationToken) => Awaitable<VerificationToken | null | undefined>; useVerificationToken: (params: { ...; }) => Awaitable<...>; }'.
    Type 'Adapter' is not assignable to type 'DefaultAdapter'.
      Types of property 'createUser' are incompatible.
        Type '((user: Omit<AdapterUser, "id">) => Awaitable<AdapterUser>) | undefined' is not assignable to type '(user: Omit<AdapterUser, "id">) => Awaitable<AdapterUser>'.
          Type 'undefined' is not assignable to type '(user: Omit<AdapterUser, "id">) => Awaitable<AdapterUser>'

First, import type Adapter from next-auth/adapters.

import type { Adapter } from "next-auth/adapters";

and change NextAuthOptions.

import type { Adapter } from "next-auth/adapters";

export const authOptions: NextAuthOptions = {,
  adapter: FirestoreAdapter(firestore) as Adapter,
  ...
};

Choking

Thank you kindly, stranger, for this answer. – Petigny

This worked for me when using supabase adapter. Thanks. – Pyrethrum

Answer 3

As mentioned by the Prisma developers themselves, the proper way would be:

// prisma/schema.prisma

import type { Adapter } from 'next-auth/adapters';

[...]

adapter: PrismaAdapter(prisma) as Adapter

Jurassic

Answer 4

I was working with Redis/upstash adapter, and had the same issue.

import { UpstashRedisAdapter } from '@next-auth/upstash-redis-adapter' 

In Auth.js they have been using this

import { UpstashRedisAdapter } from "@auth/upstash-redis-adapter";

But with the Next 13.3 updates, this has been an issue

Paymaster

And what exactly fixes the problem? – Praetor

Answer 5

I'm thinking that this has become a common issue on this transition as NextAuth adapter doc links ref the AuthJS adapter docs as "the up-to-date documentation". Same issue occurred for me with the Supabase adapter where the linked docs state to install:

npm install @supabase/supabase-js @auth/supabase-adapter

Error was cleared by editing the import statement from @auth/supabase-adapter to @next-auth/supabase-adapter and updating my dependencies accordingly.

In case it helps anyone, there were actually no Typing issues for me while dev'ing on a fedora os and only popped up on my windows laptop running ubuntu on wsl/2. Don't have the time to diagnose the why, maybe its a windows thing, but feel free to chime in with knowledge =)

Rika

Answer 6

Maybe this will solve:

take it:

adapter: MongoDBAdapter(clientPromise),

leave it like this::

adapter: MongoDBAdapter(clientPromise) as Adapter,

Santalaceous

Answer 7

For those who got the same problem with any adapters, such as PrismaAdapter, MongoDBAdapter, Supabase Adapter, just cast it as Adapter, like this: import NextAuth from "next-auth" import { MongoDBAdapter } from "@auth/mongodb-adapter" import clientPromise from "../../../lib/mongodb" import { Adapter } from "next-auth/adapters"; ...

export default NextAuth({ providers, adapter: AnyDBAdapter(clientPromise) as Adapter, })

This maybe a bug from next-auth.

Foyer

Answer 8

I had the same error, to fix it, I changed the import information

before

  import {PrismaAdapter} from '@auth/prisma-adapter'

  adapter: PrismaAdapter(prisma)

after

  import {PrismaAdapter} from '@next-auth/prisma-adapter';

  adapter: PrismaAdapter(prisma)

Valery

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Cashman

Answer 9

try this instead:

import { Adapter } from 'next-auth/adapters'
... 
... 
const authOptions: NextAuthOptions = { 
adapter: <Adapter>MongoDBAdapter(clientPromise), 
...

Cynthy

Answer 10

I had the same problem with Supabase and postgresql. Supabase changed a few things in regard to their core infrastructure (supervisor). To make the connection with prisma and supabase work, Please follow the following guide: In case of postgresql (I think it's the same with MongoDB) follow my instructions please:

Set the connection mode to Transaction in the database settings page and copy the connection string and append ?pgbouncer=true&connection_limit=1

The connection_limit=1 parameter is only required if you are using Prisma from a serverless environment. (Examples of Serverless Platforms: AWS Lambda,Vercel, Netlify Functions).

Transaction connection pooler string will look like this:

postgres://[db-user].[project-ref]:[db-password]@aws-0-[aws-region].pooler.supabase.com:6543/[db-name]?pgbouncer=true&connection_limit=1

To get the Session connection pooler string, change the port to 5432.

Create a .env file at the root of your project in for example VSCode and add these two variables (before we used just one variable):

DATABASE_URL="" # Set this to the Transaction connection pooler string you copied in Step 1
DIRECT_URL=""  # Set this to the Session connection pooler string you copied in Step 1

This is an example of my .env variables:

DATABASE_URL="postgres://postgres.[myDatabase[:[mypasswrod]@aws-0-eu-central-1.pooler.supabase.com:6543/postgres?pgbouncer=true&connection_limit=1"

DIRECT_URL="postgres://postgres.[myDatabase]:[myPassword]@aws-0-eu-central-1.pooler.supabase.com:5432/postgres"

Update your Prisma schema by adding directUrl:

datasource db {
    provider          = "postgresql"
    url               = env("DATABASE_URL")
    directUrl         = env("DIRECT_URL")
}

Now add your models in Prisma schema.

The last and final step is to test it by using the following code:

npx prisma migrate dev --name init

Now in supabase you'll see your tables are created and everything works fine.

Footling