implemented zod in addWine server action and rewrote the logic for useActionState

package-lock.json

@@ -16,7 +16,7 @@
         "postgres": "^3.4.3",
         "react": "18.2.0",
         "react-dom": "18.2.0",
-        "zod": "^3.23.3"
+        "zod": "^3.23.8"
       },
       "devDependencies": {
         "@types/eslint": "^8.56.2",

package.json

@@ -20,7 +20,7 @@
     "postgres": "^3.4.3",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "zod": "^3.23.3"
+    "zod": "^3.23.8"
   },
   "devDependencies": {
     "@types/eslint": "^8.56.2",

src/server/actions/addWine.ts

@@ -1,11 +1,9 @@
 'use server'
+import { ZodError, z } from 'zod';
 import { db } from '../db/index'
 import { wines } from '../db/schema'
 
-type Wine = {
+type NewWine = typeof wines.$inferInsert;
-  name: string;
-  producer: string;
-}
 
 export type InsertResult = {
   name: string;
@@ -13,14 +11,56 @@ export type InsertResult = {
   id: string;
   createdAt: Date;
   updatedAt: Date | null;
+  
 }[];
+export type Fields = {
+  name: FormDataEntryValue | null
+  producer: FormDataEntryValue | null;
+}
 
-export const addWine = async (wine: Wine): Promise<InsertResult>  => {
+export type FormState = {
-  const { name, producer } = wine;
+  message: string;
-  const response = await db.insert(wines).values({
+  errors: Record<keyof Fields, string> | undefined;
-      producer: producer,
+  fieldValues: NewWine;
-      name: name,
+}
-    })
+
-    .returning();
+const schema = z.object({
-  return response;
+  name: z.string(),
-  };
+  producer: z.string().uuid(),
+})
+
+export const addWine = async (
+  prevState: FormState,
+  formData: FormData): Promise<FormState>  => {
+  const newWine: NewWine = {
+    name: formData.get('name') as string,
+    producer: formData.get('producer') as string
+  }
+  try {
+    schema.parse(newWine)
+
+    const response = await db.insert(wines).values(newWine);
+    return {
+      message: `success fully added ${response}`,
+      errors: undefined,
+      fieldValues: {
+        name: "",
+        producer: ""
+      }
+    }
+  } catch (error) {
+    const zodError = error as ZodError;
+    const errorMap = zodError.flatten().fieldErrors;
+    return {
+      message: "error",
+      errors: {
+        name: errorMap["name"]?.[0] ?? "",
+        producer: errorMap["producer"]?.[0] ?? ""
+      },
+      fieldValues: {
+        name: newWine.name,
+        producer: newWine.producer
+      }
+    }
+  }
+  }