mirror of
https://github.com/LaCasemate/fab-manager.git
synced 2024-11-29 10:24:20 +01:00
Delete unused components
This commit is contained in:
vincent
Sylvain
parent
e6c6f35ff9
commit
3611abe853
@ -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<CreatePlanCategoryProps> = ({ onSuccess, onError }) => {
|
||||
const { t } = useTranslation('admin');
|
||||
|
||||
const [category, setCategory] = useState<PlanCategory>(null);
|
||||
// is the creation modal open?
|
||||
const [isOpen, setIsOpen] = useState<boolean>(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 (
|
||||
<div className="create-plan-category">
|
||||
<FabButton type='button'
|
||||
icon={<i className='fa fa-plus' />}
|
||||
className="add-category"
|
||||
onClick={toggleModal}>
|
||||
{t('app.admin.create_plan_category.new_category')}
|
||||
</FabButton>
|
||||
<FabModal title={t('app.admin.create_plan_category.new_category')}
|
||||
className="create-plan-category-modal"
|
||||
isOpen={isOpen}
|
||||
toggleModal={toggleModal}
|
||||
closeButton={true}
|
||||
confirmButton={t('app.admin.create_plan_category.confirm_create')}
|
||||
onConfirm={onCreateConfirmed}
|
||||
onCreation={initCategoryCreation}>
|
||||
{category && <div>
|
||||
<label htmlFor="name">{t('app.admin.create_plan_category.name')}</label>
|
||||
<LabelledInput id="name"
|
||||
label={<i className="fa fa-tag" />}
|
||||
type="text"
|
||||
value={category.name}
|
||||
onChange={onCategoryNameChange} />
|
||||
<label htmlFor="weight">{t('app.admin.create_plan_category.significance')}</label>
|
||||
<LabelledInput id="weight"
|
||||
type="number"
|
||||
label={<i className="fa fa-sort-numeric-desc" />}
|
||||
value={category.weight}
|
||||
onChange={onCategoryWeightChange} />
|
||||
</div>}
|
||||
<FabAlert level="info" className="significance-info">
|
||||
{t('app.admin.create_plan_category.significance_info')}
|
||||
</FabAlert>
|
||||
</FabModal>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export const CreatePlanCategory: React.FC<CreatePlanCategoryProps> = ({ onSuccess, onError }) => {
|
||||
return (
|
||||
<Loader>
|
||||
<CreatePlanCategoryComponent onSuccess={onSuccess} onError={onError} />
|
||||
</Loader>
|
||||
);
|
||||
};
|
||||
@ -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<EditPlanCategoryProps> = ({ onSuccess, onError, category }) => {
|
||||
const { t } = useTranslation('admin');
|
||||
|
||||
// is the edition modal open?
|
||||
const [editionModal, setEditionModal] = useState<boolean>(false);
|
||||
// when editing, we store the category here, until the edition is over
|
||||
const [tempCategory, setTempCategory] = useState<PlanCategory>(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 (
|
||||
<div className="edit-plan-category">
|
||||
<FabButton type='button' className="edit-button" icon={<i className="fa fa-edit" />} onClick={toggleEditionModal} />
|
||||
<FabModal title={t('app.admin.edit_plan_category.edit_category')}
|
||||
isOpen={editionModal}
|
||||
toggleModal={toggleEditionModal}
|
||||
className="edit-plan-category-modal"
|
||||
closeButton={true}
|
||||
confirmButton={t('app.admin.edit_plan_category.confirm_edition')}
|
||||
onConfirm={onEditConfirmed}>
|
||||
{tempCategory && <div>
|
||||
<label htmlFor="category-name">{t('app.admin.edit_plan_category.name')}</label>
|
||||
<LabelledInput id="category-name"
|
||||
type="text"
|
||||
label={<i className="fa fa-tag" />}
|
||||
value={tempCategory.name}
|
||||
onChange={onCategoryNameChange} />
|
||||
<label htmlFor="category-weight">{t('app.admin.edit_plan_category.significance')}</label>
|
||||
<LabelledInput id="category-weight"
|
||||
type="number"
|
||||
label={<i className="fa fa-sort-numeric-desc" />}
|
||||
value={tempCategory.weight}
|
||||
onChange={onCategoryWeightChange} />
|
||||
</div>}
|
||||
<FabAlert level="info" className="significance-info">
|
||||
{t('app.admin.edit_plan_category.significance_info')}
|
||||
</FabAlert>
|
||||
</FabModal>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export const EditPlanCategory: React.FC<EditPlanCategoryProps> = ({ onSuccess, onError, category }) => {
|
||||
return (
|
||||
<Loader>
|
||||
<EditPlanCategoryComponent onSuccess={onSuccess} onError={onError} category={category} />
|
||||
</Loader>
|
||||
);
|
||||
};
|
||||
Loading…
Reference in New Issue
Block a user