Theo's Typesafe Cult•3y ago

Help in Nextauth EmailProvider

I am getting this strange error in emailProvider for nextauth. Does anyone know what I am doing wrong?

Type 'EmailConfig' is not assignable to type 'Provider'.
  Type 'EmailConfig' is not assignable to type 'EmailConfig & InternalProviderOptions'.
    Type 'EmailConfig' is not assignable to type 'InternalProviderOptions'.
      Types of property 'options' are incompatible.
        Type 'EmailUserConfig' is not assignable to type 'Record<string, unknown>'.
          Index signature for type 'string' is missing in type 'EmailUserConfig'.ts(2322)

Type 'EmailConfig' is not assignable to type 'Provider'.
  Type 'EmailConfig' is not assignable to type 'EmailConfig & InternalProviderOptions'.
    Type 'EmailConfig' is not assignable to type 'InternalProviderOptions'.
      Types of property 'options' are incompatible.
        Type 'EmailUserConfig' is not assignable to type 'Record<string, unknown>'.
          Index signature for type 'string' is missing in type 'EmailUserConfig'.ts(2322)

Gabriel

G

GabrielOP•8/28/23, 11:47 PM

Here's my full code:

Gabriel

G

GabrielOP•8/28/23, 11:48 PM

Ajidev

A

Ajidev•8/29/23, 5:39 AM

Here is how I implemented it. My email provider looks practically identical.

Ajidev

A

Ajidev•8/29/23, 5:39 AM

Gabriel

G

GabrielOP•8/29/23, 5:48 PM

Yeah, I dont know. It is still not working

jonasmerlin

J

jonasmerlin•10/20/23, 3:58 PM

@GBianchi Did you find a solution to this?

jonasmerlin

J

jonasmerlin•10/20/23, 3:58 PM

Because I'm having the same problem right now.

Gabriel

G

GabrielOP•10/20/23, 3:58 PM

Hi, nope.

Gabriel

G

GabrielOP•10/20/23, 3:58 PM

I just completely removed email for now

Gabriel

G

GabrielOP•10/20/23, 3:59 PM

If you come across a solution, please let me know!

jasny

J

jasny•11/29/23, 10:21 AM

This seems to be a typing bug in the next-auth library and not an actual problem. I ended up just overwriting the type of the

options

options

property to satisfy the type: .

export const authOptions: NextAuthOptions = {
  adapter: PrismaAdapter(prisma),
  session: {
    strategy: "jwt",
  },
  providers: [
    GitHubProvider({
      clientId: process.env.GITHUB_CLIENT_ID!,
      clientSecret: process.env.GITHUB_CLIENT_SECRET!,
    }),
    EmailProvider({
      server: {
        host: process.env.EMAIL_SERVER_HOST,
        port: +(process.env.EMAIL_SERVER_PORT as string),
        auth: {
          user: process.env.EMAIL_SERVER_USER,
          pass: process.env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: process.env.EMAIL_FROM,

      sendVerificationRequest: verificationRequest,
    }) as EmailConfig & { options: Record<string, unknown> },
  ],

export const authOptions: NextAuthOptions = {
  adapter: PrismaAdapter(prisma),
  session: {
    strategy: "jwt",
  },
  providers: [
    GitHubProvider({
      clientId: process.env.GITHUB_CLIENT_ID!,
      clientSecret: process.env.GITHUB_CLIENT_SECRET!,
    }),
    EmailProvider({
      server: {
        host: process.env.EMAIL_SERVER_HOST,
        port: +(process.env.EMAIL_SERVER_PORT as string),
        auth: {
          user: process.env.EMAIL_SERVER_USER,
          pass: process.env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: process.env.EMAIL_FROM,

      sendVerificationRequest: verificationRequest,
    }) as EmailConfig & { options: Record<string, unknown> },
  ],

import type { DefaultSession } from "@auth/core/types";
import { PrismaAdapter } from "@auth/prisma-adapter";
import NextAuth from "next-auth";
import EmailProvider from "next-auth/providers/email";
import GoogleProvider from "next-auth/providers/google";

import { prisma } from "@kdx/db";

import { env } from "./env.mjs";

export type { Session } from "next-auth";

// Update this whenever adding new providers so that the client can
export const providers = ["google", "email"] as const;
export type OAuthProviders = (typeof providers)[number];

declare module "next-auth" {
  interface Session {
    user: {
      id: string;
      // ...other properties
      // role: UserRole;
      activeWorkspaceId: string; // Might need fix
      activeWorkspaceName: string;
    } & DefaultSession["user"];
  }

  interface User {
    activeWorkspaceId?: string | null;
  }
}

export const {
  handlers: { GET, POST },
  auth,
  CSRF_experimental,
} = NextAuth({
  adapter: PrismaAdapter(prisma),
  providers: [
    GoogleProvider({
      clientId: env.GOOGLE_CLIENT_ID,
      clientSecret: env.GOOGLE_CLIENT_SECRET,
    }),
    EmailProvider({
      server: {
        host: env.EMAIL_SERVER_HOST,
        port: env.EMAIL_SERVER_PORT,
        auth: {
          user: env.EMAIL_SERVER_USER,
          pass: env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: env.EMAIL_FROM,
      type: "email",
      sendVerificationRequest: () => {
        throw new Error("Not implemented");
      },
      id: "",
      name: "",
    }),
  ],
  },
  secret: env.NEXTAUTH_SECRET,
  pages: {
    signIn: "/auth/signIn",
    //signOut: '/auth/signout',
    //error: '/auth/error', // Error code passed in query string as ?error=
    //verifyRequest: '/auth/verify-request', // (used for check email message)
    //newUser: "/auth/new-user"
  },
});

import type { DefaultSession } from "@auth/core/types";
import { PrismaAdapter } from "@auth/prisma-adapter";
import NextAuth from "next-auth";
import EmailProvider from "next-auth/providers/email";
import GoogleProvider from "next-auth/providers/google";

import { prisma } from "@kdx/db";

import { env } from "./env.mjs";

export type { Session } from "next-auth";

// Update this whenever adding new providers so that the client can
export const providers = ["google", "email"] as const;
export type OAuthProviders = (typeof providers)[number];

declare module "next-auth" {
  interface Session {
    user: {
      id: string;
      // ...other properties
      // role: UserRole;
      activeWorkspaceId: string; // Might need fix
      activeWorkspaceName: string;
    } & DefaultSession["user"];
  }

  interface User {
    activeWorkspaceId?: string | null;
  }
}

export const {
  handlers: { GET, POST },
  auth,
  CSRF_experimental,
} = NextAuth({
  adapter: PrismaAdapter(prisma),
  providers: [
    GoogleProvider({
      clientId: env.GOOGLE_CLIENT_ID,
      clientSecret: env.GOOGLE_CLIENT_SECRET,
    }),
    EmailProvider({
      server: {
        host: env.EMAIL_SERVER_HOST,
        port: env.EMAIL_SERVER_PORT,
        auth: {
          user: env.EMAIL_SERVER_USER,
          pass: env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: env.EMAIL_FROM,
      type: "email",
      sendVerificationRequest: () => {
        throw new Error("Not implemented");
      },
      id: "",
      name: "",
    }),
  ],
  },
  secret: env.NEXTAUTH_SECRET,
  pages: {
    signIn: "/auth/signIn",
    //signOut: '/auth/signout',
    //error: '/auth/error', // Error code passed in query string as ?error=
    //verifyRequest: '/auth/verify-request', // (used for check email message)
    //newUser: "/auth/new-user"
  },
});

import NextAuth from "next-auth";
import type { NextAuthOptions } from "next-auth";
import GitHubProvider from "next-auth/providers/github";
import EmailProvider from "next-auth/providers/email";
import { prisma } from "@/db";
import { PrismaAdapter } from "@next-auth/prisma-adapter";
import { verificationRequest } from "../VerificationRequest";
export const authOptions: NextAuthOptions = {
  adapter: PrismaAdapter(prisma),
  session: {
    strategy: "jwt",
  },
  providers: [
    GitHubProvider({
      clientId: process.env.GITHUB_CLIENT_ID!,
      clientSecret: process.env.GITHUB_CLIENT_SECRET!,
    }),
    EmailProvider({
      server: {
        host: process.env.EMAIL_SERVER_HOST,
        port: +(process.env.EMAIL_SERVER_PORT as string),
        auth: {
          user: process.env.EMAIL_SERVER_USER,
          pass: process.env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: process.env.EMAIL_FROM,

      sendVerificationRequest: verificationRequest,
    }),
  ],

import NextAuth from "next-auth";
import type { NextAuthOptions } from "next-auth";
import GitHubProvider from "next-auth/providers/github";
import EmailProvider from "next-auth/providers/email";
import { prisma } from "@/db";
import { PrismaAdapter } from "@next-auth/prisma-adapter";
import { verificationRequest } from "../VerificationRequest";
export const authOptions: NextAuthOptions = {
  adapter: PrismaAdapter(prisma),
  session: {
    strategy: "jwt",
  },
  providers: [
    GitHubProvider({
      clientId: process.env.GITHUB_CLIENT_ID!,
      clientSecret: process.env.GITHUB_CLIENT_SECRET!,
    }),
    EmailProvider({
      server: {
        host: process.env.EMAIL_SERVER_HOST,
        port: +(process.env.EMAIL_SERVER_PORT as string),
        auth: {
          user: process.env.EMAIL_SERVER_USER,
          pass: process.env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: process.env.EMAIL_FROM,

      sendVerificationRequest: verificationRequest,
    }),
  ],

 callbacks: {
    async signIn({ account, user }) {
      if (account && account.provider === "github") {
        const res = await fetch("https://api.github.com/user/public_emails", {
          headers: {
            Authorization: `Bearer ${account.access_token}`,
            Accept: "application/vnd.github+json",
            "X-GitHub-Api-Version": "2022-11-28",
          },
        });
        const emails: {
          primary: boolean;
          email: string;
          verified: boolean;
          visibility: string | null;
        }[] = await res.json();

        if (emails.length) {
          user.email = emails[0].email;
        }
        return true;
      }
      // for email credentials
      return true;
    },

    async session({ token, session }) {
      if (token) {
        session.user.id = token.id;
        session.user.name = token.name;
        session.user.email = token.email;
        session.user.image = token.image || "/user.png";
      }
      return session;
    },
    async jwt({ token, user }) {
      const dbUser = await prisma.user.findFirst({
        where: {
          email: token.email,
        },
      });
      if (!dbUser) {
        if (user) {
          token.id = user?.id;
        }
        return token;
      }
      return {
        id: dbUser.id,
        name: dbUser.name,
        email: dbUser.email,
        image: dbUser.image,
      };
    },
  },
  pages: {
    signIn: "/login",
  },
};
const handler = NextAuth(authOptions);
export { handler as GET, handler as POST };

 callbacks: {
    async signIn({ account, user }) {
      if (account && account.provider === "github") {
        const res = await fetch("https://api.github.com/user/public_emails", {
          headers: {
            Authorization: `Bearer ${account.access_token}`,
            Accept: "application/vnd.github+json",
            "X-GitHub-Api-Version": "2022-11-28",
          },
        });
        const emails: {
          primary: boolean;
          email: string;
          verified: boolean;
          visibility: string | null;
        }[] = await res.json();

        if (emails.length) {
          user.email = emails[0].email;
        }
        return true;
      }
      // for email credentials
      return true;
    },

    async session({ token, session }) {
      if (token) {
        session.user.id = token.id;
        session.user.name = token.name;
        session.user.email = token.email;
        session.user.image = token.image || "/user.png";
      }
      return session;
    },
    async jwt({ token, user }) {
      const dbUser = await prisma.user.findFirst({
        where: {
          email: token.email,
        },
      });
      if (!dbUser) {
        if (user) {
          token.id = user?.id;
        }
        return token;
      }
      return {
        id: dbUser.id,
        name: dbUser.name,
        email: dbUser.email,
        image: dbUser.image,
      };
    },
  },
  pages: {
    signIn: "/login",
  },
};
const handler = NextAuth(authOptions);
export { handler as GET, handler as POST };