WEBDIENSTE/OpenSign
1
0
Fork 0
mirror of https://github.com/OpenSignLabs/OpenSign.git synced 2026-08-17 21:25:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #753 from OpenSignLabs/raktima-opensignlabs-patch-7

Browse Source 
feat:  celebration confetti on document completion
This commit is contained in:
prafull-opensignlabs
2024-05-21 14:02:28 +05:30
committed by GitHub
parent 444c9bbfdf eeb878b340
commit 4c162676b1
5 changed files with 73 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/OpenSign/package-lock.json
Generated
+20
View File
@@ -22,6 +22,7 @@
"radix-ui": "^1.0.1",
"react": "^18.2.0",
"react-bootstrap": "^2.10.2",
"react-confetti": "^6.1.0",
"react-cookie": "^7.1.4",
"react-datepicker": "^6.4.0",
"react-dnd": "^16.0.1",
@@ -19458,6 +19459,20 @@
"react": "^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/react-confetti": {
"version": "6.1.0",
"resolved": "https://registry.npmjs.org/react-confetti/-/react-confetti-6.1.0.tgz",
"integrity": "sha512-7Ypx4vz0+g8ECVxr88W9zhcQpbeujJAVqL14ZnXJ3I23mOI9/oBVTQ3dkJhUmB0D6XOtCZEM6N0Gm9PMngkORw==",
"dependencies": {
"tween-functions": "^1.2.0"
},
"engines": {
"node": ">=10.18"
},
"peerDependencies": {
"react": "^16.3.0 || ^17.0.1 || ^18.0.0"
}
},
"node_modules/react-cookie": {
"version": "7.1.4",
"resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-7.1.4.tgz",
@@ -22575,6 +22590,11 @@
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
},
"node_modules/tween-functions": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/tween-functions/-/tween-functions-1.2.0.tgz",
"integrity": "sha512-PZBtLYcCLtEcjL14Fzb1gSxPBeL7nWvGhO5ZFPGqziCcr8uvHp0NDmdjBchp6KHL+tExcg0m3NISmKxhU394dA=="
},
"node_modules/type-check": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
apps/OpenSign/package.json
+1
View File
@@ -17,6 +17,7 @@
"radix-ui": "^1.0.1",
"react": "^18.2.0",
"react-bootstrap": "^2.10.2",
"react-confetti": "^6.1.0",
"react-cookie": "^7.1.4",
"react-datepicker": "^6.4.0",
"react-dnd": "^16.0.1",
apps/OpenSign/src/components/pdf/EmailComponent.js
+8 -9
View File
@@ -10,7 +10,6 @@ import loader from "../../assets/images/loader2.gif";
function EmailComponent({
isEmail,
pdfUrl,
isCeleb,
setIsEmail,
setSuccessEmail,
pdfName,
@@ -22,6 +21,7 @@ function EmailComponent({
const [emailList, setEmailList] = useState([]);
const [emailValue, setEmailValue] = useState();
const [isLoading, setIsLoading] = useState(false);
const [isEmailCelebration, setIsEmailCelebration] = useState(false);
//function for send email
const sendEmail = async () => {
setIsLoading(true);
@@ -62,6 +62,10 @@ function EmailComponent({
" target=_blank>here</a> </p></div></div></body></html>"
};
sendMail = await axios.post(url, params, { headers: headers });
setIsEmailCelebration(true);
setTimeout(() => {
setIsEmailCelebration(false);
}, 3000);
} catch (error) {
console.log("error", error);
setIsLoading(false);
@@ -245,22 +249,17 @@ function EmailComponent({
</div>
</div>
<div style={{ height: "100%", padding: 20 }}>
{isCeleb && (
<div
style={{
position: "absolute",
marginLeft: "50px"
}}
>
{isEmailCelebration && (
<div className="absolute w-[100%] flex justify-center items-center">
<img
alt="print img"
width={300}
height={250}
// style={styles.gifCeleb}
src={celebration}
/>
</div>
)}
<p
style={{
fontFamily: "system-ui",
apps/OpenSign/src/pages/PdfRequestFiles.js
+33 -10
View File
@@ -11,6 +11,7 @@ import { useLocation, useNavigate, useParams } from "react-router-dom";
import SignPad from "../components/pdf/SignPad";
import RenderAllPdfPage from "../components/pdf/RenderAllPdfPage";
import Tour from "reactour";
import Confetti from "react-confetti";
import moment from "moment";
import {
contractDocument,
@@ -61,6 +62,7 @@ function PdfRequestFiles() {
const [handleError, setHandleError] = useState();
const [selectWidgetId, setSelectWidgetId] = useState("");
const [otpLoader, setOtpLoader] = useState(false);
const [isCelebration, setIsCelebration] = useState(false);
const [isLoading, setIsLoading] = useState({
isLoad: true,
message: "This might take some time"
@@ -219,7 +221,7 @@ function PdfRequestFiles() {
}
}
//function for get document details for perticular signer with signer'object id
const getDocumentDetails = async () => {
const getDocumentDetails = async (isNextUser) => {
let currUserId;
//getting document details
const documentData = await contractDocument(documentId);
@@ -412,6 +414,27 @@ function PdfRequestFiles() {
setSignerPos(documentData[0].Placeholders);
}
setPdfDetails(documentData);
// Check if the current signer is not a last signer and handle the complete message.
if (isNextUser) {
const getSignedAuditTrail = documentData[0].AuditTrail.filter(
(data) => data.Activity === "Signed"
);
const isLastSigner =
getSignedAuditTrail?.length === documentData?.[0]?.Signers?.length;
if (!isLastSigner) {
setIsCompleted({
isModal: true,
message:
"You have successfully signed the document. You can download or print a copy of the partially signed document. A copy of the digitally signed document will be sent to the owner over email once it is signed by all signers."
});
} else {
setIsCelebration(true);
setTimeout(() => {
setIsCelebration(false);
}, 5000);
}
}
setIsUiLoading(false);
} else {
alert("No data found!");
@@ -701,19 +724,12 @@ function PdfRequestFiles() {
setIsSigned(true);
setSignedSigners([]);
setUnSignedSigners([]);
getDocumentDetails();
getDocumentDetails(true);
const index = pdfDetails?.[0].Signers.findIndex(
(x) => x.Email === jsonSender.email
);
const newIndex = index + 1;
const user = pdfDetails?.[0].Signers[newIndex];
if (user) {
setIsCompleted({
isModal: true,
message:
"You have successfully signed the document. You can download or print a copy of the partially signed document. A copy of the digitally signed document will be sent to the owner over email once it is signed by all signers."
});
}
if (sendInOrder) {
const requestBody = pdfDetails?.[0]?.RequestBody;
const requestSubject = pdfDetails?.[0]?.RequestSubject;
@@ -1120,7 +1136,6 @@ function PdfRequestFiles() {
alertMessage: ""
});
};
return (
<DndProvider backend={HTML5Backend}>
<Title title={"Request Sign"} />
@@ -1169,6 +1184,14 @@ function PdfRequestFiles() {
</span>
</div>
)}
{isCelebration && (
<div style={{ position: "relative", zIndex: "1000" }}>
<Confetti
width={window.innerWidth}
height={window.innerHeight}
/>
</div>
)}
<div
className="relative flex flex-col md:flex-row justify-between bg-[#ebebeb]"
apps/OpenSign/src/pages/SignyourselfPdf.js
+11 -6
View File
@@ -3,6 +3,7 @@ import { PDFDocument } from "pdf-lib";
import "../styles/signature.css";
import Parse from "parse";
import { isEnableSubscription, themeColor } from "../constant/const";
import Confetti from "react-confetti";
import axios from "axios";
import Loader from "../primitives/LoaderWithMsg";
import loader from "../assets/images/loader2.gif";
@@ -70,7 +71,6 @@ function SignYourSelf() {
const [dragKey, setDragKey] = useState();
const [signKey, setSignKey] = useState();
const [imgWH, setImgWH] = useState({});
const [isCeleb, setIsCeleb] = useState(false);
const [pdfNewWidth, setPdfNewWidth] = useState();
const [pdfOriginalWidth, setPdfOriginalWidth] = useState();
const [successEmail, setSuccessEmail] = useState(false);
@@ -109,6 +109,7 @@ function SignYourSelf() {
const [isDontShow, setIsDontShow] = useState(false);
const [extUserId, setExtUserId] = useState("");
const [isCompleted, setIsCompleted] = useState(false);
const [isCelebration, setIsCelebration] = useState(false);
const [pdfArrayBuffer, setPdfArrayBuffer] = useState("");
const [activeMailAdapter, setActiveMailAdapter] = useState("");
const [isEmailVerified, setIsEmailVerified] = useState(true);
@@ -229,8 +230,12 @@ function SignYourSelf() {
setIsUiLoading(false);
setIsSignPad(false);
setIsEmail(true);
setIsCelebration(true);
setXyPostion([]);
setSignBtnPosition([]);
setTimeout(() => {
setIsCelebration(false);
}, 5000);
}
}
} else if (
@@ -649,10 +654,6 @@ function SignYourSelf() {
});
return;
} else {
setIsCeleb(true);
setTimeout(() => {
setIsCeleb(false);
}, 3000);
setIsUiLoading(true);
const existingPdfBytes = pdfArrayBuffer;
// Load a PDFDocument from the existing PDF bytes
@@ -1122,6 +1123,11 @@ function SignYourSelf() {
</span>
</div>
)}
{isCelebration && (
<div style={{ position: "relative", zIndex: "999" }}>
<Confetti width={window.innerWidth} height={window.innerHeight} />
</div>
)}
<div className="signatureContainer" ref={divRef}>
{!isEmailVerified && (
@@ -1258,7 +1264,6 @@ function SignYourSelf() {
<EmailComponent
isEmail={isEmail}
pdfUrl={pdfUrl}
isCeleb={isCeleb}
setIsEmail={setIsEmail}
pdfName={pdfDetails[0] && pdfDetails[0].Name}
setSuccessEmail={setSuccessEmail}