4.0.0 • Published 6 months ago
@transcend-io/contact-form-schema v4.0.0
@transcend-io/contact-form-schema
A zod schema for the marketing contact form.
npm install @transcend-io/contact-form-schema
Usage
Validate user-inputted ContactFormFields
on the contact form client.
import { zodResolver } from '@hookform/resolvers/zod';
import { ContactFormFields } from '@transcend-io/contact-form-schema';
import { useForm } from 'react-hook-form';
const App = () => {
const {
register,
handleSubmit,
formState: { errors },
} = useForm({
resolver: zodResolver(ContactFormFields),
});
return (
<form onSubmit={handleSubmit((d) => console.log(d))}>
<input {...register('firstName')} />
{errors.firstName?.message && <p>{errors.firstName?.message}</p>}
<input {...register('email')} />
{errors.email?.message && <p>{errors.email?.message}</p>}
{/* ... */}
<input type="submit" />
</form>
);
};
Validate the POST body in the contact form handler
import { ContactFormBody } from '@transcend-io/contact-form-schema';
export default async function contactFormHandler(
req: NextApiRequest,
res: NextApiResponse<ContactFormResponse>,
) {
// [[Perform authentication]]
// Validation
const result = ContactFormBody.safeParse(req.body);
if (!result.success) {
return res.status(400).json({ error: result.error.message });
}
const contactFormBody = result.data;
// [[Perform business logic]]
}
4.0.0
6 months ago
3.2.0
6 months ago
3.1.4
7 months ago
3.1.3
12 months ago
3.1.2
12 months ago
3.1.1
1 year ago
3.1.0
1 year ago
3.0.0
1 year ago
2.6.0
1 year ago
2.5.3
1 year ago
2.3.0
2 years ago
2.5.0
2 years ago
2.4.0
2 years ago
2.5.2
2 years ago
2.5.1
2 years ago
2.2.0
2 years ago
1.1.0
2 years ago
2.1.0
2 years ago
2.0.0
2 years ago
1.0.0
2 years ago
0.1.1
2 years ago
0.1.0
2 years ago