fix(ts): remove TS workaround for withAuth (#4926)

* fix(ts): improve Middleware types

* docs: remove TS workaround for Middleware

* ignore lint

* simplify

apps/dev/middleware.ts

@@ -30,12 +30,11 @@ export const config = { matcher: ["/middleware-protected"] }
 // export default withAuth(
 //   function middleware(req, ev) {
 //     console.log(req, ev)
-//     return undefined // NOTE: `NextMiddleware` should allow returning `void`
 //   },
 //   {
 //     callbacks: {
 //       authorized: ({ token }) => token.name === "Balázs Orbán",
-//     }
+//     },
 //   }
 // )
 

docs/docs/configuration/nextjs.md

@@ -177,13 +177,11 @@ If you do not define the options, NextAuth.js will use the default values for th
 #### wrap middleware
 
 ```ts title="middleware.ts"
-import type { NextRequest } from "next/server"
-import type { JWT } from "next-auth/jwt"
 import { withAuth } from "next-auth/middleware"
 
 export default withAuth(
-  // `withAuth` can augment your Request with the user's token.
-  function middleware(req: NextRequest & { nextauth: { token: JWT | null } }) {
+  // `withAuth` augments your `Request` with the user's token.
+  function middleware(req) {
     console.log(req.nextauth.token)
   },
   {

packages/next-auth/src/next/middleware.ts

@@ -92,7 +92,9 @@ export interface NextAuthMiddlewareOptions {
   secret?: string
 }
 
-type NextMiddlewareResult = ReturnType<NextMiddleware>
+// TODO: `NextMiddleware` should allow returning `void`
+// Simplify when https://github.com/vercel/next.js/pull/38625 is merged.
+type NextMiddlewareResult = ReturnType<NextMiddleware> | void // eslint-disable-line @typescript-eslint/no-invalid-void-type
 
 async function handleMiddleware(
   req: NextRequest,
@@ -145,12 +147,21 @@ async function handleMiddleware(
   return NextResponse.redirect(signInUrl)
 }
 
+export interface NextRequestWithAuth extends NextRequest {
+  nextauth: { token: JWT | null }
+}
+
+export type NextMiddlewareWithAuth = (
+  request: NextRequestWithAuth,
+  event: NextFetchEvent
+) => NextMiddlewareResult | Promise<NextMiddlewareResult>
+
 export type WithAuthArgs =
-  | [NextRequest]
-  | [NextRequest, NextFetchEvent]
-  | [NextRequest, NextAuthMiddlewareOptions]
-  | [NextMiddleware]
-  | [NextMiddleware, NextAuthMiddlewareOptions]
+  | [NextRequestWithAuth]
+  | [NextRequestWithAuth, NextFetchEvent]
+  | [NextRequestWithAuth, NextAuthMiddlewareOptions]
+  | [NextMiddlewareWithAuth]
+  | [NextMiddlewareWithAuth, NextAuthMiddlewareOptions]
   | [NextAuthMiddlewareOptions]
   | []
 
@@ -178,9 +189,9 @@ export function withAuth(...args: WithAuthArgs) {
   if (typeof args[0] === "function") {
     const middleware = args[0]
     const options = args[1] as NextAuthMiddlewareOptions | undefined
-    return async (...args: Parameters<NextMiddleware>) =>
+    return async (...args: Parameters<NextMiddlewareWithAuth>) =>
       await handleMiddleware(args[0], options, async (token) => {
-        ;(args[0] as any).nextauth = { token }
+        args[0].nextauth = { token }
         return await middleware(...args)
       })
   }