import React, { FC, useState } from 'react'; import { useForm, ValidationError } from '@formspree/react'; import Head from 'next/head'; import { Wrapper } from '../styles/contact'; import Input from '../components/Input'; import MDXButton from '../components/MDXButton'; const About: FC = () => { const [form, setForm] = useState<{ name: string; email: string; message: string }>({ name: '', email: '', message: '' }); const [state, Submit] = useForm(`${process.env.NEXT_PUBLIC_FORMSPREE_KEY}`); const [submitted, setSubmitted] = useState(false); const handleChange = (event: React.ChangeEvent) => { setForm({ ...form, [event.target.name]: event.target.value }); }; const handleSubmit = async (event: React.FormEvent) => { try { await Submit(event); setSubmitted(true); } finally { setTimeout(() => setSubmitted(false), 1000); setForm({ name: '', email: '', message: '' }); } }; return ( <> Contact | Hazem Krimi

Contact Me {submitted && Message sent ✔️}

); }; export default About;