From 09b39a467bcc03277d019ab33d3ced749f486a37 Mon Sep 17 00:00:00 2001 From: RaktimaNXG Date: Fri, 21 Jun 2024 20:18:12 +0530 Subject: [PATCH] fix: widgets disappear issue in request sign flow --- .../OpenSign/src/components/RenderDebugPdf.js | 6 +--- apps/OpenSign/src/components/pdf/RenderPdf.js | 31 ++++++------------- apps/OpenSign/src/pages/PdfRequestFiles.js | 23 +++++--------- apps/OpenSign/src/pages/PlaceHolderSign.js | 23 +++++--------- apps/OpenSign/src/pages/SignyourselfPdf.js | 25 ++++++--------- .../OpenSign/src/pages/TemplatePlaceholder.js | 23 +++++--------- 6 files changed, 43 insertions(+), 88 deletions(-) diff --git a/apps/OpenSign/src/components/RenderDebugPdf.js b/apps/OpenSign/src/components/RenderDebugPdf.js index c204b207a..f33935e4a 100644 --- a/apps/OpenSign/src/components/RenderDebugPdf.js +++ b/apps/OpenSign/src/components/RenderDebugPdf.js @@ -13,11 +13,7 @@ const RenderDebugPdf = (props) => { > { - const load = { - status: false, - type: "failed" - }; - props.setPdfLoadFail(load); + props.setPdfLoadFail(false); }} loading={"Loading Document.."} onLoadSuccess={props.pageDetails} diff --git a/apps/OpenSign/src/components/pdf/RenderPdf.js b/apps/OpenSign/src/components/pdf/RenderPdf.js index 87a287378..6c89d4969 100644 --- a/apps/OpenSign/src/components/pdf/RenderPdf.js +++ b/apps/OpenSign/src/components/pdf/RenderPdf.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React from "react"; import RSC from "react-scrollbars-custom"; import { Document, Page } from "react-pdf"; import { @@ -28,7 +28,8 @@ function RenderPdf({ pdfRequest, signerObjectId, signedSigners, - setPdfLoadFail, + pdfLoad, + setPdfLoad, placeholder, setSignerPos, setXyPostion, @@ -55,12 +56,9 @@ function RenderPdf({ handleTextSettingModal, setTempSignerId, uniqueId, - setPdfRenderHeight, pdfOriginalWH, scale }) { - const [isLoadPdf, setIsLoadPdf] = useState(false); - const isMobile = window.innerWidth < 767; //check isGuestSigner is present in local if yes than handle login flow header in mobile view const isGuestSigner = localStorage.getItem("isGuestSigner"); @@ -255,8 +253,8 @@ function RenderPdf({ ref={drop} id="container" > - {isLoadPdf && - containerWH?.width && + {containerWH?.width && + pdfOriginalWH.length > 0 && (pdfRequest ? signerPos.map((data, key) => { return ( @@ -387,7 +385,7 @@ function RenderPdf({
{ - setPdfLoadFail(true); + setPdfLoad(false); }} loading={"Loading Document.."} onLoadSuccess={pageDetails} @@ -406,10 +404,6 @@ function RenderPdf({ } > { - setPdfRenderHeight && setPdfRenderHeight(height); - setIsLoadPdf(true); - }} key={index} pageNumber={pageNumber} width={containerWH.width} @@ -440,8 +434,9 @@ function RenderPdf({ ref={drop} id="container" > - {isLoadPdf && + {pdfLoad && containerWH?.width && + pdfOriginalWH.length > 0 && (pdfRequest //pdf request sign flow ? signerPos?.map((data, key) => { return ( @@ -576,11 +571,7 @@ function RenderPdf({ {/* this component for render pdf document is in middle of the component */} { - const load = { - status: false, - type: "failed" - }; - setPdfLoadFail(load); + pdfLoad(false); }} loading={"Loading Document.."} onLoadSuccess={pageDetails} @@ -599,10 +590,6 @@ function RenderPdf({ } > { - setPdfRenderHeight && setPdfRenderHeight(height); - setIsLoadPdf(true); - }} key={index} width={containerWH.width} scale={scale || 1} diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js index 860b937ad..ea9617b29 100644 --- a/apps/OpenSign/src/pages/PdfRequestFiles.js +++ b/apps/OpenSign/src/pages/PdfRequestFiles.js @@ -110,10 +110,7 @@ function PdfRequestFiles() { }); const [myInitial, setMyInitial] = useState(""); const [isInitial, setIsInitial] = useState(false); - const [pdfLoadFail, setPdfLoadFail] = useState({ - status: false, - type: "load" - }); + const [pdfLoad, setPdfLoad] = useState(false); const [isSigned, setIsSigned] = useState(false); const [isExpired, setIsExpired] = useState(false); const [alreadySign, setAlreadySign] = useState(false); @@ -129,7 +126,6 @@ function PdfRequestFiles() { const [isVerifyModal, setIsVerifyModal] = useState(false); const [otp, setOtp] = useState(""); const [contractName, setContractName] = useState(""); - const [pdfRenderHeight, setPdfRenderHeight] = useState(); const [zoomPercent, setZoomPercent] = useState(0); const [totalZoomPercent, setTotalZoomPercent] = useState(); const [scale, setScale] = useState(1); @@ -1020,16 +1016,15 @@ function PdfRequestFiles() { //function for get pdf page details const pageDetails = async (pdf) => { let pdfWHObj = []; - for (let index = 0; index < allPages; index++) { - const firstPage = await pdf.getPage(index + 1); + const totalPages = pdf.numPages; // Get the total number of pages + for (let index = 0; index < totalPages; index++) { + const getPage = await pdf.getPage(index + 1); const scale = 1; - const { width, height } = firstPage.getViewport({ scale }); + const { width, height } = getPage.getViewport({ scale }); pdfWHObj.push({ pageNumber: index + 1, width, height }); } setPdfOriginalWH(pdfWHObj); - setPdfLoadFail({ - status: true - }); + setPdfLoad(true); }; //function for change page function changePage(offset) { @@ -1733,8 +1728,8 @@ function PdfRequestFiles() { pdfRequest={true} signerObjectId={signerObjectId} signedSigners={signedSigners} - setPdfLoadFail={setPdfLoadFail} - pdfLoadFail={pdfLoadFail} + setPdfLoad={setPdfLoad} + pdfLoad={pdfLoad} setSignerPos={setSignerPos} containerWH={containerWH} setIsInitial={setIsInitial} @@ -1744,8 +1739,6 @@ function PdfRequestFiles() { selectWidgetId={selectWidgetId} setCurrWidgetsDetails={setCurrWidgetsDetails} divRef={divRef} - setPdfRenderHeight={setPdfRenderHeight} - pdfRenderHeight={pdfRenderHeight} setIsResize={setIsResize} isResize={isResize} setTotalZoomPercent={setTotalZoomPercent} diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js index a379005ac..f417b8717 100644 --- a/apps/OpenSign/src/pages/PlaceHolderSign.js +++ b/apps/OpenSign/src/pages/PlaceHolderSign.js @@ -104,10 +104,7 @@ function PlaceHolderSign() { const [defaultBody, setDefaultBody] = useState(""); const [defaultSubject, setDefaultSubject] = useState(""); const [isTextSetting, setIsTextSetting] = useState(false); - const [pdfLoadFail, setPdfLoadFail] = useState({ - status: false, - type: "load" - }); + const [pdfLoad, setPdfLoad] = useState(false); const [isPageCopy, setIsPageCopy] = useState(false); const [uniqueId, setUniqueId] = useState(""); const [roleName, setRoleName] = useState(""); @@ -131,7 +128,6 @@ function PlaceHolderSign() { const [requestBody, setRequestBody] = useState(""); const [pdfArrayBuffer, setPdfArrayBuffer] = useState(""); const isHeader = useSelector((state) => state.showHeader); - const [pdfRenderHeight, setPdfRenderHeight] = useState(); const [activeMailAdapter, setActiveMailAdapter] = useState(""); const [isAlreadyPlace, setIsAlreadyPlace] = useState({ status: false, @@ -664,16 +660,15 @@ function PlaceHolderSign() { //function for get pdf page details const pageDetails = async (pdf) => { let pdfWHObj = []; - for (let index = 0; index < allPages; index++) { - const firstPage = await pdf.getPage(index + 1); + const totalPages = pdf?.numPages; + for (let index = 0; index < totalPages; index++) { + const getPage = await pdf.getPage(index + 1); const scale = 1; - const { width, height } = firstPage.getViewport({ scale }); + const { width, height } = getPage.getViewport({ scale }); pdfWHObj.push({ pageNumber: index + 1, width, height }); } setPdfOriginalWH(pdfWHObj); - setPdfLoadFail({ - status: true - }); + setPdfLoad(true); }; //function for save x and y position and show signature tab on that position @@ -2075,8 +2070,8 @@ function PlaceHolderSign() { handleDeleteSign={handleDeleteSign} handleTabDrag={handleTabDrag} handleStop={handleStop} - setPdfLoadFail={setPdfLoadFail} - pdfLoadFail={pdfLoadFail} + setPdfLoad={setPdfLoad} + pdfLoad={pdfLoad} setSignerPos={setSignerPos} containerWH={containerWH} setIsResize={setIsResize} @@ -2098,8 +2093,6 @@ function PlaceHolderSign() { handleNameModal={setIsNameModal} setTempSignerId={setTempSignerId} uniqueId={uniqueId} - setPdfRenderHeight={setPdfRenderHeight} - pdfRenderHeight={pdfRenderHeight} handleTextSettingModal={handleTextSettingModal} pdfOriginalWH={pdfOriginalWH} setScale={setScale} diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js index 76a8cc203..00740a7c3 100644 --- a/apps/OpenSign/src/pages/SignyourselfPdf.js +++ b/apps/OpenSign/src/pages/SignyourselfPdf.js @@ -106,10 +106,7 @@ function SignYourSelf() { const [currWidgetsDetails, setCurrWidgetsDetails] = useState({}); const [isCheckbox, setIsCheckbox] = useState(false); const [widgetType, setWidgetType] = useState(""); - const [pdfLoadFail, setPdfLoadFail] = useState({ - status: false, - type: "load" - }); + const [pdfLoad, setPdfLoad] = useState(false); const [isAlert, setIsAlert] = useState({ isShow: false, alertMessage: "" }); const [isDontShow, setIsDontShow] = useState(false); const [extUserId, setExtUserId] = useState(""); @@ -120,7 +117,6 @@ function SignYourSelf() { const [isEmailVerified, setIsEmailVerified] = useState(true); const [isVerifyModal, setIsVerifyModal] = useState(false); const [otp, setOtp] = useState(""); - const [pdfRenderHeight, setPdfRenderHeight] = useState(); const [zoomPercent, setZoomPercent] = useState(0); const isHeader = useSelector((state) => state.showHeader); const [scale, setScale] = useState(1); @@ -854,16 +850,15 @@ function SignYourSelf() { //function for get pdf page details const pageDetails = async (pdf) => { let pdfWHObj = []; - for (let index = 0; index < allPages; index++) { - const firstPage = await pdf.getPage(index + 1); + const totalPages = pdf?.numPages; + for (let index = 0; index < totalPages; index++) { + const getPage = await pdf.getPage(index + 1); const scale = 1; - const { width, height } = firstPage.getViewport({ scale }); + const { width, height } = getPage.getViewport({ scale }); pdfWHObj.push({ pageNumber: index + 1, width, height }); } setPdfOriginalWH(pdfWHObj); - setPdfLoadFail({ - status: true - }); + setPdfLoad(true); }; //function for change page numver of pdf function changePage(offset) { @@ -1197,7 +1192,7 @@ function SignYourSelf() { /> )} {/* this component used for UI interaction and show their functionality */} - {pdfLoadFail && !checkTourStatus && ( + {pdfLoad && !checkTourStatus && ( diff --git a/apps/OpenSign/src/pages/TemplatePlaceholder.js b/apps/OpenSign/src/pages/TemplatePlaceholder.js index 37d47fb28..d5aee2e9d 100644 --- a/apps/OpenSign/src/pages/TemplatePlaceholder.js +++ b/apps/OpenSign/src/pages/TemplatePlaceholder.js @@ -87,12 +87,8 @@ const TemplatePlaceholder = () => { const [blockColor, setBlockColor] = useState(""); const [selectWidgetId, setSelectWidgetId] = useState(""); const [isNameModal, setIsNameModal] = useState(false); - const [pdfRenderHeight, setPdfRenderHeight] = useState(); const [isTextSetting, setIsTextSetting] = useState(false); - const [pdfLoadFail, setPdfLoadFail] = useState({ - status: false, - type: "load" - }); + const [pdfLoad, setPdfLoad] = useState(false); const color = [ "#93a3db", "#e6c3db", @@ -541,16 +537,15 @@ const TemplatePlaceholder = () => { //function for get pdf page details const pageDetails = async (pdf) => { let pdfWHObj = []; - for (let index = 0; index < allPages; index++) { - const firstPage = await pdf.getPage(index + 1); + const totalPages = pdf?.numPages; + for (let index = 0; index < totalPages; index++) { + const getPage = await pdf.getPage(index + 1); const scale = 1; - const { width, height } = firstPage.getViewport({ scale }); + const { width, height } = getPage.getViewport({ scale }); pdfWHObj.push({ pageNumber: index + 1, width, height }); } setPdfOriginalWH(pdfWHObj); - setPdfLoadFail({ - status: true - }); + setPdfLoad(true); }; //function for save x and y position and show signature tab on that position const handleTabDrag = (key) => { @@ -1516,8 +1511,8 @@ const TemplatePlaceholder = () => { handleDeleteSign={handleDeleteSign} handleTabDrag={handleTabDrag} handleStop={handleStop} - setPdfLoadFail={setPdfLoadFail} - pdfLoadFail={pdfLoadFail} + setPdfLoad={setPdfLoad} + pdfLoad={pdfLoad} setSignerPos={setSignerPos} containerWH={containerWH} setIsResize={setIsResize} @@ -1537,8 +1532,6 @@ const TemplatePlaceholder = () => { selectWidgetId={selectWidgetId} setIsCheckbox={setIsCheckbox} handleNameModal={setIsNameModal} - setPdfRenderHeight={setPdfRenderHeight} - pdfRenderHeight={pdfRenderHeight} handleTextSettingModal={handleTextSettingModal} pdfOriginalWH={pdfOriginalWH} setScale={setScale}