1-1334: show short error message when validation fails #4617
Conversation
The error message only tells the user that the name doesn't match the pattern. Because we already show the pattern above the input, we don't need to repeat it in the error message. This makes for a shorter and more concise message and better UX. At the same time, for API users, we can keep the more detailed message that includes info about the pattern, the example, and the description.
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 2 Ignored Deployments
|
| @@ -137,6 +137,7 @@ const CreateFeature = () => { | |||
| handleCancel={handleCancel} | |||
| mode="Create" | |||
| clearErrors={clearErrors} | |||
| featureNaming={projectInfo.featureNaming} | |||
There was a problem hiding this comment.
Will this always exists? According to the type in featureForm it can be undefined.
There was a problem hiding this comment.
Yes. So we send it down. If we have it, all good, otherwise featureForm handles that too. Am I missing something that makes this not work in some cases?
| <dd> | ||
| <code>{featureNaming?.pattern}</code> | ||
| </dd> | ||
| {Boolean(featureNaming?.example) && ( |
There was a problem hiding this comment.
Could use conditional render component for readability
There was a problem hiding this comment.
Yeah, I thought about that, but decided against it because of the layers of nesting. Felt like it would take up a lot of extra vertical space for not a lot of extra value. However, I do see your point and would be happy to switch to the component instead if you think that's better
| <dd>{featureNaming?.example}</dd> | ||
| </> | ||
| )} | ||
| {Boolean(featureNaming?.description) && ( |
There was a problem hiding this comment.
Could also be used here
thomasheartman
deleted the
1-1334-show-sensible-user-feedback-when-the-validation-fails
branch
The error message only tells the user that the name doesn't match the
pattern. Because we already show the pattern above the input, we don't
need to repeat it in the error message. This makes for a shorter and
more concise message and better UX.
At the same time, for API users, we can keep the more detailed message
that includes info about the pattern, the example, and the description.