diff --git a/app/frontend/src/javascript/components/plan-categories/create-plan-category.tsx b/app/frontend/src/javascript/components/plan-categories/create-plan-category.tsx deleted file mode 100644 index fda2db9da..000000000 --- a/app/frontend/src/javascript/components/plan-categories/create-plan-category.tsx +++ /dev/null @@ -1,122 +0,0 @@ -import React, { BaseSyntheticEvent, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import PlanCategoryAPI from '../../api/plan-category'; -import { PlanCategory } from '../../models/plan-category'; -import { FabButton } from '../base/fab-button'; -import { FabModal } from '../base/fab-modal'; -import { LabelledInput } from '../base/labelled-input'; -import { Loader } from '../base/loader'; -import { FabAlert } from '../base/fab-alert'; - -interface CreatePlanCategoryProps { - onSuccess: (message: string) => void, - onError: (message: string) => void, -} - -/** - * This component shows a button. - * When clicked, we show a modal dialog allowing to fill the parameters with a new plan-category. - */ -const CreatePlanCategoryComponent: React.FC = ({ onSuccess, onError }) => { - const { t } = useTranslation('admin'); - - const [category, setCategory] = useState(null); - // is the creation modal open? - const [isOpen, setIsOpen] = useState(false); - - /** - * Opens/closes the new plan-category (creation) modal - */ - const toggleModal = (): void => { - setIsOpen(!isOpen); - }; - - /** - * The creation has been confirmed by the user. - * Push the new plan-category to the API. - */ - const onCreateConfirmed = (): void => { - PlanCategoryAPI.create(category).then(() => { - onSuccess(t('app.admin.create_plan_category.category_created')); - resetCategory(); - toggleModal(); - }).catch((error) => { - onError(t('app.admin.create_plan_category.unable_to_create') + error); - }); - }; - - /** - * Callback triggered when the user is changing the name of the category in the modal dialog. - * We update the name of the temporary-set plan-category, accordingly. - */ - const onCategoryNameChange = (event: BaseSyntheticEvent) => { - setCategory({ ...category, name: event.target.value }); - }; - - /** - * Callback triggered when the user is changing the weight of the category in the modal dialog. - * We update the weight of the temporary-set plan-category, accordingly. - */ - const onCategoryWeightChange = (event: BaseSyntheticEvent) => { - setCategory({ ...category, weight: event.target.value }); - }; - - /** - * Initialize a new plan-category for creation - */ - const initCategoryCreation = () => { - setCategory({ name: '', weight: 0 }); - }; - - /** - * Reinitialize the category to prevent ghost data - */ - const resetCategory = () => { - setCategory(null); - }; - - return ( -
- } - className="add-category" - onClick={toggleModal}> - {t('app.admin.create_plan_category.new_category')} - - - {category &&
- - } - type="text" - value={category.name} - onChange={onCategoryNameChange} /> - - } - value={category.weight} - onChange={onCategoryWeightChange} /> -
} - - {t('app.admin.create_plan_category.significance_info')} - -
-
- ); -}; - -export const CreatePlanCategory: React.FC = ({ onSuccess, onError }) => { - return ( - - - - ); -}; diff --git a/app/frontend/src/javascript/components/plan-categories/edit-plan-category.tsx b/app/frontend/src/javascript/components/plan-categories/edit-plan-category.tsx deleted file mode 100644 index 1d351627d..000000000 --- a/app/frontend/src/javascript/components/plan-categories/edit-plan-category.tsx +++ /dev/null @@ -1,104 +0,0 @@ -import React, { BaseSyntheticEvent, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import PlanCategoryAPI from '../../api/plan-category'; -import { PlanCategory } from '../../models/plan-category'; -import { FabButton } from '../base/fab-button'; -import { FabModal } from '../base/fab-modal'; -import { LabelledInput } from '../base/labelled-input'; -import { Loader } from '../base/loader'; -import { FabAlert } from '../base/fab-alert'; - -interface EditPlanCategoryProps { - onSuccess: (message: string) => void, - onError: (message: string) => void, - category: PlanCategory -} - -/** - * This component shows an edit button. - * When clicked, we show a modal dialog allowing to edit the parameters of the provided plan-category. - */ -const EditPlanCategoryComponent: React.FC = ({ onSuccess, onError, category }) => { - const { t } = useTranslation('admin'); - - // is the edition modal open? - const [editionModal, setEditionModal] = useState(false); - // when editing, we store the category here, until the edition is over - const [tempCategory, setTempCategory] = useState(category); - - /** - * Opens/closes the edition modal - */ - const toggleEditionModal = (): void => { - setEditionModal(!editionModal); - }; - - /** - * The edit has been confirmed by the user. - * Call the API to trigger the update of the temporary set plan-category. - */ - const onEditConfirmed = (): void => { - PlanCategoryAPI.update(tempCategory).then((updatedCategory) => { - onSuccess(t('app.admin.edit_plan_category.category_updated')); - setTempCategory(updatedCategory); - toggleEditionModal(); - }).catch((error) => { - onError(t('app.admin.edit_plan_category.unable_to_update') + error); - }); - }; - - /** - * Callback triggered when the user is changing the name of the category in the modal dialog. - * We update the name of the temporary-set plan-category, accordingly. - */ - const onCategoryNameChange = (event: BaseSyntheticEvent) => { - setTempCategory({ ...tempCategory, name: event.target.value }); - }; - - /** - * Callback triggered when the user is changing the weight of the category in the modal dialog. - * We update the weight of the temporary-set plan-category, accordingly. - */ - const onCategoryWeightChange = (event: BaseSyntheticEvent) => { - setTempCategory({ ...tempCategory, weight: event.target.value }); - }; - - return ( -
- } onClick={toggleEditionModal} /> - - {tempCategory &&
- - } - value={tempCategory.name} - onChange={onCategoryNameChange} /> - - } - value={tempCategory.weight} - onChange={onCategoryWeightChange} /> -
} - - {t('app.admin.edit_plan_category.significance_info')} - -
-
- ); -}; - -export const EditPlanCategory: React.FC = ({ onSuccess, onError, category }) => { - return ( - - - - ); -};