2022-01-18 12:16:08 +01:00
|
|
|
import { useEffect, useState } from 'react';
|
|
|
|
import { useParams } from 'react-router-dom';
|
2022-02-04 10:36:08 +01:00
|
|
|
import useFeatureApi from '../../../hooks/api/actions/useFeatureApi/useFeatureApi';
|
|
|
|
import useQueryParams from '../../../hooks/useQueryParams';
|
|
|
|
import { IFeatureViewParams } from '../../../interfaces/params';
|
2022-01-18 12:16:08 +01:00
|
|
|
|
|
|
|
const useFeatureForm = (
|
|
|
|
initialName = '',
|
|
|
|
initialType = 'release',
|
|
|
|
initialProject = 'default',
|
2022-02-03 12:39:43 +01:00
|
|
|
initialDescription = '',
|
|
|
|
initialImpressionData = false
|
2022-01-18 12:16:08 +01:00
|
|
|
) => {
|
|
|
|
const { projectId } = useParams<IFeatureViewParams>();
|
|
|
|
const params = useQueryParams();
|
|
|
|
const { validateFeatureToggleName } = useFeatureApi();
|
|
|
|
const toggleQueryName = params.get('name');
|
|
|
|
const [type, setType] = useState(initialType);
|
|
|
|
const [name, setName] = useState(toggleQueryName || initialName);
|
|
|
|
const [project, setProject] = useState(projectId || initialProject);
|
|
|
|
const [description, setDescription] = useState(initialDescription);
|
2022-02-03 12:39:43 +01:00
|
|
|
const [impressionData, setImpressionData] = useState<boolean>(
|
|
|
|
initialImpressionData
|
|
|
|
);
|
2022-01-18 12:16:08 +01:00
|
|
|
const [errors, setErrors] = useState({});
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
setType(initialType);
|
|
|
|
}, [initialType]);
|
|
|
|
|
|
|
|
useEffect(() => {
|
2022-02-15 10:57:57 +01:00
|
|
|
if (!name) {
|
|
|
|
setName(toggleQueryName || initialName);
|
|
|
|
}
|
|
|
|
}, [name, initialName, toggleQueryName]);
|
2022-01-18 12:16:08 +01:00
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
if (!projectId) setProject(initialProject);
|
|
|
|
else setProject(projectId);
|
|
|
|
}, [initialProject, projectId]);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
setDescription(initialDescription);
|
|
|
|
}, [initialDescription]);
|
|
|
|
|
2022-02-03 12:39:43 +01:00
|
|
|
useEffect(() => {
|
|
|
|
setImpressionData(initialImpressionData);
|
|
|
|
}, [initialImpressionData]);
|
|
|
|
|
2022-01-18 12:16:08 +01:00
|
|
|
const getTogglePayload = () => {
|
|
|
|
return {
|
2022-02-03 12:39:43 +01:00
|
|
|
type,
|
|
|
|
name,
|
2022-02-08 12:35:43 +01:00
|
|
|
description,
|
|
|
|
impressionData,
|
2022-01-18 12:16:08 +01:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2022-01-28 15:03:42 +01:00
|
|
|
const NAME_EXISTS_ERROR = 'Error: A toggle with that name already exists';
|
|
|
|
|
|
|
|
const validateToggleName = async () => {
|
2022-01-18 12:16:08 +01:00
|
|
|
if (name.length === 0) {
|
|
|
|
setErrors(prev => ({ ...prev, name: 'Name can not be empty.' }));
|
|
|
|
return false;
|
|
|
|
}
|
2022-01-28 15:03:42 +01:00
|
|
|
try {
|
|
|
|
await validateFeatureToggleName(name);
|
|
|
|
return true;
|
|
|
|
} catch (e: any) {
|
|
|
|
if (e.toString().includes(NAME_EXISTS_ERROR)) {
|
2022-01-18 12:16:08 +01:00
|
|
|
setErrors(prev => ({
|
|
|
|
...prev,
|
2022-01-28 15:03:42 +01:00
|
|
|
name: 'A feature with this name already exists',
|
2022-01-18 12:16:08 +01:00
|
|
|
}));
|
2022-02-10 14:33:12 +01:00
|
|
|
} else {
|
|
|
|
setErrors(prev => ({
|
|
|
|
...prev,
|
|
|
|
name: e.toString(),
|
|
|
|
}));
|
2022-01-18 12:16:08 +01:00
|
|
|
}
|
2022-01-28 15:03:42 +01:00
|
|
|
return false;
|
2022-01-18 12:16:08 +01:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
const clearErrors = () => {
|
|
|
|
setErrors({});
|
|
|
|
};
|
|
|
|
|
|
|
|
return {
|
|
|
|
type,
|
|
|
|
setType,
|
|
|
|
name,
|
|
|
|
setName,
|
|
|
|
project,
|
|
|
|
setProject,
|
|
|
|
description,
|
|
|
|
setDescription,
|
2022-02-03 12:39:43 +01:00
|
|
|
impressionData,
|
|
|
|
setImpressionData,
|
2022-01-18 12:16:08 +01:00
|
|
|
getTogglePayload,
|
2022-01-28 15:03:42 +01:00
|
|
|
validateToggleName,
|
2022-01-18 12:16:08 +01:00
|
|
|
clearErrors,
|
|
|
|
errors,
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
export default useFeatureForm;
|