import { NextPage, GetServerSideProps } from 'next'; import Head from 'next/head'; import { z } from 'zod'; import useMediaQuery from '@/hooks/utilities/useMediaQuery'; import { Tab } from '@headlessui/react'; import getBeerStyleById from '@/services/BeerStyles/getBeerStyleById'; import BeerStyleHeader from '@/components/BeerStyleById/BeerStyleHeader'; import BeerStyleQueryResult from '@/services/BeerStyles/schema/BeerStyleQueryResult'; interface BeerStylePageProps { beerStyle: z.infer; } const BeerByIdPage: NextPage = ({ beerStyle }) => { const isDesktop = useMediaQuery('(min-width: 1024px)'); return ( <> {beerStyle.name} <>
{isDesktop ? (
{/* Comments go here */}
{/* Recommendations go here */}
) : ( Comments Beers in this Style {/* Comments go here */} {/* Recommendations go here */} )}
); }; export default BeerByIdPage; export const getServerSideProps: GetServerSideProps = async ({ params }) => { const id = params!.id as string; const beerStyle = await getBeerStyleById(id); return { props: { beerStyle: JSON.parse(JSON.stringify(beerStyle)) } }; };