refactor brewery post requests

This commit is contained in:
Aaron William Po
2024-02-16 01:56:44 -05:00
parent 7c4a4bde80
commit 9f1d09a61d
8 changed files with 577 additions and 150 deletions

View File

@@ -1,20 +1,11 @@
import FormError from '@/components/ui/forms/FormError';
import FormInfo from '@/components/ui/forms/FormInfo';
import FormLabel from '@/components/ui/forms/FormLabel';
import EditBreweryPostForm from '@/components/EditBreweryPostForm';
import FormPageLayout from '@/components/ui/forms/FormPageLayout';
import FormSegment from '@/components/ui/forms/FormSegment';
import FormTextArea from '@/components/ui/forms/FormTextArea';
import FormTextInput from '@/components/ui/forms/FormTextInput';
import { getBreweryPostByIdService } from '@/services/posts/brewery-post';
import BreweryPostQueryResult from '@/services/posts/brewery-post/schema/BreweryPostQueryResult';
import EditBreweryPostValidationSchema from '@/services/posts/brewery-post/schema/EditBreweryPostValidationSchema';
import withPageAuthRequired from '@/util/withPageAuthRequired';
import { zodResolver } from '@hookform/resolvers/zod';
import { NextPage } from 'next';
import Head from 'next/head';
import { useRouter } from 'next/router';
import { useForm } from 'react-hook-form';
import { BiBeer } from 'react-icons/bi';
import { z } from 'zod';
@@ -25,49 +16,6 @@ interface EditPageProps {
const EditBreweryPostPage: NextPage<EditPageProps> = ({ breweryPost }) => {
const pageTitle = `Edit \u201c${breweryPost.name}\u201d`;
const router = useRouter();
const {
register,
handleSubmit,
formState: { errors, isSubmitting },
} = useForm<z.infer<typeof EditBreweryPostValidationSchema>>({
resolver: zodResolver(EditBreweryPostValidationSchema),
defaultValues: {
name: breweryPost.name,
description: breweryPost.description,
id: breweryPost.id,
dateEstablished: breweryPost.dateEstablished,
},
});
const onSubmit = async (data: z.infer<typeof EditBreweryPostValidationSchema>) => {
const response = await fetch(`/api/breweries/${breweryPost.id}`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
if (!response.ok) {
throw new Error('Something went wrong');
}
router.push(`/breweries/${breweryPost.id}`);
};
const handleDelete = async () => {
const response = await fetch(`/api/breweries/${breweryPost.id}`, {
method: 'DELETE',
});
if (!response.ok) {
throw new Error('Something went wrong');
}
router.push('/breweries');
};
return (
<>
<Head>
@@ -81,59 +29,7 @@ const EditBreweryPostPage: NextPage<EditPageProps> = ({ breweryPost }) => {
backLink={`/breweries/${breweryPost.id}`}
backLinkText={`Back to "${breweryPost.name}"`}
>
<>
<form className="form-control space-y-4" onSubmit={handleSubmit(onSubmit)}>
<div className="w-full">
<FormInfo>
<FormLabel htmlFor="name">Name</FormLabel>
<FormError>{errors.name?.message}</FormError>
</FormInfo>
<FormSegment>
<FormTextInput
id="name"
type="text"
placeholder="Name"
formValidationSchema={register('name')}
error={!!errors.name}
disabled={isSubmitting}
/>
</FormSegment>
<FormInfo>
<FormLabel htmlFor="description">Description</FormLabel>
<FormError>{errors.description?.message}</FormError>
</FormInfo>
<FormSegment>
<FormTextArea
disabled={isSubmitting}
placeholder="Ratione cumque quas quia aut impedit ea culpa facere. Ut in sit et quas reiciendis itaque."
error={!!errors.description}
formValidationSchema={register('description')}
id="description"
rows={8}
/>
</FormSegment>
</div>
<div className="w-full space-y-3">
<button
disabled={isSubmitting}
className="btn btn-primary w-full"
type="submit"
>
{isSubmitting ? 'Saving...' : 'Save'}
</button>
<button
className="btn btn-primary w-full"
type="button"
onClick={handleDelete}
>
Delete Brewery
</button>
</div>
</form>
</>
<EditBreweryPostForm breweryPost={breweryPost} />
</FormPageLayout>
</>
);