I'm creating a Proof of Concept application using Payload to investigate moving my team from Strapi to Payload 3.0.
We have a custom component that contains a <form> tag. If I try to use this custom component as a ui field, it technically works. However, as it's a form nested within Payload's form, this is logged to the browser console:
Warning: In HTML, <form> cannot be a descendant of <form>.
This will cause a hydration error.
It's also a bit wonky with respect to state management of the custom component.
- Is it possible to replace the underlying form with a custom component on a Payload collection's Edit View?
- Is it possible to render the component before or after the Edit View form and just tap into the state?
- Are there any other alternative approaches?
I appreciate any assistance🙏🏽