fix: modified variable name as required and added comment

microfrontends/SignDocuments/src/Component/SignYourselfPdf.js

@@ -38,7 +38,7 @@ import RenderPdf from "./component/renderPdf";
 import { contractUsers, contactBook, urlValidator } from "../utils/Utils";
 import { modalAlign } from "../utils/Utils";
 import AlertComponent from "./component/alertComponent";
-import CopyAllPage from "./component/copyAllPage";
+import PlaceholderCopy from "./component/PlaceholderCopy";
 
 //For signYourself inProgress section signer can add sign and complete doc sign.
 function SignYourSelf() {
@@ -891,7 +891,7 @@ function SignYourSelf() {
                 )}
               </Modal.Footer>
             </Modal>
-            <CopyAllPage
+            <PlaceholderCopy
               isPageCopy={isPageCopy}
               setIsPageCopy={setIsPageCopy}
               xyPostion={xyPostion}

microfrontends/SignDocuments/src/Component/component/PlaceholderCopy.js

@@ -0,0 +1,231 @@
+import React, { useState } from "react";
+import Modal from "react-bootstrap/Modal";
+import ModalHeader from "react-bootstrap/esm/ModalHeader";
+import { themeColor } from "../../utils/ThemeColor/backColor";
+
+function PlaceholderCopy(props) {
+  const copyType = ["All pages", "All pages but last", "All pages but first"];
+  const [selectCopyType, setSelectCopyType] = useState("");
+
+  //get RandomKey Id
+  const randomKey = () => {
+    const randomId = Math.floor(1000 + Math.random() * 9000);
+    return randomId;
+  };
+
+  //function for get copy placeholder position
+  const getCopyPlaceholderPosition = (
+    type,
+    rest,
+    newPageNumber,
+    existPlaceholderPosition
+  ) => {
+    let obj;
+
+    const filterPosition =
+      existPlaceholderPosition &&
+      existPlaceholderPosition.filter(
+        (data) => data.xPosition !== rest.xPosition
+      );
+    //copy all page placeholder at requested position except first page
+    if (newPageNumber === 1 && type === "first") {
+      if (filterPosition && filterPosition.length > 0) {
+        return (obj = {
+          pageNumber: newPageNumber,
+          pos: [...filterPosition]
+        });
+      }
+    }
+    //copy all page placeholder at requested position except  last page
+    else if (newPageNumber === props.allPages && type === "last") {
+      if (existPlaceholderPosition) {
+        return (obj = {
+          pageNumber: newPageNumber,
+          pos: [...filterPosition]
+        });
+      }
+    }
+    //copy all page placeholder at requested position with existing placeholder position
+    else if (existPlaceholderPosition) {
+      return (obj = {
+        pageNumber: newPageNumber,
+        pos: [...filterPosition, rest]
+      });
+    }
+    //copy all page placeholder at requested position
+    else {
+      return (obj = {
+        pageNumber: newPageNumber,
+        pos: [rest]
+      });
+    }
+  };
+
+  //function for copy placeholder as per select copy type
+  const copyPlaceholder = (type) => {
+    let newPlaceholderPosition = [];
+    let newPageNumber = 1;
+    const signerPosition = props.xyPostion;
+
+    //handle placeholder array and copy for multiple signers placeholder at requested location
+    if (props.signerObjId) {
+      //get current signers data
+      const filterSignerPosition = signerPosition.filter(
+        (data) => data.signerObjId === props.signerObjId
+      );
+      //get current pagenumber's all placeholder position data
+      const placeholderPosition = filterSignerPosition[0].placeHolder.filter(
+        (data) => data.pageNumber === props.pageNumber
+      );
+      //get current placeholder position data which user want to copy
+      const currentPlaceholder = placeholderPosition[0].pos.filter(
+        (position) => position.key === props.signKey
+      );
+      const { key, ...rest } = currentPlaceholder[0];
+      for (let i = 0; i < props.allPages; i++) {
+        const newId = randomKey();
+        rest.key = newId;
+        //get exist placeholder position for particular page
+        const existPlaceholder = filterSignerPosition[0].placeHolder.filter(
+          (data) => data.pageNumber == newPageNumber
+        );
+        const existPlaceholderPosition =
+          existPlaceholder[0] && existPlaceholder[0].pos;
+
+        //function for get copy to requested location of placeholder position
+        const getPlaceholderObj = getCopyPlaceholderPosition(
+          type,
+          rest,
+          newPageNumber,
+          existPlaceholderPosition
+        );
+        if (getPlaceholderObj) {
+          newPlaceholderPosition.push(getPlaceholderObj);
+        }
+        newPageNumber++;
+      }
+
+      const updatedSignerPlaceholder = signerPosition.map(
+        (signersData, ind) => {
+          if (signersData.signerObjId === props.signerObjId) {
+            return {
+              ...signersData,
+              placeHolder: newPlaceholderPosition
+            };
+          }
+          return signersData;
+        }
+      );
+
+      const signersData = signerPosition;
+      signersData.splice(0, signerPosition.length, ...updatedSignerPlaceholder);
+      props.setXyPostion(signersData);
+    }
+    //handle signyourself array and copy for single signers placeholder at requested location
+    else {
+      const xyPostion = props.xyPostion;
+
+      const placeholderPosition = xyPostion.filter(
+        (data) => data.pageNumber === props.pageNumber
+      );
+      //get current placeholder position data which user want to copy
+      const currentPlaceholder = placeholderPosition[0].pos.filter(
+        (pos) => pos.key === props.signKey
+      );
+      const { key, ...rest } = currentPlaceholder[0];
+      for (let i = 0; i < props.allPages; i++) {
+        //get exist placeholder position for particular page
+        const existPlaceholder = xyPostion.filter(
+          (data) => data.pageNumber == newPageNumber
+        );
+        const existPlaceholderPosition =
+          existPlaceholder[0] && existPlaceholder[0].pos;
+
+        const newId = randomKey();
+        rest.key = newId;
+        //function for get copy to requested location of placeholder position
+        const getPlaceholderObj = getCopyPlaceholderPosition(
+          type,
+          rest,
+          newPageNumber,
+          existPlaceholderPosition
+        );
+        if (getPlaceholderObj) {
+          newPlaceholderPosition.push(getPlaceholderObj);
+        }
+
+        newPageNumber++;
+      }
+      props.setXyPostion(newPlaceholderPosition);
+    }
+  };
+
+  //function for getting selected type placeholder copy
+  const handleApplyCopy = () => {
+    if (selectCopyType === "All pages") {
+      copyPlaceholder("all");
+    } else if (selectCopyType === "All pages but last") {
+      copyPlaceholder("last");
+    } else if (selectCopyType === "All pages but first") {
+      copyPlaceholder("first");
+    }
+  };
+
+  return (
+    <Modal show={props.isPageCopy}>
+      <ModalHeader style={{ background: themeColor() }}>
+        <span style={{ color: "white" }}>Place All pages</span>
+      </ModalHeader>
+
+      <Modal.Body>
+        {copyType.map((data, key) => {
+          return (
+            <div key={key} style={{ display: "flex", flexDirection: "column" }}>
+              <label key={key} style={{ fontSize: "16px", fontWeight: "500" }}>
+                <input
+                  style={{ accentColor: "red", marginRight: "10px" }}
+                  type="radio"
+                  value={data}
+                  onChange={() => setSelectCopyType(data)}
+                  checked={selectCopyType === data}
+                />
+
+                {data}
+              </label>
+            </div>
+          );
+        })}
+      </Modal.Body>
+
+      <Modal.Footer>
+        <button
+          style={{
+            color: "black"
+          }}
+          type="button"
+          className="finishBtn"
+          onClick={() => props.setIsPageCopy(false)}
+        >
+          Cancel
+        </button>
+
+        <button
+          onClick={() => {
+            handleApplyCopy();
+            props.setIsPageCopy(false);
+          }}
+          style={{
+            background: themeColor()
+          }}
+          type="button"
+          disabled={!selectCopyType}
+          className="finishBtn"
+        >
+          Apply
+        </button>
+      </Modal.Footer>
+    </Modal>
+  );
+}
+
+export default PlaceholderCopy;

microfrontends/SignDocuments/src/Component/component/copyAllPage.js

@@ -1,211 +0,0 @@
-import React, { useState } from "react";
-import Modal from "react-bootstrap/Modal";
-import ModalHeader from "react-bootstrap/esm/ModalHeader";
-import { themeColor } from "../../utils/ThemeColor/backColor";
-
-function CopyAllPage(props) {
-  const allpage = ["All pages", "All pages but last", "All pages but first"];
-  const [selectData, setSelectData] = useState("");
-
-  const randomKey = () => {
-    const randomId = Math.floor(1000 + Math.random() * 9000);
-    return randomId;
-  };
-
-  const allPagesCondition = (
-    isAlreadyPage,
-    type,
-    rest,
-    newPageNumber,
-    getAlreadyPos
-  ) => {
-    let obj;
-
-    if (isAlreadyPage === 1 && type === "first") {
-      const filterPos =
-        getAlreadyPos &&
-        getAlreadyPos.filter((data) => data.xPosition !== rest.xPosition);
-      if (filterPos && filterPos.length > 0) {
-        return (obj = {
-          pageNumber: newPageNumber,
-          pos: [...filterPos]
-        });
-      }
-    } else if (newPageNumber === props.allPages && type === "last") {
-      const filterPos =
-        getAlreadyPos &&
-        getAlreadyPos.filter((data) => data.xPosition !== rest.xPosition);
-
-      if (getAlreadyPos) {
-        return (obj = {
-          pageNumber: newPageNumber,
-          pos: [...filterPos]
-        });
-      }
-    } else if (getAlreadyPos) {
-      const filterPos =
-        getAlreadyPos &&
-        getAlreadyPos.filter((data) => data.xPosition !== rest.xPosition);
-
-      return (obj = {
-        pageNumber: newPageNumber,
-        pos: [...filterPos, rest]
-      });
-    } else {
-      return (obj = {
-        pageNumber: newPageNumber,
-        pos: [rest]
-      });
-    }
-  };
-  const addPos = (type) => {
-    let newXyPos = [];
-    let newPageNumber = 1;
-    const signerPos = props.xyPostion;
-
-    if (props.signerObjId) {
-      const filterSignerPos = signerPos.filter(
-        (data) => data.signerObjId === props.signerObjId
-      );
-      const xyData = filterSignerPos[0].placeHolder.filter(
-        (data) => data.pageNumber === props.pageNumber
-      );
-
-      const posData = xyData[0].pos.filter((pos) => pos.key === props.signKey);
-      for (let i = 0; i < props.allPages; i++) {
-        const { key, ...rest } = posData[0];
-        const newId = randomKey();
-        rest.key = newId;
-        const getAlreadyPos =
-          filterSignerPos[0].placeHolder[i] &&
-          filterSignerPos[0].placeHolder[i].pos;
-
-        const isAlreadyPage =
-          filterSignerPos[0].placeHolder[i] &&
-          filterSignerPos[0].placeHolder[i].pageNumber;
-
-        const getObj = allPagesCondition(
-          isAlreadyPage,
-          type,
-          rest,
-          newPageNumber,
-          getAlreadyPos
-        );
-        if (getObj) {
-          newXyPos.push(getObj);
-        }
-        newPageNumber++;
-      }
-
-      const addSign = signerPos.map((url, ind) => {
-        if (url.signerObjId === props.signerObjId) {
-          return {
-            ...url,
-            placeHolder: newXyPos
-          };
-        }
-        return url;
-      });
-
-      const newSignerData = signerPos;
-      newSignerData.splice(0, signerPos.length, ...addSign);
-      props.setXyPostion(newSignerData);
-    } else {
-      const xyPostion = props.xyPostion;
-
-      const xyData = xyPostion.filter(
-        (data) => data.pageNumber === props.pageNumber
-      );
-      const posData = xyData[0].pos.filter((pos) => pos.key === props.signKey);
-
-      for (let i = 0; i < props.allPages; i++) {
-        const isAlreadyPage = xyPostion[i] && xyPostion[i].pageNumber;
-        const getAlreadyPos = xyPostion[i] && xyPostion[i].pos;
-        const { key, ...rest } = posData[0];
-        const newId = randomKey();
-        rest.key = newId;
-        const getObj = allPagesCondition(
-          isAlreadyPage,
-          type,
-          rest,
-          newPageNumber,
-          getAlreadyPos
-        );
-        if (getObj) {
-          newXyPos.push(getObj);
-        }
-
-        newPageNumber++;
-      }
-      props.setXyPostion(newXyPos);
-    }
-  };
-
-  const applyAllPage = () => {
-    if (selectData === "All pages") {
-      addPos("all");
-    } else if (selectData === "All pages but last") {
-      addPos("last");
-    } else if (selectData === "All pages but first") {
-      addPos("first");
-    }
-  };
-
-  return (
-    <Modal show={props.isPageCopy}>
-      <ModalHeader style={{ background: themeColor() }}>
-        <span style={{ color: "white" }}>Place All pages</span>
-      </ModalHeader>
-
-      <Modal.Body>
-        {allpage.map((data, key) => {
-          return (
-            <div key={key} style={{ display: "flex", flexDirection: "column" }}>
-              <label key={key} style={{ fontSize: "16px", fontWeight: "500" }}>
-                <input
-                  style={{ accentColor: "red", marginRight: "10px" }}
-                  type="radio"
-                  value={data}
-                  onChange={() => setSelectData(data)}
-                  checked={selectData === data}
-                />
-
-                {data}
-              </label>
-            </div>
-          );
-        })}
-      </Modal.Body>
-
-      <Modal.Footer>
-        <button
-          style={{
-            color: "black"
-          }}
-          type="button"
-          className="finishBtn"
-          onClick={() => props.setIsPageCopy(false)}
-        >
-          Cancel
-        </button>
-
-        <button
-          onClick={() => {
-            applyAllPage();
-            props.setIsPageCopy(false);
-          }}
-          style={{
-            background: themeColor()
-          }}
-          type="button"
-          disabled={!selectData}
-          className="finishBtn"
-        >
-          Apply
-        </button>
-      </Modal.Footer>
-    </Modal>
-  );
-}
-
-export default CopyAllPage;

microfrontends/SignDocuments/src/Component/component/placeholderBorder.js

@@ -6,16 +6,6 @@ function PlaceholderBorder(props) {
 
   return (
     <div
-      // onTouchStart={(e) => {
-      //   if (!props.isDragging && props.isMobile) {
-      //     setTimeout(() => {
-      //       e.stopPropagation();
-      //       props.setIsSignPad(true);
-      //       props.setSignKey(props.pos.key);
-      //       props.setIsStamp(props.pos.isStamp);
-      //     }, 500);
-      //   }
-      // }}
       className="borderResize"
       style={{
         borderColor: themeColor(),

microfrontends/SignDocuments/src/Component/component/renderPdf.js

@@ -301,11 +301,11 @@ function RenderPdf({
     );
   };
 
-  const BlockDesign = ({ pos, data }) => {
+  const PlaceholderDesign = ({ pos, data }) => {
     return (
       <div>
         <i
-          class="fa-regular fa-copy signCopy"
+          className="fa-regular fa-copy signCopy"
           onClick={(e) => {
             console.log("hello console");
             e.stopPropagation();
@@ -317,7 +317,7 @@ function RenderPdf({
           }}
         ></i>
         <i
-          class="fa-regular fa-circle-xmark signCloseBtn"
+          className="fa-regular fa-circle-xmark signCloseBtn"
           onClick={(e) => {
             e.stopPropagation();
             if (data) {
@@ -1189,8 +1189,7 @@ function RenderPdf({
                                     >
                                       <BorderResize right={-12} top={-11} />
                                       <PlaceholderBorder pos={pos} />
-
-                                      <BlockDesign pos={pos} />
+                                      <PlaceholderDesign pos={pos} />
                                     </Rnd>
                                   )
                                 );

microfrontends/SignDocuments/src/Component/placeHolderSign.js

@@ -27,7 +27,7 @@ import {
 import RenderPdf from "./component/renderPdf";
 import ModalComponent from "./component/modalComponent";
 import { useNavigate } from "react-router-dom";
-import CopyAllPage from "./component/copyAllPage";
+import PlaceholderCopy from "./component/PlaceholderCopy";
 
 function PlaceHolderSign() {
   const navigate = useNavigate();
@@ -953,7 +953,7 @@ function PlaceHolderSign() {
               type={"signersAlert"}
               setIsShowEmail={setIsShowEmail}
             />
-            <CopyAllPage
+            <PlaceholderCopy
               isPageCopy={isPageCopy}
               setIsPageCopy={setIsPageCopy}
               xyPostion={signerPos}