Files
bodyshop/client/src/components/esignature-modal/esignature-modal.container.jsx
2026-02-27 13:15:10 -08:00

71 lines
2.2 KiB
JavaScript

import { Button, Modal } from "antd";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { toggleModalVisible } from "../../redux/modals/modals.actions";
import { selectEsignature } from "../../redux/modals/modals.selectors";
import { EmbedUpdateDocumentV1 } from "@documenso/embed-react";
import axios from "axios";
const mapStateToProps = createStructuredSelector({
esignatureModal: selectEsignature
});
const mapDispatchToProps = (dispatch) => ({
toggleModalVisible: () => dispatch(toggleModalVisible("esignature"))
});
export function EsignatureModalContainer({ esignatureModal, toggleModalVisible }) {
const { t } = useTranslation();
const { open, context } = esignatureModal;
const { token, envelopeId, documentId } = context;
return (
<Modal
open={open}
title={t("jobs.labels.esignature")}
onOk={() => {
toggleModalVisible();
}}
onCancel={() => {
toggleModalVisible();
}}
cancelButtonProps={{ style: { display: "none" } }}
width="90%"
destroyOnHidden
>
<div style={{ height: "800px", width: "100%" }}>
{token ? (
<EmbedUpdateDocumentV1
presignToken={token}
host="https://stg-app.documenso.com"
documentId={documentId}
externalId="order-12345"
className="esignature-embed"
onDocumentUpdated={(data) => {
console.log("Document updated:", data.documentId);
}}
/>
) : (
<div>No token...</div>
)}
<Button
onClick={async () => {
// Add your button click handler logic here
try {
const distResult = await axios.post("/esign/distribute", { documentId, envelopeId });
console.log("Distribution result:", distResult);
} catch (error) {
console.error("Error distributing document:", error);
}
}}
>
Distribute Document
</Button>
</div>
</Modal>
);
}
export default connect(mapStateToProps, mapDispatchToProps)(EsignatureModalContainer);