1
0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-28 00:06:53 +01:00

fix: make name validation work properly. (#7042)

Instead of using the `required` attribute, we manually make it
required. This is indicated visually by red error text if the value is
empty (or whitespace only). To indicate to screen readers that it is
required, we add the `aria-required` attribute.

We didn't previously validate if the name
was whitespace only.

Also: if no envs are selected, indicate that all will be included

This prevents this form value from ever being invalid.
This commit is contained in:
Thomas Heartman 2024-05-13 14:43:49 +02:00 committed by GitHub
parent 8aa0616698
commit 20c3ef30f3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 3 additions and 3 deletions

View File

@ -171,7 +171,7 @@ export const NewProjectForm: React.FC<FormProps> = ({
<ProjectNameContainer>
<StyledProjectName
label='Project name'
required
aria-required
value={projectName}
onChange={handleProjectNameUpdate}
error={Boolean(errors.name)}
@ -208,7 +208,7 @@ export const NewProjectForm: React.FC<FormProps> = ({
label:
projectEnvironments.size > 0
? `${projectEnvironments.size} selected`
: 'Select environments',
: 'All environments',
icon: <EnvironmentsIcon />,
}}
search={{

View File

@ -156,7 +156,7 @@ const useProjectForm = (
};
const validateName = () => {
if (projectName.length === 0) {
if (projectName.trim().length === 0) {
setErrors((prev) => ({ ...prev, name: 'Name can not be empty.' }));
return false;
}