import { useSession } from "next-auth/react";
import Head from "next/head";
import Image from "next/image";
import Link from "next/link";
import { UserNav } from "~/components/UserNav";
import { Button } from "~/components/ui/button";
import * as Table from "~/components/ui/table";
import { api } from "~/utils/api";
import { wineries } from "~/lib/data";
import { useRouter } from "next/router";
import { ScrollArea } from "~/components/ui/scroll-area";
export default function Home() {
const { data: session } = useSession({ required: true });
const { data: wines } = api.wine.getWines.useQuery();
const router = useRouter();
return (
<>
Wine Demo App
A list of your wines
Image
Name
Quantity
Year
Type
Winery
Rating
Variatal
Note
{wines?.map((wine, index) => (
{
if (
e.target instanceof HTMLElement &&
e.target.closest("#scroll-area")
)
return;
void router.push(`/${wine.id}`);
}}
className="cursor-pointer"
>
{wine.imageUrl ? (
) : (
"N/A"
)}
{wine.name}
{wine._count.wineBottles}
{wine.year}
{wine.type}
{
wineries.find((winery) => winery.key === wine.wineryKey)
?.name
}
{wine.rating}
{wine.varietal}
{wine.note}
))}
);
}