import { ButtonSubmit } from '@components/Buttons'; import { Form, FormItem, Input, TextArea } from '@components/Form'; import { getLayout } from '@components/Layouts/Layout'; import { seo } from '@config/seo'; import { t } from '@lingui/macro'; import { sendMail } from '@services/graphql/mutations'; import { NextPageWithLayout } from '@ts/types/app'; import { loadTranslation } from '@utils/helpers/i18n'; import { GetStaticProps, GetStaticPropsContext } from 'next'; import Head from 'next/head'; import { FormEvent, useState } from 'react'; import PostHeader from '@components/PostHeader/PostHeader'; import styles from '@styles/pages/Page.module.scss'; import { SocialMedia } from '@components/Widget'; const ContactPage: NextPageWithLayout = () => { const [name, setName] = useState(''); const [email, setEmail] = useState(''); const [subject, setSubject] = useState(''); const [message, setMessage] = useState(''); const [status, setStatus] = useState(''); const resetForm = () => { setName(''); setEmail(''); setSubject(''); setMessage(''); }; const submitHandler = async (e: FormEvent) => { e.preventDefault(); const body = `Message received from ${name} <${email}> on ArmandPhilippot.com.\n\n${message}`; const replyTo = `${name} <${email}>`; const data = { body, mutationId: 'contact', replyTo, subject, }; const mail = await sendMail(data); if (mail.sent) { setStatus( t`Thanks. Your message was successfully sent. I will answer it as soon as possible.` ); resetForm(); } else { const errorPrefix = t`An error occurred:`; const error = `${errorPrefix} ${mail.message}`; setStatus(error); } }; const title = t`Contact`; const intro = t`Please fill the form to contact me.`; return ( <> {seo.contact.title}

{t`All fields marked with * are required.`}

{status &&

{status}

}