CallbackRouteError when handling custom API response messages in Credentials provider

[ItisBardiaMar]

Expected Behavior

When using the Credentials provider with external API verification:

Should be able to handle the API response message (e.g., "otp incorrect") and display it to the user.
Error handling should preserve the original API error message.

Current Behavior

I am encountering the following error:

[auth][error] CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror
[auth][cause]: Error: otp incorrect

Where "otp incorrect" comes from the API response:

{
  "result": false,
  "messages": "otp incorrect"
}

Documentation Reference:

According to the documentation, a CallbackRouteError occurs when the user cannot finish login. For the Credentials provider, this can happen when:

The authorize method threw an uncaught error.
The signIn or jwt callback methods threw an uncaught error.

Code :

import Credentials from "next-auth/providers/credentials";
import NextAuth from "next-auth";

const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL;

export const { auth, handlers, signIn, signOut } = NextAuth({
   providers: [
      Credentials({
         credentials: {
            phone: { label: "Phone Number", type: "text" },
            otp: { label: "OTP", type: "text" },
         },
         async authorize(credentials) {
            if (!credentials) {
               throw new Error("لطفا دوباره تلاش کنید");
            }

            const { phone, otp } = credentials;

            const response = await fetch(
               `${process.env.NEXT_PUBLIC_API_BASE_URL}/auth/verify`,
               {
                  method: "POST",
                  headers: { "Content-Type": "application/json" },
                  body: JSON.stringify({ phone, otp_code: otp }),
               }
            );

            const data = await response.json();

            if (!response.ok) {
               throw new Error(data.messages);
            }

            if (data.result) {
               return {
                  id: data.data.user.id,
                  name: data.data.user.first_name,
                  phone: data.data.user.phone,
                  accessToken: data.data.access_token,
                  refreshToken: data.data.refresh_token,
               };
            } else {
               throw new Error(data.messages);
            }
         },
      }),
   ],
   callbacks: {
      async jwt({ token, user }) {
         if (user) {
            token.accessToken = user.accessToken;
            token.refreshToken = user.refreshToken;
         }
         return token;
      },
      async session({ session, token }) {
         session.user = { ...session.user, accessToken: token.accessToken };
         return session;
      },
   },
   secret: process.env.AUTH_SECRET,
});