diff options
Diffstat (limited to 'src/components/organisms')
| -rw-r--r-- | src/components/organisms/forms/contact-form.stories.tsx | 2 | ||||
| -rw-r--r-- | src/components/organisms/forms/contact-form.test.tsx | 4 | ||||
| -rw-r--r-- | src/components/organisms/forms/contact-form.tsx | 18 |
3 files changed, 17 insertions, 7 deletions
diff --git a/src/components/organisms/forms/contact-form.stories.tsx b/src/components/organisms/forms/contact-form.stories.tsx index 9b936f9..39d0b71 100644 --- a/src/components/organisms/forms/contact-form.stories.tsx +++ b/src/components/organisms/forms/contact-form.stories.tsx @@ -64,7 +64,7 @@ const Template: ComponentStory<typeof ContactForm> = (args) => ( */ export const Contact = Template.bind({}); Contact.args = { - sendMail: (reset: () => void) => { + sendMail: async (_data, reset: () => void) => { reset(); }, }; diff --git a/src/components/organisms/forms/contact-form.test.tsx b/src/components/organisms/forms/contact-form.test.tsx index 744f147..6225fa9 100644 --- a/src/components/organisms/forms/contact-form.test.tsx +++ b/src/components/organisms/forms/contact-form.test.tsx @@ -2,7 +2,9 @@ import { render, screen } from '@test-utils'; import ContactForm from './contact-form'; const props = { - sendMail: () => null, + sendMail: async () => { + /** Do nothing. */ + }, }; describe('ContactForm', () => { diff --git a/src/components/organisms/forms/contact-form.tsx b/src/components/organisms/forms/contact-form.tsx index 4a6902b..912402c 100644 --- a/src/components/organisms/forms/contact-form.tsx +++ b/src/components/organisms/forms/contact-form.tsx @@ -6,6 +6,13 @@ import { FC, ReactNode, useState } from 'react'; import { useIntl } from 'react-intl'; import styles from './contact-form.module.scss'; +export type ContactFormData = { + email: string; + message: string; + name: string; + subject: string; +}; + export type ContactFormProps = { /** * Set additional classnames to the form wrapper. @@ -16,10 +23,9 @@ export type ContactFormProps = { */ Notice?: ReactNode; /** - * A callback function to send mail. It takes a function as parameter to - * reset the form. + * A callback function to send mail. */ - sendMail: (reset: () => void) => void; + sendMail: (data: ContactFormData, reset: () => void) => Promise<void>; }; /** @@ -80,9 +86,11 @@ const ContactForm: FC<ContactFormProps> = ({ id: 'yN5P+m', }); - const submitHandler = () => { + const submitHandler = async () => { setIsSubmitting(true); - sendMail(resetForm); + sendMail({ email, message, name, subject: object }, resetForm).then(() => + setIsSubmitting(false) + ); }; return ( |
