diff --git a/app/components/cards/beer.tsx b/app/components/cards/beer.tsx new file mode 100644 index 0000000..a3a14a2 --- /dev/null +++ b/app/components/cards/beer.tsx @@ -0,0 +1,23 @@ +import { Link } from '@remix-run/react'; +import { Beer } from '@zenstackhq/runtime/models'; +import { Card } from 'react-bootstrap'; + +interface BeerArgments { + beer: Beer +} + +function BeerCard(options:BeerArgments) { + return ( + + + {options.beer.name} + + {options.beer.description} + + Permalink + + + ); +} + +export default BeerCard; \ No newline at end of file diff --git a/app/routes/beers.$beerid.tsx b/app/routes/beers.$beerid.tsx index 4d83d04..8237026 100644 --- a/app/routes/beers.$beerid.tsx +++ b/app/routes/beers.$beerid.tsx @@ -8,13 +8,17 @@ import { useParams, isRouteErrorResponse, useRouteError } from "@remix-run/react"; + +import BeerCard from "~/components/cards/beer"; import { db } from "~/utils/db.server"; +import { enhance } from "@zenstackhq/runtime"; export const action = async ({ params, request, }: ActionFunctionArgs) => { + const dbe = enhance(db); const form = await request.formData(); if (form.get("intent") !== "delete") { throw new Response( @@ -22,23 +26,26 @@ export const action = async ({ { status: 400 } ); } - const beer = await db.beer.findUnique({ - where: { id: params.beerid }, + const beerid = parseInt(params.beerid!); + const beer = await dbe.beer.findUnique({ + where: { id: beerid }, }); if (!beer) { throw new Response("Can't delete what does not exist", { status: 404, }); } - await db.beer.delete({ where: { id: params.beerid } }); + await dbe.beer.delete({ where: { id: beerid } }); return redirect("/beers"); }; export const loader = async ({ params, }: LoaderFunctionArgs) => { - const beer = await db.beer.findUnique({ - where: { id: params.beerid }, + const dbe = enhance(db); + const beerid = parseInt(params.beerid!); + const beer = await dbe.beer.findUnique({ + where: { id: beerid }, }); if (!beer) { throw new Response("Beer not found.", { @@ -54,8 +61,7 @@ export default function BeerRoute() { return (

You selected this beer:

-

{data.beer.name}

-

ABV {data.beer.abv}%

+