maybe fixed query. now to fix form

src/app/CreateWine.tsx

@@ -1,17 +1,17 @@
 "use client";
 
 import { FormEvent } from "react";
+import { useFormState } from "react-dom";
 import { allProducers, insertWine } from "~/server/db";
 
-export default function CreateWine() {
-  function handleSubmit(event: FormEvent<HTMLFormElement>) {
-    event.preventDefault();
+const initialState = {
+  message: null,
+};
 
-    const formData = new FormData(event.currentTarget);
-    const response = insertWine(formData);
-  }
+export default function CreateWineForm() {
+  const [state, formAction] = useFormState(insertWine, { message: "" });
   return (
-    <form onSubmit={handleSubmit}>
+    <form action={}>
       <select name="producer" id="producer">
         {allProducers.map((producer) => (
           <option key={producer.id} value={producer.id}>
@@ -19,6 +19,8 @@ export default function CreateWine() {
           </option>
         ))}
       </select>
+      <input type="text" name="name" id="name" />
+      <input type="datetime-local" name="createdAt" id="createdAt" />
     </form>
   );
 }

src/server/db/index.ts

@@ -7,9 +7,22 @@ export const db = drizzle(sql, { schema });
 
 export const allWines = await db.query.wines.findMany();
 
-type NewWine = typeof schema.wines.$inferInsert;
+type NewWine = {
+    name: string;
+    producer: string;
+  };
+  
+export type Wine = {
+    id: string;
+    name: string;
+    producer: string;
+    createdAt: Date;
+    updatedAt: Date | null;
+  };
+
+
 export const insertWine = async (wine: NewWine) => {
-    return db.insert(schema.wines).values(wine).returning();
+    return db.insert(schema.wines).values(wine);
 }
 
 export const allProducers = await db.query.producers.findMany();