diff --git a/src/app/_components/AllRegions.tsx b/src/app/_components/AllRegions.tsx index 9c3f008..4eb73b8 100644 --- a/src/app/_components/AllRegions.tsx +++ b/src/app/_components/AllRegions.tsx @@ -2,6 +2,7 @@ import { db } from "~/server/db"; export default async function AllRegions() { const allRegions = await db.query.regions.findMany(); + const allCountries = await db.query.countries.findMany(); return (

All Regions:

@@ -9,7 +10,14 @@ export default async function AllRegions() { <> diff --git a/src/app/_components/admin/CreateCountryForm.tsx b/src/app/_components/admin/CreateCountryForm.tsx index bd79a74..45ab5bf 100644 --- a/src/app/_components/admin/CreateCountryForm.tsx +++ b/src/app/_components/admin/CreateCountryForm.tsx @@ -2,22 +2,16 @@ import { Input } from "~/components/ui/input"; import { addCountry } from "~/server/actions/addCountry"; import SubmitButton from "../SubmitButton"; -import { useRef } from "react"; - -const initialState = { - name: "" as string, -}; +import { useFormState } from "react-dom"; export default function CreateCountryForm() { - const ref = useRef(null); - const handleSubmit = async (formData: FormData) => { - ref.current?.reset(); - await addCountry(formData); - }; + const [state, formAction] = useFormState(addCountry, null); + return ( -
- + + + {state?.message} ); } diff --git a/src/app/_components/admin/CreateRegionForm.tsx b/src/app/_components/admin/CreateRegionForm.tsx index b7f6a89..2c3ba9b 100644 --- a/src/app/_components/admin/CreateRegionForm.tsx +++ b/src/app/_components/admin/CreateRegionForm.tsx @@ -1,7 +1,7 @@ "use client"; import { Input } from "~/components/ui/input"; import SubmitButton from "../SubmitButton"; -import { useRef } from "react"; +import { useActionState } from "react"; import { addRegion } from "~/server/actions/addRegion"; import { Select, @@ -11,7 +11,6 @@ import { SelectValue, } from "~/components/ui/select"; import { useFormState } from "react-dom"; -import { init } from "next/dist/compiled/webpack/webpack"; interface Country { id: string; @@ -21,10 +20,9 @@ interface Country { export default function CreateRegionForm(props: { countries: Country[] }) { const [state, formAction] = useFormState(addRegion, null); const { countries } = props; - const ref = useRef(null); return ( -
- + +