I am having an issue that results in credentials?.email resulting in a "unresolved variable" although I am passing credentials as a parameter... Not sure why this is happening.

import NextAuth from "next-auth"
import CredentialsProvider from "next-auth/providers/credentials"

const handler = NextAuth({
    providers: [
        CredentialsProvider({
            name: "Credentials",
            credentials: {
                email: {
                    label: "Email:",
                    type: "text",
                    placeholder: "example@gmail.com"
                },
                password: {
                    label: "Password:",
                    type: "password"
                }
            },
            async authorize(credentials){
                //this is where you need to retrieve user data
                // to verify with credentials
                // Docs: https://next-auth.js.org/configuration/providers/credentials
                const user = { id: "1", email: "clark@reeftrader.com", name: "Clark", password: "Password123!" }

                if (credentials?.email === user.email && credentials?.password === user.password) {
                    return user
                } else {
                    return null
                }
            }
        })
    ]
})

export {handler as GET, handler as POST}