updated create region form

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 (
     <div className="pt-4">
       <h1 className="text-2xl">All Regions:</h1>
@@ -9,7 +10,14 @@ export default async function AllRegions() {
         <>
           <ul>
             {allRegions.map((region) => (
-              <li key={region.id}>{region.name}</li>
+              <li key={region.id}>
+                {region.name} -{" "}
+                {
+                  allCountries.find(
+                    (country) => country.id === region.countryId,
+                  )?.name
+                }
+              </li>
             ))}
           </ul>
         </>

src/app/_components/admin/CreateRegionForm.tsx

@@ -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;