Next.js Discord

Discord Forum

Next13, react-hook-form and server components

Answered
Highlander posted this in #help-forum
Open in Discord
Avatar
HighlanderOP
I'm using next13 and it's server components
export default function Login() {
  const { toast } = useToast();

  const form = useForm<z.infer<typeof formSchema>>({
    resolver: zodResolver(formSchema),
    defaultValues: {
      username: "",
      password: "",
    },
  });

  async function onSubmit(values: z.infer<typeof formSchema>) {
    const response = await fetch("/agsa", {
      method: "POST",
      headers: {},
      body: JSON.stringify({
        username: values.username,
        password: values.password,
      }),
    });
    if (!response.ok) {
      console.log("error has occured");
    }
    toast({
        description: "Login was successful"
    })
  }

  return <LoginForm form={form} onSubmit={onSubmit} />;
}

What's the way I could move my form declaration to the client component while retaining the username and password values in the server component for data fetching?
Answered by Highlander
Mixed up server components, you can ignore this
View full answer

1 Reply

Avatar
HighlanderOP
Mixed up server components, you can ignore this
Answer