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:
parent
27d6e364af
commit
f9cdb6ca0c
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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}>
|
||||||
|
@ -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,
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user