Alert behavior instead of inline error option

[lgalloherran]

I'm working on the Toll-free verification flow and in the rejection path for this flow, we are considering using the 'alert' component to indicate users the info that needs to be fixed. We are using the alert instead of the inline error per input due to some technical limitations (the system can't map the error to an input, but it can map it out to the step of the flow).
The question to discuss is: Once the alert is displayed and the user corrects the info item, Should the alert disappear? Or, Should we keep the alert until the user submits the form again?
Here is the link to the Figma file: https://www.figma.com/file/Lb81LexUpQATGMGH5ryRzu/PN-RC-toll-free-code-red?node-id=2298%3A151329

[kelseycavitt]

Hi Luz!

Thanks for sharing the Figma file, and signing up for Office Hours, looking forward to chatting with you!

I understand there may be technical limitations with the system. I'm not sure how the validation is being handled, but it would be most helpful to show users which field isn't correct or meeting the requirements for them to best understand where the problem is, in other words, displaying errors inline in addition to the use of the alert component.

Additionally, if the user corrects the information, the alert can go away, but I'm wondering "when" this would happen. Do you have the ability to do inline validation? Or does the validation happen once the user "submits" their information?

If you are also only able to use the alert, I think the copy of the alert could also be a little more closely related to label. You could say something like, "The URL format provided for the Opt-in policy is not valid. Please provide a valid URL and resubmit."

Let me know if you have more questions!

[shleewhite]

Just following up from office hours, we discussed a few things:

• The alert should be present until the user re-submits the form for validation
• The copy of the Alert should be as specific about which inputs have errors as possible (like Kelsey mentioned above)
• If there are multiple errors on one step of the form, there should be one Alert with bullet point list of the specific error messages (similar to this example from the Conversations UI Kit: https://www.figma.com/file/cSdKlqoTbxoAUmnrYkfFWl/Conversations-UI-Kit?node-id=948%3A43894)