mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +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