Next.js Discord

Discord Forum

Next Auth

Unanswered
Sun bear posted this in #help-forum
Open in Discord
Sun bearOP
How can i redirect after successfuly signed in and not redirect when there is error and hundle this error on same page.
"use client";

// Render Prop
import React from "react";
import { Formik, Form, Field, ErrorMessage } from "formik";
import { signIn } from "next-auth/react";
import { useRouter } from "next/navigation";

const LoginForm = () => {
  const router = useRouter();
  return (
    <div>
      <h1>Any place in your app!</h1>
      <Formik
        initialValues={{ email: "", password: "" }}
        validate={(values) => {
          const errors: any = {};
          if (!values.email) {
            errors.email = "Required";
          } else if (
            !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)
          ) {
            errors.email = "Invalid email address";
          }
          return errors;
        }}
        onSubmit={(values, { setSubmitting }) => {
          (async () => {
            try {
              const res = await signIn("credentials", {
                email: values.email,
                password: values.password,
                redirect: false,
                // callbackUrl: "/",
              });
            } catch (error) {
              console.log("err", error);
            }
            setSubmitting(false);
          })();
        }}
      >

8 Replies

Common Murre
* provide a callback ul for redirect after successfull login
signIn('credentials', { ...values, callbackUrl: window.location.host }))
* if there is an error thrown from the authorize function
[image] - configure the error page
- get the error value
const { error } = useRouter().query;
Sun bearOP
const { error } = useRouter().query;
i cannot use
because i use app directory
ah
Milkfish
The equivalent in app directory would be something like this by the way

try useSearchParams().get('error')