fix : minor bug fix in template

2026-08-17 21:25:54 +02:00 · 2023-12-29 23:00:37 +05:30
parent ccdf50dbe0
commit 4648ace84e
5 changed files with 227 additions and 308 deletions
@@ -327,12 +327,12 @@ const TemplatePlaceholder = () => {

  //function for setting position after drop signature button over pdf
  const addPositionOfSignature = (item, monitor) => {
-        getSignerPos(item, monitor);
+    getSignerPos(item, monitor);
  };

  // `getSignerPos` is used to get placeholder position when user place it and save it in array
  const getSignerPos = (item, monitor) => {
-    const signer = signersdata.find((x) => x.Id === uniqueId);
+    if(uniqueId){const signer = signersdata.find((x) => x.Id === uniqueId);
    if (signer) {
      const posZIndex = zIndex + 1;
      setZIndex(posZIndex);
@@ -344,8 +344,7 @@ const TemplatePlaceholder = () => {
      // );
      let filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
      let dropData = [];
-      let xyPosArr = [];
-      let xyPos = {};
+      let placeHolder ;
      if (item === "onclick") {
        const dropObj = {
          xPosition: window.innerWidth / 2 - 100,
@@ -359,12 +358,11 @@ const TemplatePlaceholder = () => {
          zIndex: posZIndex
        };
        dropData.push(dropObj);
-        xyPos = {
+        placeHolder = {
          pageNumber: pageNumber,
          pos: dropData
        };

-        xyPosArr.push(xyPos);
      } else if (item.type === "BOX") {
        const offset = monitor.getClientOffset();
        //adding and updating drop position in array when user drop signature button in div
@@ -390,21 +388,14 @@ const TemplatePlaceholder = () => {
        };

        dropData.push(dropObj);
-        xyPos = {
+        placeHolder = {
          pageNumber: pageNumber,
          pos: dropData
        };
-
-        xyPosArr.push(xyPos);
      }
-      const { blockColor, Role } = signersdata.find((x) => x.Id === uniqueId);
+      const { blockColor, Role } = signer
      //adding placholder in existing signer pos array (placaholder)
      if (filterSignerPos.length > 0) {
-        // const colorIndex = signerPos
-        //   .map((e) => e.signerObjId)
-        //   .indexOf(signerObjId);
-
-        const colorIndex = signerPos.map((e) => e.Id).indexOf(uniqueId);
        const getPlaceHolder = filterSignerPos[0].placeHolder;
        const updatePlace = getPlaceHolder.filter(
          (data) => data.pageNumber !== pageNumber
@@ -416,79 +407,21 @@ const TemplatePlaceholder = () => {
        //add entry of position for same signer on multiple page
        if (getPageNumer.length > 0) {
          const getPos = getPageNumer[0].pos;
-          const newSignPos = getPos.concat(dropData);
+          const newSignPos = getPos.concat(dropData); 
          let xyPos = {
            pageNumber: pageNumber,
            pos: newSignPos
          };
          updatePlace.push(xyPos);
-          let placeHolderPos;
-          if (contractName) {
-            placeHolderPos = {
-              blockColor: blockColor ? blockColor : color[isSelectListId],
-              signerObjId: signerObjId,
-              placeHolder: updatePlace,
-              signerPtr: {
-                __type: "Pointer",
-                className: `${contractName}`,
-                objectId: signerObjId
-              },
-              Role: Role ? Role : roleName,
-              Id: uniqueId
-            };
-          } else {
-            placeHolderPos = {
-              blockColor: blockColor ? blockColor : color[isSelectListId],
-              signerObjId: "",
-              placeHolder: updatePlace,
-              signerPtr: {},
-              Role: Role ? Role : roleName,
-              Id: uniqueId
-            };
-          }
-          // signerPos.splice(colorIndex, 1, placeHolderPos);
-          const newArry = [placeHolderPos];
-          const newArray = [
-            ...signerPos.slice(0, colorIndex),
-            ...newArry,
-            ...signerPos.slice(colorIndex + 1)
-          ];
-          setSignerPos(newArray);
+          const updatesignerPos = signerPos.map((x) =>
+            x.Id === uniqueId ? { ...x, placeHolder: updatePlace } : x
+          );
+          setSignerPos(updatesignerPos);
        } else {
-          const newSignPoss = getPlaceHolder.concat(xyPosArr[0]);
-          let placeHolderPos;
-          if (contractName) {
-            placeHolderPos = {
-              blockColor: color[isSelectListId],
-              signerObjId: signerObjId,
-              placeHolder: newSignPoss,
-              signerPtr: {
-                __type: "Pointer",
-                className: `${contractName}`,
-                objectId: signerObjId
-              },
-              Role: Role ? Role : roleName,
-              Id: uniqueId
-            };
-          } else {
-            placeHolderPos = {
-              blockColor: color[isSelectListId],
-              signerObjId: "",
-              placeHolder: newSignPoss,
-              signerPtr: {},
-              Role: Role ? Role : roleName,
-              Id: uniqueId
-            };
-          }
-
-          const newArry = [placeHolderPos];
-          const newArray = [
-            ...signerPos.slice(0, colorIndex),
-            ...newArry,
-            ...signerPos.slice(colorIndex + 1)
-          ];
-
-          setSignerPos(newArray);
+          const updatesignerPos = signerPos.map((x) =>
+            x.Id === uniqueId ? { ...x, placeHolder: [...x.placeHolder, placeHolder] } : x
+          );
+          setSignerPos(updatesignerPos);
        }
      } else {
        //adding new placeholder for selected signer in pos array (placeholder)
@@ -502,7 +435,7 @@ const TemplatePlaceholder = () => {
            },
            signerObjId: signerObjId,
            blockColor: blockColor ? blockColor : color[isSelectListId],
-            placeHolder: xyPosArr,
+            placeHolder: [placeHolder],
            Role: Role ? Role : roleName,
            Id: uniqueId
          };
@@ -511,18 +444,17 @@ const TemplatePlaceholder = () => {
            signerPtr: {},
            signerObjId: "",
            blockColor: blockColor ? blockColor : color[isSelectListId],
-            placeHolder: xyPosArr,
+            placeHolder: [placeHolder],
            Role: Role ? Role : roleName,
            Id: uniqueId
          };
        }
-
        setSignerPos((prev) => [...prev, placeHolderPos]);
      }
      setIsMailSend(false);
    } else {
      setIsReceipent(false);
-    }
+    }}
  };
  //function for get pdf page details
  const pageDetails = async (pdf) => {
@@ -884,18 +816,18 @@ const TemplatePlaceholder = () => {
  // `handleDeleteUser` function is used to delete record and placeholder when user click on delete which is place next user name in recipients list
  const handleDeleteUser = (Id) => {
    const updateSigner = signersdata
-    .filter((x) => x.Id !== Id)
-    .map((x, i) => ({ ...x, blockColor: color[i] }));
+      .filter((x) => x.Id !== Id)
+      .map((x, i) => ({ ...x, blockColor: color[i] }));
    setSignersData(updateSigner);
    const updatePlaceholderUser = signerPos
-    .filter((x) => x.Id !== Id)
-    .map((x, i) => ({ ...x, blockColor: color[i] }));
-    const index = signersdata.findIndex((x)=> x.Id === Id)
-    if(index === signersdata.length - 1){
-      setUniqueId(updateSigner[updateSigner.length - 1]?.Id ||"");
+      .filter((x) => x.Id !== Id)
+      .map((x, i) => ({ ...x, blockColor: color[i] }));
+    const index = signersdata.findIndex((x) => x.Id === Id);
+    if (index === signersdata.length - 1) {
+      setUniqueId(updateSigner[updateSigner.length - 1]?.Id || "");
      setIsSelectId(0);
-    }else{
-      setUniqueId(updateSigner[index]?.Id ||"");
+    } else {
+      setUniqueId(updateSigner[index]?.Id || "");
      setIsSelectId(index);
    }

@@ -924,12 +856,14 @@ const TemplatePlaceholder = () => {

    const updateSigner = signersdata.map((x) => {
      if (x.Id === uniqueId) {
-        return { ...x, ...data };
+        return { ...x, ...data, className: "contracts_Contactbook" };
      }
      return { ...x };
    });
    setSignersData(updateSigner);
    setIsMailSend(false);
+    const index = signersdata.findIndex((x)=> x.Id ===uniqueId)
+    setIsSelectId(index)
  };

  // `closePopup` is used to close Add/Choose signer modal
@@ -1054,7 +988,10 @@ const TemplatePlaceholder = () => {
                handleClose={() => setIsCreateDocModal(false)}
              >
                <div style={{ height: "100%", padding: 20 }}>
-                  <p>Do you want to create a document using the template you just created ?</p>
+                  <p>
+                    Do you want to create a document using the template you just
+                    created ?
+                  </p>
                  <div
                    style={{
                      height: "1px",
@@ -83,22 +83,56 @@ function FieldsComponent({
                  justifyContent: "center"
                }}
                onClick={() => {
-                  if (signersdata?.length) {
-                    handleModal();
-                  }
+                  // if (signersdata?.length) {
+                  handleModal();
+                  // }
                }}
              >
-                <span style={{ fontSize: "13px", fontWeight: "700" }}>
+                <span
+                  style={{
+                    fontSize: "13px",
+                    fontWeight: "700",
+                    textAlign: "center"
+                  }}
+                >
                  Recipient
                </span>
-                <span style={{ fontSize: "13px", fontWeight: "700" }}>
+                <span
+                  style={{
+                    fontSize: "13px",
+                    fontWeight: "700",
+                    display: "flex",
+                    alignItems: "center"
+                  }}
+                >
                  {signersdata[isSelectListId]?.Role && (
                    <div>
-                      {signersdata[isSelectListId]?.Name
-                        ? ` : ${signersdata[isSelectListId]?.Name}`
-                        : ` : ${signersdata[isSelectListId]?.Role}`}
+                      {signersdata[isSelectListId]?.Name ? (
+                        <>
+                          :{" "}
+                          {signersdata[isSelectListId]?.Name?.length > 12
+                            ? `${signersdata[isSelectListId].Name.slice(
+                                0,
+                                12
+                              )}...`
+                            : signersdata[isSelectListId]?.Name}
+                        </>
+                      ) : (
+                        <>
+                          :{" "}
+                          {signersdata[isSelectListId]?.Role?.length > 12
+                            ? `${signersdata[isSelectListId].Role.slice(
+                                0,
+                                12
+                              )}...`
+                            : signersdata[isSelectListId]?.Role}
+                        </>
+                      )}
                    </div>
                  )}
+                  <div style={{ marginLeft: 6, fontSize: 16 }}>
+                    <i className="fa-solid fa-angle-down"></i>
+                  </div>
                </span>
              </div>
            )}
@@ -333,25 +367,41 @@ function FieldsComponent({
          </div>
        </div>
      )}
-      <ModalUi
-        title={"Recipients"}
-        isOpen={isSignersModal}
-        handleClose={handleModal}
-      >
-        <RecipientList
-          signerPos={signerPos}
-          signersdata={signersdata}
-          isSelectListId={isSelectListId}
-          setSignerObjId={setSignerObjId}
-          setIsSelectId={setIsSelectId}
-          setContractName={setContractName}
-          setUniqueId={setUniqueId}
-          setRoleName={setRoleName}
-          handleDeleteUser={handleDeleteUser}
-          handleRoleChange={handleRoleChange}
-          handleOnBlur={handleOnBlur}
-        />
-      </ModalUi>
+      {isSignersModal && (
+        <ModalUi
+          title={"Recipients"}
+          isOpen={isSignersModal}
+          handleClose={handleModal}
+        >
+          {signersdata.length > 0 ? (
+            <RecipientList
+              signerPos={signerPos}
+              signersdata={signersdata}
+              isSelectListId={isSelectListId}
+              setSignerObjId={setSignerObjId}
+              setIsSelectId={setIsSelectId}
+              setContractName={setContractName}
+              setUniqueId={setUniqueId}
+              setRoleName={setRoleName}
+              handleDeleteUser={handleDeleteUser}
+              handleRoleChange={handleRoleChange}
+              handleOnBlur={handleOnBlur}
+              handleModal={handleModal}
+            />
+          ) : (
+            <div
+              style={{
+                padding: 20,
+                fontSize: 15,
+                fontWeight: "500",
+                textAlign: "center"
+              }}
+            >
+              Please add Recipient
+            </div>
+          )}
+        </ModalUi>
+      )}
    </>
  );
 }
@@ -381,14 +381,12 @@ function RenderPdf({
  };
  const handleUserName = (signerId, Role) => {
    if (signerId) {
-      const checkSign = signersdata.filter(
-        (sign) => sign.objectId === signerId
-      );
-      if (checkSign.length > 0) {
+      const checkSign = signersdata.find((sign) => sign.objectId === signerId);
+      if (checkSign?.Name) {
        return (
          <>
            <div style={{ color: "black", fontSize: 11 }}>
-              {checkSign[0].Name}
+              {checkSign?.Name}
            </div>
            <div style={{ color: "black", fontSize: 11 }}> {`(${Role})`} </div>
          </>
@@ -788,7 +786,6 @@ function RenderPdf({
                                        xyPostion,
                                        index,
                                        setXyPostion
-                                     
                                      );
                                    }}
                                  >
@@ -53,7 +53,7 @@ function PlaceHolderSign() {
    message: "This might take some time"
  });
  const [handleError, setHandleError] = useState();
-  const [currentEmail, setCurrentEmail] = useState();
+  const [currentId, setCurrentId] = useState("");
  const [pdfNewWidth, setPdfNewWidth] = useState();
  const [placeholderTour, setPlaceholderTour] = useState(true);
  const [checkTourStatus, setCheckTourStatus] = useState(false);
@@ -202,10 +202,7 @@ function PlaceHolderSign() {

      if (documentData[0].Signers && documentData[0].Signers.length > 0) {
        const currEmail = documentData[0].ExtUserPtr.Email;
-        const filterCurrEmail = documentData[0].Signers.filter(
-          (data) => data.Email === currEmail
-        );
-        setCurrentEmail(filterCurrEmail);
+        setCurrentId(currEmail)
        setSignerObjId(documentData[0].Signers[0].objectId);
        setContractName(documentData[0].Signers[0].className);
        setIsSelectId(0);
@@ -329,196 +326,128 @@ function PlaceHolderSign() {
  };

  const getSignerPos = (item, monitor) => {
-    const posZIndex = zIndex + 1;
-    setZIndex(posZIndex);
-    const newWidth = containerWH.width;
-    const scale = pdfOriginalWidth / newWidth;
-    const key = Math.floor(1000 + Math.random() * 9000);
-    // let filterSignerPos = signerPos.filter(
-    //   (data) => data.signerObjId === signerObjId
-    // );
-    let filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
-
-    let dropData = [];
-    let xyPosArr = [];
-    let xyPos = {};
-    if (item === "onclick") {
-      const dropObj = {
-        //onclick put placeholder center on pdf
-        xPosition: window.innerWidth / 2 - 100,
-        yPosition: window.innerHeight / 2 - 60,
-        isStamp: monitor,
-        key: key,
-        isDrag: false,
-        scale: scale,
-        isMobile: isMobile,
-        yBottom: window.innerHeight / 2 - 60,
-        zIndex: posZIndex
-      };
-      dropData.push(dropObj);
-      xyPos = {
-        pageNumber: pageNumber,
-        pos: dropData
-      };
-
-      xyPosArr.push(xyPos);
-    } else if (item.type === "BOX") {
-      const offset = monitor.getClientOffset();
-      //adding and updating drop position in array when user drop signature button in div
-      const containerRect = document
-        .getElementById("container")
-        .getBoundingClientRect();
-      const x = offset.x - containerRect.left;
-      const y = offset.y - containerRect.top;
-      const ybottom = containerRect.bottom - offset.y;
-
-      const dropObj = {
-        xPosition: signBtnPosition[0] ? x - signBtnPosition[0].xPos : x,
-        yPosition: signBtnPosition[0] ? y - signBtnPosition[0].yPos : y,
-        isStamp: isDragStamp || isDragStampSS ? true : false,
-        key: key,
-        isDrag: false,
-        firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
-        firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
-        yBottom: ybottom,
-        scale: scale,
-        isMobile: isMobile,
-        zIndex: posZIndex
-      };
-      dropData.push(dropObj);
-      xyPos = {
-        pageNumber: pageNumber,
-        pos: dropData
-      };
-
-      xyPosArr.push(xyPos);
-    }
-
-    //add signers objId first inseretion
-    if (filterSignerPos.length > 0) {
-      // const colorIndex = signerPos
-      //   .map((e) => e.signerObjId)
-      //   .indexOf(signerObjId);
-
-      const colorIndex = signerPos.map((e) => e.Id).indexOf(uniqueId);
-
-      const getPlaceHolder = filterSignerPos[0].placeHolder;
-      const updatePlace = getPlaceHolder.filter(
-        (data) => data.pageNumber !== pageNumber
-      );
-      const getPageNumer = getPlaceHolder.filter(
-        (data) => data.pageNumber === pageNumber
-      );
-
-      //add entry of position for same signer on multiple page
-      if (getPageNumer.length > 0) {
-        const getPos = getPageNumer[0].pos;
-        const newSignPos = getPos.concat(dropData);
-        let xyPos = {
+    const signer = signersdata.find((x) => x.Id === uniqueId);
+    if (signer) {
+      const posZIndex = zIndex + 1;
+      setZIndex(posZIndex);
+      const newWidth = containerWH.width;
+      const scale = pdfOriginalWidth / newWidth;
+      const key = randomId();
+      // let filterSignerPos = signerPos.filter(
+      //   (data) => data.signerObjId === signerObjId
+      // );
+      let filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
+      let dropData = [];
+      let placeHolder ;
+      if (item === "onclick") {
+        const dropObj = {
+          xPosition: window.innerWidth / 2 - 100,
+          yPosition: window.innerHeight / 2 - 60,
+          isStamp: monitor,
+          key: key,
+          isDrag: false,
+          scale: scale,
+          isMobile: isMobile,
+          yBottom: window.innerHeight / 2 - 60,
+          zIndex: posZIndex
+        };
+        dropData.push(dropObj);
+        placeHolder = {
          pageNumber: pageNumber,
-          pos: newSignPos
+          pos: dropData
        };
-        updatePlace.push(xyPos);
+
+      } else if (item.type === "BOX") {
+        const offset = monitor.getClientOffset();
+        //adding and updating drop position in array when user drop signature button in div
+        const containerRect = document
+          .getElementById("container")
+          .getBoundingClientRect();
+        const x = offset.x - containerRect.left;
+        const y = offset.y - containerRect.top;
+        const ybottom = containerRect.bottom - offset.y;
+
+        const dropObj = {
+          xPosition: signBtnPosition[0] ? x - signBtnPosition[0].xPos : x,
+          yPosition: signBtnPosition[0] ? y - signBtnPosition[0].yPos : y,
+          isStamp: isDragStamp || isDragStampSS ? true : false,
+          key: key,
+          isDrag: false,
+          firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
+          firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
+          yBottom: ybottom,
+          scale: scale,
+          isMobile: isMobile,
+          zIndex: posZIndex
+        };
+
+        dropData.push(dropObj);
+        placeHolder = {
+          pageNumber: pageNumber,
+          pos: dropData
+        };
+      }
+      const { blockColor, Role } = signer
+      //adding placholder in existing signer pos array (placaholder)
+      if (filterSignerPos.length > 0) {
+        const getPlaceHolder = filterSignerPos[0].placeHolder;
+        const updatePlace = getPlaceHolder.filter(
+          (data) => data.pageNumber !== pageNumber
+        );
+        const getPageNumer = getPlaceHolder.filter(
+          (data) => data.pageNumber === pageNumber
+        );
+
+        //add entry of position for same signer on multiple page
+        if (getPageNumer.length > 0) {
+          const getPos = getPageNumer[0].pos;
+          const newSignPos = getPos.concat(dropData); 
+          let xyPos = {
+            pageNumber: pageNumber,
+            pos: newSignPos
+          };
+          updatePlace.push(xyPos);
+          const updatesignerPos = signerPos.map((x) =>
+            x.Id === uniqueId ? { ...x, placeHolder: updatePlace } : x
+          );
+          setSignerPos(updatesignerPos);
+        } else {
+          const updatesignerPos = signerPos.map((x) =>
+            x.Id === uniqueId ? { ...x, placeHolder: [...x.placeHolder, placeHolder] } : x
+          );
+          setSignerPos(updatesignerPos);
+        }
+      } else {
+        //adding new placeholder for selected signer in pos array (placeholder)
        let placeHolderPos;
        if (contractName) {
          placeHolderPos = {
-            blockColor: color[isSelectListId],
-            signerObjId: signerObjId,
-            placeHolder: updatePlace,
            signerPtr: {
              __type: "Pointer",
              className: `${contractName}`,
              objectId: signerObjId
            },
-            Role: roleName,
-            Id: uniqueId
-          };
-        } else {
-          placeHolderPos = {
-            blockColor: color[isSelectListId],
-            signerObjId: "",
-            placeHolder: updatePlace,
-            signerPtr: {},
-            Role: roleName,
-            Id: uniqueId
-          };
-        }
-        // signerPos.splice(colorIndex, 1, placeHolderPos);
-        const newArry = [placeHolderPos];
-        const newArray = [
-          ...signerPos.slice(0, colorIndex),
-          ...newArry,
-          ...signerPos.slice(colorIndex + 1)
-        ];
-        setSignerPos(newArray);
-      } else {
-        const newSignPoss = getPlaceHolder.concat(xyPosArr[0]);
-        let placeHolderPos;
-        if (contractName) {
-          placeHolderPos = {
-            blockColor: color[isSelectListId],
            signerObjId: signerObjId,
-            placeHolder: newSignPoss,
-            signerPtr: {
-              __type: "Pointer",
-              className: `${contractName}`,
-              objectId: signerObjId
-            },
-            Role: roleName,
+            blockColor: blockColor ? blockColor : color[isSelectListId],
+            placeHolder: [placeHolder],
+            Role: Role ? Role : roleName,
            Id: uniqueId
          };
        } else {
          placeHolderPos = {
-            blockColor: color[isSelectListId],
-            signerObjId: "",
-            placeHolder: newSignPoss,
            signerPtr: {},
-            Role: roleName,
+            signerObjId: "",
+            blockColor: blockColor ? blockColor : color[isSelectListId],
+            placeHolder: [placeHolder],
+            Role: Role ? Role : roleName,
            Id: uniqueId
          };
        }
-
-        // signerPos.splice(colorIndex, 1, placeHolderPos);
-        const newArry = [placeHolderPos];
-        const newArray = [
-          ...signerPos.slice(0, colorIndex),
-          ...newArry,
-          ...signerPos.slice(colorIndex + 1)
-        ];
-
-        setSignerPos(newArray);
-      }
-    } else {
-      let placeHolderPos;
-      if (contractName) {
-        placeHolderPos = {
-          signerPtr: {
-            __type: "Pointer",
-            className: `${contractName}`,
-            objectId: signerObjId
-          },
-          signerObjId: signerObjId,
-          blockColor: color[isSelectListId],
-          placeHolder: xyPosArr,
-          Role: roleName,
-          Id: uniqueId
-        };
-      } else {
-        placeHolderPos = {
-          signerPtr: {},
-          signerObjId: "",
-          blockColor: color[isSelectListId],
-          placeHolder: xyPosArr,
-          Role: roleName,
-          Id: uniqueId
-        };
+        setSignerPos((prev) => [...prev, placeHolderPos]);
      }

-      setSignerPos((prev) => [...prev, placeHolderPos]);
-    }
-    setIsMailSend(false);
+    } 
  };
-
  //function for get pdf page details
  const pageDetails = async (pdf) => {
    const load = {
@@ -791,6 +720,8 @@ function PlaceHolderSign() {
          objectId: x.objectId
        };
      });
+      const currentUser = signersdata.find((x)=> x.Email === currentId)
+      setCurrentId(currentUser?.objectId)
      // console.log("signers ", signers);
      try {
        const data = {
@@ -904,7 +835,7 @@ function PlaceHolderSign() {
  const handleRecipientSign = () => {
    const hostUrl = getHostUrl();
    navigate(
-      `${hostUrl}recipientSignPdf/${documentId}/${currentEmail[0].objectId}`
+      `${hostUrl}recipientSignPdf/${documentId}/${currentId}`
    );
  };

@@ -929,13 +860,14 @@ function PlaceHolderSign() {

    const updateSigner = signersdata.map((x) => {
      if (x.Id === uniqueId) {
-        return { ...x, ...data };
+        return { ...x, ...data, className: "contracts_Contactbook" };
      }
      return { ...x };
    });
    // console.log("updateSigner ", updateSigner);
-
    setSignersData(updateSigner);
+    const index = signersdata.findIndex((x)=> x.Id ===uniqueId)
+    setIsSelectId(index)
  }
  };

@@ -1056,13 +988,13 @@ function PlaceHolderSign() {
                {/* signature modal */}
                <Modal.Body>
                  <p>You have successfully sent mails to all recipients!</p>
-                  {currentEmail?.length > 0 && (
+                  {currentId && (
                    <p>Do you want to sign documents right now ?</p>
                  )}
                </Modal.Body>

                <Modal.Footer>
-                  {currentEmail?.length > 0 ? (
+                  {currentId ? (
                    <>
                      <button
                        onClick={() => {
@@ -85,6 +85,9 @@ const RecipientList = (props) => {
                props.setContractName(obj?.className);
                props.setUniqueId(obj.Id);
                props.setRoleName(obj.Role);
+                if(props.handleModal){
+                  props.handleModal()
+                }
              }}
            >
              <div