Don't use autoFocus prop, as apparently it can reduce usability and a…

…ccessibility (jsx-a11y/no-autofocus)

src/pages/contact-us/index.js

@@ -1,9 +1,15 @@
-import React from 'react'
+import React, { useEffect, useRef } from 'react'
 import Layout from '../../components/layout'
 
 import './styles.css'
 
 const ContactPage = () => {
+  const nameInput = useRef(null)
+
+  useEffect(() => {
+    if (nameInput.current) nameInput.current.focus()
+  }, [])
+
   return (
     <Layout title="Contact">
       <form
@@ -15,12 +21,12 @@ const ContactPage = () => {
       >
         {/* The `form-name` hidden field is required to support form submissions in Netlify without JavaScript */}
         <input type="hidden" name="form-name" value="contact" />
-        <p class="hidden">
+        <div class="hidden">
           <label>
             Don’t fill this out if you're human:{' '}
             <input name="bot-field" />
           </label>
-        </p>
+        </div>
         <div className="cf7-form">
           <div className="clear margin-b15">
             <div className="col-xs-12 col-sm-6 padding-l0 xs-p0">
@@ -31,7 +37,7 @@ const ContactPage = () => {
                   type="text"
                   name="name"
                   required="required"
-                  autoFocus="autofocus"
+                  ref={nameInput}
                   aria-required="true"
                   aria-invalid="false"
                 />