Hey guys, I've been trying to get next-auth working for a few days here but I'm still having no luck...

I have a /login page

export default function LoginForm() {
  return (
      <form className="space-y-6 mt-6">
        <div>
          <input
            type="text"
            placeholder="Name"
            className="w-full input input-bordered"
          />
        </div>
        <div>
          <input
            type="password"
            placeholder="Enter Password"
            className="w-full input input-bordered"
          />
        </div>
        <div>
          <button onClick={() => signIn()} className="btn btn-block mb-4">
            login
          </button>
        </div>
      </form>
  );
}

authOptions:

export const authOptions: NextAuthOptions = {
  providers: [
    CredentialsProvider({
      name: "credentials",
      credentials: {
        username: {
          label: "Username:",
          type: "text",
          placeholder: "username",
        },
        password: {
          label: "Password:",
          type: "password",
          placeholder: "password",
        },
      },
      async authorize(credentials, req) {
        const user = { id: "23", name: "testman", password: "testson" };

        console.log('AUTH')
        if (
          credentials?.username === user.name &&
          credentials?.password === user.password
        ) {
          return user;
        } else return null;
      },
    }),
  ],
  pages: {
    signIn: "/login",
  },
};

Trying to sign in with credentials, but for some reason its just redirecting me to http://localhost:3000/api/auth/error, which is giving CLIENT_FETCH_ERROR which apparently has to do with NEXTAUTH_URL, but that's set to http://localhost:3000 (is that not correct?)

If anyone has a clue what the problem could be, please help out. I am going crazy over here 😄