I'm using server action to do the login with Supabase. The server action will throw an error if there is (invalid creds). But the front end can't display that error. but instead it display this.

An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.

On my test on local works fine. the error gets display properly.

export async function login(formData: FormData) {
  const supabase = createClient();

  const data = {
    email: formData.get("email") as string,
    password: formData.get("password") as string,
  };
  const { error } = await supabase.auth.signInWithPassword(
    data,
  );

  if (error) {
    throw new Error("error");
  }
}

This is frontend code to handle this

  const { mutate: loginMutate } = useMutation({
    mutationFn: async (formData: FormData) => await login(formData),
    onSuccess: () => {
      router.push('/dashboard');
    },
    onError: (error) => {
      toast({
        title: 'Error login',
        description: error.message,
        variant: 'destructive',
      });
    },
  });

  const onSubmit: SubmitHandler<FieldValues> = async (data) => {
    setIsLoading(true);
    const formData = new FormData();
    Object.entries(data).forEach(([key, value]) => {
      formData.append(key, value);
    });
    loginMutate(formData);
    setIsLoading(false);
  };

The toast part responsible which support to render the word "error" but it doesn't.

any suggestion would be appreciated!!