fixed to lowercase
All checks were successful
Vercel Production Deployment / Deploy-Production (push) Successful in 1m21s

This commit is contained in:
christian 2024-06-02 16:32:17 +02:00
parent 72156c0778
commit 753f09da32
2 changed files with 20 additions and 10 deletions

View File

@ -5,6 +5,7 @@ import SubmitButton from "../SubmitButton";
import { useFormState } from "react-dom";
import { useEffect, useRef } from "react";
import clsx from "clsx";
import { Check, CircleX } from "lucide-react";
export default function CreateCountryForm() {
const [formState, formAction] = useFormState(addCountry, {
@ -21,14 +22,21 @@ export default function CreateCountryForm() {
}
}, [formState.message]);
return (
<form action={formAction}>
<form action={formAction} className="flex flex-col gap-2">
<Input
name="name"
id="name"
className={clsx({ "border-red-500": formState.errors?.name })}
/>
{formState.message === "success" ? (
<Check className="text-green-400" />
) : (
<div className="flex items-center gap-2">
<CircleX className="text-red-600" />
<span>{formState.errors?.name}</span>{" "}
</div>
)}
<SubmitButton text={"Country"} />
{formState.errors?.name}
</form>
);
}

View File

@ -7,29 +7,31 @@ import { ZodError, z } from "zod";
import { eq } from "drizzle-orm";
export async function addCountry(prevstate: any, formData: FormData) {
const name = formData.get("name") as string;
const name = (formData.get("name") as string).toLowerCase();
const exists = await db
.select({ name: countries.name })
.from(countries)
.where(eq(countries.name, name));
//Define the schema for the form data
const schema = z.object({
name: z
.string()
.min(1, { message: "Name is required" })
.refine(() => !exists[0], { message: `${name} already exists` }),
});
//Parse the form data using the schema for validation, and check if the name already exists
try {
schema.parse({
name,
});
if (!exists[0]) {
//If the name doesn't exist, add the country to the database abd revalidate the page
await db
.insert(countries)
.values({ name })
.returning({ name: countries.name });
revalidatePath("/");
}
//Return a success message
return {
message: "success",
errors: undefined,