Toast after a server action

[iron gorge]

action.ts

"use server";

import prisma from "@/utils/prisma";

type FormDataType = {
  name: string;
  email: string;
  message: string;
  subject: string;
  pno?: string;
};

export const addDoc = async (formData: FormData) => {
  try {
    if (
      !formData.get("name") ||
      !formData.get("email") ||
      !formData.get("message") ||
      !formData.get("subject")
    ) {
      return;
    }

    const rawFormData: FormDataType = {
      name: formData.get("name") as string,
      email: formData.get("email") as string,
      message: formData.get("message") as string,
      subject: formData.get("subject") as string,
      pno: formData.get("pno") as string,
    };

    await prisma.contact.create({
      data: {
        name: rawFormData.name,
        email: rawFormData.email,
        message: rawFormData.message,
        subject: rawFormData.subject,
        phone: rawFormData.pno,
      },
    });
  } catch (error) {
    console.log(error);
  }
};

Form.tsx

const Form = () => {
  return (
    <form className={styles.form} autoComplete="off" action={addDoc}>
     ...
    </form>
  );
};

i basically wanna toast a message if the action has been succesfull but i'm getting the following error, whenever i'm using the toast function

[river ravine]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[quick shell]

hi, you should do it in the form

const Form = () => {
  return (
    <form className={styles.form} autoComplete="off" action={async (data) => {
  await addDoc(data)
  toast.success("Message sent")
}}>
     ...
    </form>
  );
};

[iron gorge]

But if an error occurs

i need to toastthe error, which is confusing to me

i mean i could return the response and check for its response and conditionally toast the message

[austere kiln]

const res = await addDoc(data)
if (res?.error) {
toast.error...
}

[iron gorge]

but is thatright?

[iron gorge]

right exactly what i had in mind

[quick shell]

yeah like ian said, you can return the result/error on the server action

[iron gorge]

perfect

thank you everyone!