Auth.js(NextAuth v5)のOAuthでinvalid_requestエラーを回避する

// sign-in.tsx 

"use client";

import { signIn } from "next-auth/react";

export default function SignIn() {
    return (
        <button
            onClick={() => signIn("google")}
        >
            Googleでサインイン
        </button>
    );
}

// auth.ts(ガイドそのまま)

import NextAuth from "next-auth"
import Google from "next-auth/providers/google"

export const { handlers, signIn, signOut, auth } = NextAuth({
    providers: [Google],
})

// sign-in-action.ts

"use server";

import { signIn } from "@/auth";

export async function signInAction() {
    await signIn("google");
}

// sign-in.tsx

"use client";

import { signInAction } from "@/sign-in-action";

export default function SignIn() {
    return (
        <form action={signInAction}>
            <button>
                Googleでサインイン
            </button>
        </form>
    );
}