Next.js Discord

Discord Forum

Error when setting up client action

Unanswered
Northeast Congo Lion posted this in #help-forum
Open in Discord
Northeast Congo LionOP
## Error:
No overload matches this call.
  Overload 1 of 2, '(action: (state: { message: string; }) => { message: string; } | Promise<{ message: string; }>, initialState: { message: string; }, permalink?: string | undefined): [state: { message: string; }, dispatch: () => void]', gave the following error.
    Argument of type '(prevState: string, formData: FormData) => Promise<{ message: string; }>' is not assignable to parameter of type '(state: { message: string; }) => { message: string; } | Promise<{ message: string; }>'.
      Target signature provides too few arguments. Expected 2 or more, but got 1.
  Overload 2 of 2, '(action: (state: { message: string; }, payload: FormData) => { message: string; } | Promise<{ message: string; }>, initialState: { message: string; }, permalink?: string | undefined): [state: ...]', gave the following error.
    Argument of type '(prevState: string, formData: FormData) => Promise<{ message: string; }>' is not assignable to parameter of type '(state: { message: string; }, payload: FormData) => { message: string; } | Promise<{ message: string; }>'.
      Types of parameters 'prevState' and 'state' are incompatible.
        Type '{ message: string; }' is not assignable to type 'string'.ts(2769)
(alias) function createBooking(prevState: string, formData: FormData): Promise<{
    message: string;
}>
import createBooking


the action code:

'use server'

import { createDocument, deleteDocument, findDocument, updateDocument } from "./utils/db0perations";

import { revalidatePath } from "next/cache";
import { useFormState } from "react-dom";
import { z } from "zod";

export async function createBooking(prevState:string, formData: FormData){
    const schema = z.object({
        name: z.string().min(1),
        email: z.string().email().min(5),
        message: z.string().min(1),
    })
    const data = schema.parse({
        name: formData.get('name'),
        email: formData.get('email'),
        message: formData.get('message'),
    });


    try {
        createDocument(data, 'bookings');
        return {message: 'Booking created successfully'};
    } catch (error) {
        console.error(error);
        return {message: 'An error occurred while creating the booking'};
    }
}

1 Reply

Northeast Congo LionOP
I don't understand the error, i tried to follow as close as I could this crash course on actions: https://www.youtube.com/watch?v=dDpZfOQBMaU