AaronPo/the-biergarten-app
1
0
Fork 0
mirror of https://github.com/aaronpo97/the-biergarten-app.git synced 2026-02-16 10:42:08 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Add create beer, beer post page

Browse Source
This commit is contained in:
Aaron William Po
2023-01-24 21:03:31 -05:00
parent 972846f5a8
commit d0bced1376
12 changed files with 264 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
pages/api/beers/create.ts Normal file
View File

@@ -0,0 +1,92 @@
import DBClient from '@/prisma/DBClient';
import { NextApiHandler } from 'next';
import { z } from 'zod';
class ServerError extends Error {
constructor(message: string, public statusCode: number) {
super(message);
this.name = 'ServerError';
}
}
export const NewBeerInfo = z.object({
name: z.string().min(1).max(100),
description: z.string().min(1).max(1000),
typeId: z.string().uuid(),
abv: z.number().min(1).max(50),
ibu: z.number().min(2),
breweryId: z.string().uuid(),
});
export const ResponseBody = z.object({
message: z.string(),
statusCode: z.number(),
success: z.boolean(),
payload: z.unknown(),
});
const handler: NextApiHandler<z.infer<typeof ResponseBody>> = async (req, res) => {
try {
const { method } = req;
if (method !== 'POST') {
throw new ServerError('Method not allowed', 405);
}
const cleanedReqBody = NewBeerInfo.safeParse(req.body);
if (!cleanedReqBody.success) {
throw new ServerError('Invalid request body', 400);
}
const { name, description, typeId, abv, ibu, breweryId } = cleanedReqBody.data;
const user = await DBClient.instance.user.findFirstOrThrow();
const newBeerPost = await DBClient.instance.beerPost.create({
data: {
name,
description,
abv,
ibu,
type: {
connect: {
id: typeId,
},
},
postedBy: {
connect: {
id: user.id,
},
},
brewery: {
connect: {
id: breweryId,
},
},
},
});
res
.status(200)
.json({ message: 'Success', statusCode: 200, payload: newBeerPost, success: true });
} catch (error) {
if (error instanceof ServerError) {
res.status(error.statusCode).json({
message: error.message,
statusCode: error.statusCode,
payload: null,
success: false,
});
} else {
res.status(500).json({
message: 'Internal server error',
statusCode: 500,
payload: null,
success: false,
});
}
}
};
export default handler;

26
pages/beers/[id].tsx
View File

@@ -86,7 +86,25 @@ const BeerInfoHeader: React.FC<{ beerPost: BeerPostQueryResult }> = ({ beerPost
);
};
const CommentCard: React.FC<{ comment: BeerPostQueryResult['beerComments'][number] }> = ({
comment,
}) => {
return (
<div className="card bg-base-300">
<div className="card-body">
<h3 className="text-2xl font-semibold">{comment.postedBy.username}</h3>
<h4 className="italic">{`posted ${formatDistanceStrict(
new Date(comment.createdAt),
new Date(),
)} ago`}</h4>
<p>{comment.content}</p>
</div>
</div>
);
};
const BeerByIdPage: NextPage<BeerPageProps> = ({ beerPost }) => {
console.log(beerPost.beerComments);
return (
<Layout>
<Head>
@@ -108,7 +126,13 @@ const BeerByIdPage: NextPage<BeerPageProps> = ({ beerPost }) => {
<div className="mt-4 flex space-x-3">
<div className="w-[60%] space-y-3">
<div className="card h-[22rem] bg-base-300"></div>
<div className="card h-[44rem] bg-base-300"></div>
<div className="card h-[44rem] overflow-y-auto bg-base-300">
{/* for each comment make a card */}
{beerPost.beerComments.map((comment) => (
<CommentCard key={comment.id} comment={comment} />
))}
</div>
</div>
<div className="w-[40%]">
<div className="card h-full bg-base-300"></div>

21
pages/beers/create.tsx
View File

@@ -1,19 +1,29 @@
import BeerForm from '@/components/BeerForm';
import Layout from '@/components/Layout';
import DBClient from '@/prisma/DBClient';
import getAllBreweryPosts from '@/services/BreweryPost/getAllBreweryPosts';
import BreweryPostQueryResult from '@/services/BreweryPost/types/BreweryPostQueryResult';
import { BeerType } from '@prisma/client';
import { NextPage } from 'next';
import { BiBeer } from 'react-icons/bi';
interface CreateBeerPageProps {
breweries: BreweryPostQueryResult[];
types: BeerType[];
}
const Create: NextPage<CreateBeerPageProps> = ({ breweries }) => {
const Create: NextPage<CreateBeerPageProps> = ({ breweries, types }) => {
return (
<Layout>
<div className="align-center flex h-full flex-col items-center justify-center">
<div className="align-center my-12 flex h-full flex-col items-center justify-center">
<div className="w-8/12">
<BeerForm type="create" breweries={breweries} />
<div className="flex flex-col items-center space-y-1">
<BiBeer className="text-5xl" />
<h1 className="text-3xl font-bold">Create a New Beer</h1>
</div>
<BeerForm type="create" breweries={breweries} types={types} />
</div>
</div>
</Layout>
@@ -22,9 +32,12 @@ const Create: NextPage<CreateBeerPageProps> = ({ breweries }) => {
export const getServerSideProps = async () => {
const breweryPosts = await getAllBreweryPosts();
const beerTypes = await DBClient.instance.beerType.findMany();
return {
props: {
breweries: breweryPosts,
breweries: JSON.parse(JSON.stringify(breweryPosts)),
types: JSON.parse(JSON.stringify(beerTypes)),
},
};
};

2
pages/beers/index.tsx
View File

@@ -96,7 +96,7 @@ export const getServerSideProps: GetServerSideProps<BeerPageProps> = async (cont
const pageNumber = parseInt(query.page_num as string, 10) || 1;
const pageSize = 24;
const pageSize = 12;
const numberOfPosts = await DBClient.instance.beerPost.count();
const pageCount = numberOfPosts ? Math.ceil(numberOfPosts / pageSize) : 0;