Nextjs server action issue
in the form:
type Ingredient = {
name: string;
purchasePrice: Prisma.Decimal;
}
const onSubmit = async (values: Ingredient) => {
await addIngredient(values)
}
in the ingredient-actions.ts file:
export const addIngredient = async (ingredientData: Ingredient ): Promise<IngredientPrisma | ErrorMessage> => {
try {
const ingredientResponse = await prisma.ingredient.create({ data: {
name: ingredientData.name,
purchasePrice: ingredientData.purchasePrice,
} });
revalidatePath('/dashboard');
return ingredientResponse;
} catch (err) {
return {
message: 'Error creating ingredient'
}
}
}
and I'm having an error ("Only plain objects can be passed to Server Functions"),
so meanwhile I'm "fixing" this by doing addIngredient(JSON.stringify(values)) in the onSubmit.
and in the definition of the action, undo by doing JSON.parse(ingredientData).
export const addIngredient = async (ingredientData: string): Promise<IngredientPrisma | ErrorMessage> => {
try {
const ingredient:Ingredient = JSON.parse(ingredientData);
const ingredientResponse = await prisma.ingredient.create({ data: {
name: ingredient.name,
purchasePrice: ingredient.purchasePrice,
} });
revalidatePath('/dashboard');
return ingredientResponse;
} catch (err) {
return {
message: 'Error creating ingredient'
}
}
}
how would you deal with that without using JSON ?