1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-04 00:18:01 +01:00

fix: handle projectId validation (#823)

* fix: handle projectId validation

* chore: remove unused function

* fix: update PR based on feedback
This commit is contained in:
Youssef Khedher 2022-03-28 22:45:41 +01:00 committed by GitHub
parent 27d6e364af
commit f9cdb6ca0c
4 changed files with 17 additions and 21 deletions

View File

@ -24,7 +24,7 @@ const CreateProject = () => {
setProjectDesc, setProjectDesc,
getProjectPayload, getProjectPayload,
clearErrors, clearErrors,
validateIdUniqueness, validateProjectId,
validateName, validateName,
errors, errors,
} = useProjectForm(); } = useProjectForm();
@ -35,7 +35,7 @@ const CreateProject = () => {
e.preventDefault(); e.preventDefault();
clearErrors(); clearErrors();
const validName = validateName(); const validName = validateName();
const validId = await validateIdUniqueness(); const validId = await validateProjectId();
if (validName && validId) { if (validName && validId) {
const payload = getProjectPayload(); const payload = getProjectPayload();
@ -88,7 +88,7 @@ const CreateProject = () => {
setProjectDesc={setProjectDesc} setProjectDesc={setProjectDesc}
mode="Create" mode="Create"
clearErrors={clearErrors} clearErrors={clearErrors}
validateIdUniqueness={validateIdUniqueness} validateProjectId={validateProjectId}
> >
<CreateButton name="project" permission={CREATE_PROJECT} /> <CreateButton name="project" permission={CREATE_PROJECT} />
</ProjectForm> </ProjectForm>

View File

@ -25,9 +25,8 @@ const EditProject = () => {
setProjectDesc, setProjectDesc,
getProjectPayload, getProjectPayload,
clearErrors, clearErrors,
validateIdUniqueness,
validateName,
validateProjectId, validateProjectId,
validateName,
errors, errors,
} = useProjectForm(id, project.name, project.description); } = useProjectForm(id, project.name, project.description);
@ -48,9 +47,8 @@ const EditProject = () => {
const payload = getProjectPayload(); const payload = getProjectPayload();
const validName = validateName(); const validName = validateName();
const validId = validateProjectId();
if (validName && validId) { if (validName) {
try { try {
await editProject(id, payload); await editProject(id, payload);
refetch(); refetch();
@ -89,7 +87,7 @@ const EditProject = () => {
setProjectDesc={setProjectDesc} setProjectDesc={setProjectDesc}
mode="Edit" mode="Edit"
clearErrors={clearErrors} clearErrors={clearErrors}
validateIdUniqueness={validateIdUniqueness} validateProjectId={validateProjectId}
> >
<UpdateButton permission={UPDATE_PROJECT} /> <UpdateButton permission={UPDATE_PROJECT} />
</ProjectForm> </ProjectForm>

View File

@ -16,7 +16,7 @@ interface IProjectForm {
errors: { [key: string]: string }; errors: { [key: string]: string };
mode: 'Create' | 'Edit'; mode: 'Create' | 'Edit';
clearErrors: () => void; clearErrors: () => void;
validateIdUniqueness: () => void; validateProjectId: () => void;
} }
const ProjectForm: React.FC<IProjectForm> = ({ const ProjectForm: React.FC<IProjectForm> = ({
@ -31,7 +31,7 @@ const ProjectForm: React.FC<IProjectForm> = ({
setProjectDesc, setProjectDesc,
errors, errors,
mode, mode,
validateIdUniqueness, validateProjectId,
clearErrors, clearErrors,
}) => { }) => {
const styles = useStyles(); const styles = useStyles();
@ -50,9 +50,10 @@ const ProjectForm: React.FC<IProjectForm> = ({
error={Boolean(errors.id)} error={Boolean(errors.id)}
errorText={errors.id} errorText={errors.id}
onFocus={() => clearErrors()} onFocus={() => clearErrors()}
onBlur={validateIdUniqueness} onBlur={validateProjectId}
disabled={mode === 'Edit'} disabled={mode === 'Edit'}
autoFocus autoFocus
required
/> />
<p className={styles.inputDescription}> <p className={styles.inputDescription}>
@ -66,6 +67,7 @@ const ProjectForm: React.FC<IProjectForm> = ({
error={Boolean(errors.name)} error={Boolean(errors.name)}
errorText={errors.name} errorText={errors.name}
onFocus={() => clearErrors()} onFocus={() => clearErrors()}
required
/> />
<p className={styles.inputDescription}> <p className={styles.inputDescription}>

View File

@ -33,7 +33,7 @@ const useProjectForm = (
}; };
const NAME_EXISTS_ERROR = 'Error: A project with this id already exists.'; const NAME_EXISTS_ERROR = 'Error: A project with this id already exists.';
const validateIdUniqueness = async () => { const validateProjectId = async () => {
if (projectId.length === 0) { if (projectId.length === 0) {
setErrors(prev => ({ ...prev, id: 'Id can not be empty.' })); setErrors(prev => ({ ...prev, id: 'Id can not be empty.' }));
return false; return false;
@ -47,19 +47,16 @@ const useProjectForm = (
...prev, ...prev,
id: 'A project with this id already exists', id: 'A project with this id already exists',
})); }));
} else {
setErrors(prev => ({
...prev,
id: e.toString(),
}));
} }
return false; return false;
} }
}; };
const validateProjectId = () => {
if (projectId.length === 0) {
setErrors(prev => ({ ...prev, id: 'id can not be empty.' }));
return false;
}
return true;
};
const validateName = () => { const validateName = () => {
if (projectName.length === 0) { if (projectName.length === 0) {
setErrors(prev => ({ ...prev, name: 'Name can not be empty.' })); setErrors(prev => ({ ...prev, name: 'Name can not be empty.' }));
@ -83,7 +80,6 @@ const useProjectForm = (
getProjectPayload, getProjectPayload,
validateName, validateName,
validateProjectId, validateProjectId,
validateIdUniqueness,
clearErrors, clearErrors,
errors, errors,
}; };