How to use Contact Us form in Hydrogen

[devRaunakYadav]

How to use the contact us form in Hydrogen, I have created a form but I don't know how to submit it.
I have tried fetch but it's not working, please suggest if any know

[davidhousedev]

You may find the information in this thread helpful! Shopify/hydrogen#1281

[saibotlive]

I've looked through that thread and I still don't know how to submit a contact form with Hydrogen. Any help would be great.

[davidhousedev]

Hey @saibotlive , these are the steps you could take to implement a Contact Us form:

• Implement the UI using the Hydrogen <Form> component
• Implement a form handler, an api route that runs when your form is submitted
• Validate your form data then send it to a location for review by you or your team

I left the last step intentionally vague because you'll need to use your best judgement about how to save the message that your visitor submitted. If you already have a database running, you could save it there. You may consider using a service like Mailgun or Sendgrid to send the email to you or a shared email. Perhaps there's a creative use of Shopify's APIs that others may suggest.

Hydrogen will give you the tools to accept user data and send it to your backend, then it's up to you what to do next :)

[selvinkuik]

+1 for this. From my perspective, I'm looking for a contact form GraphQL mutation, similar to the way you currently add a new address to handle form submissions directly within Shopify (as would be the case using Liquid)

[brresnic]

I'm not sure whether it's integrated with Shopify's standard API, but this does exist in the Shopify supply store (which is built with hydrogen) https://shopify.supply/about

[brresnic]

https://shopify.dev/api/admin-graphql/2022-10/mutations/customerCreate#examples-Create_a_customer_subscribed_to_SMS_marketing
^this looks promising