diff --git a/src/front/Assets/images/validate_anchoring.gif b/src/front/Assets/images/validate_anchoring.gif new file mode 100644 index 00000000..5a5beade Binary files /dev/null and b/src/front/Assets/images/validate_anchoring.gif differ diff --git a/src/front/Components/DesignSystem/Modal/Confirm/index.tsx b/src/front/Components/DesignSystem/Modal/Confirm/index.tsx index 4d36d317..1466d972 100644 --- a/src/front/Components/DesignSystem/Modal/Confirm/index.tsx +++ b/src/front/Components/DesignSystem/Modal/Confirm/index.tsx @@ -11,6 +11,7 @@ type IProps = IPropsModal & { cancelPath?: string; confirmText: string | JSX.Element; showCancelButton: boolean; + showButtons: boolean; canConfirm: boolean; }; @@ -22,6 +23,7 @@ export default class Confirm extends React.Component { cancelText: "Cancel", confirmText: "Confirm", canConfirm: true, + showButtons: true, ...Modal.defaultProps, }; @@ -29,17 +31,17 @@ export default class Confirm extends React.Component { return ( + animationDelay={this.props.animationDelay} + {...this.props}> {this.props.children} ); } - private footer(): JSX.Element { + private footer(): JSX.Element | null { + if (!this.props.showButtons) return null; return (
{this.props.showCancelButton && diff --git a/src/front/Components/DesignSystem/Modal/index.tsx b/src/front/Components/DesignSystem/Modal/index.tsx index 6726b19b..a1bca8ef 100644 --- a/src/front/Components/DesignSystem/Modal/index.tsx +++ b/src/front/Components/DesignSystem/Modal/index.tsx @@ -11,7 +11,7 @@ import Loader from "./Elements/Loader"; export type IProps = { closeBtn?: boolean; header?: string | JSX.Element; - footer?: JSX.Element; + footer?: JSX.Element | null; textLoader?: string | JSX.Element; isOpen: boolean; onClose: () => void; @@ -87,6 +87,7 @@ export default class Modal extends React.Component { } protected close() { + if (this.props.hasContainerClosable === false) return; if (this.state.willClose) return; this.props.onClose(); } diff --git a/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss b/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss index 22d490df..1542ed78 100644 --- a/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss +++ b/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss @@ -31,4 +31,14 @@ margin-bottom: 24px; } } + + .validate-document-container { + .document-validating-container { + .validate-gif { + width: 100%; + height: 100%; + object-fit: contain; + } + } + } } diff --git a/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx b/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx index 55bbbb26..94aa34bf 100644 --- a/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx +++ b/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx @@ -1,9 +1,12 @@ +import ValidateAnchoringGif from "@Front/Assets/images/validate_anchoring.gif"; import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button"; +import CheckBox from "@Front/Components/DesignSystem/CheckBox"; import FilePreview from "@Front/Components/DesignSystem/FilePreview"; import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField"; import Confirm from "@Front/Components/DesignSystem/Modal/Confirm"; import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography"; import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; +import Image from "next/image"; import React from "react"; import BasePage from "../../Base"; @@ -14,6 +17,7 @@ type IState = { isRefuseModalVisible: boolean; isValidateModalVisible: boolean; refuseText: string; + hasValidateAnchoring: boolean; }; export default class ViewDocuments extends BasePage { @@ -24,12 +28,14 @@ export default class ViewDocuments extends BasePage { isValidateModalVisible: false, isRefuseModalVisible: false, refuseText: "", + hasValidateAnchoring: false, }; this.closeModals = this.closeModals.bind(this); this.openValidateModal = this.openValidateModal.bind(this); this.openRefuseModal = this.openRefuseModal.bind(this); this.onRefuseTextChange = this.onRefuseTextChange.bind(this); + this.validateAnchoring = this.validateAnchoring.bind(this); } public override render(): JSX.Element { @@ -59,12 +65,31 @@ export default class ViewDocuments extends BasePage { -
+ confirmText={"Confirmer"} + showButtons={!this.state.hasValidateAnchoring}> +
+ {!this.state.hasValidateAnchoring && ( + + Êtes-vous sûr de vouloir ancrer ce document ? + + )} + {this.state.hasValidateAnchoring && ( +
+ + Le document s'ancre dans la blockchain. + + Anchoring animation +
+ +
+
+ )} +
{ ); } + private validateAnchoring() { + this.setState({ + hasValidateAnchoring: true, + }); + } + private onRefuseTextChange(e: React.ChangeEvent) { this.setState({ refuseText: e.target.value,