next-auth: HTTP-based email provider: type `"email"` is not assignable to type `"oauth" | "credentials"`

Provider type

Email

Environment

System: OS: Linux 6.4 Arch Linux CPU: (8) x64 11th Gen Intel® Core™ i7-1185G7 @ 3.00GHz Memory: 26.16 GB / 31.06 GB Container: Yes Shell: 5.9 - /usr/bin/zsh Binaries: Node: 20.4.0 - /usr/bin/node Yarn: 3.3.0 - /usr/bin/yarn npm: 9.8.1 - /usr/bin/npm pnpm: 8.6.10 - /usr/bin/pnpm

Reproduction URL

https://github.com/mcevoypeter/next-auth-issue-repro

Describe the issue

I’m attempting to configure an HTTP-based email provider following the guide from the docs. When I add a stubbed-out provider object to the providers object key, I get the following error when running npm run build:

> build
> next build

- info Linting and checking validity of types ...Failed to compile.

./pages/api/auth/[...nextauth].ts:35:5
Type error: Type '{ id: string; type: "email"; sendVerificationRequest({ identifier: email, url }: { identifier: any; url: any; }): Promise<void>; }' is not assignable to type 'Provider'.
  Types of property 'type' are incompatible.
    Type '"email"' is not assignable to type '"oauth" | "credentials"'.

  33 |       version: "2.0",
  34 |     }),
> 35 |     {
     |     ^
  36 |       id: 'mailgun',
  37 |       type: 'email',
  38 |       async sendVerificationRequest({identifier: email, url}) {

How to reproduce

  1. git clone https://github.com/mcevoypeter/next-auth-issue-repro
  2. cd next-auth-issue-repro
  3. npm install
  4. npm run build

Expected behavior

I expect npm run build to cleanly compile.

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 6
  • Comments: 15 (2 by maintainers)

Most upvoted comments

Why is this closed? It looks like is still an issue in next-auth 5.0.0-beta.13 This does not work: https://authjs.dev/guides/providers/email-http

Strange, I have to add whole bunch of other properties, to effectively only use the sendVerificationRequest method

providers: [
    {
      id: 'email',
      type: 'email',
      from: 'asdf@asdf.ca',
      server: {},
      maxAge: 24 * 60 * 60,
      name: 'Email',
      options: {},
      sendVerificationRequest: (params) => {
        console.log({ params });
      },
    },
  ],

The other option seems to be use to he EmailProvider from next-auth/providers/email but that requires installing nodemailer, which is not necessary at all for my needs; I am using a separate service for sending emails to users.

Is this a TS definitions issue, or something perhaps can we just use EmailProvider, but without requiring nodemailer somehow (this seems best)?

Edit: nvm, nodemailer is not required. Seems I can get around by just using sendVerificationRequest directly

I am using “next-auth”: “5.0.0-beta.5”, and I still have the same issue: TS2322: Type ‘“email”’ is not assignable to type ‘“oidc” | “credentials” | “oauth”’.

And I literally use the example from the documentation: https://authjs.dev/guides/providers/email-http#setup

import NextAuth, { NextAuthOptions } from "next-auth"
import { PrismaAdapter } from "@auth/prisma-adapter"
import { PrismaClient } from "@prisma/client"

const prisma = new PrismaClient()

export const authOptions: NextAuthOptions = {
  adapter: PrismaAdapter(prisma),
  providers: [
    {
      id: 'sendgrid',
      type: 'email',
      async sendVerificationRequest({identifier: email, url}) {
        // Call the cloud Email provider API for sending emails
        // See https://docs.sendgrid.com/api-reference/mail-send/mail-send
        const response = await fetch("https://api.sendgrid.com/v3/mail/send", {
          // The body format will vary depending on provider, please see their documentation
          // for further details.
          body: JSON.stringify({
            personalizations: [{ to: [{ email }] }],
            from: { email: "noreply@company.com" },
            subject: "Sign in to Your page",
            content: [
              {
                type: "text/plain",
                value: `Please click here to authenticate - ${url}`,
              },
            ],
          }),
          headers: {
            // Authentication will also vary from provider to provider, please see their docs.
            Authorization: `Bearer ${process.env.SENDGRID_API}`,
            "Content-Type": "application/json",
          },
          method: "POST",
        })

        if (!response.ok) {
          const { errors } = await response.json()
          throw new Error(JSON.stringify(errors))
        }
      },
    }
  ],
}

And the error is:

[auth][error] MissingAdapter: Email login requires an adapter. .Read more at https://errors.authjs.dev#missingadapter
    at assertConfig (webpack-internal:///(middleware)/./node_modules/next-auth/node_modules/@auth/core/lib/utils/assert.js:93:34)
    at Auth (webpack-internal:///(middleware)/./node_modules/next-auth/node_modules/@auth/core/index.js:82:95

Why is this ticket open for such a long time?

Seems to be broken from this change here: https://github.com/nextauthjs/next-auth/commit/1e886b97bcd76b0679a00d6d03e9cc0a68ca9407

Looking through the next-auth code, it seems like the intended fix should be:

...
import Email from "next-auth/providers/email"
...

    // {
    //   id: 'mailgun',
    //   type: 'email',
    //   async sendVerificationRequest({identifier: email, url}) {
    //     console.log(email)
    //   }
    // },
    Email({
      type: 'email',
      async sendVerificationRequest({identifier: email, url}) {
        console.log(email)
      }
    }),
  ],

It seems the current Email provider doesn’t allow overwriting the id field however, which seems problematic.

Can you chime in on what changes should happen @balazsorban44? Seems like we could update the docs to use the provider, and just add in id?: = "email" to the EmailUserConfig.

this worked for me:

import EmailProvider from "next-auth/providers/email";

 EmailProvider({
      async sendVerificationRequest({ identifier: email, url }) {
        await sendVerificationRequest({ identifier: email, url });
      },
    }),

I was able to get the code to typecheck by adding the name, server, and options keys:

{
  id: 'mailgun',
  type: 'email',
  name: 'Email',
  server: null,
  options: {},
  async sendVerificationRequest({identifier: email, url}) {
    // <snip>
  }
}