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:
parent
8aa0616698
commit
20c3ef30f3
@ -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={{
|
||||
|
@ -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;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user