diff --git a/src/app/CreateWine.tsx b/src/app/CreateWine.tsx index 5b1ad5f..ce4ae1e 100644 --- a/src/app/CreateWine.tsx +++ b/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) { - 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 ( -
+ + +
); } diff --git a/src/server/db/index.ts b/src/server/db/index.ts index 8c70d51..8302c71 100644 --- a/src/server/db/index.ts +++ b/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();