Create a Custom Sign-In Page
Create pages/auth/signin.js, place the Google button and credentials form there, and configure pages: { signIn: "/auth/signin" } in authOptions. Ensure the sign-in page is public to avoid redirect loops.
File: `pages/auth/signin.js`
import GoogleSignInButton from "../../components/GoogleSignInButton";
import CredentialsForm from "../../components/CredentialsForm";
export default function SignInPage() {
return <main><h1>Sign in</h1><GoogleSignInButton /><hr /><CredentialsForm /></main>;
}💡 Adjust import paths to match your file structure.