Error Error: `cookies` was called outside a request scope

Hello!

I was following this quickstart guide.

I tried to comment the usecase with /:


import { NextResponse } from "next/server";
import { auth0 } from "./lib/auth0"

export async function middleware(request) {
    try {
        const authRes = await auth0.middleware(request);

        // authentication routes — let the middleware handle it
        if (request.nextUrl.pathname.startsWith("/auth")) {
            return authRes;
        }

        // public routes — no need to check for session
        if (request.nextUrl.pathname === ("/")) {
            // COMMENTED.
            // return authRes;
        }


        const { origin } = new URL(request.url)
        const session = await auth0.getSession()
        // user does not have a session — redirect to login
        if (!session) {
            return NextResponse.redirect(`${origin}/auth/login`)
        }


        return authRes
    } catch (e) {
        console.info('error', e)
    }
}

export const config = {
    matcher: [
        /*
         * Match all request paths except for the ones starting with:
         * - _next/static (static files)
         * - _next/image (image optimization files)
         * - favicon.ico, sitemap.xml, robots.txt (metadata files)
         * - api (API routes)
         */
        "/((?!_next/static|_next/image|favicon.ico|file.svg|globe.svg|next.svg|vercel.svg|window.svg|sitemap.xml|robots.txt|api).*)",
    ],
}

However, I got the error

error Error: `cookies` was called outside a request scope. Read more: https://nextjs.org/docs/messages/next-dynamic-api-wrong-context
    at middleware (src/middleware.js:23:32)
  21 |   
  22 |     const { origin } = new URL(request.url)
> 23 |     const session = await auth0.getSession()

The error redirects me to dynamic-api doc page but it doesn’t give me a clue why with commented line for / I got it.

My intention to protect all routes under Auth0, even a a root one.

thx!