✨ Archiving deed types

src/front/Api/LeCoffreApi/Admin/DeedTypes/DeedTypes.ts

@@ -81,4 +81,14 @@ export default class DeedTypes extends BaseAdmin {
 			return Promise.reject(err);
 		}
 	}
+
+	public async delete(uid: string) {
+		const url = new URL(this.baseURl);
+		try {
+			return await this.deleteRequest<DeedType>(url);
+		} catch (err) {
+			this.onError(err);
+			return Promise.reject(err);
+		}
+	}
 }

src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/index.tsx

@@ -87,7 +87,11 @@ export default class DefaultDeedTypesDashboard extends React.Component<IProps, I
 
 	public override async componentDidMount() {
 		this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window));
-		const query: IGetDeedTypesParams = {};
+		const query: IGetDeedTypesParams = {
+			where: {
+				archived_at: null,
+			},
+		};
 
 		const deedTypes = await DeedTypes.getInstance().get(query);
 		this.setState({ deedTypes });

src/front/Components/Layouts/DeedTypes/DeedTypesInformations/index.tsx

@@ -5,6 +5,7 @@ import DocumentTypes from "@Front/Api/LeCoffreApi/Admin/DocumentTypes/DocumentTy
 import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
 import Form from "@Front/Components/DesignSystem/Form";
 import { IOption } from "@Front/Components/DesignSystem/Form/SelectField";
+import Confirm from "@Front/Components/DesignSystem/Modal/Confirm";
 import MultiSelect from "@Front/Components/DesignSystem/MultiSelect";
 import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
 import DefaultDeedTypesDashboard from "@Front/Components/LayoutTemplates/DefaultDeedTypeDashboard";
@@ -28,6 +29,26 @@ export default function DeedTypesInformations(props: IProps) {
 	const [availableDocuments, setAvailableDocuments] = useState<DocumentType[]>([]);
 	const [selectedDocuments, setSelectedDocuments] = useState<IOption[]>([]);
 
+	const [isDeleteModalOpened, setIsDeleteModalOpened] = useState<boolean>(false);
+
+	const openDeleteModal = useCallback(() => {
+		setIsDeleteModalOpened(true);
+	}, []);
+
+	const closeDeleteModal = useCallback(() => {
+		setIsDeleteModalOpened(false);
+	}, []);
+
+	const deleteDeedType = useCallback(async () => {
+		await DeedTypes.getInstance().put(
+			deedTypeUid as string,
+			DeedType.hydrate<DeedType>({
+				archived_at: new Date(),
+			}),
+		);
+		router.push(Module.getInstance().get().modules.pages.DeedTypes.props.path);
+	}, [deedTypeUid, router]);
+
 	useEffect(() => {
 		async function getDeedType() {
 			if (!deedTypeUid) return;
@@ -136,8 +157,24 @@ export default function DeedTypesInformations(props: IProps) {
 					</Form>
 				</div>
 				<div className={classes["delete-container"]}>
-					<Button variant={EButtonVariant.GHOST}>Supprimer</Button>
+					<Button variant={EButtonVariant.GHOST} onClick={openDeleteModal}>
+						Archiver
+					</Button>
 				</div>
+				<Confirm
+					isOpen={isDeleteModalOpened}
+					onClose={closeDeleteModal}
+					onAccept={deleteDeedType}
+					closeBtn
+					header={"Archiver le type d'acte ?"}
+					confirmText={"Valider"}
+					cancelText={"Annuler"}>
+					<div className={classes["modal-content"]}>
+						<Typography typo={ITypo.P_16} className={classes["text"]}>
+							Êtes-vous sûr de vouloir archiver ce type d'acte ?
+						</Typography>
+					</div>
+				</Confirm>
 			</div>
 		</DefaultDeedTypesDashboard>
 	);