1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-06 00:07:44 +01:00
unleash.unleash/frontend/src/component/project/Project/hooks/useProjectForm.ts
Nuno Góis 15f77f5b8b
fix: project settings flag limit not properly set (#5317)
https://linear.app/unleash/issue/SR-169/ticket-1107-project-feature-flag-limit-is-not-correctly-updated

Fixes #5315, an issue where it would not be possible to set an empty
flag limit.
This also fixes the UI behavior: Before, when the flag limit field was
emptied, it would disappear from the UI.

I'm a bit unsure of the original intent of the `(data.defaultStickiness
!== undefined || data.featureLimit !== undefined)` condition. We're in
an update method, triggered by a PUT endpoint - I think it's safe to
assume that we'll always want to set these values to whatever they come
as, we just need to convert them to `null` in case they are not present
(i.e. `undefined`).
2023-11-10 09:57:20 +00:00

140 lines
3.9 KiB
TypeScript

import { useEffect, useState } from 'react';
import useProjectApi from 'hooks/api/actions/useProjectApi/useProjectApi';
import { formatUnknownError } from 'utils/formatUnknownError';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { ProjectMode } from './useProjectEnterpriseSettingsForm';
export const DEFAULT_PROJECT_STICKINESS = 'default';
const useProjectForm = (
initialProjectId = '',
initialProjectName = '',
initialProjectDesc = '',
initialProjectStickiness = DEFAULT_PROJECT_STICKINESS,
initialFeatureLimit = '',
initialProjectMode: ProjectMode = 'open',
) => {
const { isEnterprise } = useUiConfig();
const [projectId, setProjectId] = useState(initialProjectId);
const [projectMode, setProjectMode] =
useState<ProjectMode>(initialProjectMode);
const [projectName, setProjectName] = useState(initialProjectName);
const [projectDesc, setProjectDesc] = useState(initialProjectDesc);
const [projectStickiness, setProjectStickiness] = useState<string>(
initialProjectStickiness,
);
const [featureLimit, setFeatureLimit] =
useState<string>(initialFeatureLimit);
const [errors, setErrors] = useState({});
const { validateId } = useProjectApi();
useEffect(() => {
setProjectId(initialProjectId);
}, [initialProjectId]);
useEffect(() => {
setProjectName(initialProjectName);
}, [initialProjectName]);
useEffect(() => {
setProjectDesc(initialProjectDesc);
}, [initialProjectDesc]);
useEffect(() => {
setFeatureLimit(initialFeatureLimit);
}, [initialFeatureLimit]);
useEffect(() => {
setProjectStickiness(initialProjectStickiness);
}, [initialProjectStickiness]);
useEffect(() => {
setProjectMode(initialProjectMode);
}, [initialProjectMode]);
const getCreateProjectPayload = () => {
return isEnterprise()
? {
id: projectId,
name: projectName,
description: projectDesc,
defaultStickiness: projectStickiness,
mode: projectMode,
}
: {
id: projectId,
name: projectName,
description: projectDesc,
defaultStickiness: projectStickiness,
};
};
const getEditProjectPayload = () => {
return {
id: projectId,
name: projectName,
description: projectDesc,
defaultStickiness: projectStickiness,
featureLimit: getFeatureLimitAsNumber(),
};
};
const getFeatureLimitAsNumber = () => {
if (featureLimit === '') {
return null;
}
return Number(featureLimit);
};
const validateProjectId = async () => {
if (projectId.length === 0) {
setErrors((prev) => ({ ...prev, id: 'Id can not be empty.' }));
return false;
}
try {
await validateId(getCreateProjectPayload().id);
return true;
} catch (error: unknown) {
setErrors((prev) => ({ ...prev, id: formatUnknownError(error) }));
return false;
}
};
const validateName = () => {
if (projectName.length === 0) {
setErrors((prev) => ({ ...prev, name: 'Name can not be empty.' }));
return false;
}
return true;
};
const clearErrors = () => {
setErrors({});
};
return {
projectId,
projectName,
projectDesc,
projectMode,
projectStickiness,
featureLimit,
setProjectId,
setProjectName,
setProjectDesc,
setProjectStickiness,
setFeatureLimit,
setProjectMode,
getCreateProjectPayload,
getEditProjectPayload,
validateName,
validateProjectId,
clearErrors,
errors,
};
};
export default useProjectForm;