Maybe fixed the form?

package.json

@@ -16,7 +16,7 @@
     },
     "dependencies": {
         "@formspree/deploy": "^0.3.3",
-        "@formspree/react": "^2.2.3",
+        "@formspree/react": "^2.5.1",
         "@fortawesome/fontawesome-svg-core": "^6.5.1",
         "@fortawesome/free-brands-svg-icons": "^6.5.1",
         "@fortawesome/react-fontawesome": "^0.2.0",

src/components/ContactForm.js

@@ -2,32 +2,32 @@ import React from 'react'
 import { useForm, ValidationError } from '@formspree/react'
 
 export default function ContactForm({ Component, pageProps }) {
-    const [state, handleSubmit] = useForm('contactForm')
-
+    const [state, handleSubmit] = useForm('xwkaqlnd')
     if (state.succeeded) {
-        return <div>Thank you for your message!</div>
+        return <p>Thanks! Your message has been sent.</p>
     }
-    // else if (state.errors) {return <div>Sorry, your message couldn't be sent</div>}
-
     return (
-        <form onSubmit={handleSubmit} method="POST">
+        <form onSubmit={handleSubmit}>
             <label htmlFor="name">Name</label>
             <input id="name" type="text" name="name"></input>
             <ValidationError prefix="Name" field="name" errors={state.errors} />
+
             <label htmlFor="email">Email</label>
             <input id="email" type="email" name="email" />
             <ValidationError
                 prefix="Email"
                 field="email"
                 errors={state.errors}
             />
+
             <label htmlFor="message">Message</label>
             <textarea id="message" type="text" name="message"></textarea>
             <ValidationError
                 prefix="Message"
                 field="message"
                 errors={state.errors}
             />
+
             <button
                 type="submit"
                 className="button"

src/pages/index.js

@@ -3,7 +3,6 @@ import Layout from '../components/Layout'
 import CaseStudy from '../components/CaseStudy'
 import ContactForm from '../components/ContactForm'
 import { graphql } from 'gatsby'
-import { FormspreeProvider } from '@formspree/react'
 import { StaticImage } from 'gatsby-plugin-image'
 import { Helmet } from 'react-helmet'
 import { library } from '@fortawesome/fontawesome-svg-core'
@@ -620,9 +619,7 @@ export default function index({ data }) {
 
             <section id="contact">
                 <h2 className="heading">Get in Contact</h2>
-                <FormspreeProvider project="1710348955751022432">
-                    <ContactForm />
-                </FormspreeProvider>
+                <ContactForm />
             </section>
         </Layout>
     )