NextAuth sign in function not working properly

hey, i have nextauth set up with credentialsProvider on, i have the following onClick on a button:
onClick={async () =>
await signIn("credentials", {
email: "some eamil",
password: "some password",
})
}
onClick={async () =>
await signIn("credentials", {
email: "some eamil",
password: "some password",
})
}
however when i click on the button, the authorize function on the nextauth route doesn't get called( i put in some console logs to see it called) any idea why? note: i did add my own signIn page in the nextauth config note2: it works just fine when i use the predfined sign in page nextauth config: import dbPromise from "@/modules/db"; import NextAuth from "next-auth/next"; import GoogleProvider from "next-auth/providers/google"; import CredentialsProvider from "next-auth/providers/credentials"; const handler = NextAuth({ providers: [ GoogleProvider({ clientId: process.env.GOOGLE_CLIENT_ID, clientSecret: process.env.GOOGLE_CLIENT_SECRET, }), CredentialsProvider({ name: "Credentials", credentials: { email: { label: "Email", type: "email", placeholder: "example@example.com", }, password: { label: "Password", type: "password" }, }, async authorize({ email, password }) { console.log("next auth authorize function called"); try { if (!email || !password) { return null; } const dbUser = await (await dbPromise) .db("auth") .collection("users") .findOne({ email }); if (dbUser && dbUser.password === password) { return dbUser; } } catch (error) { console.error( "NEXT_AUTH_ERROR, this error happened during the authorize function", error ); } console.log("next auth authorized function done"); }, }), ], pages: { signIn: "/login", }, }); export const GET = handler; export const POST = handler;