fix: error in auto-sign feature unexpected issue encountered - something went wrong

apps/OpenSign/src/components/pdf/EmailComponent.js

@@ -1,9 +1,7 @@
 import React, { useState } from "react";
-import { saveAs } from "file-saver";
 import axios from "axios";
-import { getBase64FromUrl } from "../../constant/Utils";
+import { handleDownloadPdf, handleToPrint } from "../../constant/Utils";
 import { themeColor, emailRegex } from "../../constant/const";
-import printModule from "print-js";
 import Loader from "../../primitives/Loader";
 import ModalUi from "../../primitives/ModalUi";
 
@@ -12,7 +10,7 @@ function EmailComponent({
   pdfUrl,
   setIsEmail,
   setSuccessEmail,
-  pdfName,
+  pdfDetails,
   sender,
   setIsAlert,
   extUserId,
@@ -22,8 +20,11 @@ function EmailComponent({
   const [emailValue, setEmailValue] = useState("");
   const [isLoading, setIsLoading] = useState(false);
   const [emailErr, setEmailErr] = useState(false);
+  const [isDownloading, setIsDownloading] = useState("");
+  const isAndroid = /Android/i.test(navigator.userAgent);
   //function for send email
   const sendEmail = async () => {
+    const pdfName = pdfDetails[0]?.Name;
     setIsLoading(true);
 
     let sendMail;
@@ -138,43 +139,6 @@ function EmailComponent({
       }
     }
   };
-
-  // function for print signed pdf
-  const handleToPrint = async (event) => {
-    event.preventDefault();
-
-    const pdf = await getBase64FromUrl(pdfUrl);
-    const isAndroidDevice = navigator.userAgent.match(/Android/i);
-    const isAppleDevice =
-      (/iPad|iPhone|iPod/.test(navigator.platform) ||
-        (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1)) &&
-      !window.MSStream;
-    if (isAndroidDevice || isAppleDevice) {
-      const byteArray = Uint8Array.from(
-        atob(pdf)
-          .split("")
-          .map((char) => char.charCodeAt(0))
-      );
-      const blob = new Blob([byteArray], { type: "application/pdf" });
-      const blobUrl = URL.createObjectURL(blob);
-      window.open(blobUrl, "_blank");
-    } else {
-      printModule({ printable: pdf, type: "pdf", base64: true });
-    }
-  };
-
-  //handle download signed pdf
-  const handleDownloadPdf = () => {
-    saveAs(pdfUrl, `${sanitizeFileName(pdfName)}_signed_by_OpenSign™.pdf`);
-  };
-
-  const sanitizeFileName = (pdfName) => {
-    // Replace spaces with underscore
-    return pdfName.replace(/ /g, "_");
-  };
-
-  const isAndroid = /Android/i.test(navigator.userAgent);
-
   return (
     <div>
       {/* isEmail */}
@@ -188,6 +152,11 @@ function EmailComponent({
               </span>
             </div>
           )}
+          {isDownloading === "pdf" && (
+            <div className="fixed z-[200] inset-0 flex justify-center items-center bg-black bg-opacity-30">
+              <Loader />
+            </div>
+          )}
           <div className="flex justify-between items-center py-[10px] px-[20px] border-b-[1px] border-base-content">
             <span className="text-base-content font-semibold">
               Successfully signed!
@@ -195,7 +164,7 @@ function EmailComponent({
             <div className="flex flex-row">
               {!isAndroid && (
                 <button
-                  onClick={handleToPrint}
+                  onClick={(e) => handleToPrint(e, pdfUrl, setIsDownloading)}
                   className="op-btn op-btn-neutral op-btn-sm text-[15px]"
                 >
                   <i className="fa-light fa-print" aria-hidden="true"></i>
@@ -204,7 +173,9 @@ function EmailComponent({
               )}
               <button
                 className="op-btn op-btn-primary op-btn-sm text-[15px] ml-2"
-                onClick={() => handleDownloadPdf()}
+                onClick={() =>
+                  handleDownloadPdf(pdfDetails, pdfUrl, setIsDownloading)
+                }
               >
                 <i className="fa-light fa-download" aria-hidden="true"></i>
                 Download

apps/OpenSign/src/constant/Utils.js

@@ -440,7 +440,7 @@ export const resizeBorderExtraWidth = () => {
   return 20;
 };
 
-export async function getBase64FromUrl(url) {
+export async function getBase64FromUrl(url, autosign) {
   const data = await fetch(url);
   const blob = await data.blob();
   return new Promise((resolve) => {
@@ -448,8 +448,12 @@ export async function getBase64FromUrl(url) {
     reader.readAsDataURL(blob);
     reader.onloadend = function () {
       const pdfBase = this.result;
+      if (autosign) {
+        resolve(pdfBase);
+      } else {
         const suffixbase64 = pdfBase.split(",").pop();
         resolve(suffixbase64);
+      }
     };
   });
 }
@@ -2225,3 +2229,42 @@ export const getContainerScale = (pdfOriginalWH, pageNumber, containerWH) => {
   const containerScale = containerWH?.width / getPdfPageWidth?.width || 1;
   return containerScale;
 };
+//function to get default signatur eof current user from `contracts_Signature` class
+export const getDefaultSignature = async (objectId) => {
+  try {
+    const result = await axios.get(
+      `${localStorage.getItem(
+        "baseUrl"
+      )}classes/contracts_Signature?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${objectId}"}}`,
+      {
+        headers: {
+          "Content-Type": "application/json",
+          "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
+          "X-Parse-Session-Token": localStorage.getItem("accesstoken")
+        }
+      }
+    );
+    const res = result.data?.results;
+    if (res[0] && res.length > 0) {
+      const defaultSignature = res[0]?.ImageURL
+        ? await getBase64FromUrl(res[0]?.ImageURL, true)
+        : "";
+      const defaultInitial = res[0]?.Initials
+        ? await getBase64FromUrl(res[0]?.Initials, true)
+        : "";
+
+      return {
+        status: "success",
+        res: {
+          defaultSignature: defaultSignature,
+          defaultInitial: defaultInitial
+        }
+      };
+    }
+  } catch (err) {
+    console.log("Error: error in fetch data in contracts_Signature", err);
+    return {
+      status: "error"
+    };
+  }
+};

apps/OpenSign/src/pages/PdfRequestFiles.js

@@ -30,7 +30,8 @@ import {
   contactBook,
   handleDownloadPdf,
   handleToPrint,
-  handleDownloadCertificate
+  handleDownloadCertificate,
+  getDefaultSignature
 } from "../constant/Utils";
 import LoaderWithMsg from "../primitives/LoaderWithMsg";
 import HandleError from "../primitives/HandleError";
@@ -337,6 +338,7 @@ function PdfRequestFiles(props) {
   };
   //function for get document details for perticular signer with signer'object id
   const getDocumentDetails = async (docId, isNextUser) => {
+    try {
       const senderUser = localStorage.getItem(
         `Parse/${localStorage.getItem("parseAppId")}/currentUser`
       );
@@ -349,7 +351,8 @@ function PdfRequestFiles(props) {
         const isCompleted =
           documentData[0].IsCompleted && documentData[0].IsCompleted;
         const expireDate = documentData[0].ExpiryDate.iso;
-      const declined = documentData[0].IsDeclined && documentData[0].IsDeclined;
+        const declined =
+          documentData[0].IsDeclined && documentData[0].IsDeclined;
         const expireUpdateDate = new Date(expireDate).getTime();
         const currDate = new Date().getTime();
         const getSigners = documentData[0].Signers;
@@ -422,7 +425,9 @@ function PdfRequestFiles(props) {
         const audittrailData =
           documentData[0].AuditTrail &&
           documentData[0].AuditTrail.length > 0 &&
-        documentData[0].AuditTrail.filter((data) => data.Activity === "Signed");
+          documentData[0].AuditTrail.filter(
+            (data) => data.Activity === "Signed"
+          );
 
         const checkAlreadySign =
           documentData[0].AuditTrail &&
@@ -474,7 +479,8 @@ function PdfRequestFiles(props) {
                 {
                   headers: {
                     "Content-Type": "application/json",
-                  "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
+                    "X-Parse-Application-Id":
+                      localStorage.getItem("parseAppId"),
                     sessiontoken: localStorage.getItem("accesstoken")
                   }
                 }
@@ -604,42 +610,24 @@ function PdfRequestFiles(props) {
           isLoad: false
         });
       }
-    await axios
+      //function to get default signatur eof current user from `contracts_Signature` class
-      .get(
+      const defaultSignRes = await getDefaultSignature(jsonSender.objectId);
-        `${localStorage.getItem(
+      if (defaultSignRes?.status === "success") {
-          "baseUrl"
+        setDefaultSignImg(defaultSignRes?.res?.defaultSignature);
-        )}classes/contracts_Signature?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${
+        setMyInitial(defaultSignRes?.res?.defaultInitial);
-          jsonSender?.objectId
+      } else if (defaultSignRes?.status === "error") {
-        }"}}`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken")
-          }
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-
-        if (res[0] && res.length > 0) {
-          setDefaultSignImg(res[0].ImageURL);
-          setMyInitial(res[0]?.Initials);
-        }
-
-        const loadObj = {
-          isLoad: false
-        };
-        setIsLoading(loadObj);
-      })
-      .catch((err) => {
-        console.log("Err in contracts_Signature class", err);
         setHandleError("Error: Something went wrong!");
         setIsLoading({
           isLoad: false
         });
+      }
+    } catch (err) {
+      console.log("Error: error in getDocumentDetails", err);
+      setHandleError("Error: Something went wrong!");
+      setIsLoading({
+        isLoad: false
       });
+    }
   };
   //function for embed signature or image url in pdf
   async function embedWidgetsData() {
@@ -2156,7 +2144,6 @@ function PdfRequestFiles(props) {
                     {defaultSignImg && !alreadySign && currentSigner && (
                       <DefaultSignature
                         defaultSignImg={defaultSignImg}
-                        setDefaultSignImg={setDefaultSignImg}
                         userObjectId={signerObjectId}
                         setIsLoading={setIsLoading}
                         xyPostion={signerPos}

apps/OpenSign/src/pages/SignyourselfPdf.js

@@ -33,7 +33,8 @@ import {
   fetchImageBase64,
   changeImageWH,
   handleSendOTP,
-  getContainerScale
+  getContainerScale,
+  getDefaultSignature
 } from "../constant/Utils";
 import { useParams } from "react-router-dom";
 import Tour from "reactour";
@@ -205,6 +206,7 @@ function SignYourSelf() {
   }, [divRef.current, isHeader]);
   //function for get document details for perticular signer with signer'object id
   const getDocumentDetails = async (showComplete) => {
+    try {
       let isCompleted;
       //getting document details
       const documentData = await contractDocument(documentId);
@@ -224,7 +226,8 @@ function SignYourSelf() {
         } else {
           setHandleError("Error: Something went wrong!");
         }
-      isCompleted = documentData[0].IsCompleted && documentData[0].IsCompleted;
+        isCompleted =
+          documentData[0].IsCompleted && documentData[0].IsCompleted;
         if (isCompleted) {
           setIsCelebration(true);
           setTimeout(() => {
@@ -262,37 +265,19 @@ function SignYourSelf() {
         };
         setIsLoading(loadObj);
       }
-    await axios
+
-      .get(
+      //function to get default signatur eof current user from `contracts_Signature` class
-        `${localStorage.getItem(
+      const defaultSignRes = await getDefaultSignature(jsonSender.objectId);
-          "baseUrl"
+      console.log("defaultSignRes", defaultSignRes);
-        )}classes/contracts_Signature?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${
+      if (defaultSignRes?.status === "success") {
-          jsonSender.objectId
+        setDefaultSignImg(defaultSignRes?.res?.defaultSignature);
-        }"}}`,
+        setMyInitial(defaultSignRes?.res?.defaultInitial);
-        {
+      } else if (defaultSignRes?.status === "error") {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken")
-          }
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-        if (res[0] && res.length > 0) {
-          setDefaultSignImg(res[0].ImageURL);
-          setMyInitial(res[0]?.Initials);
-        }
-      })
-      .catch((err) => {
-        console.log("Err ", err);
-        const loadObj = {
-          isLoad: false
-        };
         setHandleError("Error: Something went wrong!");
-        setIsLoading(loadObj);
+        setIsLoading({
+          isLoad: false
         });
+      }
       const contractUsersRes = await contractUsers();
       if (contractUsersRes === "Error: Something went wrong!") {
         const loadObj = {
@@ -349,7 +334,15 @@ function SignYourSelf() {
         };
         setIsLoading(loadObj);
       }
+    } catch (err) {
+      console.log("Error: error in getDocumentDetails", err);
+      setHandleError("Error: Something went wrong!");
+      setIsLoading({
+        isLoad: false
+      });
+    }
   };
+
   const getWidgetValue = (type) => {
     switch (type) {
       case "name":
@@ -1310,12 +1303,12 @@ function SignYourSelf() {
                   isEmail={isEmail}
                   pdfUrl={pdfUrl}
                   setIsEmail={setIsEmail}
-                  pdfName={pdfDetails[0] && pdfDetails[0].Name}
                   setSuccessEmail={setSuccessEmail}
                   sender={jsonSender}
                   setIsAlert={setIsAlert}
                   extUserId={extUserId}
                   activeMailAdapter={activeMailAdapter}
+                  pdfDetails={pdfDetails}
                 />
                 {/* pdf header which contain funish back button */}
                 <Header