♻️ Upgrade to latest next-auth

Author: lukevella

apps/web/declarations/next-auth.d.ts

@@ -20,6 +20,7 @@ declare module "next-auth" {
   }
 
   interface User extends DefaultUser {
+    id: string;
     locale?: string | null;
     timeZone?: string | null;
     timeFormat?: TimeFormat | null;

apps/web/package.json

@@ -18,7 +18,7 @@
     "docker:start": "./scripts/docker-start.sh"
   },
   "dependencies": {
-    "@auth/prisma-adapter": "^1.0.3",
+    "@auth/prisma-adapter": "^2.7.4",
     "@aws-sdk/client-s3": "^3.645.0",
     "@aws-sdk/s3-request-presigner": "^3.645.0",
     "@hookform/resolvers": "^3.3.1",
@@ -67,7 +67,7 @@
     "lucide-react": "^0.387.0",
     "micro": "^10.0.1",
     "nanoid": "^5.0.9",
-    "next-auth": "^4.24.5",
+    "next-auth": "^5.0.0-beta.25",
     "next-i18next": "^13.0.3",
     "php-serialize": "^4.1.1",
     "postcss": "^8.4.31",

apps/web/src/app/[locale]/(admin)/settings/profile/delete-account-dialog.tsx

@@ -38,7 +38,7 @@ export function DeleteAccountDialog({
     onSuccess() {
       posthog?.capture("delete account");
       signOut({
-        callbackUrl: "/login",
+        redirectTo: "/login",
       });
     },
   });

apps/web/src/app/[locale]/(auth)/login/components/login-email-form.tsx

@@ -53,13 +53,13 @@ export function LoginWithEmailForm() {
           if (doesExist) {
             await signIn("email", {
               email: identifier,
-              callbackUrl: searchParams?.get("callbackUrl") ?? undefined,
+              redirectTo: searchParams?.get("callbackUrl") ?? undefined,
               redirect: false,
             });
             // redirect to verify page with callbackUrl
             router.push(
               `/login/verify?callbackUrl=${encodeURIComponent(
-                searchParams?.get("callbackUrl") ?? "",
+                searchParams?.get("callbac`kUrl") ?? "",
               )}`,
             );
           } else {

apps/web/src/app/[locale]/(auth)/login/components/login-with-oidc.tsx

@@ -15,7 +15,7 @@ export async function LoginWithOIDC({
     <Button
       onClick={() => {
         signIn("oidc", {
-          callbackUrl,
+          redirectTo: callbackUrl,
         });
       }}
       variant="link"

apps/web/src/app/[locale]/(auth)/login/components/sso-provider.tsx

@@ -15,7 +15,7 @@ function SSOImage({ provider }: { provider: string }) {
     );
   }
 
-  if (provider === "azure-ad") {
+  if (provider === "microsoft-entra-id") {
     return (
       <Image
         src="/static/microsoft.svg"
@@ -58,7 +58,7 @@ export function SSOProvider({
       key={providerId}
       onClick={() => {
         signIn(providerId, {
-          callbackUrl,
+          redirectTo: callbackUrl,
         });
       }}
     >

apps/web/src/app/[locale]/(auth)/login/page.tsx

@@ -1,7 +1,10 @@
 import Link from "next/link";
 import { Trans } from "react-i18next/TransWithoutContext";
 
-import { getOAuthProviders } from "@/auth";
+import { getOptionalProviders } from "@/auth/get-optional-providers";
+import { GoogleProvider } from "@/auth/providers/google";
+import { MicrosoftProvider } from "@/auth/providers/microsoft";
+import { OIDCProvider } from "@/auth/providers/oidc";
 import { getTranslation } from "@/i18n/server";
 
 import {
@@ -26,16 +29,15 @@ export default async function LoginPage({
   };
 }) {
   const { t } = await getTranslation();
-  const oAuthProviders = getOAuthProviders();
+  const oAuthProviders = getOptionalProviders().map((provider) => ({
+    id: provider.options,
+    name: provider.name,
+  }));
 
   const hasAlternateLoginMethods = oAuthProviders.length > 0;
 
-  const oidcProvider = oAuthProviders.find(
-    (provider) => provider.id === "oidc",
-  );
-  const socialProviders = oAuthProviders.filter(
-    (provider) => provider.id !== "oidc",
-  );
+  const oidcProvider = OIDCProvider();
+  const socialProviders = [GoogleProvider(), MicrosoftProvider()];
 
   return (
     <AuthPageContainer>
@@ -63,14 +65,16 @@ export default async function LoginPage({
         ) : null}
         {socialProviders ? (
           <div className="grid gap-4">
-            {socialProviders.map((provider) => (
-              <SSOProvider
-                key={provider.id}
-                providerId={provider.id}
-                name={provider.name}
-                callbackUrl={searchParams?.callbackUrl}
-              />
-            ))}
+            {socialProviders.map((provider) =>
+              provider ? (
+                <SSOProvider
+                  key={provider.id}
+                  providerId={provider.id}
+                  name={provider.options?.name || provider.name}
+                  callbackUrl={searchParams?.callbackUrl}
+                />
+              ) : null,
+            )}
           </div>
         ) : null}
       </AuthPageContent>

apps/web/src/app/[locale]/layout.tsx

@@ -8,8 +8,8 @@ import React from "react";
 
 import { TimeZoneChangeDetector } from "@/app/[locale]/timezone-change-detector";
 import { Providers } from "@/app/providers";
-import { getServerSession } from "@/auth";
 import { SessionProvider } from "@/auth/session-provider";
+import { auth } from "@/next-auth";
 
 const inter = Inter({
   subsets: ["latin"],
@@ -30,7 +30,7 @@ export default async function Root({
   children: React.ReactNode;
   params: { locale: string };
 }) {
-  const session = await getServerSession();
+  const session = await auth();
 
   return (
     <html lang={locale} className={inter.className}>

apps/web/src/app/api/auth/[...nextauth]/route.ts

@@ -0,0 +1,6 @@
+import { withPosthog } from "@rallly/posthog/server";
+
+import { handlers } from "@/next-auth";
+
+export const GET = withPosthog(handlers.GET);
+export const POST = withPosthog(handlers.POST);

apps/web/src/app/api/notifications/unsubscribe/route.ts

@@ -3,7 +3,7 @@ import { cookies } from "next/headers";
 import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
 
-import { getServerSession } from "@/auth";
+import { auth } from "@/next-auth";
 import type { DisableNotificationsPayload } from "@/trpc/types";
 import { decryptToken } from "@/utils/session";
 
@@ -14,7 +14,7 @@ export const GET = async (req: NextRequest) => {
     return NextResponse.redirect(new URL("/login", req.url));
   }
 
-  const session = await getServerSession();
+  const session = await auth();
 
   if (!session || !session.user?.email) {
     return NextResponse.redirect(new URL("/login", req.url));

apps/web/src/app/api/stripe/checkout/route.ts

@@ -5,7 +5,7 @@ import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
 import { z } from "zod";
 
-import { getServerSession } from "@/auth";
+import { auth } from "@/next-auth";
 
 const inputSchema = z.object({
   period: z.enum(["monthly", "yearly"]).optional(),
@@ -14,7 +14,7 @@ const inputSchema = z.object({
 });
 
 export async function POST(request: NextRequest) {
-  const userSession = await getServerSession();
+  const userSession = await auth();
   const formData = await request.formData();
   const { period = "monthly", return_path } = inputSchema.parse(
     Object.fromEntries(formData.entries()),

apps/web/src/app/api/stripe/portal/route.ts

@@ -5,7 +5,7 @@ import * as Sentry from "@sentry/nextjs";
 import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
 
-import { getServerSession } from "@/auth";
+import { auth } from "@/next-auth";
 
 export async function GET(request: NextRequest) {
   const sessionId = request.nextUrl.searchParams.get("session_id");
@@ -32,7 +32,7 @@ export async function GET(request: NextRequest) {
       );
     }
   } else {
-    const userSession = await getServerSession();
+    const userSession = await auth();
     if (!userSession?.user || userSession.user.email === null) {
       Sentry.captureException(new Error("User not logged in"));
       return NextResponse.json(

apps/web/src/app/api/trpc/[trpc]/route.ts

@@ -4,7 +4,7 @@ import { ipAddress } from "@vercel/functions";
 import type { NextRequest } from "next/server";
 
 import { getLocaleFromHeader } from "@/app/guest";
-import { getServerSession } from "@/auth";
+import { auth } from "@/next-auth";
 import type { TRPCContext } from "@/trpc/context";
 import { appRouter } from "@/trpc/routers";
 import { getEmailClient } from "@/utils/emails";
@@ -15,7 +15,7 @@ const handler = (req: NextRequest) => {
     req,
     router: appRouter,
     createContext: async () => {
-      const session = await getServerSession();
+      const session = await auth();
       const locale = await getLocaleFromHeader(req);
       const user = session?.user
         ? {

apps/web/src/app/api/user/verify-email-change/route.ts

@@ -3,7 +3,7 @@ import { cookies } from "next/headers";
 import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
 
-import { getServerSession } from "@/auth";
+import { auth } from "@/next-auth";
 import { decryptToken } from "@/utils/session";
 
 type EmailChangePayload = {
@@ -50,7 +50,7 @@ export const GET = async (request: NextRequest) => {
     return NextResponse.json({ error: "No token provided" }, { status: 400 });
   }
 
-  const session = await getServerSession();
+  const session = await auth();
 
   if (!session?.user || !session.user.email) {
     return NextResponse.redirect(

apps/web/src/auth.ts

@@ -5,13 +5,9 @@ import type {
   NextApiRequest,
   NextApiResponse,
 } from "next";
-import type { NextAuthOptions } from "next-auth";
-import NextAuth, {
-  getServerSession as getServerSessionWithOptions,
-} from "next-auth/next";
-import type { Provider } from "next-auth/providers/index";
+import type { OAuthProviderType } from "next-auth/providers";
 
-import { CustomPrismaAdapter } from "./auth/custom-prisma-adapter";
+import { CustomPrismaAdapter } from "./auth/adapters/prisma";
 import { mergeGuestsIntoUser } from "./auth/merge-user";
 import { EmailProvider } from "./auth/providers/email";
 import { GoogleProvider } from "./auth/providers/google";
@@ -23,12 +19,12 @@ import { RegistrationTokenProvider } from "./auth/providers/registration-token";
 function getOptionalProviders() {
   return [OIDCProvider(), GoogleProvider(), MicrosoftProvider()].filter(
     Boolean,
-  ) as Provider[];
+  ) as OAuthProviderType[];
 }
 
 const getAuthOptions = (...args: GetServerSessionParams) =>
   ({
-    adapter: CustomPrismaAdapter(prisma, {
+    adapter: CustomPrismaAdapter({
       migrateData: async (userId) => {
         const session = await getServerSession(...args);
         if (session?.user && session.user.email === null) {
@@ -193,11 +189,6 @@ export async function getServerSession(...args: GetServerSessionParams) {
   return await getServerSessionWithOptions(...args, getAuthOptions(...args));
 }
 
-export async function AuthApiRoute(req: NextApiRequest, res: NextApiResponse) {
-  const authOptions = getAuthOptions(req, res);
-  return NextAuth(req, res, authOptions);
-}
-
 export const isEmailBlocked = (email: string) => {
   if (process.env.ALLOWED_EMAILS) {
     const allowedEmails = process.env.ALLOWED_EMAILS.split(",");

apps/web/src/auth/custom-prisma-adapter.ts renamed to apps/web/src/auth/adapters/prisma.ts

@@ -10,19 +10,18 @@
  * See: https://github.com/lukevella/rallly/issues/949
  */
 import { PrismaAdapter } from "@auth/prisma-adapter";
-import type { ExtendedPrismaClient, PrismaClient } from "@rallly/database";
-import type { Adapter, AdapterAccount } from "next-auth/adapters";
+import { prisma } from "@rallly/database";
+import type { Adapter } from "next-auth/adapters";
 
-export function CustomPrismaAdapter(
-  client: ExtendedPrismaClient,
-  options: { migrateData: (userId: string) => Promise<void> },
-) {
-  const adapter = PrismaAdapter(client as PrismaClient);
+export function CustomPrismaAdapter(options: {
+  migrateData: (userId: string) => Promise<void>;
+}) {
+  const adapter = PrismaAdapter(prisma);
   return {
     ...adapter,
-    linkAccount: async (account: AdapterAccount) => {
+    linkAccount: async (account) => {
       await options.migrateData(account.userId);
-      return (await client.account.create({
+      return prisma.account.create({
         data: {
           userId: account.userId,
           type: account.type,
@@ -36,7 +35,7 @@ export function CustomPrismaAdapter(
           scope: account.scope as string,
           session_state: account.session_state as string,
         },
-      })) as AdapterAccount;
+      });
     },
-  } satisfies Adapter;
+  } as Adapter;
 }

apps/web/src/auth/get-optional-providers.ts

@@ -0,0 +1,11 @@
+import type { Provider } from "next-auth/providers/index";
+
+import { GoogleProvider } from "./providers/google";
+import { MicrosoftProvider } from "./providers/microsoft";
+import { OIDCProvider } from "./providers/oidc";
+
+export function getOptionalProviders() {
+  return [OIDCProvider(), GoogleProvider(), MicrosoftProvider()].filter(
+    Boolean,
+  ) as Provider[];
+}

apps/web/src/auth/is-email-blocked.ts

@@ -0,0 +1,19 @@
+export const isEmailBlocked = (email: string) => {
+  if (process.env.ALLOWED_EMAILS) {
+    const allowedEmails = process.env.ALLOWED_EMAILS.split(",");
+    // Check whether the email matches enough of the patterns specified in ALLOWED_EMAILS
+    const isAllowed = allowedEmails.some((allowedEmail) => {
+      const regex = new RegExp(
+        `^${allowedEmail
+          .replace(/[.+?^${}()|[\]\\]/g, "\\$&")
+          .replaceAll(/[*]/g, ".*")}$`,
+      );
+      return regex.test(email);
+    });
+
+    if (!isAllowed) {
+      return true;
+    }
+  }
+  return false;
+};

apps/web/src/auth/providers/email.ts

@@ -1,13 +1,14 @@
 import { prisma } from "@rallly/database";
 import { absoluteUrl } from "@rallly/utils/absolute-url";
 import { generateOtp } from "@rallly/utils/nanoid";
-import BaseEmailProvider from "next-auth/providers/email";
+import NodemailerProvider from "next-auth/providers/nodemailer";
 
 import { getEmailClient } from "@/utils/emails";
 
-export const EmailProvider = BaseEmailProvider({
-  server: "",
+export const EmailProvider = NodemailerProvider({
+  server: "none", // This value is required even though we don't need it
   from: process.env.NOREPLY_EMAIL,
+  id: "email",
   generateVerificationToken() {
     return generateOtp();
   },