diff --git a/src/app/App.tsx b/src/app/App.tsx index bf28490..251a9b5 100644 --- a/src/app/App.tsx +++ b/src/app/App.tsx @@ -4,6 +4,10 @@ import CreateCountry from "./_components/admin/CreateCountry"; import AllCountries from "./_components/AllCountries"; import CreateRegion from "./_components/admin/CreateRegion"; import AllRegions from "./_components/AllRegions"; +import CreateSubRegion from "./_components/admin/CreateSubRegion"; +import AllSubRegions from "./_components/AllSubRegions"; +import CreateProducer from "./_components/admin/CreateProducer"; +import AllProducers from "./_components/allProducers"; export default function App() { return ( @@ -14,6 +18,10 @@ export default function App() { + + + + ); } diff --git a/src/app/_components/AllCountries.tsx b/src/app/_components/AllCountries.tsx index 5fdbd62..e7744a0 100644 --- a/src/app/_components/AllCountries.tsx +++ b/src/app/_components/AllCountries.tsx @@ -1,9 +1,9 @@ import { Delete } from "lucide-react"; import { deleteCountry } from "~/server/actions/deleteCountry"; -import { db } from "~/server/db"; +import getAllCountries from "~/server/actions/getAllCountries"; export default async function AllCountries() { - const countries = await db.query.countries.findMany(); + const countries = await getAllCountries(); return (

All Countries:

diff --git a/src/app/_components/AllRegions.tsx b/src/app/_components/AllRegions.tsx index 4eb73b8..c3f2162 100644 --- a/src/app/_components/AllRegions.tsx +++ b/src/app/_components/AllRegions.tsx @@ -1,29 +1,24 @@ -import { db } from "~/server/db"; +import { Delete } from "lucide-react"; +import deleteRegion from "~/server/actions/deleteRegion"; +import getAllCountries from "~/server/actions/getAllCountries"; +import getAllRegions from "~/server/actions/getAllRegions"; export default async function AllRegions() { - const allRegions = await db.query.regions.findMany(); - const allCountries = await db.query.countries.findMany(); + const allRegions = await getAllRegions(); + const allCountries = await getAllCountries(); return (

All Regions:

- {allRegions[0] ? ( - <> -
    - {allRegions.map((region) => ( -
  • - {region.name} -{" "} - { - allCountries.find( - (country) => country.id === region.countryId, - )?.name - } -
  • - ))} -
- - ) : ( -

There are no regions in the db.

- )} + {allRegions.map((region) => ( +
+

{region.name}

+
+ +
+
+ ))}
); } diff --git a/src/app/_components/AllSubRegions.tsx b/src/app/_components/AllSubRegions.tsx new file mode 100644 index 0000000..ccdce27 --- /dev/null +++ b/src/app/_components/AllSubRegions.tsx @@ -0,0 +1,22 @@ +import { Delete } from "lucide-react"; +import deleteSubRegion from "~/server/actions/deleteSubRegion"; +import getAllSubRegions from "~/server/actions/getAllSubRegions"; + +export default async function AllSubRegions() { + const allSubRegions = await getAllSubRegions(); + return ( +
+

All Sub Regions:

+ {allSubRegions.map((subRegion) => ( +
+

{subRegion.name}

+
+ +
+
+ ))} +
+ ); +} diff --git a/src/app/_components/admin/CreateCountry.tsx b/src/app/_components/admin/CreateCountry.tsx index 0c10572..6223e42 100644 --- a/src/app/_components/admin/CreateCountry.tsx +++ b/src/app/_components/admin/CreateCountry.tsx @@ -2,9 +2,9 @@ import CreateCountryForm from "./CreateCountryForm"; export default function CreateCountry() { return ( - <> +

Fill the form to create a new country

- +
); } diff --git a/src/app/_components/admin/CreateProducer.tsx b/src/app/_components/admin/CreateProducer.tsx new file mode 100644 index 0000000..067e7db --- /dev/null +++ b/src/app/_components/admin/CreateProducer.tsx @@ -0,0 +1,13 @@ +"use server"; +import getAllCountries from "~/server/actions/getAllCountries"; +import CreateProducerForm from "./CreateProducerForm"; + +export default async function CreateProducer() { + const allCountries = await getAllCountries(); + return ( +
+

Fill the form to create a new producer

+ +
+ ); +} diff --git a/src/app/_components/admin/CreateProducerForm.tsx b/src/app/_components/admin/CreateProducerForm.tsx new file mode 100644 index 0000000..abe5c4a --- /dev/null +++ b/src/app/_components/admin/CreateProducerForm.tsx @@ -0,0 +1,108 @@ +"use client"; +import clsx from "clsx"; +import { Check, CircleX } from "lucide-react"; +import { useFormState } from "react-dom"; +import { Input } from "~/components/ui/input"; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "~/components/ui/select"; +import { Textarea } from "~/components/ui/textarea"; +import { addProducer } from "~/server/actions/addProducer"; +import SubmitButton from "../SubmitButton"; + +type Country = { + id: string; + name: string; +}; + +export default function CreateProducerForm(props: { allCountries: Country[] }) { + const { allCountries } = props; + const [formState, formAction] = useFormState(addProducer, { + message: "", + errors: undefined, + fieldValues: { + name: "", + description: "", + imageUrl: "", + countryId: "", + }, + }); + return ( +
+ + {formState.message !== "" && !formState.errors?.name ? ( + + ) : ( + "" + )} + {formState.errors?.name ? ( +
+ + {formState.errors?.name} +
+ ) : ( + "" + )} +