From 5348c6620a452b6229f8580fd6d8aee2b1c83fb7 Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Fri, 8 Mar 2024 17:51:00 +0530
Subject: [PATCH 01/21] fix: signature widget setting icon for placed with old
 data

---
 apps/OpenSign/src/components/pdf/Placeholder.js | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index f21cb988f..ea8c155f4 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -237,10 +237,12 @@ function Placeholder(props) {
                   }}
                 ></i>
               ) : (
-                props.pos.type !== "date" &&
-                props.pos.type !== "label" &&
-                props.pos.type !== "signature" &&
-                !props.isSignYourself && (
+                ((!props?.pos?.type && props.pos.isStamp) ||
+                  (props?.pos?.type &&
+                    props?.pos?.type !== "date" &&
+                    props?.pos?.type !== "label" &&
+                    props?.pos?.type !== "signature" &&
+                    !props.isSignYourself)) && (
                   <i
                     onClick={(e) => {
                       e.stopPropagation();

From 885b5287b48824404aa68385abb1d6e3256311ad Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Fri, 8 Mar 2024 18:39:02 +0530
Subject: [PATCH 02/21] fix: condition of render setting icon for widgets

---
 apps/OpenSign/src/components/pdf/Placeholder.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index ea8c155f4..2bdf2ed6e 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -239,9 +239,7 @@ function Placeholder(props) {
               ) : (
                 ((!props?.pos?.type && props.pos.isStamp) ||
                   (props?.pos?.type &&
-                    props?.pos?.type !== "date" &&
-                    props?.pos?.type !== "label" &&
-                    props?.pos?.type !== "signature" &&
+                    !["date", "label", "signature"].includes(props.pos.type) &&
                     !props.isSignYourself)) && (
                   <i
                     onClick={(e) => {

From 0e5cffa1fa600fcf4530219d679a465f45cf4ccf Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Mon, 11 Mar 2024 16:59:10 +0530
Subject: [PATCH 03/21] fix: widgets issue after placing on multiple pages

---
 .../src/components/pdf/Placeholder.js         | 97 +++++++++++--------
 .../src/components/pdf/PlaceholderCopy.js     | 14 ++-
 .../src/components/pdf/PlaceholderType.js     | 41 +++++---
 apps/OpenSign/src/components/pdf/RenderPdf.js |  8 +-
 apps/OpenSign/src/constant/Utils.js           | 29 ++++--
 apps/OpenSign/src/pages/PlaceHolderSign.js    | 11 ++-
 6 files changed, 129 insertions(+), 71 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 2bdf2ed6e..b5b524059 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -13,6 +13,8 @@ function Placeholder(props) {
   const [selectDate, setSelectDate] = useState();
   const [dateFormat, setDateFormat] = useState([]);
   const [saveDateFormat, setSaveDateFormat] = useState("");
+
+  const [startDate, setStartDate] = useState();
   const dateFormatArr = [
     "L",
     "DD-MM-YYYY",
@@ -52,36 +54,41 @@ function Placeholder(props) {
     }
   };
 
+  //useEffect for to set date and date format for all flow (signyour-self, request-sign,placeholder,template)
+  //checking if already have data and set else set new date
   useEffect(() => {
     //set default current date and default format MM/dd/yyyy
-    if (props.isSignYourself) {
-      const date = new Date();
-      const milliseconds = date.getTime();
-      const newDate = moment(milliseconds).format("MM/DD/YYYY");
-      const dateObj = {
-        date: newDate,
-        format: "MM/dd/YYYY"
-      };
-      setSelectDate(dateObj);
-    } else {
-      const defaultRes = props?.pos?.options?.response;
-      const defaultFormat = props.pos?.options?.validation?.format;
-      const updateDate = defaultRes
-        ? new Date(props?.pos?.options?.response)
-        : new Date();
-      const dateFormat = defaultFormat ? defaultFormat : "MM/DD/YYYY";
-      const milliseconds = updateDate.getTime();
-      const newDate = moment(milliseconds).format(dateFormat);
-      const dateObj = {
-        date: newDate,
-        format: props.pos?.options?.validation?.format
-          ? props.pos?.options?.validation?.format
-          : "MM/dd/YYYY"
-      };
-      setSelectDate(dateObj);
-    }
+    // if (props.isSignYourself) {
+    //   const date = new Date();
+    //   const milliseconds = date.getTime();
+    //   const newDate = moment(milliseconds).format("MM/DD/YYYY");
+    //   const dateObj = {
+    //     date: newDate,
+    //     format: "MM/dd/YYYY"
+    //   };
+    //   setSelectDate(dateObj);
+    // } else {
+    const defaultRes = props?.pos?.options?.response;
+
+    const defaultFormat = props.pos?.options?.validation?.format;
+    const updateDate = defaultRes
+      ? new Date(props?.pos?.options?.response)
+      : new Date();
+    const dateFormat = defaultFormat ? defaultFormat : "MM/DD/YYYY";
+    const milliseconds = updateDate.getTime();
+    const newDate = moment(milliseconds).format(dateFormat);
+    const dateObj = {
+      date: newDate,
+      format: props.pos?.options?.validation?.format
+        ? props.pos?.options?.validation?.format
+        : "MM/dd/YYYY"
+    };
+    setSelectDate(dateObj);
+    setStartDate(updateDate);
+
+    // }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [props.index]);
 
   //function for add selected date and format in selectFormat
   const changeDateFormat = () => {
@@ -206,13 +213,27 @@ function Placeholder(props) {
       props?.handleNameModal(true);
     }
 
-    if (props.isPlaceholder) {
+    if (props.isPlaceholder && props.type !== "label") {
       props.setUniqueId(props.data.Id);
     }
     props.setSignKey(props.pos.key);
     props.setWidgetType(props.pos.type);
     props.setCurrWidgetsDetails(props.pos);
   };
+  const handleCopyPlaceholder = (e) => {
+    if (props.data && props?.pos?.type !== "label") {
+      props.setSignerObjId(props?.data?.signerObjId);
+      props.setUniqueId(props?.data?.Id);
+    } else if (props.data && props.pos.type === "label") {
+      props.setTempSignerId(props.uniqueId);
+      props.setSignerObjId(props?.data?.signerObjId);
+      props.setUniqueId(props?.data?.Id);
+    }
+    e.stopPropagation();
+    props.setIsPageCopy(true);
+    props.setSignKey(props.pos.key);
+  };
+
   const PlaceholderIcon = () => {
     return (
       props.isShowBorder && (
@@ -365,22 +386,10 @@ function Placeholder(props) {
           <i
             className="fa-regular fa-copy signCopy"
             onClick={(e) => {
-              if (props.data) {
-                props.setSignerObjId(props.data.signerObjId);
-                props.setUniqueId(props.data.Id);
-              }
-              e.stopPropagation();
-              props.setIsPageCopy(true);
-              props.setSignKey(props.pos.key);
+              handleCopyPlaceholder(e);
             }}
             onTouchEnd={(e) => {
-              if (props.data) {
-                props.setSignerObjId(props.data.signerObjId);
-                props.setUniqueId(props.data.Id);
-              }
-              e.stopPropagation();
-              props.setIsPageCopy(true);
-              props.setSignKey(props.pos.key);
+              handleCopyPlaceholder(e);
             }}
             style={{
               color: "#188ae2",
@@ -618,6 +627,8 @@ function Placeholder(props) {
             setSaveDateFormat={setSaveDateFormat}
             saveDateFormat={saveDateFormat}
             setValidateAlert={props.setValidateAlert}
+            setStartDate={setStartDate}
+            startDate={startDate}
           />
         </div>
       ) : (
@@ -643,6 +654,8 @@ function Placeholder(props) {
             setSaveDateFormat={setSaveDateFormat}
             saveDateFormat={saveDateFormat}
             setValidateAlert={props.setValidateAlert}
+            setStartDate={setStartDate}
+            startDate={startDate}
           />
         </>
       )}
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderCopy.js b/apps/OpenSign/src/components/pdf/PlaceholderCopy.js
index 4ae92e18f..b57023bdf 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderCopy.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderCopy.js
@@ -180,7 +180,13 @@ function PlaceholderCopy(props) {
       copyPlaceholder("first");
     }
   };
-
+  const handleUniqueId = () => {
+    if (props.widgetType === "label") {
+      props.setUniqueId(props?.tempSignerId);
+      props.setTempSignerId("");
+    }
+    props.setIsPageCopy(false);
+  };
   return (
     <ModalUi
       isOpen={props.isPageCopy}
@@ -220,7 +226,7 @@ function PlaceholderCopy(props) {
         <button
           onClick={() => {
             handleApplyCopy();
-            props.setIsPageCopy(false);
+            handleUniqueId();
           }}
           style={{ background: themeColor }}
           type="button"
@@ -232,7 +238,9 @@ function PlaceholderCopy(props) {
         <button
           type="button"
           className="finishBtn cancelBtn"
-          onClick={() => props.setIsPageCopy(false)}
+          onClick={() => {
+            handleUniqueId();
+          }}
         >
           Cancel
         </button>
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 795d942bd..5dc0452d3 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -7,10 +7,8 @@ import RegexParser from "regex-parser";
 
 function PlaceholderType(props) {
   const type = props?.pos?.type;
-  const [selectOption, setSelectOption] = useState(
-    props.pos?.options?.defaultValue ? props.pos?.options?.defaultValue : ""
-  );
-  const [startDate, setStartDate] = useState(new Date());
+  const [selectOption, setSelectOption] = useState("");
+
   const [validatePlaceholder, setValidatePlaceholder] = useState("");
   const inputRef = useRef(null);
   const [textValue, setTextValue] = useState();
@@ -89,10 +87,7 @@ function PlaceholderType(props) {
   }
 
   useEffect(() => {
-    if (props.isNeedSign && type === "date") {
-      const updateDate = new Date();
-      setStartDate(updateDate);
-    } else if (type && type === "checkbox" && props.isNeedSign) {
+    if (type && type === "checkbox" && props.isNeedSign) {
       const isDefaultValue = props.pos.options?.defaultValue;
       if (isDefaultValue) {
         setSelectedCheckbox(isDefaultValue);
@@ -103,8 +98,20 @@ function PlaceholderType(props) {
       checkRegularExpress(props.pos?.options?.validation?.type);
     }
     setTextValue(
-      props.pos?.options?.defaultValue ? props.pos?.options?.defaultValue : ""
+      props.pos?.options?.response
+        ? props.pos?.options?.response
+        : props.pos?.options?.defaultValue
+          ? props.pos?.options?.defaultValue
+          : ""
+    );
+    setSelectOption(
+      props.pos?.options?.response
+        ? props.pos?.options?.response
+        : props.pos?.options?.defaultValue
+          ? props.pos?.options?.defaultValue
+          : ""
     );
+
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -135,7 +142,7 @@ function PlaceholderType(props) {
           }
         }
         // const updateDate = new Date(props.saveDateFormat);
-        setStartDate(updateDate);
+        props.setStartDate(updateDate);
         const dateObj = {
           date: props.saveDateFormat,
           format: props.selectDate
@@ -646,17 +653,23 @@ function PlaceholderType(props) {
             className="inputPlaceholder"
             style={{ outlineColor: "#007bff" }}
             selected={
-              startDate
-                ? startDate
+              props?.startDate
+                ? props?.startDate
                 : props.pos.options?.response &&
                   new Date(props.pos.options.response)
             }
             onChange={(date) => {
-              setStartDate(date);
+              props.setStartDate(date);
             }}
             popperPlacement="top-end"
             customInput={<ExampleCustomInput />}
             dateFormat={
+              // props.pos?.options?.validation?.format
+              //   ? props.pos?.options?.validation?.format
+              //   : props.selectDate
+              //   ? props.selectDate?.format
+              //   : "MM/dd/YYYY"
+
               props.selectDate
                 ? props.selectDate?.format
                 : props.pos?.options?.validation?.format
@@ -757,7 +770,9 @@ function PlaceholderType(props) {
         <textarea
           placeholder="Enter label"
           rows={1}
+          value={textValue}
           onChange={(e) => {
+            setTextValue(e.target.value);
             onChangeInput(
               e.target.value,
               props.pos.key,
diff --git a/apps/OpenSign/src/components/pdf/RenderPdf.js b/apps/OpenSign/src/components/pdf/RenderPdf.js
index af72c3729..2ed1493eb 100644
--- a/apps/OpenSign/src/components/pdf/RenderPdf.js
+++ b/apps/OpenSign/src/components/pdf/RenderPdf.js
@@ -56,7 +56,9 @@ function RenderPdf({
   selectWidgetId,
   unSignedWidgetId,
   setIsCheckbox,
-  handleNameModal
+  handleNameModal,
+  setTempSignerId,
+  uniqueId
 }) {
   const isMobile = window.innerWidth < 767;
   const newWidth = containerWH.width;
@@ -393,6 +395,8 @@ function RenderPdf({
                                         setSelectWidgetId={setSelectWidgetId}
                                         selectWidgetId={selectWidgetId}
                                         handleNameModal={handleNameModal}
+                                        setTempSignerId={setTempSignerId}
+                                        uniqueId={uniqueId}
                                       />
                                     </React.Fragment>
                                   );
@@ -574,6 +578,8 @@ function RenderPdf({
                                           setSelectWidgetId={setSelectWidgetId}
                                           selectWidgetId={selectWidgetId}
                                           handleNameModal={handleNameModal}
+                                          setTempSignerId={setTempSignerId}
+                                          uniqueId={uniqueId}
                                         />
                                       </React.Fragment>
                                     );
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index ceb828315..088424b19 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -692,13 +692,27 @@ export const onChangeInput = (
 
     const updatePosition = getXYdata.map((positionData) => {
       if (positionData.key === signKey) {
-        return {
-          ...positionData,
-          options: {
-            ...positionData.options,
-            response: value
-          }
-        };
+        if (dateFormat) {
+          return {
+            ...positionData,
+            options: {
+              ...positionData.options,
+              response: value,
+              validation: {
+                type: "date-format",
+                format: dateFormat // This indicates the required date format explicitly.
+              }
+            }
+          };
+        } else {
+          return {
+            ...positionData,
+            options: {
+              ...positionData.options,
+              response: value
+            }
+          };
+        }
       }
       return positionData;
     });
@@ -970,7 +984,6 @@ export const multiSignEmbed = async (
     } else {
       updateItem = item.pos;
     }
-
     const newWidth = containerWH.width;
     const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
     const pageNo = item.pageNumber;
diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js
index 9b46961c8..557b12abf 100644
--- a/apps/OpenSign/src/pages/PlaceHolderSign.js
+++ b/apps/OpenSign/src/pages/PlaceHolderSign.js
@@ -76,6 +76,7 @@ function PlaceHolderSign() {
   const [isResize, setIsResize] = useState(false);
   const [zIndex, setZIndex] = useState(1);
   const [signKey, setSignKey] = useState();
+  const [tempSignerId, setTempSignerId] = useState("");
   const [pdfLoadFail, setPdfLoadFail] = useState({
     status: false,
     type: "load"
@@ -380,7 +381,6 @@ function PlaceHolderSign() {
           pos: dropData
         };
       }
-
       setSelectWidgetId(key);
       if (signer) {
         let filterSignerPos;
@@ -391,7 +391,6 @@ function PlaceHolderSign() {
         }
 
         const { blockColor, Role } = signer;
-
         //adding placholder in existing signer pos array (placaholder)
         if (filterSignerPos.length > 0) {
           const getPlaceHolder = filterSignerPos[0].placeHolder;
@@ -442,7 +441,6 @@ function PlaceHolderSign() {
           }
         } else {
           //adding new placeholder for selected signer in pos array (placeholder)
-          // const signerData = signerPos;
           let placeHolderPos;
           if (dragTypeValue === "label") {
             placeHolderPos = {
@@ -1553,8 +1551,11 @@ function PlaceHolderSign() {
                 allPages={allPages}
                 pageNumber={pageNumber}
                 signKey={signKey}
-                // signerObjId={signerObjId}
                 Id={uniqueId}
+                widgetType={widgetType}
+                setUniqueId={setUniqueId}
+                tempSignerId={tempSignerId}
+                setTempSignerId={setTempSignerId}
               />
               <DropdownWidgetOption
                 type="radio"
@@ -1639,6 +1640,8 @@ function PlaceHolderSign() {
                     setSelectWidgetId={setSelectWidgetId}
                     selectWidgetId={selectWidgetId}
                     handleNameModal={setIsNameModal}
+                    setTempSignerId={setTempSignerId}
+                    uniqueId={uniqueId}
                   />
                 )}
               </div>

From 51505af6d80bf66d8c3df1b181e2388c11b9bab9 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Mon, 11 Mar 2024 17:35:20 +0530
Subject: [PATCH 04/21] fix: E-sign is not available in completed document

---
 apps/OpenSign/package.json                    |   2 +-
 .../cloud/parsefunction/pdf/PDF.min.js        | 163 ++++++++++--------
 .../pdf/customSignPdf/SignPdfError.min.js     |  21 ++-
 .../customSignPdf/pdflibplaceholder.min.js    |  87 ++++++++++
 apps/OpenSignServer/package-lock.json         |   8 +-
 apps/OpenSignServer/package.json              |   2 +-
 6 files changed, 200 insertions(+), 83 deletions(-)
 create mode 100644 apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/pdflibplaceholder.min.js

diff --git a/apps/OpenSign/package.json b/apps/OpenSign/package.json
index b77c268de..80baff0ab 100644
--- a/apps/OpenSign/package.json
+++ b/apps/OpenSign/package.json
@@ -48,7 +48,7 @@
   },
   "scripts": {
     "start": "serve -s build",
-    "start-dev" :"react-scripts start",
+    "start-dev": "react-scripts start",
     "version": "curl -s https://api.github.com/repos/opensignlabs/opensign/releases/latest | grep '\"tag_name\":' | awk -F '\"' '{print $4}' > ./public/version.txt",
     "version-win": "powershell -Command \"Invoke-RestMethod -Uri 'https://api.github.com/repos/opensignlabs/opensign/releases/latest' | Select-Object -ExpandProperty tag_name | Out-File -FilePath ./public/version.txt\"",
     "build": "npm run version && react-scripts build",
diff --git a/apps/OpenSignServer/cloud/parsefunction/pdf/PDF.min.js b/apps/OpenSignServer/cloud/parsefunction/pdf/PDF.min.js
index 85d56af52..166f4449e 100644
--- a/apps/OpenSignServer/cloud/parsefunction/pdf/PDF.min.js
+++ b/apps/OpenSignServer/cloud/parsefunction/pdf/PDF.min.js
@@ -1,7 +1,8 @@
 import SignPDF from './SignPDF.min.cjs';
 import fs from 'node:fs';
 import axios from 'axios';
-import { plainAddPlaceholder } from 'node-signpdf/dist/helpers/index.js';
+import { pdflibAddPlaceholder } from './customSignPdf/pdflibplaceholder.min.js';
+import { PDFDocument } from 'pdf-lib';
 const serverUrl = process.env.SERVER_URL,
   APPID = process.env.APP_ID,
   masterKEY = process.env.MASTER_KEY;
@@ -15,20 +16,20 @@ async function uploadFile(e, a) {
     console.log('Err ', e), fs.unlinkSync(a);
   }
 }
-async function updateDoc(t, s, r, i, n, o) {
+async function updateDoc(t, s, r, i, o, n) {
   try {
     var d = {
-      UserPtr: { __type: 'Pointer', className: o, objectId: r },
+      UserPtr: { __type: 'Pointer', className: n, objectId: r },
       SignedUrl: s,
       Activity: 'Signed',
       ipAddress: i,
     };
     let e;
-    var l = (e = n.AuditTrail && 0 < n.AuditTrail.length ? [...n.AuditTrail, d] : [d]).filter(
+    var l = (e = o.AuditTrail && 0 < o.AuditTrail.length ? [...o.AuditTrail, d] : [d]).filter(
       e => 'Signed' === e.Activity
     );
     let a = !1;
-    !((n.Signers && 0 < n.Signers.length && l.length !== n.Signers.length) || !(a = !0));
+    !((o.Signers && 0 < o.Signers.length && l.length !== o.Signers.length) || !(a = !0));
     var c = { SignedUrl: s, AuditTrail: e, IsCompleted: a };
     await axios.put(serverUrl + '/classes/contracts_Document/' + t, c, {
       headers: {
@@ -150,9 +151,8 @@ async function sendDoctoWebhook(t, e, a, s) {
           }
         }));
 }
-async function PDF(i, n) {
+async function PDF(i) {
   try {
-    i.params.sign;
     var e = i.params.docId,
       a = i.params.userId,
       o = await axios.get(
@@ -173,125 +173,136 @@ async function PDF(i, n) {
       });
     if (!t.data || !t.data.objectId) return { status: 'error', message: 'this user not allowed!' };
     {
-      var d,
+      var n,
+        d,
         l,
-        c,
-        p = JSON.stringify({ objectId: a });
+        c = JSON.stringify({ objectId: a });
       let s, r;
       r = a
-        ? (d = await axios.get(serverUrl + '/classes/contracts_Contactbook?where=' + p, {
+        ? (n = await axios.get(serverUrl + '/classes/contracts_Contactbook?where=' + c, {
             headers: {
               'X-Parse-Application-Id': APPID,
               'X-Parse-Session-Token': i.headers.sessiontoken,
             },
-          })).data && 0 < d.data.results.length
-          ? ((s = d), 'contracts_Contactbook')
-          : ((s = await axios.get(serverUrl + '/classes/contracts_Users?where=' + p, {
+          })).data && 0 < n.data.results.length
+          ? ((s = n), 'contracts_Contactbook')
+          : ((s = await axios.get(serverUrl + '/classes/contracts_Users?where=' + c, {
               headers: { 'X-Parse-Application-Id': APPID, 'X-Parse-Master-Key': masterKEY },
             })),
             'contracts_Users')
-        : ((l = JSON.stringify({
+        : ((d = JSON.stringify({
             UserId: { __type: 'Pointer', className: '_User', objectId: t.data.objectId },
           })),
-          (c = await axios.get(serverUrl + '/classes/contracts_Users?where=' + l, {
+          (l = await axios.get(serverUrl + '/classes/contracts_Users?where=' + d, {
             headers: { 'X-Parse-Application-Id': APPID, 'X-Parse-Master-Key': masterKEY },
-          })).data && 0 < c.data.results.length
-            ? ((s = c), 'contracts_Users')
-            : ((s = await axios.get(serverUrl + '/classes/contracts_Contactbook?where=' + l, {
+          })).data && 0 < l.data.results.length
+            ? ((s = l), 'contracts_Users')
+            : ((s = await axios.get(serverUrl + '/classes/contracts_Contactbook?where=' + d, {
                 headers: {
                   'X-Parse-Application-Id': APPID,
                   'X-Parse-Session-Token': i.headers.sessiontoken,
                 },
               })),
               'contracts_Contactbook'));
-      var m = s.data.results[0].Name,
-        g = s.data.results[0].Email;
+      var p = s.data.results[0].Name,
+        m = s.data.results[0].Email;
       if (!i.params.pdfFile) return { status: 'error', message: 'pdf file not present!' };
       {
         let e = Buffer.from(i.params.pdfFile, 'base64');
-        var h = process.env.PFX_BASE64,
-          u = Buffer.from(h, 'base64'),
-          f = {
+        var g = process.env.PFX_BASE64,
+          h = Buffer.from(g, 'base64'),
+          u = {
             UserPtr: { __type: 'Pointer', className: r, objectId: s.data.results[0].objectId },
             SignedUrl: '',
             Activity: 'Signed',
             ipAddress: i.headers['x-real-ip'],
           };
         let a;
-        var y = (a =
+        var f = (a =
           o.data.AuditTrail && 0 < o.data.AuditTrail.length
-            ? [...o.data.AuditTrail, f]
-            : [f]).filter(e => 'Signed' === e.Activity);
+            ? [...o.data.AuditTrail, u]
+            : [u]).filter(e => 'Signed' === e.Activity);
         let t = !1;
         !(
-          (o.data.Signers && 0 < o.data.Signers.length && y.length !== o.data.Signers.length) ||
+          (o.data.Signers && 0 < o.data.Signers.length && f.length !== o.data.Signers.length) ||
           !(t = !0)
         );
-        var v,
+        var y,
           P,
-          b = `exported_file_${Math.floor(5e3 * Math.random())}.pdf`,
-          x = './exports/' + b,
-          U =
+          v,
+          b,
+          x,
+          w,
+          U,
+          I,
+          S,
+          A = `exported_file_${Math.floor(5e3 * Math.random())}.pdf`,
+          D = './exports/' + A,
+          E =
             (t
-              ? ((v = o.data.Signers?.map(e => e.Name + ' <' + e.Email + '>')),
+              ? ((y = o.data.Signers?.map(e => e.Name + ' <' + e.Email + '>')),
                 (e =
-                  v && 0 < v.length
-                    ? plainAddPlaceholder({
-                        pdfBuffer: e,
-                        reason: 'Digitally signed by OpenSign for ' + v?.join(', '),
+                  y && 0 < y.length
+                    ? ((P = await PDFDocument.load(e)),
+                      pdflibAddPlaceholder({
+                        pdfDoc: P,
+                        reason: 'Digitally signed by OpenSign for ' + y?.join(', '),
                         location: 'location',
-                        signatureLength: 1e4,
-                      })
-                    : plainAddPlaceholder({
-                        pdfBuffer: e,
-                        reason: 'Digitally signed by OpenSign for ' + m + ' <' + g + '>',
+                        signatureLength: 15e3,
+                      }),
+                      (v = await P.save()),
+                      Buffer.from(v))
+                    : ((b = await PDFDocument.load(e)),
+                      pdflibAddPlaceholder({
+                        pdfDoc: b,
+                        reason: 'Digitally signed by OpenSign for ' + p + ' <' + m + '>',
                         location: 'location',
-                        signatureLength: 1e4,
-                      })),
-                (P = await new SignPDF(e, u).signPDF()),
-                fs.writeFileSync(x, P))
-              : fs.writeFileSync(x, e),
-            await uploadFile(b, x));
-        if (U && U.imageUrl) {
-          const n = await updateDoc(
-            i.params.docId,
-            U.imageUrl,
-            s.data.results[0].objectId,
-            i.headers['x-real-ip'],
-            o.data,
-            r
-          );
-          var I,
-            w = {
-              url: U.imageUrl,
+                        signatureLength: 15e3,
+                      }),
+                      (x = await b.save()),
+                      Buffer.from(x))),
+                (w = await new SignPDF(e, h).signPDF()),
+                fs.writeFileSync(D, w))
+              : fs.writeFileSync(D, e),
+            await uploadFile(A, D));
+        if (E && E.imageUrl)
+          return (
+            (U = await updateDoc(
+              i.params.docId,
+              E.imageUrl,
+              s.data.results[0].objectId,
+              i.headers['x-real-ip'],
+              o.data,
+              r
+            )),
+            (I = {
+              url: E.imageUrl,
               sender: { Mail: o.data.ExtUserPtr.Email, Name: o.data.ExtUserPtr.Name },
               pdfName: o.data.Name,
-              receiver: g,
-            };
-          return (
+              receiver: m,
+            }),
             o.data.IsSendMail && !1 === o.data.IsSendMail
               ? console.log("don't send mail")
-              : sendMail(w),
-            sendDoctoWebhook(o, U.imageUrl, 'signed', s?.data.results?.[0]),
-            n &&
-              n.isCompleted &&
-              ((I = {
-                url: U.imageUrl,
+              : sendMail(I),
+            sendDoctoWebhook(o, E.imageUrl, 'signed', s?.data.results?.[0]),
+            U &&
+              U.isCompleted &&
+              ((S = {
+                url: E.imageUrl,
                 sender: { Mail: o.data.ExtUserPtr.Email, Name: 'OpenSign™' },
                 pdfName: o.data.Name,
                 receiver: o.data.ExtUserPtr.Email,
               }),
               o.data.IsSendMail && !1 === o.data.IsSendMail
                 ? console.log("don't send mail")
-                : sendCompletedMail(I),
-              sendDoctoWebhook(o, U.imageUrl, 'completed')),
-            fs.unlinkSync(x),
-            console.log('New Signed PDF created called: ' + x),
-            'success' === n.message
-              ? { status: 'success', data: U.imageUrl }
+                : sendCompletedMail(S),
+              sendDoctoWebhook(o, E.imageUrl, 'completed')),
+            fs.unlinkSync(D),
+            console.log('New Signed PDF created called: ' + D),
+            'success' === U.message
+              ? { status: 'success', data: E.imageUrl }
               : { status: 'error', message: 'please provide required parameters!' }
           );
-        }
       }
     }
   } catch (e) {
diff --git a/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/SignPdfError.min.js b/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/SignPdfError.min.js
index 54ea42ede..4557aca9f 100644
--- a/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/SignPdfError.min.js
+++ b/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/SignPdfError.min.js
@@ -1 +1,20 @@
-const ERROR_TYPE_UNKNOWN=1,ERROR_TYPE_INPUT=2,ERROR_TYPE_PARSE=3,ERROR_VERIFY_SIGNATURE=4;class SignPdfError extends Error{constructor(R,E=ERROR_TYPE_UNKNOWN){super(R),this.type=E}}SignPdfError.TYPE_UNKNOWN=ERROR_TYPE_UNKNOWN,SignPdfError.TYPE_INPUT=ERROR_TYPE_INPUT,SignPdfError.TYPE_PARSE=ERROR_TYPE_PARSE,SignPdfError.VERIFY_SIGNATURE=ERROR_VERIFY_SIGNATURE;export default SignPdfError;export{ERROR_TYPE_UNKNOWN,ERROR_TYPE_INPUT,ERROR_TYPE_PARSE,ERROR_VERIFY_SIGNATURE};
\ No newline at end of file
+const ERROR_TYPE_UNKNOWN = 1,
+  ERROR_TYPE_INPUT = 2,
+  ERROR_TYPE_PARSE = 3,
+  ERROR_VERIFY_SIGNATURE = 4;
+class SignPdfError extends Error {
+  constructor(R, E = ERROR_TYPE_UNKNOWN) {
+    super(R), (this.type = E);
+  }
+}
+(SignPdfError.TYPE_UNKNOWN = ERROR_TYPE_UNKNOWN),
+  (SignPdfError.TYPE_INPUT = ERROR_TYPE_INPUT),
+  (SignPdfError.TYPE_PARSE = ERROR_TYPE_PARSE),
+  (SignPdfError.VERIFY_SIGNATURE = ERROR_VERIFY_SIGNATURE);
+export {
+  ERROR_TYPE_UNKNOWN,
+  ERROR_TYPE_INPUT,
+  ERROR_TYPE_PARSE,
+  ERROR_VERIFY_SIGNATURE,
+  SignPdfError,
+};
diff --git a/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/pdflibplaceholder.min.js b/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/pdflibplaceholder.min.js
new file mode 100644
index 000000000..610e5012d
--- /dev/null
+++ b/apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/pdflibplaceholder.min.js
@@ -0,0 +1,87 @@
+import {
+  DEFAULT_BYTE_RANGE_PLACEHOLDER,
+  DEFAULT_SIGNATURE_LENGTH,
+  SUBFILTER_ADOBE_PKCS7_DETACHED,
+} from './const.min.js';
+import { SignPdfError } from './SignPdfError.min.js';
+import {
+  PDFArray,
+  PDFDict,
+  PDFHexString,
+  PDFName,
+  PDFNumber,
+  PDFInvalidObject,
+  PDFString,
+} from 'pdf-lib';
+const pdflibAddPlaceholder = ({
+  pdfDoc: e = void 0,
+  pdfPage: o = void 0,
+  reason: t,
+  contactInfo: r = 'emailfromp1289@gmail.com',
+  name: i = 'Name from p12',
+  location: n,
+  signingTime: a = void 0,
+  signatureLength: P = DEFAULT_SIGNATURE_LENGTH,
+  byteRangePlaceholder: F = DEFAULT_BYTE_RANGE_PLACEHOLDER,
+  subFilter: D = SUBFILTER_ADOBE_PKCS7_DETACHED,
+  widgetRect: f = [0, 0, 0, 0],
+  appName: g = void 0,
+}) => {
+  if (void 0 === e && void 0 === o)
+    throw new SignPdfError('PDFDoc or PDFPage must be set.', SignPdfError.TYPE_INPUT);
+  var e = e ?? o.doc,
+    o = o ?? e.getPages()[0],
+    m = PDFArray.withContext(e.context),
+    F =
+      (m.push(PDFNumber.of(0)),
+      m.push(PDFName.of(F)),
+      m.push(PDFName.of(F)),
+      m.push(PDFName.of(F)),
+      PDFHexString.of(String.fromCharCode(0).repeat(P))),
+    P = g ? { App: { Name: g } } : {},
+    g = e.context.obj({
+      Type: 'Sig',
+      Filter: 'Adobe.PPKLite',
+      SubFilter: D,
+      ByteRange: m,
+      Contents: F,
+      Reason: PDFString.of(t),
+      M: PDFString.fromDate(a ?? new Date()),
+      ContactInfo: PDFString.of(r),
+      Name: PDFString.of(i),
+      Location: PDFString.of(n),
+      Prop_Build: { Filter: { Name: 'Adobe.PPKLite' }, ...P },
+    }),
+    D = new Uint8Array(g.sizeInBytes()),
+    m = (g.copyBytesInto(D, 0), PDFInvalidObject.of(D)),
+    F = e.context.register(m);
+  const s = PDFArray.withContext(e.context);
+  f.forEach(e => s.push(PDFNumber.of(e)));
+  (t = e.context.formXObject([], { BBox: f, Resources: {} })),
+    (a = e.context.obj({
+      Type: 'Annot',
+      Subtype: 'Widget',
+      FT: 'Sig',
+      Rect: s,
+      V: F,
+      T: PDFString.of('Signature1'),
+      F: 4,
+      P: o.ref,
+      AP: { N: e.context.register(t) },
+    })),
+    (r = e.context.register(a));
+  let c = o.node.lookupMaybe(PDFName.of('Annots'), PDFArray),
+    d =
+      ((c = void 0 === c ? e.context.obj([]) : c).push(r),
+      o.node.set(PDFName.of('Annots'), c),
+      e.catalog.lookupMaybe(PDFName.of('AcroForm'), PDFDict));
+  void 0 === d &&
+    ((d = e.context.obj({ Fields: [] })),
+    (i = e.context.register(d)),
+    e.catalog.set(PDFName.of('AcroForm'), i));
+  let N;
+  N = d.has(PDFName.of('SigFlags')) ? d.get(PDFName.of('SigFlags')) : PDFNumber.of(0);
+  n = PDFNumber.of(3 | N.asNumber());
+  d.set(PDFName.of('SigFlags'), n), d.get(PDFName.of('Fields')).push(r);
+};
+export { pdflibAddPlaceholder };
diff --git a/apps/OpenSignServer/package-lock.json b/apps/OpenSignServer/package-lock.json
index e32a872a0..ff47aa212 100644
--- a/apps/OpenSignServer/package-lock.json
+++ b/apps/OpenSignServer/package-lock.json
@@ -32,7 +32,7 @@
         "parse-server-api-mail-adapter": "^3.1.1",
         "parse-server-fs-adapter": "1.0.1",
         "parse-server-s3-adapter": "^1.2.0",
-        "pdf-lib": "^1.16.0",
+        "pdf-lib": "^1.17.1",
         "pdfkit": "^0.13.0",
         "posthog-node": "^3.6.2",
         "razorpay": "^2.8.6",
@@ -7025,9 +7025,9 @@
       "integrity": "sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ=="
     },
     "node_modules/pdf-lib": {
-      "version": "1.16.0",
-      "resolved": "https://registry.npmjs.org/pdf-lib/-/pdf-lib-1.16.0.tgz",
-      "integrity": "sha512-P/1SSmElOBKrPlbc+Sn7UxikRQbzVA64+4Dh6/uczPscvq/NatP9eryoOguyBTpTnzICNiG8EnMH4Ziqp2TnFA==",
+      "version": "1.17.1",
+      "resolved": "https://registry.npmjs.org/pdf-lib/-/pdf-lib-1.17.1.tgz",
+      "integrity": "sha512-V/mpyJAoTsN4cnP31vc0wfNA1+p20evqqnap0KLoRUN0Yk/p3wN52DOEsL4oBFcLdb76hlpKPtzJIgo67j/XLw==",
       "dependencies": {
         "@pdf-lib/standard-fonts": "^1.0.0",
         "@pdf-lib/upng": "^1.0.1",
diff --git a/apps/OpenSignServer/package.json b/apps/OpenSignServer/package.json
index c5cb6d1b7..c3c8dd7e5 100644
--- a/apps/OpenSignServer/package.json
+++ b/apps/OpenSignServer/package.json
@@ -41,7 +41,7 @@
     "parse-server-api-mail-adapter": "^3.1.1",
     "parse-server-fs-adapter": "1.0.1",
     "parse-server-s3-adapter": "^1.2.0",
-    "pdf-lib": "^1.16.0",
+    "pdf-lib": "^1.17.1",
     "pdfkit": "^0.13.0",
     "posthog-node": "^3.6.2",
     "razorpay": "^2.8.6",

From b94e0fa0529b25a6d7e98d1b013bad5ac0fc4fde Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Tue, 12 Mar 2024 16:50:50 +0530
Subject: [PATCH 05/21] refactor: change order of minimum & maximum input in
 checkbox setting

---
 .../components/pdf/DropdownWidgetOption.js    |  61 ++++---
 .../src/components/pdf/Placeholder.js         | 165 +++++++++++-------
 .../src/components/pdf/PlaceholderType.js     |  14 +-
 3 files changed, 141 insertions(+), 99 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
index 19d616dc9..1d8a075cf 100644
--- a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
+++ b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
@@ -178,36 +178,6 @@ function DropdownWidgetOption(props) {
               className="drodown-input"
             />
 
-            {props.type === "checkbox" && !props.isSignYourself && (
-              <>
-                <label style={{ fontSize: "13px", fontWeight: "600" }}>
-                  Minimun check
-                </label>
-                <input
-                  required
-                  defaultValue={0}
-                  value={minCount}
-                  onChange={(e) => {
-                    const count = handleSetMinMax(e);
-                    setMinCount(count);
-                  }}
-                  className="drodown-input"
-                />
-                <label style={{ fontSize: "13px", fontWeight: "600" }}>
-                  Maximum check
-                </label>
-                <input
-                  required
-                  defaultValue={0}
-                  value={maxCount}
-                  onChange={(e) => {
-                    const count = handleSetMinMax(e);
-                    setMaxCount(count);
-                  }}
-                  className="drodown-input"
-                />
-              </>
-            )}
             <label
               style={{ fontSize: "13px", fontWeight: "600", marginTop: "5px" }}
             >
@@ -274,7 +244,6 @@ function DropdownWidgetOption(props) {
                   ></i>
                 </div>
               ))}
-
               <i
                 onClick={handleAddInput}
                 style={{
@@ -285,6 +254,36 @@ function DropdownWidgetOption(props) {
                 }}
                 className="fa-solid fa-square-plus"
               ></i>
+              {props.type === "checkbox" && !props.isSignYourself && (
+                <>
+                  <label style={{ fontSize: "13px", fontWeight: "600" }}>
+                    Minimun check
+                  </label>
+                  <input
+                    required
+                    defaultValue={0}
+                    value={minCount}
+                    onChange={(e) => {
+                      const count = handleSetMinMax(e);
+                      setMinCount(count);
+                    }}
+                    className="drodown-input"
+                  />
+                  <label style={{ fontSize: "13px", fontWeight: "600" }}>
+                    Maximum check
+                  </label>
+                  <input
+                    required
+                    defaultValue={0}
+                    value={maxCount}
+                    onChange={(e) => {
+                      const count = handleSetMinMax(e);
+                      setMaxCount(count);
+                    }}
+                    className="drodown-input"
+                  />
+                </>
+              )}
             </div>
             {["dropdown", "radio"].includes(props.type) && (
               <>
diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index b5b524059..08e121c3e 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -7,14 +7,78 @@ import PlaceholderType from "./PlaceholderType";
 import moment from "moment";
 import "../../styles/opensigndrive.css";
 
+const selectFormat = (data) => {
+  switch (data) {
+    case "L":
+      return "MM/dd/yyyy";
+    case "DD-MM-YYYY":
+      return "dd-MM-yyyy";
+    case "DD/MM/YYYY":
+      return "dd/MM/yyyy";
+    case "LL":
+      return "MMMM dd, yyyy";
+    case "DD MMM, YYYY":
+      return "dd MMM, yyyy";
+    case "YYYY-MM-DD":
+      return "yyyy-MM-dd";
+    case "MM-DD-YYYY":
+      return "MM-dd-yyyy";
+    case "MM.DD.YYYY":
+      return "MM.dd.yyyy";
+    case "MMM DD, YYYY":
+      return "MMM dd, yyyy";
+    case "DD MMMM, YYYY":
+      return "dd MMMM, yyyy";
+    default:
+      return "MM/dd/yyyy";
+  }
+};
+
+const changeDateToMomentFormat = (format) => {
+  switch (format) {
+    case "MM/dd/yyyy":
+      return "L";
+    case "dd-MM-yyyy":
+      return "DD-MM-YYYY";
+    case "dd/MM/yyyy":
+      return "DD/MM/YYYY";
+    case "MMMM dd, yyyy":
+      return "LL";
+    case "dd MMM, yyyy":
+      return "DD MMM, YYYY";
+    case "yyyy-MM-dd":
+      return "YYYY-MM-DD";
+    case "MM-dd-yyyy":
+      return "MM-DD-YYYY";
+    case "MM.dd.yyyy":
+      return "MM.DD.YYYY";
+    case "MMM dd, yyyy":
+      return "MMM DD, YYYY";
+    case "dd MMMM, yyyy":
+      return "DD MMMM, YYYY";
+    default:
+      return "L";
+  }
+};
+
+const getDefaultdate = (selectedDate) =>
+  selectedDate ? new Date(selectedDate) : new Date();
+const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
+
 function Placeholder(props) {
   const [isDraggingEnabled, setDraggingEnabled] = useState(true);
   const [isShowDateFormat, setIsShowDateFormat] = useState(false);
-  const [selectDate, setSelectDate] = useState();
+  const [selectDate, setSelectDate] = useState({
+    date: moment(
+      getDefaultdate(props?.pos?.options?.response).getTime()
+    ).format(changeDateToMomentFormat(props.pos?.options?.validation?.format)),
+    format: getDefaultFormat(props.pos?.options?.validation?.format)
+  });
   const [dateFormat, setDateFormat] = useState([]);
   const [saveDateFormat, setSaveDateFormat] = useState("");
-
-  const [startDate, setStartDate] = useState();
+  const [startDate, setStartDate] = useState(
+    getDefaultdate(props?.pos?.options?.response)
+  );
   const dateFormatArr = [
     "L",
     "DD-MM-YYYY",
@@ -27,71 +91,41 @@ function Placeholder(props) {
     "DD MMMM, YYYY"
   ];
 
-  const selectFormat = (data) => {
-    switch (data) {
-      case "L":
-        return "MM/dd/yyyy";
-      case "DD-MM-YYYY":
-        return "dd-MM-yyyy";
-      case "DD/MM/YYYY":
-        return "dd/MM/yyyy";
-      case "LL":
-        return "MMMM dd, yyyy";
-      case "DD MMM, YYYY":
-        return "dd MMM, YYYY";
-      case "YYYY-MM-DD":
-        return "YYYY-MM-dd";
-      case "MM-DD-YYYY":
-        return "MM-dd-YYYY";
-      case "MM.DD.YYYY":
-        return "MM.dd.YYYY";
-      case "MMM DD, YYYY":
-        return "MMM dd, YYYY";
-      case "DD MMMM, YYYY":
-        return "dd MMMM, YYYY";
-      default:
-        return "dd/MM/yyyy";
-    }
-  };
+  // console.log('props.pos',props.pos?.options?.validation?.format)
 
   //useEffect for to set date and date format for all flow (signyour-self, request-sign,placeholder,template)
   //checking if already have data and set else set new date
-  useEffect(() => {
-    //set default current date and default format MM/dd/yyyy
-    // if (props.isSignYourself) {
-    //   const date = new Date();
-    //   const milliseconds = date.getTime();
-    //   const newDate = moment(milliseconds).format("MM/DD/YYYY");
-    //   const dateObj = {
-    //     date: newDate,
-    //     format: "MM/dd/YYYY"
-    //   };
-    //   setSelectDate(dateObj);
-    // } else {
-    const defaultRes = props?.pos?.options?.response;
-
-    const defaultFormat = props.pos?.options?.validation?.format;
-    const updateDate = defaultRes
-      ? new Date(props?.pos?.options?.response)
-      : new Date();
-    const dateFormat = defaultFormat ? defaultFormat : "MM/DD/YYYY";
-    const milliseconds = updateDate.getTime();
-    const newDate = moment(milliseconds).format(dateFormat);
-    const dateObj = {
-      date: newDate,
-      format: props.pos?.options?.validation?.format
-        ? props.pos?.options?.validation?.format
-        : "MM/dd/YYYY"
-    };
-    setSelectDate(dateObj);
-    setStartDate(updateDate);
+  // useEffect(() => {
+  //   console.log('go here')
+  //   //set default current date and default format MM/dd/yyyy
+  //   const defaultFormat = props.pos?.options?.validation?.format;
+  //   const updateDate = props?.pos?.options?.response
+  //     ? new Date(props?.pos?.options?.response)
+  //     : new Date();
+  //   //DD-mm-YYYY
+  //   const dateFormat = defaultFormat && defaultFormat;
+  //   // const isMomentType = dateFormat && dateFormat === "MM/dd/YYYY";
+  //   // const selectMomentFormat = isMomentType ?  "MM/DD/YYYY" : dateFormat;
+  //   const selectMomentFormat = changeDateToMomentFormat(dateFormat);
 
-    // }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [props.index]);
+  //   // const isFormatType = dateFormat && dateFormat === "MM/dd/YYYY";
+  //   const getFormat = dateFormat || "MM/dd/yyyy";
+  //   const milliseconds = updateDate.getTime();
+  //   const newDate = moment(milliseconds).format(selectMomentFormat);
+  //   // console.log('new date',newDate)
+  //   const dateObj = {
+  //     date: newDate,
+  //     format: getFormat
+  //   };
+  //   console.log("dateobj selectdate useEffect", dateObj);
+  //   setSelectDate(dateObj);
+  //   setStartDate(updateDate);
+  //   // eslint-disable-next-line react-hooks/exhaustive-deps
+  // }, []);
 
-  //function for add selected date and format in selectFormat
+  //function change format array list with selected date and format
   const changeDateFormat = () => {
+    // console.log("selected date", selectDate);
     const updateDate = [];
     dateFormatArr.map((data) => {
       let date;
@@ -102,17 +136,24 @@ function Placeholder(props) {
         date = new Date(selectDate?.date);
       }
       const milliseconds = date.getTime();
+      // console.log('data',data)
       const newDate = moment(milliseconds).format(data);
+      // console.log('new date',newDate)
       const dateObj = {
         date: newDate,
         format: selectFormat(data)
       };
+      // console.log('dateobj',dateObj)
       updateDate.push(dateObj);
     });
+    // console.log('updated format',updateDate)
     setDateFormat(updateDate);
   };
+
+  // console.log("selected date", selectDate);
   useEffect(() => {
     if (props.isPlaceholder || props.isSignYourself) {
+      // console.log("selected date useEffect", selectDate);
       selectDate && changeDateFormat();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 5dc0452d3..7aa433107 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -8,7 +8,6 @@ import RegexParser from "regex-parser";
 function PlaceholderType(props) {
   const type = props?.pos?.type;
   const [selectOption, setSelectOption] = useState("");
-
   const [validatePlaceholder, setValidatePlaceholder] = useState("");
   const inputRef = useRef(null);
   const [textValue, setTextValue] = useState();
@@ -129,11 +128,13 @@ function PlaceholderType(props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.pos?.options?.defaultValue]);
 
+  //useEffect to save date and format on local array
   useEffect(() => {
     if (type && type === "date") {
-      if (props.selectDate) {
+      if (props?.selectDate) {
         let updateDate;
-        if (props.selectDate.format === "dd-MM-yyyy") {
+        if (props?.selectDate.format === "dd-MM-yyyy") {
+          // console.log('saveDateformat',props.saveDateFormat)
           const [day, month, year] = props.saveDateFormat.split("-");
           updateDate = new Date(`${year}-${month}-${day}`);
         } else {
@@ -149,8 +150,9 @@ function PlaceholderType(props) {
             ? props.selectDate?.format
             : props.pos?.options?.validation?.format
               ? props.pos?.options?.validation?.format
-              : "MM/dd/YYYY"
+              : "MM/dd/yyyy"
         };
+        console.log("savedateformat selectdate", dateObj);
         props.setSelectDate(dateObj);
         onChangeInput(
           props.saveDateFormat,
@@ -164,7 +166,7 @@ function PlaceholderType(props) {
             ? props.selectDate.format
             : props.pos?.options?.validation?.format
               ? props.pos?.options?.validation?.format
-              : "MM/dd/YYYY"
+              : "MM/dd/yyyy"
         );
       }
     }
@@ -674,7 +676,7 @@ function PlaceholderType(props) {
                 ? props.selectDate?.format
                 : props.pos?.options?.validation?.format
                   ? props.pos?.options?.validation?.format
-                  : "MM/dd/YYYY"
+                  : "MM/dd/yyyy"
             }
           />
         </div>

From 375aa0b7e7028e03b83896830efdca5401763d8d Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Tue, 12 Mar 2024 20:02:11 +0530
Subject: [PATCH 06/21] fix: invalid date issue for indian format

---
 .../src/components/pdf/Placeholder.js         | 47 ++++++++++++++-----
 .../src/components/pdf/PlaceholderType.js     | 41 ++++++++--------
 .../src/components/pdf/WidgetComponent.js     | 10 ++--
 apps/OpenSign/src/constant/Utils.js           | 43 +++++++++--------
 apps/OpenSign/src/pages/SignyourselfPdf.js    | 12 ++---
 5 files changed, 85 insertions(+), 68 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 08e121c3e..87312ae99 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -61,23 +61,53 @@ const changeDateToMomentFormat = (format) => {
   }
 };
 
-const getDefaultdate = (selectedDate) =>
-  selectedDate ? new Date(selectedDate) : new Date();
+// const getDefaultdate = (selectedDate) => {
+//   return selectedDate ? new Date(selectedDate) : new Date();
+// };
+const getDefaultdate = (selectedDate, format = "dd-MM-yyyy") => {
+  let date;
+  if (format && format === "dd-MM-yyyy") {
+    const newdate = selectedDate
+      ? selectedDate
+      : moment(new Date()).format(changeDateToMomentFormat(format));
+    const [day, month, year] = newdate.split("-");
+    date = new Date(`${year}-${month}-${day}`);
+  } else {
+    date = new Date(selectedDate);
+  }
+  const value = date;
+  return value;
+};
 const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
 
 function Placeholder(props) {
   const [isDraggingEnabled, setDraggingEnabled] = useState(true);
   const [isShowDateFormat, setIsShowDateFormat] = useState(false);
+  // const [selectDate, setSelectDate] = useState({
+  //   date: moment(
+  //     getDefaultdate(props?.pos?.options?.response).getTime()
+  //   ).format(changeDateToMomentFormat(props.pos?.options?.validation?.format)),
+  //   format: getDefaultFormat(props.pos?.options?.validation?.format)
+  // });
   const [selectDate, setSelectDate] = useState({
     date: moment(
-      getDefaultdate(props?.pos?.options?.response).getTime()
+      getDefaultdate(
+        props?.pos?.options?.response,
+        props.pos?.options?.validation?.format
+      ).getTime()
     ).format(changeDateToMomentFormat(props.pos?.options?.validation?.format)),
     format: getDefaultFormat(props.pos?.options?.validation?.format)
   });
   const [dateFormat, setDateFormat] = useState([]);
   const [saveDateFormat, setSaveDateFormat] = useState("");
+  // const [startDate, setStartDate] = useState(
+  //   getDefaultdate(props?.pos?.options?.response)
+  // );
   const [startDate, setStartDate] = useState(
-    getDefaultdate(props?.pos?.options?.response)
+    getDefaultdate(
+      props?.pos?.options?.response,
+      props.pos?.options?.validation?.format
+    )
   );
   const dateFormatArr = [
     "L",
@@ -91,8 +121,6 @@ function Placeholder(props) {
     "DD MMMM, YYYY"
   ];
 
-  // console.log('props.pos',props.pos?.options?.validation?.format)
-
   //useEffect for to set date and date format for all flow (signyour-self, request-sign,placeholder,template)
   //checking if already have data and set else set new date
   // useEffect(() => {
@@ -125,28 +153,23 @@ function Placeholder(props) {
 
   //function change format array list with selected date and format
   const changeDateFormat = () => {
-    // console.log("selected date", selectDate);
     const updateDate = [];
     dateFormatArr.map((data) => {
       let date;
-      if (selectDate.format === "dd-MM-yyyy") {
+      if (selectDate && selectDate.format === "dd-MM-yyyy") {
         const [day, month, year] = selectDate.date.split("-");
         date = new Date(`${year}-${month}-${day}`);
       } else {
         date = new Date(selectDate?.date);
       }
       const milliseconds = date.getTime();
-      // console.log('data',data)
       const newDate = moment(milliseconds).format(data);
-      // console.log('new date',newDate)
       const dateObj = {
         date: newDate,
         format: selectFormat(data)
       };
-      // console.log('dateobj',dateObj)
       updateDate.push(dateObj);
     });
-    // console.log('updated format',updateDate)
     setDateFormat(updateDate);
   };
 
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 7aa433107..d21906c8c 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -133,27 +133,28 @@ function PlaceholderType(props) {
     if (type && type === "date") {
       if (props?.selectDate) {
         let updateDate;
-        if (props?.selectDate.format === "dd-MM-yyyy") {
-          // console.log('saveDateformat',props.saveDateFormat)
-          const [day, month, year] = props.saveDateFormat.split("-");
-          updateDate = new Date(`${year}-${month}-${day}`);
-        } else {
-          if (props?.saveDateFormat) {
-            updateDate = new Date(props.saveDateFormat);
-          }
-        }
+        // if (props?.selectDate.format === "dd-MM-yyyy") {
+        //   // console.log('saveDateformat',props.saveDateFormat)
+        //   const [day, month, year] = props.saveDateFormat.split("-");
+        //   updateDate = new Date(`${year}-${month}-${day}`);
+        //   console.log('update',updateDate)
+        // } else {
+        //   if (props?.saveDateFormat) {
+        //     updateDate = new Date(props.saveDateFormat);
+        //   }
+        // }
         // const updateDate = new Date(props.saveDateFormat);
-        props.setStartDate(updateDate);
-        const dateObj = {
-          date: props.saveDateFormat,
-          format: props.selectDate
-            ? props.selectDate?.format
-            : props.pos?.options?.validation?.format
-              ? props.pos?.options?.validation?.format
-              : "MM/dd/yyyy"
-        };
-        console.log("savedateformat selectdate", dateObj);
-        props.setSelectDate(dateObj);
+        // props.setStartDate(updateDate);
+        // const dateObj = {
+        //   date: props.saveDateFormat,
+        //   format: props.selectDate
+        //     ? props.selectDate?.format
+        //     : props.pos?.options?.validation?.format
+        //       ? props.pos?.options?.validation?.format
+        //       : "MM/dd/yyyy"
+        // };
+
+        // props.setSelectDate(dateObj);
         onChangeInput(
           props.saveDateFormat,
           props.pos.key,
diff --git a/apps/OpenSign/src/components/pdf/WidgetComponent.js b/apps/OpenSign/src/components/pdf/WidgetComponent.js
index 943e9f30e..1b9a0094b 100644
--- a/apps/OpenSign/src/components/pdf/WidgetComponent.js
+++ b/apps/OpenSign/src/components/pdf/WidgetComponent.js
@@ -204,17 +204,17 @@ function WidgetComponent({
       dragSignature,
       dragStamp,
       initials,
+      name,
+      jobTitle,
+      company,
+      date,
       label,
       text,
       checkbox,
       dropdown,
       radio,
       image,
-      date,
-      name,
-      email,
-      company,
-      jobTitle
+      email
     ];
     const getWidgetArray = widgets;
     const newUpdateSigner = getWidgetArray.map((obj, ind) => {
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index 088424b19..936d1d9de 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -161,6 +161,26 @@ export const widgets = [
     icon: "fa-solid fa-signature",
     iconSize: "15px"
   },
+  {
+    type: "name",
+    icon: "fa-solid fa-user",
+    iconSize: "21px"
+  },
+  {
+    type: "job title",
+    icon: "fa-solid fa-address-card",
+    iconSize: "17px"
+  },
+  {
+    type: "company",
+    icon: "fa-solid fa-building",
+    iconSize: "25px"
+  },
+  {
+    type: "date",
+    icon: "fa-solid fa-calendar-days",
+    iconSize: "20px"
+  },
   {
     type: "label",
     icon: "fa-solid fa-text-width",
@@ -191,40 +211,19 @@ export const widgets = [
     icon: "fa-solid fa-image",
     iconSize: "20px"
   },
-  {
-    type: "date",
-    icon: "fa-solid fa-calendar-days",
-    iconSize: "20px"
-  },
-  {
-    type: "name",
-    icon: "fa-solid fa-user",
-    iconSize: "21px"
-  },
   {
     type: "email",
     icon: "fa-solid fa-envelope",
     iconSize: "20px"
-  },
-  {
-    type: "company",
-    icon: "fa-solid fa-building",
-    iconSize: "25px"
-  },
-  {
-    type: "job title",
-    icon: "fa-solid fa-address-card",
-    iconSize: "17px"
   }
 ];
 
-const getDate = () => {
+export const getDate = () => {
   const date = new Date();
   const milliseconds = date.getTime();
   const newDate = moment(milliseconds).format("MM/DD/YYYY");
   return newDate;
 };
-
 export const addWidgetOptions = (type) => {
   const defaultOpt = {
     name: "",
diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js
index 4b7501c56..0b56688a6 100644
--- a/apps/OpenSign/src/pages/SignyourselfPdf.js
+++ b/apps/OpenSign/src/pages/SignyourselfPdf.js
@@ -25,7 +25,8 @@ import {
   onSaveSign,
   contractUsers,
   contactBook,
-  randomId
+  randomId,
+  getDate
 } from "../constant/Utils";
 import { useParams } from "react-router-dom";
 import Tour from "reactour";
@@ -308,13 +309,6 @@ function SignYourSelf() {
       setIsLoading(loadObj);
     }
   };
-
-  const getDate = () => {
-    const date = new Date();
-    const milliseconds = date.getTime();
-    const newDate = moment(milliseconds).format("MM/DD/YYYY");
-    return newDate;
-  };
   const getWidgetValue = (type) => {
     switch (type) {
       case "name":
@@ -333,6 +327,7 @@ function SignYourSelf() {
         return "";
     }
   };
+
   const addWidgetOptions = (type) => {
     switch (type) {
       case "signature":
@@ -596,7 +591,6 @@ function SignYourSelf() {
       await signPdfFun(pdfBytes, documentId);
     }
   }
-
   //function for get digital signature
   const signPdfFun = async (base64Url, documentId) => {
     let singleSign = {

From 08e805569fb6657ba9bf97cbc06f90b1d81e64cb Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 13 Mar 2024 09:56:59 +0530
Subject: [PATCH 07/21] fix: disable date change in placeholder and template
 flow

---
 apps/OpenSign/src/components/pdf/PlaceholderType.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index d21906c8c..5c93135e0 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -649,7 +649,9 @@ function PlaceholderType(props) {
               </div>
             )}
             disabled={
-              props.isNeedSign && props.data?.signerObjId !== props.signerObjId
+              props.isPlaceholder ||
+              (props.isNeedSign &&
+                props.data?.signerObjId !== props.signerObjId)
             }
             onBlur={handleInputBlur}
             closeOnScroll={true}

From 61b123cb61d2b715007d7600ebceca4816841449 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Wed, 13 Mar 2024 10:31:49 +0530
Subject: [PATCH 08/21] refator: update dashboard tour messages

---
 apps/OpenSign/src/layout/HomeLayout.js        |   2 +-
 .../20240313095456-update_tour_dashboard.cjs  | 219 ++++++++++++++++++
 2 files changed, 220 insertions(+), 1 deletion(-)
 create mode 100644 apps/OpenSignServer/databases/migrations/20240313095456-update_tour_dashboard.cjs

diff --git a/apps/OpenSign/src/layout/HomeLayout.js b/apps/OpenSign/src/layout/HomeLayout.js
index 662ddf4af..8f4c26379 100644
--- a/apps/OpenSign/src/layout/HomeLayout.js
+++ b/apps/OpenSign/src/layout/HomeLayout.js
@@ -97,7 +97,7 @@ const HomeLayout = () => {
         ...resArr,
         {
           selector: '[data-tut="reactourLast"]',
-          content: `You are good to go`,
+          content: `You are ready to start using OpenSign! If you need support feel free to contact us.`,
           position: "top"
           // style: { backgroundColor: "#abd4d2" },
         }
diff --git a/apps/OpenSignServer/databases/migrations/20240313095456-update_tour_dashboard.cjs b/apps/OpenSignServer/databases/migrations/20240313095456-update_tour_dashboard.cjs
new file mode 100644
index 000000000..d91b9f746
--- /dev/null
+++ b/apps/OpenSignServer/databases/migrations/20240313095456-update_tour_dashboard.cjs
@@ -0,0 +1,219 @@
+/**
+ *
+ * @param {Parse} Parse
+ */
+exports.up = async Parse => {
+  // TODO: set className here
+  const className = 'w_dashboard';
+  const dashboard = new Parse.Query(className);
+  const updatedashboard = await dashboard.get('35KBoSgoAK');
+  updatedashboard.set('rows', [
+    {
+      columns: [
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'Card',
+            icon: 'fas fa-signature',
+            bgColor: '#f0058e',
+            label: 'Need your Signature',
+            description: null,
+            data: {
+              id: 'e04ee9dc-932d-6b80-0202-703fd154eb74',
+              queryType: '',
+              class: 'contracts_Document',
+              query:
+                'where={"$and":[{"AuditTrail.UserPtr":{"$ne":{"__type":"Pointer","className": "contracts_Users","objectId":"#objectId#"}}},{"AuditTrail.Activity":{"$ne":"Signed"}}],"Signers":{"$in":[{"__type":"Pointer","className":"contracts_Users","objectId":"#objectId#"}]},"IsDeclined":{"$ne":true},"IsCompleted":{"$ne":true},"Type":{"$ne":"Folder"},"Placeholders":{"$ne":null},"ExpiryDate":{"#*gt":{"__type":"#Date#","iso":"#today#"}}}&count=1',
+              key: 'count',
+              Redirect_type: 'Report',
+              Redirect_id: '4Hhwbp482K',
+              tourSection: 'tourcard1',
+              tourMessage:
+                'Clicking on this card will take you to the list of documents awaiting your review.',
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'Card',
+            icon: 'fas fa-sign-out-alt',
+            bgColor: '#g0058e',
+            label: 'Out for signatures',
+            description: null,
+            data: {
+              id: 'c1935cc0-28d4-3d73-b72a-8c1e3d18a17f',
+              queryType: '',
+              class: 'contracts_Document',
+              query:
+                'where={"Type":{"#*ne":"Folder"},"Signers":{"#*exists":true,"#*ne":[]},"Placeholders":{"#*ne":null},"IsCompleted":{"#*ne":true},"IsDeclined":{"#*ne":true},"IsArchive":{"#*ne":true},"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"#UserId.objectId#"},"ExpiryDate":{"#*gt":{"__type":"#Date#","iso":"#today#"}}}&count=1',
+              key: 'count',
+              Redirect_type: 'Report',
+              Redirect_id: '1MwEuxLEkF',
+              tourSection: 'tourcard2',
+              tourMessage:
+                'Clicking on this card will take you to a list of documents awaiting signature.',
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'report',
+            reportId: '5Go51Q7T8r',
+            data: {
+              tourSection: 'tourreport1',
+              tourMessage: 'This is a list of documents that are waiting for your signature.',
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'report',
+            reportId: 'd9k3UfYHBc',
+            data: {
+              tourSection: 'tourreport2',
+              tourMessage:
+                "This is a list of documents you've sent to other parties for signature.",
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '12',
+          collg: '12',
+          widget: {
+            type: 'report',
+            reportId: 'kC5mfynCi4',
+            data: {
+              tourSection: 'tourreport3',
+              tourMessage:
+                'This are documents you have started but have not finalized for sending.',
+            },
+          },
+        },
+      ],
+    },
+  ]);
+
+  return updatedashboard.save();
+};
+
+/**
+ *
+ * @param {Parse} Parse
+ */
+exports.down = async Parse => {
+  const className = 'w_dashboard';
+  const dashboard = new Parse.Query(className);
+  const revertdashboard = await dashboard.get('35KBoSgoAK');
+  revertdashboard.set('rows', [
+    {
+      columns: [
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'Card',
+            icon: 'fas fa-signature',
+            bgColor: '#f0058e',
+            label: 'Need your Signature',
+            description: null,
+            data: {
+              id: 'e04ee9dc-932d-6b80-0202-703fd154eb74',
+              queryType: '',
+              class: 'contracts_Document',
+              query:
+                'where={"$and":[{"AuditTrail.UserPtr":{"$ne":{"__type":"Pointer","className": "contracts_Users","objectId":"#objectId#"}}},{"AuditTrail.Activity":{"$ne":"Signed"}}],"Signers":{"$in":[{"__type":"Pointer","className":"contracts_Users","objectId":"#objectId#"}]},"IsDeclined":{"$ne":true},"IsCompleted":{"$ne":true},"Type":{"$ne":"Folder"},"Placeholders":{"$ne":null},"ExpiryDate":{"#*gt":{"__type":"#Date#","iso":"#today#"}}}&count=1',
+              key: 'count',
+              Redirect_type: 'Report',
+              Redirect_id: '4Hhwbp482K',
+              tourSection: 'tourcard1',
+              tourMessage:
+                'This card shows the aggregate count of documents that are awaiting your signature. Clicking on this card will seamlessly take you to the detailed list of such documents for your review and action.',
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'Card',
+            icon: 'fas fa-sign-out-alt',
+            bgColor: '#g0058e',
+            label: 'Out for signatures',
+            description: null,
+            data: {
+              id: 'c1935cc0-28d4-3d73-b72a-8c1e3d18a17f',
+              queryType: '',
+              class: 'contracts_Document',
+              query:
+                'where={"Type":{"#*ne":"Folder"},"Signers":{"#*exists":true,"#*ne":[]},"Placeholders":{"#*ne":null},"IsCompleted":{"#*ne":true},"IsDeclined":{"#*ne":true},"IsArchive":{"#*ne":true},"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"#UserId.objectId#"},"ExpiryDate":{"#*gt":{"__type":"#Date#","iso":"#today#"}}}&count=1',
+              key: 'count',
+              Redirect_type: 'Report',
+              Redirect_id: '1MwEuxLEkF',
+              tourSection: 'tourcard2',
+              tourMessage:
+                "This card indicates the total number of documents you've sent out for signatures. A single click on this card will navigate you to a comprehensive list of these documents, allowing you to monitor their status.",
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'report',
+            reportId: '5Go51Q7T8r',
+            data: {
+              tourSection: 'tourreport1',
+              tourMessage:
+                'Here lies a curated list of documents that are pending your signature. These are requests from other users that require your immediate attention for completion.',
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '6',
+          collg: '6',
+          widget: {
+            type: 'report',
+            reportId: 'd9k3UfYHBc',
+            data: {
+              tourSection: 'tourreport2',
+              tourMessage:
+                "This area displays all the documents you've dispatched for signatures from other parties. It serves as a real-time tracker for documents pending external approval.",
+            },
+          },
+        },
+        {
+          colxs: '12',
+          colmd: '12',
+          collg: '12',
+          widget: {
+            type: 'report',
+            reportId: 'kC5mfynCi4',
+            data: {
+              tourSection: 'tourreport3',
+              tourMessage:
+                "In this section, you'll find your draft documents awaiting completion. These are the documents you've initiated but haven't yet finalized for sending.",
+            },
+          },
+        },
+      ],
+    },
+  ]);
+
+  return revertdashboard.save();
+};

From c04fd80a3826dd126e824c3086c40c237923f935 Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 13 Mar 2024 11:40:17 +0530
Subject: [PATCH 09/21] feat: change label widget name to text and text widget
 name to text input

---
 .../src/components/pdf/Placeholder.js         | 25 ++++++++++-------
 .../src/components/pdf/PlaceholderCopy.js     |  4 +--
 .../src/components/pdf/PlaceholderType.js     | 17 ++++++++----
 .../src/components/pdf/WidgetComponent.js     | 25 ++++++++---------
 .../src/components/pdf/WidgetNameModal.js     | 11 ++++----
 apps/OpenSign/src/constant/Utils.js           | 18 +++++++------
 apps/OpenSign/src/pages/PlaceHolderSign.js    | 27 +++++++++++--------
 apps/OpenSign/src/pages/SignyourselfPdf.js    |  6 ++---
 .../OpenSign/src/pages/TemplatePlaceholder.js | 11 +++++---
 9 files changed, 86 insertions(+), 58 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 87312ae99..ca337cc1b 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -2,7 +2,12 @@ import React, { useState, useEffect } from "react";
 import BorderResize from "./BorderResize";
 import PlaceholderBorder from "./PlaceholderBorder";
 import { Rnd } from "react-rnd";
-import { defaultWidthHeight, isMobile } from "../../constant/Utils";
+import {
+  defaultWidthHeight,
+  isMobile,
+  textInputWidget,
+  textWidget
+} from "../../constant/Utils";
 import PlaceholderType from "./PlaceholderType";
 import moment from "moment";
 import "../../styles/opensigndrive.css";
@@ -202,7 +207,7 @@ function Placeholder(props) {
     }
 
     const widgetTypeExist = [
-      "text",
+      textInputWidget,
       "checkbox",
       "name",
       "company",
@@ -238,7 +243,7 @@ function Placeholder(props) {
     } else if (
       props.isPlaceholder &&
       !props.isDragging &&
-      props.pos.type !== "label"
+      props.pos.type !== textWidget
     ) {
       if (props.pos.key === props.selectWidgetId) {
         props.handleLinkUser(props.data.Id);
@@ -277,7 +282,7 @@ function Placeholder(props) {
       props?.handleNameModal(true);
     }
 
-    if (props.isPlaceholder && props.type !== "label") {
+    if (props.isPlaceholder && props.type !== textWidget) {
       props.setUniqueId(props.data.Id);
     }
     props.setSignKey(props.pos.key);
@@ -285,10 +290,10 @@ function Placeholder(props) {
     props.setCurrWidgetsDetails(props.pos);
   };
   const handleCopyPlaceholder = (e) => {
-    if (props.data && props?.pos?.type !== "label") {
+    if (props.data && props?.pos?.type !== textWidget) {
       props.setSignerObjId(props?.data?.signerObjId);
       props.setUniqueId(props?.data?.Id);
-    } else if (props.data && props.pos.type === "label") {
+    } else if (props.data && props.pos.type === textWidget) {
       props.setTempSignerId(props.uniqueId);
       props.setSignerObjId(props?.data?.signerObjId);
       props.setUniqueId(props?.data?.Id);
@@ -324,7 +329,9 @@ function Placeholder(props) {
               ) : (
                 ((!props?.pos?.type && props.pos.isStamp) ||
                   (props?.pos?.type &&
-                    !["date", "label", "signature"].includes(props.pos.type) &&
+                    !["date", textWidget, "signature"].includes(
+                      props.pos.type
+                    ) &&
                     !props.isSignYourself)) && (
                   <i
                     onClick={(e) => {
@@ -349,7 +356,7 @@ function Placeholder(props) {
                 )
               )}
 
-              {props.pos.type !== "label" && !props.isSignYourself && (
+              {props.pos.type !== textWidget && !props.isSignYourself && (
                 <i
                   data-tut="reactourLinkUser"
                   className="fa-regular fa-user signUserIcon"
@@ -511,7 +518,7 @@ function Placeholder(props) {
       //ref={nodeRef}
       key={props.pos.key}
       lockAspectRatio={
-        props.pos.type !== "label" &&
+        props.pos.type !== textWidget &&
         (props.pos.Width
           ? props.pos.Width / props.pos.Height
           : defaultWidthHeight(props.pos.type).width /
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderCopy.js b/apps/OpenSign/src/components/pdf/PlaceholderCopy.js
index b57023bdf..17d86206c 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderCopy.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderCopy.js
@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { themeColor } from "../../constant/const";
 import ModalUi from "../../primitives/ModalUi";
-import { randomId } from "../../constant/Utils";
+import { randomId, textWidget } from "../../constant/Utils";
 
 function PlaceholderCopy(props) {
   const copyType = ["All pages", "All pages but last", "All pages but first"];
@@ -181,7 +181,7 @@ function PlaceholderCopy(props) {
     }
   };
   const handleUniqueId = () => {
-    if (props.widgetType === "label") {
+    if (props.widgetType === textWidget) {
       props.setUniqueId(props?.tempSignerId);
       props.setTempSignerId("");
     }
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 5c93135e0..c575bcd47 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -1,5 +1,12 @@
 import React, { useEffect, useState, forwardRef, useRef } from "react";
-import { getMonth, getYear, onChangeInput, range } from "../../constant/Utils";
+import {
+  getMonth,
+  getYear,
+  onChangeInput,
+  range,
+  textInputWidget,
+  textWidget
+} from "../../constant/Utils";
 import DatePicker from "react-datepicker";
 import "react-datepicker/dist/react-datepicker.css";
 import "../../styles/signature.css";
@@ -77,7 +84,7 @@ function PlaceholderType(props) {
       case "number":
         setValidatePlaceholder("12345");
         break;
-      case "text":
+      case textInputWidget:
         setValidatePlaceholder("enter text");
         break;
       default:
@@ -132,7 +139,7 @@ function PlaceholderType(props) {
   useEffect(() => {
     if (type && type === "date") {
       if (props?.selectDate) {
-        let updateDate;
+        // let updateDate;
         // if (props?.selectDate.format === "dd-MM-yyyy") {
         //   // console.log('saveDateformat',props.saveDateFormat)
         //   const [day, month, year] = props.saveDateFormat.split("-");
@@ -410,7 +417,7 @@ function PlaceholderType(props) {
           })}
         </div>
       );
-    case "text":
+    case textInputWidget:
       return props.isSignYourself ||
         (props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
         <input
@@ -770,7 +777,7 @@ function PlaceholderType(props) {
           })}
         </div>
       );
-    case "label":
+    case textWidget:
       return (
         <textarea
           placeholder="Enter label"
diff --git a/apps/OpenSign/src/components/pdf/WidgetComponent.js b/apps/OpenSign/src/components/pdf/WidgetComponent.js
index 1b9a0094b..1aa721c8a 100644
--- a/apps/OpenSign/src/components/pdf/WidgetComponent.js
+++ b/apps/OpenSign/src/components/pdf/WidgetComponent.js
@@ -3,7 +3,7 @@ import ModalUi from "../../primitives/ModalUi";
 import RecipientList from "./RecipientList";
 import { useDrag } from "react-dnd";
 import WidgetList from "./WidgetList";
-import { widgets } from "../../constant/Utils";
+import { textInputWidget, textWidget, widgets } from "../../constant/Utils";
 import { themeColor } from "../../constant/const";
 function WidgetComponent({
   dragSignature,
@@ -58,16 +58,15 @@ function WidgetComponent({
       isDragCheck: !!monitor.isDragging()
     })
   });
-  const [, text] = useDrag({
+  const [, textInput] = useDrag({
     type: "BOX",
     item: {
       type: "BOX",
       id: 7,
-      text: "text"
+      text: textInputWidget
     },
-
     collect: (monitor) => ({
-      isDragText: !!monitor.isDragging()
+      isDragTextInput: !!monitor.isDragging()
     })
   });
   const [, initials] = useDrag({
@@ -165,16 +164,16 @@ function WidgetComponent({
       isDragRadio: !!monitor.isDragging()
     })
   });
-  const [, label] = useDrag({
+  const [, text] = useDrag({
     type: "BOX",
 
     item: {
       type: "BOX",
       id: 16,
-      text: "label"
+      text: textWidget
     },
     collect: (monitor) => ({
-      isDragLabel: !!monitor.isDragging()
+      isDragText: !!monitor.isDragging()
     })
   });
   const isMobile = window.innerWidth < 767;
@@ -208,8 +207,8 @@ function WidgetComponent({
       jobTitle,
       company,
       date,
-      label,
       text,
+      textInput,
       checkbox,
       dropdown,
       radio,
@@ -227,13 +226,15 @@ function WidgetComponent({
 
   const filterWidgets = widget.filter(
     (data) =>
-      data.type !== "dropdown" && data.type !== "radio" && data.type !== "label"
+      data.type !== "dropdown" &&
+      data.type !== "radio" &&
+      data.type !== textWidget
   );
-  const labelWidget = widget.filter((data) => data.type !== "label");
+  const textWidgetData = widget.filter((data) => data.type !== textWidget);
   const updateWidgets = isSignYourself
     ? filterWidgets
     : isTemplateFlow
-      ? labelWidget
+      ? textWidgetData
       : widget;
 
   return (
diff --git a/apps/OpenSign/src/components/pdf/WidgetNameModal.js b/apps/OpenSign/src/components/pdf/WidgetNameModal.js
index 3d0ae2f01..329dea3e6 100644
--- a/apps/OpenSign/src/components/pdf/WidgetNameModal.js
+++ b/apps/OpenSign/src/components/pdf/WidgetNameModal.js
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from "react";
 import ModalUi from "../../primitives/ModalUi";
 import "../../styles/AddUser.css";
 import RegexParser from "regex-parser";
+import { textInputWidget } from "../../constant/Utils";
 
 const WidgetNameModal = (props) => {
   const [formdata, setFormdata] = useState({
@@ -69,7 +70,7 @@ const WidgetNameModal = (props) => {
         return "/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$/";
       case "number":
         return "/^\\d+$/";
-      case "text":
+      case textInputWidget:
         return "/^[a-zA-Zs]+$/";
       default:
         return type;
@@ -111,8 +112,8 @@ const WidgetNameModal = (props) => {
             required
           />
         </div>
-        {(props.defaultdata?.type === "text" ||
-          props.widgetName === "text") && (
+        {(props.defaultdata?.type === textInputWidget ||
+          props.widgetName === textInputWidget) && (
           <>
             <div className="form-section">
               <label htmlFor="textvalidate" style={{ fontSize: 13 }}>
@@ -243,8 +244,8 @@ const WidgetNameModal = (props) => {
             })}
           </div>
         </div>
-        {(props.defaultdata?.type === "text" ||
-          props?.widgetName === "text") && (
+        {(props.defaultdata?.type === textInputWidget ||
+          props?.widgetName === textInputWidget) && (
           <div className="form-section">
             <label htmlFor="hint" style={{ fontSize: 13 }}>
               Hint
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index 936d1d9de..1a8a2b3a6 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -5,6 +5,8 @@ import React from "react";
 import { rgb } from "pdf-lib";
 
 export const isMobile = window.innerWidth < 767;
+export const textInputWidget = "text input";
+export const textWidget = "text";
 export const openInNewTab = (url) => {
   window.open(url, "_blank", "noopener,noreferrer");
 };
@@ -182,12 +184,12 @@ export const widgets = [
     iconSize: "20px"
   },
   {
-    type: "label",
+    type: textWidget,
     icon: "fa-solid fa-text-width",
     iconSize: "20px"
   },
   {
-    type: "text",
+    type: textInputWidget,
     icon: "fa-solid fa-font",
     iconSize: "21px"
   },
@@ -236,7 +238,7 @@ export const addWidgetOptions = (type) => {
       return defaultOpt;
     case "checkbox":
       return defaultOpt;
-    case "text":
+    case textInputWidget:
       return { ...defaultOpt, validation: { type: "text", pattern: "" } };
     case "initials":
       return defaultOpt;
@@ -256,7 +258,7 @@ export const addWidgetOptions = (type) => {
       return defaultOpt;
     case "radio":
       return { ...defaultOpt, values: [] };
-    case "label":
+    case textWidget:
       return defaultOpt;
     default:
       return {};
@@ -322,7 +324,7 @@ export const defaultWidthHeight = (type) => {
       return { width: 150, height: 60 };
     case "checkbox":
       return { width: 15, height: 15 };
-    case "text":
+    case textInputWidget:
       return { width: 150, height: 25 };
     case "dropdown":
       return { width: 120, height: 22 };
@@ -342,7 +344,7 @@ export const defaultWidthHeight = (type) => {
       return { width: 150, height: 20 };
     case "radio":
       return { width: 15, height: 30 };
-    case "label":
+    case textWidget:
       return { width: 150, height: 17 };
     default:
       return { width: 150, height: 60 };
@@ -1137,7 +1139,7 @@ export const multiSignEmbed = async (
         }
       };
       const widgetTypeExist = [
-        "text",
+        textInputWidget,
         "name",
         "company",
         "job title",
@@ -1183,7 +1185,7 @@ export const multiSignEmbed = async (
             checkbox.enableReadOnly();
           });
         }
-      } else if (position.type === "label") {
+      } else if (position.type === textWidget) {
         const font = await pdfDoc.embedFont("Helvetica");
         const fontSize = 12;
         let textContent;
diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js
index 557b12abf..13dc516ba 100644
--- a/apps/OpenSign/src/pages/PlaceHolderSign.js
+++ b/apps/OpenSign/src/pages/PlaceHolderSign.js
@@ -24,7 +24,9 @@ import {
   randomId,
   defaultWidthHeight,
   multiSignEmbed,
-  addWidgetOptions
+  addWidgetOptions,
+  textInputWidget,
+  textWidget
 } from "../constant/Utils";
 import RenderPdf from "../components/pdf/RenderPdf";
 import { useNavigate } from "react-router-dom";
@@ -384,7 +386,7 @@ function PlaceHolderSign() {
       setSelectWidgetId(key);
       if (signer) {
         let filterSignerPos;
-        if (dragTypeValue === "label") {
+        if (dragTypeValue === textWidget) {
           filterSignerPos = signerPos.filter((data) => data.Role === "prefill");
         } else {
           filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
@@ -411,7 +413,7 @@ function PlaceHolderSign() {
             };
             updatePlace.push(xyPos);
             let updatesignerPos;
-            if (dragTypeValue === "label") {
+            if (dragTypeValue === textWidget) {
               updatesignerPos = signerPos.map((x) =>
                 x.Role === "prefill" ? { ...x, placeHolder: updatePlace } : x
               );
@@ -424,7 +426,7 @@ function PlaceHolderSign() {
             setSignerPos(updatesignerPos);
           } else {
             let updatesignerPos;
-            if (dragTypeValue === "label") {
+            if (dragTypeValue === textWidget) {
               updatesignerPos = signerPos.map((x) =>
                 x.Role === "prefill"
                   ? { ...x, placeHolder: [...x.placeHolder, placeHolder] }
@@ -442,7 +444,7 @@ function PlaceHolderSign() {
         } else {
           //adding new placeholder for selected signer in pos array (placeholder)
           let placeHolderPos;
-          if (dragTypeValue === "label") {
+          if (dragTypeValue === textWidget) {
             placeHolderPos = {
               signerPtr: {},
               signerObjId: "",
@@ -484,7 +486,10 @@ function PlaceHolderSign() {
           setIsCheckbox(true);
         } else if (dragTypeValue === "radio") {
           setIsRadio(true);
-        } else if (dragTypeValue !== "label" && dragTypeValue !== "signature") {
+        } else if (
+          dragTypeValue !== textWidget &&
+          dragTypeValue !== "signature"
+        ) {
           setIsNameModal(true);
         }
         setWidgetType(dragTypeValue);
@@ -734,7 +739,7 @@ function PlaceHolderSign() {
 
     if (getPrefill && isLabel) {
       const alert = {
-        mssg: "label",
+        mssg: textWidget,
         alert: true
       };
       setIsSendAlert(alert);
@@ -1184,7 +1189,7 @@ function PlaceHolderSign() {
         const getPosData = getXYdata;
         const addSignPos = getPosData.map((position) => {
           if (position.key === signKey) {
-            if (position.type === "text") {
+            if (position.type === textInputWidget) {
               return {
                 ...position,
                 options: {
@@ -1404,13 +1409,13 @@ function PlaceHolderSign() {
 
               <ModalUi
                 headerColor={
-                  isSendAlert.mssg === "sure" || isSendAlert.mssg === "label"
+                  isSendAlert.mssg === "sure" || isSendAlert.mssg === textWidget
                     ? "#dc3545"
                     : isSendAlert.mssg === "confirm" && themeColor
                 }
                 isOpen={isSendAlert.alert}
                 title={
-                  isSendAlert.mssg === "sure" || isSendAlert.mssg === "label"
+                  isSendAlert.mssg === "sure" || isSendAlert.mssg === textWidget
                     ? "Fields required"
                     : isSendAlert.mssg === "confirm" && "Send Mail"
                 }
@@ -1419,7 +1424,7 @@ function PlaceHolderSign() {
                 <div style={{ height: "100%", padding: 20 }}>
                   {isSendAlert.mssg === "sure" ? (
                     <p>Please add field for all recipients.</p>
-                  ) : isSendAlert.mssg === "label" ? (
+                  ) : isSendAlert.mssg === textWidget ? (
                     <p>Please confirm that you have filled label widget.</p>
                   ) : (
                     isSendAlert.mssg === "confirm" && (
diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js
index 0b56688a6..f86bd1228 100644
--- a/apps/OpenSign/src/pages/SignyourselfPdf.js
+++ b/apps/OpenSign/src/pages/SignyourselfPdf.js
@@ -3,7 +3,6 @@ import { PDFDocument } from "pdf-lib";
 import "../styles/signature.css";
 import { themeColor } from "../constant/const";
 import axios from "axios";
-import moment from "moment";
 import Loader from "../primitives/LoaderWithMsg";
 import loader from "../assets/images/loader2.gif";
 import RenderAllPdfPage from "../components/pdf/RenderAllPdfPage";
@@ -26,7 +25,8 @@ import {
   contractUsers,
   contactBook,
   randomId,
-  getDate
+  getDate,
+  textInputWidget
 } from "../constant/Utils";
 import { useParams } from "react-router-dom";
 import Tour from "reactour";
@@ -343,7 +343,7 @@ function SignYourSelf() {
           name: "checkbox"
         };
 
-      case "text":
+      case textInputWidget:
         return {
           name: "text"
         };
diff --git a/apps/OpenSign/src/pages/TemplatePlaceholder.js b/apps/OpenSign/src/pages/TemplatePlaceholder.js
index 41b43ecbd..a9e06c29e 100644
--- a/apps/OpenSign/src/pages/TemplatePlaceholder.js
+++ b/apps/OpenSign/src/pages/TemplatePlaceholder.js
@@ -21,7 +21,9 @@ import {
   addZIndex,
   createDocument,
   defaultWidthHeight,
-  addWidgetOptions
+  addWidgetOptions,
+  textInputWidget,
+  textWidget
 } from "../constant/Utils";
 import RenderPdf from "../components/pdf/RenderPdf";
 import "../styles/AddUser.css";
@@ -444,7 +446,10 @@ const TemplatePlaceholder = () => {
           setIsCheckbox(true);
         } else if (dragTypeValue === "radio") {
           setIsRadio(true);
-        } else if (dragTypeValue !== "label" && dragTypeValue !== "signature") {
+        } else if (
+          dragTypeValue !== textWidget &&
+          dragTypeValue !== "signature"
+        ) {
           setIsNameModal(true);
         }
         setCurrWidgetsDetails({});
@@ -1106,7 +1111,7 @@ const TemplatePlaceholder = () => {
         const getPosData = getXYdata;
         const addSignPos = getPosData.map((position) => {
           if (position.key === signKey) {
-            if (position.type === "text") {
+            if (position.type === textInputWidget) {
               return {
                 ...position,
                 options: {

From 73b2ba6abd2bc922eaabae131854dfa64977834a Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 13 Mar 2024 14:30:25 +0530
Subject: [PATCH 10/21] fix: default date issue and remove commented code,
 unnecessary using useEffect

---
 .../src/components/pdf/Placeholder.js         | 90 +++++++++----------
 .../src/components/pdf/PlaceholderType.js     | 68 +++-----------
 apps/OpenSign/src/constant/Utils.js           |  6 +-
 apps/OpenSign/src/pages/SignyourselfPdf.js    |  3 +-
 4 files changed, 58 insertions(+), 109 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index ca337cc1b..9ab841933 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -5,6 +5,7 @@ import { Rnd } from "react-rnd";
 import {
   defaultWidthHeight,
   isMobile,
+  onChangeInput,
   textInputWidget,
   textWidget
 } from "../../constant/Utils";
@@ -66,9 +67,7 @@ const changeDateToMomentFormat = (format) => {
   }
 };
 
-// const getDefaultdate = (selectedDate) => {
-//   return selectedDate ? new Date(selectedDate) : new Date();
-// };
+//function to get default date
 const getDefaultdate = (selectedDate, format = "dd-MM-yyyy") => {
   let date;
   if (format && format === "dd-MM-yyyy") {
@@ -83,17 +82,12 @@ const getDefaultdate = (selectedDate, format = "dd-MM-yyyy") => {
   const value = date;
   return value;
 };
+//function to get default format
 const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
 
 function Placeholder(props) {
   const [isDraggingEnabled, setDraggingEnabled] = useState(true);
   const [isShowDateFormat, setIsShowDateFormat] = useState(false);
-  // const [selectDate, setSelectDate] = useState({
-  //   date: moment(
-  //     getDefaultdate(props?.pos?.options?.response).getTime()
-  //   ).format(changeDateToMomentFormat(props.pos?.options?.validation?.format)),
-  //   format: getDefaultFormat(props.pos?.options?.validation?.format)
-  // });
   const [selectDate, setSelectDate] = useState({
     date: moment(
       getDefaultdate(
@@ -104,10 +98,6 @@ function Placeholder(props) {
     format: getDefaultFormat(props.pos?.options?.validation?.format)
   });
   const [dateFormat, setDateFormat] = useState([]);
-  const [saveDateFormat, setSaveDateFormat] = useState("");
-  // const [startDate, setStartDate] = useState(
-  //   getDefaultdate(props?.pos?.options?.response)
-  // );
   const [startDate, setStartDate] = useState(
     getDefaultdate(
       props?.pos?.options?.response,
@@ -126,36 +116,6 @@ function Placeholder(props) {
     "DD MMMM, YYYY"
   ];
 
-  //useEffect for to set date and date format for all flow (signyour-self, request-sign,placeholder,template)
-  //checking if already have data and set else set new date
-  // useEffect(() => {
-  //   console.log('go here')
-  //   //set default current date and default format MM/dd/yyyy
-  //   const defaultFormat = props.pos?.options?.validation?.format;
-  //   const updateDate = props?.pos?.options?.response
-  //     ? new Date(props?.pos?.options?.response)
-  //     : new Date();
-  //   //DD-mm-YYYY
-  //   const dateFormat = defaultFormat && defaultFormat;
-  //   // const isMomentType = dateFormat && dateFormat === "MM/dd/YYYY";
-  //   // const selectMomentFormat = isMomentType ?  "MM/DD/YYYY" : dateFormat;
-  //   const selectMomentFormat = changeDateToMomentFormat(dateFormat);
-
-  //   // const isFormatType = dateFormat && dateFormat === "MM/dd/YYYY";
-  //   const getFormat = dateFormat || "MM/dd/yyyy";
-  //   const milliseconds = updateDate.getTime();
-  //   const newDate = moment(milliseconds).format(selectMomentFormat);
-  //   // console.log('new date',newDate)
-  //   const dateObj = {
-  //     date: newDate,
-  //     format: getFormat
-  //   };
-  //   console.log("dateobj selectdate useEffect", dateObj);
-  //   setSelectDate(dateObj);
-  //   setStartDate(updateDate);
-  //   // eslint-disable-next-line react-hooks/exhaustive-deps
-  // }, []);
-
   //function change format array list with selected date and format
   const changeDateFormat = () => {
     const updateDate = [];
@@ -178,15 +138,14 @@ function Placeholder(props) {
     setDateFormat(updateDate);
   };
 
-  // console.log("selected date", selectDate);
   useEffect(() => {
     if (props.isPlaceholder || props.isSignYourself) {
-      // console.log("selected date useEffect", selectDate);
       selectDate && changeDateFormat();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [selectDate]);
-  //handle to close drop down menu onclick screen
+
+  //it detect outside click of date dropdown menu
   useEffect(() => {
     const closeMenuOnOutsideClick = (e) => {
       if (isShowDateFormat && !e.target.closest("#menu-container")) {
@@ -271,6 +230,7 @@ function Placeholder(props) {
     }
   };
 
+  //function to set state value of onclick on widget's setting icon
   const handleWidgetsOnclick = () => {
     if (props.pos.type === "radio") {
       props.setIsRadio(true);
@@ -289,6 +249,7 @@ function Placeholder(props) {
     props.setWidgetType(props.pos.type);
     props.setCurrWidgetsDetails(props.pos);
   };
+  //function ro set state value of onclick on widget's copy icon
   const handleCopyPlaceholder = (e) => {
     if (props.data && props?.pos?.type !== textWidget) {
       props.setSignerObjId(props?.data?.signerObjId);
@@ -303,6 +264,35 @@ function Placeholder(props) {
     props.setSignKey(props.pos.key);
   };
 
+  //function to save date and format on local array onchange date and onclick format
+  const handleSaveDate = (data, isDateChange) => {
+    let updateDate = data.date;
+    //check if date change by user
+    if (isDateChange) {
+      //`changeDateToMomentFormat` is used to convert date as per required to moment package
+      updateDate = moment(data.date).format(
+        changeDateToMomentFormat(data.format)
+      );
+    }
+    //using moment package is used to change date as per the format provided in selectDate obj e.g. - MM/dd/yyyy -> 03/12/2024
+    //`getDefaultdate` is used to convert update date in new Date() format
+    const date = moment(
+      getDefaultdate(updateDate, data?.format).getTime()
+    ).format(changeDateToMomentFormat(data?.format));
+
+    //`onChangeInput` is used to save data related to date in a placeholder field
+    onChangeInput(
+      date,
+      props.pos.key,
+      props.xyPostion,
+      props.index,
+      props.setXyPostion,
+      props.data && props.data.Id,
+      false,
+      data?.format
+    );
+    setSelectDate({ date: date, format: data?.format });
+  };
   const PlaceholderIcon = () => {
     return (
       props.isShowBorder && (
@@ -439,10 +429,12 @@ function Placeholder(props) {
                         e.stopPropagation();
                         setIsShowDateFormat(!isShowDateFormat);
                         setSelectDate(data);
+                        handleSaveDate(data);
                       }}
                       onClick={() => {
                         setIsShowDateFormat(!isShowDateFormat);
                         setSelectDate(data);
+                        handleSaveDate(data);
                       }}
                       className="dropdown-item itemColor"
                       style={{ fontSize: "12px" }}
@@ -695,11 +687,10 @@ function Placeholder(props) {
             isNeedSign={props.isNeedSign}
             setSelectDate={setSelectDate}
             selectDate={selectDate}
-            setSaveDateFormat={setSaveDateFormat}
-            saveDateFormat={saveDateFormat}
             setValidateAlert={props.setValidateAlert}
             setStartDate={setStartDate}
             startDate={startDate}
+            handleSaveDate={handleSaveDate}
           />
         </div>
       ) : (
@@ -722,11 +713,10 @@ function Placeholder(props) {
             isNeedSign={props.isNeedSign}
             setSelectDate={setSelectDate}
             selectDate={selectDate}
-            setSaveDateFormat={setSaveDateFormat}
-            saveDateFormat={saveDateFormat}
             setValidateAlert={props.setValidateAlert}
             setStartDate={setStartDate}
             startDate={startDate}
+            handleSaveDate={handleSaveDate}
           />
         </>
       )}
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index c575bcd47..5151f794d 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -117,7 +117,6 @@ function PlaceholderType(props) {
           ? props.pos?.options?.defaultValue
           : ""
     );
-
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -135,54 +134,7 @@ function PlaceholderType(props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.pos?.options?.defaultValue]);
 
-  //useEffect to save date and format on local array
-  useEffect(() => {
-    if (type && type === "date") {
-      if (props?.selectDate) {
-        // let updateDate;
-        // if (props?.selectDate.format === "dd-MM-yyyy") {
-        //   // console.log('saveDateformat',props.saveDateFormat)
-        //   const [day, month, year] = props.saveDateFormat.split("-");
-        //   updateDate = new Date(`${year}-${month}-${day}`);
-        //   console.log('update',updateDate)
-        // } else {
-        //   if (props?.saveDateFormat) {
-        //     updateDate = new Date(props.saveDateFormat);
-        //   }
-        // }
-        // const updateDate = new Date(props.saveDateFormat);
-        // props.setStartDate(updateDate);
-        // const dateObj = {
-        //   date: props.saveDateFormat,
-        //   format: props.selectDate
-        //     ? props.selectDate?.format
-        //     : props.pos?.options?.validation?.format
-        //       ? props.pos?.options?.validation?.format
-        //       : "MM/dd/yyyy"
-        // };
-
-        // props.setSelectDate(dateObj);
-        onChangeInput(
-          props.saveDateFormat,
-          props.pos.key,
-          props.xyPostion,
-          props.index,
-          props.setXyPostion,
-          props.data && props.data.Id,
-          false,
-          props.selectDate?.format
-            ? props.selectDate.format
-            : props.pos?.options?.validation?.format
-              ? props.pos?.options?.validation?.format
-              : "MM/dd/yyyy"
-        );
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [props.saveDateFormat]);
-
   const dateValue = (value) => {
-    props.setSaveDateFormat(value);
     return <span>{value}</span>;
   };
   const ExampleCustomInput = forwardRef(({ value, onClick }, ref) => (
@@ -325,6 +277,16 @@ function PlaceholderType(props) {
     );
   };
 
+  //function to set onchange date
+  const handleOnDateChange = (date) => {
+    props.setStartDate(date);
+    const isDateChange = true;
+    const dateObj = {
+      date: date,
+      format: props.selectDate.format
+    };
+    props.handleSaveDate(dateObj, isDateChange);
+  };
   switch (type) {
     case "signature":
       return props.pos.SignUrl ? (
@@ -670,18 +632,10 @@ function PlaceholderType(props) {
                 : props.pos.options?.response &&
                   new Date(props.pos.options.response)
             }
-            onChange={(date) => {
-              props.setStartDate(date);
-            }}
+            onChange={(date) => handleOnDateChange(date)}
             popperPlacement="top-end"
             customInput={<ExampleCustomInput />}
             dateFormat={
-              // props.pos?.options?.validation?.format
-              //   ? props.pos?.options?.validation?.format
-              //   : props.selectDate
-              //   ? props.selectDate?.format
-              //   : "MM/dd/YYYY"
-
               props.selectDate
                 ? props.selectDate?.format
                 : props.pos?.options?.validation?.format
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index 1a8a2b3a6..dad40145d 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -249,7 +249,11 @@ export const addWidgetOptions = (type) => {
     case "job title":
       return { ...defaultOpt, validation: { type: "text", pattern: "" } };
     case "date":
-      return { ...defaultOpt, response: getDate() };
+      return {
+        ...defaultOpt,
+        response: getDate(),
+        validation: { format: "MM/dd/yyyy", type: "date-format" }
+      };
     case "image":
       return defaultOpt;
     case "email":
diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js
index f86bd1228..2dd3ec38b 100644
--- a/apps/OpenSign/src/pages/SignyourselfPdf.js
+++ b/apps/OpenSign/src/pages/SignyourselfPdf.js
@@ -381,7 +381,8 @@ function SignYourSelf() {
       case "date":
         return {
           name: "date",
-          defaultValue: getDate()
+          response: getDate(),
+          validation: { format: "MM/dd/yyyy", type: "date-format" }
         };
       case "image":
         return {

From 1b215f53e76ebed2150db4f916ece623d8371acf Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Wed, 13 Mar 2024 15:17:04 +0530
Subject: [PATCH 11/21] feat: add help for select folder input

---
 apps/OpenSign/package-lock.json               | 14 ++++++
 apps/OpenSign/package.json                    |  1 +
 .../components/shared/fields/CreateFolder.js  | 20 ++++++++-
 .../components/shared/fields/SelectFolder.js  | 44 ++++++++++++-------
 apps/OpenSign/src/primitives/Tooltip.js       | 18 ++++++++
 5 files changed, 78 insertions(+), 19 deletions(-)
 create mode 100644 apps/OpenSign/src/primitives/Tooltip.js

diff --git a/apps/OpenSign/package-lock.json b/apps/OpenSign/package-lock.json
index 94de8ab4c..e5fb4cc1e 100644
--- a/apps/OpenSign/package-lock.json
+++ b/apps/OpenSign/package-lock.json
@@ -43,6 +43,7 @@
         "react-scrollbars-custom": "^4.1.1",
         "react-select": "^5.8.0",
         "react-signature-canvas": "^1.0.6",
+        "react-tooltip": "^5.26.3",
         "reactour": "^1.19.2",
         "redux": "^4.2.1",
         "redux-thunk": "^2.4.2",
@@ -20145,6 +20146,19 @@
         }
       }
     },
+    "node_modules/react-tooltip": {
+      "version": "5.26.3",
+      "resolved": "https://registry.npmjs.org/react-tooltip/-/react-tooltip-5.26.3.tgz",
+      "integrity": "sha512-MpYAws8CEHUd/RC4GaDCdoceph/T4KHM5vS5Dbk8FOmLMvvIht2ymP2htWdrke7K6lqPO8rz8+bnwWUIXeDlzg==",
+      "dependencies": {
+        "@floating-ui/dom": "^1.6.1",
+        "classnames": "^2.3.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.14.0",
+        "react-dom": ">=16.14.0"
+      }
+    },
     "node_modules/react-transition-group": {
       "version": "4.4.5",
       "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
diff --git a/apps/OpenSign/package.json b/apps/OpenSign/package.json
index 80baff0ab..b1c11a070 100644
--- a/apps/OpenSign/package.json
+++ b/apps/OpenSign/package.json
@@ -38,6 +38,7 @@
     "react-scrollbars-custom": "^4.1.1",
     "react-select": "^5.8.0",
     "react-signature-canvas": "^1.0.6",
+    "react-tooltip": "^5.26.3",
     "reactour": "^1.19.2",
     "redux": "^4.2.1",
     "redux-thunk": "^2.4.2",
diff --git a/apps/OpenSign/src/components/shared/fields/CreateFolder.js b/apps/OpenSign/src/components/shared/fields/CreateFolder.js
index 80af92051..ec70bef19 100644
--- a/apps/OpenSign/src/components/shared/fields/CreateFolder.js
+++ b/apps/OpenSign/src/components/shared/fields/CreateFolder.js
@@ -11,6 +11,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
   const [name, setName] = useState("");
   const [folderList, setFolderList] = useState([]);
   const [isAlert, setIsAlert] = useState(false);
+  const [isLoader, setIsLoader] = useState(false);
   const [selectedParent, setSelectedParent] = useState();
   const [alert, setAlert] = useState({ type: "info", message: "" });
   useEffect(() => {
@@ -42,6 +43,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
   };
   const handleCreateFolder = async (event) => {
     event.preventDefault();
+    handleLoader(true);
     if (name) {
       const currentUser = Parse.User.current();
       const exsitQuery = new Parse.Query(folderCls);
@@ -52,7 +54,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
       }
       const templExist = await exsitQuery.first();
       if (templExist) {
-        setAlert({ type: "dange", message: "Folder already exist!" });
+        setAlert({ type: "danger", message: "Folder already exist!" });
         setIsAlert(true);
         setTimeout(() => {
           setIsAlert(false);
@@ -74,6 +76,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
         template.set("CreatedBy", Parse.User.createWithoutData(currentUser.id));
         const res = await template.save();
         if (res) {
+          handleLoader(false);
           setAlert({
             type: "success",
             message: "Folder created successfully!"
@@ -88,6 +91,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
         }
       }
     } else {
+      handleLoader(false);
       setAlert({ type: "info", message: "Please fill folder name" });
       setIsAlert(true);
       setTimeout(() => {
@@ -98,10 +102,21 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
   const handleOptions = (e) => {
     setSelectedParent(e.target.value);
   };
+  const handleLoader = (status) => {
+    setIsLoader(status);
+  };
   return (
     <div>
       {isAlert && <Alert type={alert.type}>{alert.message}</Alert>}
-      <div id="createFolder">
+      <div id="createFolder" className="relative">
+        {isLoader && (
+          <div className="absolute h-full w-full flex justify-center items-center ">
+            <div
+              style={{ fontSize: "45px", color: "#3dd3e0" }}
+              className="loader-37"
+            ></div>
+          </div>
+        )}
         <h1 className="text-base font-semibold">Create Folder</h1>
         <div className="text-xs mt-2">
           <label className="block">
@@ -133,6 +148,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => {
         <div>
           <button
             onClick={handleCreateFolder}
+            disabled={isLoader}
             className="flex items-center rounded p-2 bg-[#32a3ac] text-white mt-3"
           >
             <i className="fa-solid fa-plus mr-1"></i>
diff --git a/apps/OpenSign/src/components/shared/fields/SelectFolder.js b/apps/OpenSign/src/components/shared/fields/SelectFolder.js
index ff4798b0b..ff9839249 100644
--- a/apps/OpenSign/src/components/shared/fields/SelectFolder.js
+++ b/apps/OpenSign/src/components/shared/fields/SelectFolder.js
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from "react";
 import Parse from "parse";
 import CreateFolder from "./CreateFolder";
 import ModalUi from "../../../primitives/ModalUi";
+import Tooltip from "../../../primitives/Tooltip";
 
 const SelectFolder = ({ required, onSuccess, folderCls }) => {
   const [isOpen, SetIsOpen] = useState(false);
@@ -145,7 +146,7 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
           {required && <span className="text-red-500 text-[13px]">*</span>}
         </label>
       </div>
-      <div className="rounded px-[20px] py-[20px] bg-white border border-gray-200 shadow flex max-w-sm gap-8 items-center">
+      <div className="relative rounded px-[20px] py-[20px] bg-white border border-gray-200 shadow flex max-w-sm gap-8 items-center">
         <div>
           <i
             className="far fa-folder-open text-[40px] text-[#33bbff]"
@@ -170,6 +171,13 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
             {selectFolder && selectFolder.Name ? `(${folderPath})` : ""}
           </p>
         </div>
+        <div className="absolute top-1 right-1 cursor-pointer">
+          <Tooltip
+            message={
+              "If you do not select a folder, your signed document will be saved in the Main OpenSign drive folder."
+            }
+          />
+        </div>
       </div>
       <ModalUi
         title={"Select Folder"}
@@ -201,23 +209,25 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
             <hr />
           </div>
           <div className="mt-2 mb-3">
-            {!isAdd &&
-              folderList.length > 0 &&
-              folderList.map((folder) => (
-                <div
-                  key={folder.Name}
-                  className="border-[1px] border-[#8a8a8a] px-2 py-2 mb-2 cursor-pointer"
-                  onClick={() => handleSelect(folder)}
-                >
-                  <div className="flex items-center gap-2">
-                    <i
-                      className="fa fa-folder text-[#33bbff] text-[1.4rem]"
-                      aria-hidden="true"
-                    ></i>
-                    <span className="font-semibold">{folder.Name}</span>
+            <div className="max-h-[210px] overflow-auto">
+              {!isAdd &&
+                folderList.length > 0 &&
+                folderList.map((folder) => (
+                  <div
+                    key={folder.Name}
+                    className="border-[1px] border-[#8a8a8a] px-2 py-2 mb-2 cursor-pointer "
+                    onClick={() => handleSelect(folder)}
+                  >
+                    <div className="flex items-center gap-2">
+                      <i
+                        className="fa fa-folder text-[#33bbff] text-[1.4rem]"
+                        aria-hidden="true"
+                      ></i>
+                      <span className="font-semibold">{folder.Name}</span>
+                    </div>
                   </div>
-                </div>
-              ))}
+                ))}
+            </div>
             {isAdd && (
               <CreateFolder
                 parentFolderId={clickFolder && clickFolder.ObjectId}
diff --git a/apps/OpenSign/src/primitives/Tooltip.js b/apps/OpenSign/src/primitives/Tooltip.js
new file mode 100644
index 000000000..2d1edcd82
--- /dev/null
+++ b/apps/OpenSign/src/primitives/Tooltip.js
@@ -0,0 +1,18 @@
+import React from "react";
+// import * as HoverCard from "@radix-ui/react-hover-card";
+// import "../styles/opensigndrive.css";
+import { Tooltip as ReactTooltip } from "react-tooltip";
+const Tooltip = ({ children, message }) => (
+  <>
+    <a data-tooltip-id="my-tooltip" data-tooltip-content={message}>
+      {children ? (
+        children
+      ) : (
+        <i className="fa-solid fa-question  border-[1.5px] px-1.5 py-0.5 rounded-full border-[#33bbff] text-xs text-[#33bbff]"></i>
+      )}
+    </a>
+    <ReactTooltip id="my-tooltip" className="max-w-[200px]" />
+  </>
+);
+
+export default Tooltip;

From 6004522d5cdba5efdeb24023abab08a6b7ab6793 Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 13 Mar 2024 16:36:03 +0530
Subject: [PATCH 12/21] feat: change radio widgets name radio to radio button

---
 .../components/pdf/DropdownWidgetOption.js    |  9 ++--
 .../src/components/pdf/Placeholder.js         | 43 ++++++++++++-------
 .../src/components/pdf/PlaceholderBorder.js   |  3 +-
 .../src/components/pdf/PlaceholderType.js     |  3 +-
 .../src/components/pdf/WidgetComponent.js     | 17 +++++---
 apps/OpenSign/src/constant/Utils.js           | 11 ++---
 apps/OpenSign/src/pages/PdfRequestFiles.js    | 11 +++--
 apps/OpenSign/src/pages/PlaceHolderSign.js    |  9 ++--
 .../OpenSign/src/pages/TemplatePlaceholder.js |  9 ++--
 9 files changed, 70 insertions(+), 45 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
index 1d8a075cf..1d9b2f415 100644
--- a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
+++ b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
@@ -1,6 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { themeColor } from "../../constant/const";
 import ModalUi from "../../primitives/ModalUi";
+import { radioButtonWidget } from "../../constant/Utils";
 function DropdownWidgetOption(props) {
   const [dropdownOptionList, setDropdownOptionList] = useState([
     "option-1",
@@ -143,7 +144,7 @@ function DropdownWidgetOption(props) {
       //   styleClass={"dropdownModal"}
       isOpen={props.showDropdown}
       title={props.title}
-      closeOff={true}
+      showClose={false}
     >
       <div style={{ height: "100%", padding: 20 }}>
         <form
@@ -153,7 +154,7 @@ function DropdownWidgetOption(props) {
           }}
         >
           <div className="dropdownContainer">
-            {["checkbox", "radio"].includes(props.type) &&
+            {["checkbox", radioButtonWidget].includes(props.type) &&
               !props.isSignYourself && (
                 <div>
                   <input
@@ -285,7 +286,7 @@ function DropdownWidgetOption(props) {
                 </>
               )}
             </div>
-            {["dropdown", "radio"].includes(props.type) && (
+            {["dropdown", radioButtonWidget].includes(props.type) && (
               <>
                 <label
                   style={{
@@ -320,7 +321,7 @@ function DropdownWidgetOption(props) {
                 </select>
               </>
             )}
-            {props.type !== "checkbox" && props.type !== "radio" && (
+            {props.type !== "checkbox" && props.type !== radioButtonWidget && (
               <>
                 <div
                   style={{
diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 9ab841933..719ed77a1 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -6,6 +6,7 @@ import {
   defaultWidthHeight,
   isMobile,
   onChangeInput,
+  radioButtonWidget,
   textInputWidget,
   textWidget
 } from "../../constant/Utils";
@@ -232,7 +233,7 @@ function Placeholder(props) {
 
   //function to set state value of onclick on widget's setting icon
   const handleWidgetsOnclick = () => {
-    if (props.pos.type === "radio") {
+    if (props.pos.type === radioButtonWidget) {
       props.setIsRadio(true);
     } else if (props.pos.type === "dropdown") {
       props?.setShowDropdown(true);
@@ -335,10 +336,14 @@ function Placeholder(props) {
                     className="fa-solid fa-gear settingIcon"
                     style={{
                       color: "#188ae2",
-                      right: ["checkbox", "radio"].includes(props.pos.type)
+                      right: ["checkbox", radioButtonWidget].includes(
+                        props.pos.type
+                      )
                         ? "24px"
                         : "47px",
-                      top: ["checkbox", "radio"].includes(props.pos.type)
+                      top: ["checkbox", radioButtonWidget].includes(
+                        props.pos.type
+                      )
                         ? "-28px"
                         : "-19px"
                     }}
@@ -364,12 +369,12 @@ function Placeholder(props) {
                     color: "#188ae2",
                     right:
                       props.pos.type === "checkbox" ||
-                      props.pos.type === "radio"
+                      props.pos.type === radioButtonWidget
                         ? "8px"
                         : "32px",
                     top:
                       props.pos.type === "checkbox" ||
-                      props.pos.type === "radio"
+                      props.pos.type === radioButtonWidget
                         ? "-28px"
                         : "-18px"
                   }}
@@ -457,11 +462,13 @@ function Placeholder(props) {
             style={{
               color: "#188ae2",
               right:
-                props.pos.type === "checkbox" || props.pos.type === "radio"
+                props.pos.type === "checkbox" ||
+                props.pos.type === radioButtonWidget
                   ? "-9px"
                   : "12px",
               top:
-                props.pos.type === "checkbox" || props.pos.type === "radio"
+                props.pos.type === "checkbox" ||
+                props.pos.type === radioButtonWidget
                   ? "-28px"
                   : "-18px"
             }}
@@ -490,11 +497,13 @@ function Placeholder(props) {
             style={{
               color: "#188ae2",
               right:
-                props.pos.type === "checkbox" || props.pos.type === "radio"
+                props.pos.type === "checkbox" ||
+                props.pos.type === radioButtonWidget
                   ? "-27px"
                   : "-8px",
               top:
-                props.pos.type === "checkbox" || props.pos.type === "radio"
+                props.pos.type === "checkbox" ||
+                props.pos.type === radioButtonWidget
                   ? "-28px"
                   : "-18px"
             }}
@@ -526,10 +535,10 @@ function Placeholder(props) {
           props.data && props.isNeedSign
             ? props.data?.signerObjId === props.signerObjId &&
               props.pos.type !== "checkbox" &&
-              props.pos.type !== "radio"
+              props.pos.type !== radioButtonWidget
               ? true
               : false
-            : props.pos.type !== "radio" &&
+            : props.pos.type !== radioButtonWidget &&
               props.pos.type !== "checkbox" &&
               props.pos.key === props.selectWidgetId &&
               true,
@@ -614,31 +623,33 @@ function Placeholder(props) {
       }}
     >
       {props.isShowBorder &&
-      props.pos.type !== "radio" &&
+      props.pos.type !== radioButtonWidget &&
       props.pos.type !== "checkbox" &&
       props.pos.key === props.selectWidgetId ? (
         <BorderResize
           right={
-            props.pos.type === "checkbox" || props.pos.type === "radio"
+            props.pos.type === "checkbox" ||
+            props.pos.type === radioButtonWidget
               ? -21
               : -12
           }
           top={
-            props.pos.type === "checkbox" || props.pos.type === "radio"
+            props.pos.type === "checkbox" ||
+            props.pos.type === radioButtonWidget
               ? -21
               : -11
           }
         />
       ) : props.data && props.isNeedSign && props.pos.type !== "checkbox" ? (
         props.data?.signerObjId === props.signerObjId &&
-        props.pos.type !== "radio" &&
+        props.pos.type !== radioButtonWidget &&
         props.pos.type !== "checkbox" ? (
           <BorderResize />
         ) : (
           <></>
         )
       ) : (
-        props.pos.type !== "radio" &&
+        props.pos.type !== radioButtonWidget &&
         props.pos.type !== "checkbox" &&
         props.pos.key === props.selectWidgetId && <BorderResize />
       )}
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
index 543d17ac7..996d1332a 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
@@ -2,11 +2,12 @@ import React from "react";
 import { themeColor } from "../../constant/const";
 import {
   defaultWidthHeight,
+  radioButtonWidget,
   resizeBorderExtraWidth
 } from "../../constant/Utils";
 function PlaceholderBorder(props) {
   const getResizeBorderExtraWidth =
-    props.pos.type === "checkbox" || props.pos.type === "radio"
+    props.pos.type === "checkbox" || props.pos.type === radioButtonWidget
       ? 38
       : resizeBorderExtraWidth();
   const defaultWidth = defaultWidthHeight(props.pos.type).width;
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 5151f794d..e61310f8f 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -3,6 +3,7 @@ import {
   getMonth,
   getYear,
   onChangeInput,
+  radioButtonWidget,
   range,
   textInputWidget,
   textWidget
@@ -700,7 +701,7 @@ function PlaceholderType(props) {
           <span>{type}</span>
         </div>
       );
-    case "radio":
+    case radioButtonWidget:
       return (
         <div>
           {props.pos.options?.values.map((data, ind) => {
diff --git a/apps/OpenSign/src/components/pdf/WidgetComponent.js b/apps/OpenSign/src/components/pdf/WidgetComponent.js
index 1aa721c8a..101095648 100644
--- a/apps/OpenSign/src/components/pdf/WidgetComponent.js
+++ b/apps/OpenSign/src/components/pdf/WidgetComponent.js
@@ -3,7 +3,12 @@ import ModalUi from "../../primitives/ModalUi";
 import RecipientList from "./RecipientList";
 import { useDrag } from "react-dnd";
 import WidgetList from "./WidgetList";
-import { textInputWidget, textWidget, widgets } from "../../constant/Utils";
+import {
+  radioButtonWidget,
+  textInputWidget,
+  textWidget,
+  widgets
+} from "../../constant/Utils";
 import { themeColor } from "../../constant/const";
 function WidgetComponent({
   dragSignature,
@@ -152,16 +157,16 @@ function WidgetComponent({
       isDragEmail: !!monitor.isDragging()
     })
   });
-  const [, radio] = useDrag({
+  const [, radioButton] = useDrag({
     type: "BOX",
 
     item: {
       type: "BOX",
       id: 15,
-      text: "radio"
+      text: radioButtonWidget
     },
     collect: (monitor) => ({
-      isDragRadio: !!monitor.isDragging()
+      isDragRadiotton: !!monitor.isDragging()
     })
   });
   const [, text] = useDrag({
@@ -211,7 +216,7 @@ function WidgetComponent({
       textInput,
       checkbox,
       dropdown,
-      radio,
+      radioButton,
       image,
       email
     ];
@@ -227,7 +232,7 @@ function WidgetComponent({
   const filterWidgets = widget.filter(
     (data) =>
       data.type !== "dropdown" &&
-      data.type !== "radio" &&
+      data.type !== radioButtonWidget &&
       data.type !== textWidget
   );
   const textWidgetData = widget.filter((data) => data.type !== textWidget);
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index dad40145d..7e26226c2 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -7,6 +7,7 @@ import { rgb } from "pdf-lib";
 export const isMobile = window.innerWidth < 767;
 export const textInputWidget = "text input";
 export const textWidget = "text";
+export const radioButtonWidget = "radio button";
 export const openInNewTab = (url) => {
   window.open(url, "_blank", "noopener,noreferrer");
 };
@@ -204,7 +205,7 @@ export const widgets = [
     iconSize: "19px"
   },
   {
-    type: "radio",
+    type: radioButtonWidget,
     icon: "fa-regular fa-circle-dot",
     iconSize: "20px"
   },
@@ -260,7 +261,7 @@ export const addWidgetOptions = (type) => {
       return { ...defaultOpt, validation: { type: "email", pattern: "" } };
     case "dropdown":
       return defaultOpt;
-    case "radio":
+    case radioButtonWidget:
       return { ...defaultOpt, values: [] };
     case textWidget:
       return defaultOpt;
@@ -346,7 +347,7 @@ export const defaultWidthHeight = (type) => {
       return { width: 70, height: 70 };
     case "email":
       return { width: 150, height: 20 };
-    case "radio":
+    case radioButtonWidget:
       return { width: 15, height: 30 };
     case textWidget:
       return { width: 150, height: 17 };
@@ -1078,7 +1079,7 @@ export const multiSignEmbed = async (
           ? labelDefaultHeight
           : scaleHeight;
         const widgetHeight =
-          position.type === "radio"
+          position.type === radioButtonWidget
             ? 10
             : position.type === "checkbox"
               ? 10
@@ -1272,7 +1273,7 @@ export const multiSignEmbed = async (
           height: scaleHeight
         });
         dropdown.enableReadOnly();
-      } else if (position.type === "radio") {
+      } else if (position.type === radioButtonWidget) {
         const radioRandomId = "radio" + randomId();
         const radioGroup = form.createRadioGroup(radioRandomId);
         let addYPosition = 18;
diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js
index 2c8c7e241..326d029b9 100644
--- a/apps/OpenSign/src/pages/PdfRequestFiles.js
+++ b/apps/OpenSign/src/pages/PdfRequestFiles.js
@@ -19,7 +19,8 @@ import {
   onImageSelect,
   onSaveSign,
   onSaveImage,
-  addDefaultSignatureImg
+  addDefaultSignatureImg,
+  radioButtonWidget
 } from "../constant/Utils";
 import Loader from "../primitives/LoaderWithMsg";
 import HandleError from "../primitives/HandleError";
@@ -385,7 +386,8 @@ function PdfRequestFiles() {
           for (let j = 0; j < checkUser[0].placeHolder[i].pos.length; j++) {
             checkboxExist =
               checkUser[0].placeHolder[i].pos[j].type === "checkbox";
-            radioExist = checkUser[0].placeHolder[i].pos[j].type === "radio";
+            radioExist =
+              checkUser[0].placeHolder[i].pos[j].type === radioButtonWidget;
             if (checkboxExist) {
               requiredCheckbox = checkUser[0].placeHolder[i].pos.filter(
                 (position) =>
@@ -434,7 +436,8 @@ function PdfRequestFiles() {
             } else if (radioExist) {
               requiredRadio = checkUser[0].placeHolder[i].pos.filter(
                 (position) =>
-                  !position.options?.isReadOnly && position.type === "radio"
+                  !position.options?.isReadOnly &&
+                  position.type === radioButtonWidget
               );
               if (requiredRadio && requiredRadio?.length > 0) {
                 let checkSigned;
@@ -457,7 +460,7 @@ function PdfRequestFiles() {
               const requiredWidgets = checkUser[0].placeHolder[i].pos.filter(
                 (position) =>
                   position.options?.status === "required" &&
-                  position.type !== "radio" &&
+                  position.type !== radioButtonWidget &&
                   position.type !== "checkbox"
               );
               if (requiredWidgets && requiredWidgets?.length > 0) {
diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js
index 13dc516ba..7fe365374 100644
--- a/apps/OpenSign/src/pages/PlaceHolderSign.js
+++ b/apps/OpenSign/src/pages/PlaceHolderSign.js
@@ -26,7 +26,8 @@ import {
   multiSignEmbed,
   addWidgetOptions,
   textInputWidget,
-  textWidget
+  textWidget,
+  radioButtonWidget
 } from "../constant/Utils";
 import RenderPdf from "../components/pdf/RenderPdf";
 import { useNavigate } from "react-router-dom";
@@ -484,7 +485,7 @@ function PlaceHolderSign() {
           setShowDropdown(true);
         } else if (dragTypeValue === "checkbox") {
           setIsCheckbox(true);
-        } else if (dragTypeValue === "radio") {
+        } else if (dragTypeValue === radioButtonWidget) {
           setIsRadio(true);
         } else if (
           dragTypeValue !== textWidget &&
@@ -1070,7 +1071,7 @@ function PlaceHolderSign() {
         const getPosData = getXYdata;
         const addSignPos = getPosData.map((position) => {
           if (position.key === signKey) {
-            if (widgetType === "radio") {
+            if (widgetType === radioButtonWidget) {
               if (addOption) {
                 return {
                   ...position,
@@ -1563,7 +1564,7 @@ function PlaceHolderSign() {
                 setTempSignerId={setTempSignerId}
               />
               <DropdownWidgetOption
-                type="radio"
+                type={radioButtonWidget}
                 title="Radio group"
                 showDropdown={isRadio}
                 setShowDropdown={setIsRadio}
diff --git a/apps/OpenSign/src/pages/TemplatePlaceholder.js b/apps/OpenSign/src/pages/TemplatePlaceholder.js
index a9e06c29e..76b5ef7ac 100644
--- a/apps/OpenSign/src/pages/TemplatePlaceholder.js
+++ b/apps/OpenSign/src/pages/TemplatePlaceholder.js
@@ -23,7 +23,8 @@ import {
   defaultWidthHeight,
   addWidgetOptions,
   textInputWidget,
-  textWidget
+  textWidget,
+  radioButtonWidget
 } from "../constant/Utils";
 import RenderPdf from "../components/pdf/RenderPdf";
 import "../styles/AddUser.css";
@@ -444,7 +445,7 @@ const TemplatePlaceholder = () => {
           setShowDropdown(true);
         } else if (dragTypeValue === "checkbox") {
           setIsCheckbox(true);
-        } else if (dragTypeValue === "radio") {
+        } else if (dragTypeValue === radioButtonWidget) {
           setIsRadio(true);
         } else if (
           dragTypeValue !== textWidget &&
@@ -991,7 +992,7 @@ const TemplatePlaceholder = () => {
         const getPosData = getXYdata;
         const addSignPos = getPosData.map((position) => {
           if (position.key === signKey) {
-            if (widgetType === "radio") {
+            if (widgetType === radioButtonWidget) {
               if (addOption) {
                 return {
                   ...position,
@@ -1310,7 +1311,7 @@ const TemplatePlaceholder = () => {
                 </div>
               </ModalUi>
               <DropdownWidgetOption
-                type="radio"
+                type={radioButtonWidget}
                 title="Radio group"
                 showDropdown={isRadio}
                 setShowDropdown={setIsRadio}

From 53147caebccce09cb54c07e2e2ba6ec0619234d7 Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 13 Mar 2024 17:47:31 +0530
Subject: [PATCH 13/21] fix: checkbox checked issue in signyour-self flow

---
 .../src/components/pdf/Placeholder.js         | 32 ++++++++++++-------
 1 file changed, 21 insertions(+), 11 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 719ed77a1..bb93d16ba 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -90,20 +90,29 @@ function Placeholder(props) {
   const [isDraggingEnabled, setDraggingEnabled] = useState(true);
   const [isShowDateFormat, setIsShowDateFormat] = useState(false);
   const [selectDate, setSelectDate] = useState({
-    date: moment(
-      getDefaultdate(
-        props?.pos?.options?.response,
-        props.pos?.options?.validation?.format
-      ).getTime()
-    ).format(changeDateToMomentFormat(props.pos?.options?.validation?.format)),
-    format: getDefaultFormat(props.pos?.options?.validation?.format)
+    date:
+      props.pos.type === "date"
+        ? moment(
+            getDefaultdate(
+              props?.pos?.options?.response,
+              props.pos?.options?.validation?.format
+            ).getTime()
+          ).format(
+            changeDateToMomentFormat(props.pos?.options?.validation?.format)
+          )
+        : "",
+    format:
+      props.pos.type === "date"
+        ? getDefaultFormat(props.pos?.options?.validation?.format)
+        : ""
   });
   const [dateFormat, setDateFormat] = useState([]);
   const [startDate, setStartDate] = useState(
-    getDefaultdate(
-      props?.pos?.options?.response,
-      props.pos?.options?.validation?.format
-    )
+    props.pos.type === "date" &&
+      getDefaultdate(
+        props?.pos?.options?.response,
+        props.pos?.options?.validation?.format
+      )
   );
   const dateFormatArr = [
     "L",
@@ -117,6 +126,7 @@ function Placeholder(props) {
     "DD MMMM, YYYY"
   ];
 
+  useEffect(() => {}, []);
   //function change format array list with selected date and format
   const changeDateFormat = () => {
     const updateDate = [];

From 82eeffa6e4b4f8914f62f9fdde6f42c55bc8c841 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Wed, 13 Mar 2024 18:36:24 +0530
Subject: [PATCH 14/21] fix: reset button not working in forms

---
 .../components/shared/fields/SelectFolder.js  | 25 ++++++++++++++++++-
 apps/OpenSign/src/pages/Form.js               | 22 ++++++++++++----
 2 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/apps/OpenSign/src/components/shared/fields/SelectFolder.js b/apps/OpenSign/src/components/shared/fields/SelectFolder.js
index ff9839249..eb4cac824 100644
--- a/apps/OpenSign/src/components/shared/fields/SelectFolder.js
+++ b/apps/OpenSign/src/components/shared/fields/SelectFolder.js
@@ -4,7 +4,7 @@ import CreateFolder from "./CreateFolder";
 import ModalUi from "../../../primitives/ModalUi";
 import Tooltip from "../../../primitives/Tooltip";
 
-const SelectFolder = ({ required, onSuccess, folderCls }) => {
+const SelectFolder = ({ required, onSuccess, folderCls, isReset }) => {
   const [isOpen, SetIsOpen] = useState(false);
   const [clickFolder, setClickFolder] = useState("");
   const [selectFolder, setSelectedFolder] = useState({});
@@ -23,6 +23,21 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
     }
     // eslint-disable-next-line
   }, [isOpen]);
+  // below useEffect is used to reset folder selection if user pass isReset = true from parent component
+  useEffect(() => {
+    if (isReset == true) {
+      handleReset();
+    }
+  }, [isReset]);
+  const handleReset = () => {
+    setFolderPath({});
+    setSelectedFolder("");
+    setClickFolder("");
+    setIsAdd(false);
+    setFolderList([]);
+    setTabList([]);
+  };
+  // `fetchFolder` is used to fetch of folder list created by user on basis of folderPtr or without folderPtr
   const fetchFolder = async (folderPtr) => {
     setIsLoader(true);
     try {
@@ -48,6 +63,8 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
       setIsLoader(false);
     }
   };
+
+  // `handleSelect` is used to save pointer of folder selected by user and it's path in state
   const handleSelect = (item) => {
     setFolderList([]);
     setClickFolder({ ObjectId: item.objectId, Name: item.Name });
@@ -74,6 +91,7 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
     }
   };
 
+  // `handleSubmit` is used to pass folderPtr to parent component
   const handleSubmit = () => {
     let url = "Root";
     tabList.forEach((t) => {
@@ -86,6 +104,8 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
     }
     SetIsOpen(false);
   };
+
+  // `handleCancel` is used to clear list of folder, close popup and folderUrl
   const handleCancel = () => {
     SetIsOpen(false);
     setClickFolder({});
@@ -93,6 +113,7 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
     setTabList([]);
   };
 
+  // `handleCancel` is call when user click on folder name from path/tab in popup
   const removeTabListItem = async (e, i) => {
     e.preventDefault();
     // setEditable(false);
@@ -122,9 +143,11 @@ const SelectFolder = ({ required, onSuccess, folderCls }) => {
       fetchFolder(folderPtr);
     }
   };
+  // `handleCreate` is used to open folder creation form in popup
   const handleCreate = () => {
     setIsAdd(!isAdd);
   };
+  // `handleAddFolder` is call when user folder created successfully and it fetch folder list on the basis of folderPtr or without folderPtr
   const handleAddFolder = () => {
     setFolderList([]);
     if (clickFolder && clickFolder.ObjectId) {
diff --git a/apps/OpenSign/src/pages/Form.js b/apps/OpenSign/src/pages/Form.js
index a954b061c..a3b89cb2c 100644
--- a/apps/OpenSign/src/pages/Form.js
+++ b/apps/OpenSign/src/pages/Form.js
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { formJson } from "../json/FormJson";
 import AddUser from "../components/AddUser";
@@ -11,6 +11,7 @@ import SignersInput from "../components/shared/fields/SignersInput";
 import Title from "../components/Title";
 import PageNotFound from "./PageNotFound";
 
+// `Form` render all type of Form on this basis of their provided in path
 function Form() {
   const { id } = useParams();
 
@@ -40,13 +41,16 @@ const Forms = (props) => {
   const [fileupload, setFileUpload] = useState([]);
   const [fileload, setfileload] = useState(false);
   const [percentage, setpercentage] = useState(0);
+  const [isFolderReset, setIsFolderReset] = useState(false);
   const [isAlert, setIsAlert] = useState(false);
   const [isSubmit, setIsSubmit] = useState(false);
   const [isErr, setIsErr] = useState("");
   const handleStrInput = (e) => {
     setFormData({ ...formData, [e.target.name]: e.target.value });
   };
-
+  useEffect(() => {
+    handleReset();
+  }, [props.title]);
   const handleFileInput = (e) => {
     setpercentage(0);
     try {
@@ -222,15 +226,19 @@ const Forms = (props) => {
   };
 
   const handleReset = () => {
+    setIsFolderReset(true);
     setSigners([]);
     setFolder({ ObjectId: "", Name: "" });
     setFormData({
       Name: "",
       Description: "",
-      Note: ""
+      Note: "Please review and sign this document",
+      TimeToCompleteDays: 15,
+      SendinOrder: "false"
     });
     setFileUpload([]);
     setpercentage(0);
+    setTimeout(() => setIsFolderReset(false), 50);
   };
   return (
     <div className="shadow-md rounded my-2 p-3 bg-[#ffffff] md:border-[1px] md:border-gray-600/50">
@@ -347,7 +355,11 @@ const Forms = (props) => {
               required
             />
           </div>
-          <SelectFolder onSuccess={handleFolder} folderCls={props.Cls} />
+          <SelectFolder
+            onSuccess={handleFolder}
+            folderCls={props.Cls}
+            isReset={isFolderReset}
+          />
 
           {props.title === "Request Signatures" && (
             <div className="text-xs mt-2">
@@ -402,7 +414,7 @@ const Forms = (props) => {
               Submit
             </button>
             <div
-              className="bg-[#188ae2] rounded-sm shadow-md text-[13px] font-semibold uppercase text-white py-1.5 px-2.5 text-center ml-[2px] focus:outline-none"
+              className="cursor-pointer bg-[#188ae2] rounded-sm shadow-md text-[13px] font-semibold uppercase text-white py-1.5 px-2.5 text-center ml-[2px] focus:outline-none"
               onClick={() => handleReset()}
             >
               Reset

From 27730c89e86fb67e51313b0c52f78e41ca2ece75 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Wed, 13 Mar 2024 20:17:22 +0530
Subject: [PATCH 15/21] fix: signers not get reset in request signature form on
 reset button

---
 .../src/components/shared/fields/SignersInput.js     |  7 ++++++-
 apps/OpenSign/src/pages/Form.js                      | 12 +++++++-----
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/apps/OpenSign/src/components/shared/fields/SignersInput.js b/apps/OpenSign/src/components/shared/fields/SignersInput.js
index efe2c58a8..5f00dbfb0 100644
--- a/apps/OpenSign/src/components/shared/fields/SignersInput.js
+++ b/apps/OpenSign/src/components/shared/fields/SignersInput.js
@@ -19,7 +19,7 @@ const SignersInput = (props) => {
   Modal.setAppElement("body");
   const [state, setState] = useState(undefined);
   // const [editFormData, setEditFormData] = useState([]);
-  const [selected, setSelected] = React.useState([]);
+  const [selected, setSelected] = useState([]);
   const [isModal, setIsModel] = useState(false);
   const onChange = (selectedOptions) => setSelected(selectedOptions);
   const [modalIsOpen, setModalIsOpen] = useState(false);
@@ -63,6 +63,11 @@ const SignersInput = (props) => {
   useEffect(() => {
     GetSelectListData();
   }, []);
+  useEffect(() => {
+    if (props.isReset && props.isReset === true) {
+      setSelected([]);
+    }
+  }, [props.isReset]);
 
   useEffect(() => {
     if (selected && selected.length) {
diff --git a/apps/OpenSign/src/pages/Form.js b/apps/OpenSign/src/pages/Form.js
index a3b89cb2c..bd081ef12 100644
--- a/apps/OpenSign/src/pages/Form.js
+++ b/apps/OpenSign/src/pages/Form.js
@@ -41,7 +41,7 @@ const Forms = (props) => {
   const [fileupload, setFileUpload] = useState([]);
   const [fileload, setfileload] = useState(false);
   const [percentage, setpercentage] = useState(0);
-  const [isFolderReset, setIsFolderReset] = useState(false);
+  const [isReset, setIsReset] = useState(false);
   const [isAlert, setIsAlert] = useState(false);
   const [isSubmit, setIsSubmit] = useState(false);
   const [isErr, setIsErr] = useState("");
@@ -226,7 +226,7 @@ const Forms = (props) => {
   };
 
   const handleReset = () => {
-    setIsFolderReset(true);
+    setIsReset(true);
     setSigners([]);
     setFolder({ ObjectId: "", Name: "" });
     setFormData({
@@ -238,7 +238,7 @@ const Forms = (props) => {
     });
     setFileUpload([]);
     setpercentage(0);
-    setTimeout(() => setIsFolderReset(false), 50);
+    setTimeout(() => setIsReset(false), 50);
   };
   return (
     <div className="shadow-md rounded my-2 p-3 bg-[#ffffff] md:border-[1px] md:border-gray-600/50">
@@ -342,7 +342,9 @@ const Forms = (props) => {
               onChange={(e) => handleStrInput(e)}
             />
           </div>
-          {props.signers && <SignersInput onChange={handleSigners} required />}
+          {props.signers && (
+            <SignersInput onChange={handleSigners} isReset={isReset} required />
+          )}
           <div className="text-xs mt-2">
             <label className="block">
               Note<span className="text-red-500 text-[13px]">*</span>
@@ -358,7 +360,7 @@ const Forms = (props) => {
           <SelectFolder
             onSuccess={handleFolder}
             folderCls={props.Cls}
-            isReset={isFolderReset}
+            isReset={isReset}
           />
 
           {props.title === "Request Signatures" && (

From 86b0e909481ab53bf9b755ceca74886ffab8e87f Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 13 Mar 2024 20:25:18 +0530
Subject: [PATCH 16/21] fix: date z-index and default data of
 email,name,company name, job title widgets in guest login flow

---
 apps/OpenSign/src/components/pdf/Placeholder.js     | 4 +++-
 apps/OpenSign/src/components/pdf/PlaceholderType.js | 2 +-
 apps/OpenSign/src/components/pdf/RenderPdf.js       | 2 ++
 apps/OpenSign/src/pages/GuestLogin.js               | 9 +++++++++
 apps/OpenSign/src/pages/PdfRequestFiles.js          | 4 ++++
 5 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index bb93d16ba..ff0f199e4 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -573,7 +573,9 @@ function Placeholder(props) {
             : "all-scroll",
         zIndex:
           props.pos.type === "date"
-            ? "99"
+            ? props.pos.key === props.selectWidgetId
+              ? 99 + 1
+              : 99
             : props?.pos?.zIndex
               ? props.pos.zIndex
               : "5",
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index e61310f8f..7d10c3ef4 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -133,7 +133,7 @@ function PlaceholderType(props) {
       }
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [props.pos?.options?.defaultValue]);
+  }, [props.pos]);
 
   const dateValue = (value) => {
     return <span>{value}</span>;
diff --git a/apps/OpenSign/src/components/pdf/RenderPdf.js b/apps/OpenSign/src/components/pdf/RenderPdf.js
index 2ed1493eb..7e7cadef6 100644
--- a/apps/OpenSign/src/components/pdf/RenderPdf.js
+++ b/apps/OpenSign/src/components/pdf/RenderPdf.js
@@ -270,6 +270,8 @@ function RenderPdf({
                         setIsInitial={setIsInitial}
                         setValidateAlert={setValidateAlert}
                         unSignedWidgetId={unSignedWidgetId}
+                        setSelectWidgetId={setSelectWidgetId}
+                        selectWidgetId={selectWidgetId}
                       />
                     </React.Fragment>
                   )
diff --git a/apps/OpenSign/src/pages/GuestLogin.js b/apps/OpenSign/src/pages/GuestLogin.js
index 5ddf29b65..6f048a64a 100644
--- a/apps/OpenSign/src/pages/GuestLogin.js
+++ b/apps/OpenSign/src/pages/GuestLogin.js
@@ -4,6 +4,7 @@ import "../styles/loginPage.css";
 import loader from "../assets/images/loader2.gif";
 import axios from "axios";
 import { themeColor } from "../constant/const";
+import { contractUsers } from "../constant/Utils";
 
 function GuestLogin() {
   const { id, userMail, contactBookId, serverUrl } = useParams();
@@ -103,11 +104,19 @@ function GuestLogin() {
         } else {
           let _user = user.data.result;
           const parseId = localStorage.getItem("parseAppId");
+          const contractUserDetails = await contractUsers(_user.email);
           localStorage.setItem("UserInformation", JSON.stringify(_user));
           localStorage.setItem(
             `Parse/${parseId}/currentUser`,
             JSON.stringify(_user)
           );
+          if (contractUserDetails) {
+            localStorage.setItem(
+              "Extand_Class",
+              JSON.stringify(contractUserDetails)
+            );
+          }
+
           localStorage.setItem("username", _user.name);
           localStorage.setItem("accesstoken", _user.sessionToken);
           //save isGuestSigner true in local to handle login flow header in mobile view
diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js
index 326d029b9..1025bdfc1 100644
--- a/apps/OpenSign/src/pages/PdfRequestFiles.js
+++ b/apps/OpenSign/src/pages/PdfRequestFiles.js
@@ -49,6 +49,7 @@ function PdfRequestFiles() {
   const [imgWH, setImgWH] = useState({});
   const imageRef = useRef(null);
   const [handleError, setHandleError] = useState();
+  const [selectWidgetId, setSelectWidgetId] = useState("");
   const [isLoading, setIsLoading] = useState({
     isLoad: true,
     message: "This might take some time"
@@ -646,6 +647,7 @@ function PdfRequestFiles() {
       });
     }
   }
+  console.log("signer", signerPos);
   //function for update TourStatus
   const closeTour = async () => {
     setWidgetsTour(false);
@@ -1176,6 +1178,8 @@ function PdfRequestFiles() {
                   setIsInitial={setIsInitial}
                   setValidateAlert={setValidateAlert}
                   unSignedWidgetId={unSignedWidgetId}
+                  setSelectWidgetId={setSelectWidgetId}
+                  selectWidgetId={selectWidgetId}
                 />
               )}
             </div>

From b99d8e6d6eaad9369528b554005bb1d6eb0797fc Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Thu, 14 Mar 2024 16:50:46 +0530
Subject: [PATCH 17/21] feat: add show/hide label in checkbox and radio widget

---
 .../components/pdf/DropdownWidgetOption.js    |  55 ++++---
 .../src/components/pdf/Placeholder.js         |  29 ++--
 .../src/components/pdf/PlaceholderBorder.js   |  27 +++-
 .../src/components/pdf/PlaceholderType.js     | 134 ++++++++++--------
 apps/OpenSign/src/constant/Utils.js           |  28 +++-
 apps/OpenSign/src/pages/Form.js               |   2 +-
 apps/OpenSign/src/pages/PdfRequestFiles.js    |   1 -
 apps/OpenSign/src/pages/PlaceHolderSign.js    |   9 +-
 apps/OpenSign/src/pages/SignyourselfPdf.js    |   8 +-
 .../OpenSign/src/pages/TemplatePlaceholder.js |  13 +-
 apps/OpenSign/src/styles/signature.css        |   2 +
 11 files changed, 194 insertions(+), 114 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
index 1d9b2f415..b4d3b1dd6 100644
--- a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
+++ b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
@@ -11,6 +11,7 @@ function DropdownWidgetOption(props) {
   const [maxCount, setMaxCount] = useState(0);
   const [dropdownName, setDropdownName] = useState(props.type);
   const [isReadOnly, setIsReadOnly] = useState(false);
+  const [isHideLabel, setIsHideLabel] = useState(false);
   const [status, setStatus] = useState("required");
   const [defaultValue, setDefaultValue] = useState("");
   const statusArr = ["required", "optional"];
@@ -20,6 +21,7 @@ function DropdownWidgetOption(props) {
     setDropdownOptionList(["option-1", "option-2"]);
     setDropdownName(props.type);
     setIsReadOnly(false);
+    setIsHideLabel(false);
     setMinCount(0);
     setMaxCount(0);
     setDefaultCheckbox([]);
@@ -40,6 +42,7 @@ function DropdownWidgetOption(props) {
         props.currWidgetsDetails?.options?.validation?.maxRequiredCount
       );
       setIsReadOnly(props.currWidgetsDetails?.options?.isReadOnly);
+      setIsHideLabel(props.currWidgetsDetails?.options?.isHideLabel);
       setStatus(props.currWidgetsDetails?.options?.status || "required");
       setDefaultValue(props.currWidgetsDetails?.options?.defaultValue || "");
       setDefaultCheckbox(props.currWidgetsDetails?.options?.defaultValue || []);
@@ -107,13 +110,15 @@ function DropdownWidgetOption(props) {
       null,
       null,
       status,
-      defaultData
+      defaultData,
+      isHideLabel
     );
     //  props.setShowDropdown(false);
     setDropdownOptionList(["option-1", "option-2"]);
     setDropdownName(props.type);
     //  props.setCurrWidgetsDetails({});
     setIsReadOnly(false);
+    setIsHideLabel(false);
     setMinCount(0);
     setMaxCount(0);
     setDefaultCheckbox([]);
@@ -154,20 +159,6 @@ function DropdownWidgetOption(props) {
           }}
         >
           <div className="dropdownContainer">
-            {["checkbox", radioButtonWidget].includes(props.type) &&
-              !props.isSignYourself && (
-                <div>
-                  <input
-                    type="checkbox"
-                    checked={isReadOnly}
-                    onChange={(e) => {
-                      setIsReadOnly(e.target.checked);
-                    }}
-                  />
-
-                  <label style={{ marginLeft: "10px" }}>Is read only</label>
-                </div>
-              )}
             <label style={{ fontSize: "13px", fontWeight: "600" }}>
               Name<span style={{ color: "red", fontSize: 13 }}> *</span>
             </label>
@@ -358,8 +349,40 @@ function DropdownWidgetOption(props) {
                 </div>
               </>
             )}
-          </div>
+            {["checkbox", radioButtonWidget].includes(props.type) && (
+              <div className="flex flex-row gap-5 mt-2 items-center text-center">
+                {!props.isSignYourself && (
+                  <div>
+                    <input
+                      id="isreadonly"
+                      type="checkbox"
+                      checked={isReadOnly}
+                      onChange={(e) => {
+                        setIsReadOnly(e.target.checked);
+                      }}
+                    />
+                    <label className="ml-1" htmlFor="isreadonly">
+                      Is read only
+                    </label>
+                  </div>
+                )}
+                <div>
+                  <input
+                    id="ishidelabel"
+                    type="checkbox"
+                    checked={isHideLabel}
+                    onChange={(e) => {
+                      setIsHideLabel(e.target.checked);
+                    }}
+                  />
 
+                  <label className="ml-1" htmlFor="ishidelabel">
+                    Hide label
+                  </label>
+                </div>
+              </div>
+            )}
+          </div>
           <div
             style={{
               height: "1px",
diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index ff0f199e4..81a645067 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -125,8 +125,6 @@ function Placeholder(props) {
     "DD MMM, YYYY",
     "DD MMMM, YYYY"
   ];
-
-  useEffect(() => {}, []);
   //function change format array list with selected date and format
   const changeDateFormat = () => {
     const updateDate = [];
@@ -463,12 +461,8 @@ function Placeholder(props) {
           )}
           <i
             className="fa-regular fa-copy signCopy"
-            onClick={(e) => {
-              handleCopyPlaceholder(e);
-            }}
-            onTouchEnd={(e) => {
-              handleCopyPlaceholder(e);
-            }}
+            onClick={(e) => handleCopyPlaceholder(e)}
+            onTouchEnd={(e) => handleCopyPlaceholder(e)}
             style={{
               color: "#188ae2",
               right:
@@ -526,7 +520,6 @@ function Placeholder(props) {
   return (
     <Rnd
       data-tut={props.pos.key === props.unSignedWidgetId ? "IsSigned" : ""}
-      //ref={nodeRef}
       key={props.pos.key}
       lockAspectRatio={
         props.pos.type !== textWidget &&
@@ -558,8 +551,8 @@ function Placeholder(props) {
       bounds="parent"
       className="signYourselfBlock"
       style={{
-        border: props.pos.type !== "checkbox" && "1px solid #007bff",
-        borderRadius: props.pos.type !== "checkbox" && "2px",
+        border: "1px solid #007bff",
+        borderRadius: "2px",
         textAlign:
           props.pos.type !== "name" &&
           props.pos.type !== "company" &&
@@ -579,17 +572,21 @@ function Placeholder(props) {
             : props?.pos?.zIndex
               ? props.pos.zIndex
               : "5",
-        background: props.data
-          ? props.data.blockColor
-          : props.pos.type !== "checkbox" && "rgb(203 233 237)"
+        background: props.data ? props.data.blockColor : "rgb(203 233 237)"
       }}
       onDrag={() => {
         setDraggingEnabled(true);
         props.handleTabDrag && props.handleTabDrag(props.pos.key);
       }}
       size={{
-        width: props.posWidth(props.pos, props.isSignYourself),
-        height: props.posHeight(props.pos, props.isSignYourself)
+        width:
+          props.pos.type === radioButtonWidget || props.pos.type === "checkbox"
+            ? "auto"
+            : props.posWidth(props.pos, props.isSignYourself),
+        height:
+          props.pos.type === radioButtonWidget || props.pos.type === "checkbox"
+            ? "auto"
+            : props.posHeight(props.pos, props.isSignYourself)
       }}
       onResizeStart={() => {
         setDraggingEnabled(true);
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
index 996d1332a..22907f296 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
@@ -13,6 +13,24 @@ function PlaceholderBorder(props) {
   const defaultWidth = defaultWidthHeight(props.pos.type).width;
   const defaultHeight = defaultWidthHeight(props.pos.type).height;
 
+  const handleMinWidth = () => {
+    if (props.pos.type === "checkbox" || props.pos.type === radioButtonWidget) {
+      return "120%";
+    } else {
+      return props.pos.Width
+        ? props.pos.Width + getResizeBorderExtraWidth
+        : defaultWidth + getResizeBorderExtraWidth;
+    }
+  };
+  const handleMinHeight = () => {
+    if (props.pos.type === "checkbox" || props.pos.type === radioButtonWidget) {
+      return "120%";
+    } else {
+      return props.pos.Height
+        ? props.pos.Height + getResizeBorderExtraWidth
+        : defaultHeight + getResizeBorderExtraWidth;
+    }
+  };
   return (
     <div
       onMouseEnter={props?.setDraggingEnabled(true)}
@@ -20,13 +38,8 @@ function PlaceholderBorder(props) {
       style={{
         borderColor: themeColor,
         borderStyle: "dashed",
-
-        width: props.pos.Width
-          ? props.pos.Width + getResizeBorderExtraWidth
-          : defaultWidth + getResizeBorderExtraWidth,
-        height: props.pos.Height
-          ? props.pos.Height + getResizeBorderExtraWidth
-          : defaultHeight + getResizeBorderExtraWidth,
+        minWidth: handleMinWidth(),
+        minHeight: handleMinHeight(),
         borderWidth: "0.2px",
         overflow: "hidden"
       }}
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 7d10c3ef4..71614bd8b 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -135,9 +135,6 @@ function PlaceholderType(props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.pos]);
 
-  const dateValue = (value) => {
-    return <span>{value}</span>;
-  };
   const ExampleCustomInput = forwardRef(({ value, onClick }, ref) => (
     <div
       className="inputPlaceholder"
@@ -145,7 +142,7 @@ function PlaceholderType(props) {
       onClick={onClick}
       ref={ref}
     >
-      {dateValue(value)}
+      {value}
       <i className="fa-regular fa-calendar" style={{ marginLeft: "5px" }}></i>
     </div>
   ));
@@ -277,7 +274,6 @@ function PlaceholderType(props) {
       isRadio
     );
   };
-
   //function to set onchange date
   const handleOnDateChange = (date) => {
     props.setStartDate(date);
@@ -336,46 +332,54 @@ function PlaceholderType(props) {
         <div style={{ zIndex: props.isSignYourself && "99" }}>
           {props.pos.options?.values?.map((data, ind) => {
             return (
-              <input
-                key={ind}
-                style={{
-                  width: props.pos.Width,
-                  display: "flex",
-                  justifyContent: "center",
-                  marginBottom: "6px",
-                  marginTop: "5px"
-                }}
-                onBlur={handleInputBlur}
-                disabled={
-                  props.isNeedSign &&
-                  (props.pos.options?.isReadOnly ||
-                    props.data?.signerObjId !== props.signerObjId)
-                }
-                type="checkbox"
-                checked={selectCheckbox(ind)}
-                onChange={(e) => {
-                  if (e.target.checked) {
-                    if (!props.isPlaceholder) {
-                      const maxRequired =
-                        props.pos.options?.validation?.maxRequiredCount;
-                      const maxCountInt = maxRequired && parseInt(maxRequired);
+              <div key={ind} className="flex items-center gap-1 min-w-max">
+                <input
+                  id={data}
+                  style={{
+                    width: props.pos.Width,
+                    display: "flex",
+                    justifyContent: "center",
+                    marginBottom: "6px",
+                    marginTop: "5px"
+                  }}
+                  onBlur={handleInputBlur}
+                  disabled={
+                    props.isNeedSign &&
+                    (props.pos.options?.isReadOnly ||
+                      props.data?.signerObjId !== props.signerObjId)
+                  }
+                  type="checkbox"
+                  checked={selectCheckbox(ind)}
+                  onChange={(e) => {
+                    if (e.target.checked) {
+                      if (!props.isPlaceholder) {
+                        const maxRequired =
+                          props.pos.options?.validation?.maxRequiredCount;
+                        const maxCountInt =
+                          maxRequired && parseInt(maxRequired);
 
-                      if (maxCountInt > 0) {
-                        if (
-                          selectedCheckbox &&
-                          selectedCheckbox?.length <= maxCountInt - 1
-                        ) {
+                        if (maxCountInt > 0) {
+                          if (
+                            selectedCheckbox &&
+                            selectedCheckbox?.length <= maxCountInt - 1
+                          ) {
+                            handleCheckboxValue(e.target.checked, ind);
+                          }
+                        } else {
                           handleCheckboxValue(e.target.checked, ind);
                         }
-                      } else {
-                        handleCheckboxValue(e.target.checked, ind);
                       }
+                    } else {
+                      handleCheckboxValue(e.target.checked, ind);
                     }
-                  } else {
-                    handleCheckboxValue(e.target.checked, ind);
-                  }
-                }}
-              />
+                  }}
+                />
+                {!props.pos.options?.isHideLabel && (
+                  <label htmlFor={data} className="text-xs">
+                    {data}
+                  </label>
+                )}
+              </div>
             );
           })}
         </div>
@@ -706,28 +710,38 @@ function PlaceholderType(props) {
         <div>
           {props.pos.options?.values.map((data, ind) => {
             return (
-              <input
+              <div
                 key={ind}
-                style={{
-                  width: props.pos.Width,
-                  display: "flex",
-                  justifyContent: "center",
-                  marginBottom: "6px",
-                  marginTop: "5px"
-                }}
-                type="radio"
-                disabled={
-                  props.isNeedSign &&
-                  (props.pos.options?.isReadOnly ||
-                    props.data?.signerObjId !== props.signerObjId)
-                }
-                checked={handleRadioCheck(data)}
-                onChange={(e) => {
-                  if (!props.isPlaceholder) {
-                    handleCheckRadio(e.target.checked, data);
+                className="flex flex-row items-center gap-1 min-w-max"
+              >
+                <input
+                  id={data}
+                  style={{
+                    width: props.pos.Width,
+                    display: "flex",
+                    justifyContent: "center",
+                    marginBottom: "6px",
+                    marginTop: "5px"
+                  }}
+                  type="radio"
+                  disabled={
+                    props.isNeedSign &&
+                    (props.pos.options?.isReadOnly ||
+                      props.data?.signerObjId !== props.signerObjId)
                   }
-                }}
-              />
+                  checked={handleRadioCheck(data)}
+                  onChange={(e) => {
+                    if (!props.isPlaceholder) {
+                      handleCheckRadio(e.target.checked, data);
+                    }
+                  }}
+                />
+                {!props.pos.options?.isHideLabel && (
+                  <label htmlFor={data} className="text-xs">
+                    {data}
+                  </label>
+                )}
+              </div>
             );
           })}
         </div>
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index 7e26226c2..ee89a2666 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -238,7 +238,7 @@ export const addWidgetOptions = (type) => {
     case "stamp":
       return defaultOpt;
     case "checkbox":
-      return defaultOpt;
+      return { defaultOpt, options: { isReadOnly: false, isHideLabel: false } };
     case textInputWidget:
       return { ...defaultOpt, validation: { type: "text", pattern: "" } };
     case "initials":
@@ -262,7 +262,12 @@ export const addWidgetOptions = (type) => {
     case "dropdown":
       return defaultOpt;
     case radioButtonWidget:
-      return { ...defaultOpt, values: [] };
+      return {
+        ...defaultOpt,
+        values: [],
+        isReadOnly: false,
+        isHideLabel: false
+      };
     case textWidget:
       return defaultOpt;
     default:
@@ -1176,6 +1181,14 @@ export const multiSignEmbed = async (
               yPosition = yPos(position, ind);
               addYPosition = height + 8;
             }
+            if (!position?.options?.isHideLabel) {
+              // below line of code is used to embed label with radio button in pdf
+              page.drawText(item, {
+                x: xPos(position) + 15,
+                y: yPosition + 2,
+                size: height
+              });
+            }
             checkbox.addToPage(page, {
               x: xPos(position),
               y: yPosition,
@@ -1270,7 +1283,8 @@ export const multiSignEmbed = async (
           x: xPos(position),
           y: yPos(position),
           width: scaleWidth,
-          height: scaleHeight
+          height: scaleHeight,
+          borderWidth: 0
         });
         dropdown.enableReadOnly();
       } else if (position.type === radioButtonWidget) {
@@ -1287,6 +1301,14 @@ export const multiSignEmbed = async (
             yPosition = yPos(position);
           }
 
+          if (!position?.options?.isHideLabel) {
+            // below line of code is used to embed label with radio button in pdf
+            page.drawText(data, {
+              x: xPos(position) + 15,
+              y: yPosition + 2,
+              size: 11
+            });
+          }
           radioGroup.addOptionToPage(data, page, {
             x: xPos(position),
             y: yPosition,
diff --git a/apps/OpenSign/src/pages/Form.js b/apps/OpenSign/src/pages/Form.js
index bd081ef12..4aa442bda 100644
--- a/apps/OpenSign/src/pages/Form.js
+++ b/apps/OpenSign/src/pages/Form.js
@@ -413,7 +413,7 @@ const Forms = (props) => {
               type="submit"
               disabled={isSubmit}
             >
-              Submit
+              Next
             </button>
             <div
               className="cursor-pointer bg-[#188ae2] rounded-sm shadow-md text-[13px] font-semibold uppercase text-white py-1.5 px-2.5 text-center ml-[2px] focus:outline-none"
diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js
index 1025bdfc1..bdb017394 100644
--- a/apps/OpenSign/src/pages/PdfRequestFiles.js
+++ b/apps/OpenSign/src/pages/PdfRequestFiles.js
@@ -647,7 +647,6 @@ function PdfRequestFiles() {
       });
     }
   }
-  console.log("signer", signerPos);
   //function for update TourStatus
   const closeTour = async () => {
     setWidgetsTour(false);
diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js
index 7fe365374..35351be3e 100644
--- a/apps/OpenSign/src/pages/PlaceHolderSign.js
+++ b/apps/OpenSign/src/pages/PlaceHolderSign.js
@@ -1055,7 +1055,8 @@ function PlaceHolderSign() {
     addOption,
     deleteOption,
     status,
-    defaultValue
+    defaultValue,
+    isHideLabel
   ) => {
     const filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
     if (filterSignerPos.length > 0) {
@@ -1093,7 +1094,8 @@ function PlaceHolderSign() {
                     ...position.options,
                     name: dropdownName,
                     values: dropdownOptions,
-                    isReadOnly: isReadOnly,
+                    isReadOnly: isReadOnly || false,
+                    isHideLabel: isHideLabel || false,
                     defaultValue: defaultValue
                   }
                 };
@@ -1125,7 +1127,8 @@ function PlaceHolderSign() {
                       maxRequiredCount: maxCount
                     },
                     defaultValue: defaultValue,
-                    isReadOnly: isReadOnly
+                    isReadOnly: isReadOnly || false,
+                    isHideLabel: isHideLabel || false
                   }
                 };
               }
diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js
index 2dd3ec38b..1d4803e9f 100644
--- a/apps/OpenSign/src/pages/SignyourselfPdf.js
+++ b/apps/OpenSign/src/pages/SignyourselfPdf.js
@@ -870,7 +870,10 @@ function SignYourSelf() {
     maxCount,
     isReadOnly,
     addOption,
-    deleteOption
+    deleteOption,
+    status,
+    defaultValue,
+    isHideLabel
   ) => {
     const getPageNumer = xyPostion.filter(
       (data) => data.pageNumber === pageNumber
@@ -902,7 +905,8 @@ function SignYourSelf() {
                 ...position.options,
                 name: dropdownName,
                 values: dropdownOptions,
-                isReadOnly: isReadOnly
+                isReadOnly: isReadOnly,
+                isHideLabel: isHideLabel || false
               }
             };
           }
diff --git a/apps/OpenSign/src/pages/TemplatePlaceholder.js b/apps/OpenSign/src/pages/TemplatePlaceholder.js
index 76b5ef7ac..dc71aaa9c 100644
--- a/apps/OpenSign/src/pages/TemplatePlaceholder.js
+++ b/apps/OpenSign/src/pages/TemplatePlaceholder.js
@@ -976,7 +976,8 @@ const TemplatePlaceholder = () => {
     addOption,
     deleteOption,
     status,
-    defaultValue
+    defaultValue,
+    isHideLabel
   ) => {
     const filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
     if (filterSignerPos.length > 0) {
@@ -996,7 +997,6 @@ const TemplatePlaceholder = () => {
               if (addOption) {
                 return {
                   ...position,
-
                   Height: position.Height
                     ? position.Height + 15
                     : defaultWidthHeight(widgetType).height + 15
@@ -1016,7 +1016,9 @@ const TemplatePlaceholder = () => {
                     name: dropdownName,
                     values: dropdownOptions,
                     status: status,
-                    defaultValue: defaultValue
+                    defaultValue: defaultValue,
+                    isReadOnly: isReadOnly || false,
+                    isHideLabel: isHideLabel || false
                   }
                 };
               }
@@ -1046,8 +1048,9 @@ const TemplatePlaceholder = () => {
                       minRequiredCount: minCount,
                       maxRequiredCount: maxCount
                     },
-                    isReadOnly: isReadOnly,
-                    defaultValue: defaultValue
+                    isReadOnly: isReadOnly || false,
+                    defaultValue: defaultValue,
+                    isHideLabel: isHideLabel || false
                   }
                 };
               }
diff --git a/apps/OpenSign/src/styles/signature.css b/apps/OpenSign/src/styles/signature.css
index 8229cdb05..47c3d9e73 100644
--- a/apps/OpenSign/src/styles/signature.css
+++ b/apps/OpenSign/src/styles/signature.css
@@ -339,6 +339,8 @@
   display: flex !important;
   justify-content: center !important;
   align-items: center !important;
+  min-width:max-content;
+  min-height: max-content;
 }
 
 .finishBtn {

From 7584667643dc4187b1986a55d33dc8c449420379 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Thu, 14 Mar 2024 18:35:40 +0530
Subject: [PATCH 18/21] fix: when click on label in radio or checkbox widget
 it's border not visible

---
 .../src/components/pdf/Placeholder.js         | 45 +++++++++----------
 .../src/components/pdf/PlaceholderType.js     | 23 +++++-----
 2 files changed, 32 insertions(+), 36 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 81a645067..d7c8f7d36 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -168,8 +168,8 @@ function Placeholder(props) {
     };
   }, [isShowDateFormat]);
 
-  //onclick placeholder function to open signature pad
-  const handlePlaceholderClick = () => {
+  //`handleWidgetIdandPopup` is used to set current widget id and open relative popup
+  const handleWidgetIdandPopup = () => {
     if (props.setSelectWidgetId) {
       props.setSelectWidgetId(props.pos.key);
     }
@@ -238,9 +238,18 @@ function Placeholder(props) {
       }
     }
   };
-
-  //function to set state value of onclick on widget's setting icon
-  const handleWidgetsOnclick = () => {
+  const handleOnClickPlaceholder = () => {
+    if (!props.isNeedSign) {
+      props.setWidgetType(props.pos.type);
+    }
+    if (props.isNeedSign && props.data?.signerObjId === props.signerObjId) {
+      handleWidgetIdandPopup();
+    } else if (props.isPlaceholder || props.isSignYourself) {
+      handleWidgetIdandPopup();
+    }
+  };
+  //`handleOnClickSettingIcon` is used set current widget details and open setting of it
+  const handleOnClickSettingIcon = () => {
     if (props.pos.type === radioButtonWidget) {
       props.setIsRadio(true);
     } else if (props.pos.type === "dropdown") {
@@ -312,11 +321,11 @@ function Placeholder(props) {
                 <i
                   onClick={(e) => {
                     e.stopPropagation();
-                    handleWidgetsOnclick();
+                    handleOnClickSettingIcon();
                   }}
                   onTouchEnd={(e) => {
                     e.stopPropagation();
-                    handleWidgetsOnclick();
+                    handleOnClickSettingIcon();
                   }}
                   className="fa-solid fa-gear settingIcon"
                   style={{
@@ -335,11 +344,11 @@ function Placeholder(props) {
                   <i
                     onClick={(e) => {
                       e.stopPropagation();
-                      handleWidgetsOnclick();
+                      handleOnClickSettingIcon();
                     }}
                     onTouchEnd={(e) => {
                       e.stopPropagation();
-                      handleWidgetsOnclick();
+                      handleOnClickSettingIcon();
                     }}
                     className="fa-solid fa-gear settingIcon"
                     style={{
@@ -622,14 +631,7 @@ function Placeholder(props) {
             false
           );
       }}
-      onClick={() => {
-        !props.isNeedSign && props.setWidgetType(props.pos.type);
-        props.isNeedSign && props.data?.signerObjId === props.signerObjId
-          ? handlePlaceholderClick()
-          : props.isPlaceholder
-            ? handlePlaceholderClick()
-            : props.isSignYourself && handlePlaceholderClick();
-      }}
+      onClick={() => handleOnClickPlaceholder()}
     >
       {props.isShowBorder &&
       props.pos.type !== radioButtonWidget &&
@@ -679,14 +681,7 @@ function Placeholder(props) {
             // height: props.posHeight(props.pos, props.isSignYourself),
             zIndex: "10"
           }}
-          onTouchEnd={() => {
-            !props.isNeedSign && props.setWidgetType(props.pos.type);
-            props.isNeedSign && props.data?.signerObjId === props.signerObjId
-              ? handlePlaceholderClick()
-              : props.isPlaceholder
-                ? handlePlaceholderClick()
-                : props.isSignYourself && handlePlaceholderClick();
-          }}
+          onTouchEnd={() => handleOnClickPlaceholder()}
         >
           {props.pos.key === props.selectWidgetId && <PlaceholderIcon />}
 
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 71614bd8b..8f5b78ce8 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -332,15 +332,14 @@ function PlaceholderType(props) {
         <div style={{ zIndex: props.isSignYourself && "99" }}>
           {props.pos.options?.values?.map((data, ind) => {
             return (
-              <div key={ind} className="flex items-center gap-1 min-w-max">
+              <div key={ind} className="flex items-center text-center gap-0.5">
                 <input
                   id={data}
                   style={{
                     width: props.pos.Width,
                     display: "flex",
                     justifyContent: "center",
-                    marginBottom: "6px",
-                    marginTop: "5px"
+                    marginTop: ind === 0 ? 0 : "5px"
                   }}
                   onBlur={handleInputBlur}
                   disabled={
@@ -375,7 +374,10 @@ function PlaceholderType(props) {
                   }}
                 />
                 {!props.pos.options?.isHideLabel && (
-                  <label htmlFor={data} className="text-xs">
+                  <label
+                    htmlFor={!props.isPlaceholder && data}
+                    className="text-xs mb-0 text-center"
+                  >
                     {data}
                   </label>
                 )}
@@ -710,18 +712,14 @@ function PlaceholderType(props) {
         <div>
           {props.pos.options?.values.map((data, ind) => {
             return (
-              <div
-                key={ind}
-                className="flex flex-row items-center gap-1 min-w-max"
-              >
+              <div key={ind} className="flex items-center text-center gap-0.5">
                 <input
                   id={data}
                   style={{
                     width: props.pos.Width,
                     display: "flex",
                     justifyContent: "center",
-                    marginBottom: "6px",
-                    marginTop: "5px"
+                    marginTop: ind === 0 ? 0 : "5px"
                   }}
                   type="radio"
                   disabled={
@@ -737,7 +735,10 @@ function PlaceholderType(props) {
                   }}
                 />
                 {!props.pos.options?.isHideLabel && (
-                  <label htmlFor={data} className="text-xs">
+                  <label
+                    htmlFor={!props.isPlaceholder && data}
+                    className="text-xs mb-0"
+                  >
                     {data}
                   </label>
                 )}

From 17660dae21553a8f82e531294333133258daeee6 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Thu, 14 Mar 2024 20:12:41 +0530
Subject: [PATCH 19/21] fix: border of radio button & checkbox is not proper

---
 .../src/components/pdf/Placeholder.js         | 98 ++++++-------------
 .../src/components/pdf/PlaceholderBorder.js   |  9 +-
 apps/OpenSign/src/styles/signature.css        |  2 -
 3 files changed, 32 insertions(+), 77 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index d7c8f7d36..3f8ba02c0 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -114,6 +114,10 @@ function Placeholder(props) {
         props.pos?.options?.validation?.format
       )
   );
+  const [getCheckboxRenderWidth, setGetCheckboxRenderWidth] = useState({
+    width: null,
+    height: null
+  });
   const dateFormatArr = [
     "L",
     "DD-MM-YYYY",
@@ -125,6 +129,21 @@ function Placeholder(props) {
     "DD MMM, YYYY",
     "DD MMMM, YYYY"
   ];
+
+  useEffect(() => {
+    const updateWidth = () => {
+      const rndElement = document.getElementById(props.pos.key);
+      if (rndElement) {
+        const { width, height } = rndElement.getBoundingClientRect();
+        setGetCheckboxRenderWidth({ width: width, height: height });
+      }
+    };
+
+    // Delay to ensure rendering is complete
+    const timer = setTimeout(updateWidth, 0);
+
+    return () => clearTimeout(timer);
+  }, [props.pos]);
   //function change format array list with selected date and format
   const changeDateFormat = () => {
     const updateDate = [];
@@ -330,8 +349,8 @@ function Placeholder(props) {
                   className="fa-solid fa-gear settingIcon"
                   style={{
                     color: "#188ae2",
-                    right: "9px",
-                    top: "-28px"
+                    right: "29px",
+                    top: "-19px"
                   }}
                 ></i>
               ) : (
@@ -351,19 +370,7 @@ function Placeholder(props) {
                       handleOnClickSettingIcon();
                     }}
                     className="fa-solid fa-gear settingIcon"
-                    style={{
-                      color: "#188ae2",
-                      right: ["checkbox", radioButtonWidget].includes(
-                        props.pos.type
-                      )
-                        ? "24px"
-                        : "47px",
-                      top: ["checkbox", radioButtonWidget].includes(
-                        props.pos.type
-                      )
-                        ? "-28px"
-                        : "-19px"
-                    }}
+                    style={{ color: "#188ae2", right: "47px", top: "-19px" }}
                   ></i>
                 )
               )}
@@ -382,19 +389,7 @@ function Placeholder(props) {
                     props.handleLinkUser(props.data.Id);
                     props.setUniqueId(props.data.Id);
                   }}
-                  style={{
-                    color: "#188ae2",
-                    right:
-                      props.pos.type === "checkbox" ||
-                      props.pos.type === radioButtonWidget
-                        ? "8px"
-                        : "32px",
-                    top:
-                      props.pos.type === "checkbox" ||
-                      props.pos.type === radioButtonWidget
-                        ? "-28px"
-                        : "-18px"
-                  }}
+                  style={{ color: "#188ae2", right: "32px", top: "-18px" }}
                 ></i>
               )}
             </>
@@ -472,19 +467,7 @@ function Placeholder(props) {
             className="fa-regular fa-copy signCopy"
             onClick={(e) => handleCopyPlaceholder(e)}
             onTouchEnd={(e) => handleCopyPlaceholder(e)}
-            style={{
-              color: "#188ae2",
-              right:
-                props.pos.type === "checkbox" ||
-                props.pos.type === radioButtonWidget
-                  ? "-9px"
-                  : "12px",
-              top:
-                props.pos.type === "checkbox" ||
-                props.pos.type === radioButtonWidget
-                  ? "-28px"
-                  : "-18px"
-            }}
+            style={{ color: "#188ae2", right: "12px", top: "-18px" }}
           ></i>
           <i
             className="fa-regular fa-circle-xmark signCloseBtn"
@@ -507,19 +490,7 @@ function Placeholder(props) {
                 props.setIsStamp(false);
               }
             }}
-            style={{
-              color: "#188ae2",
-              right:
-                props.pos.type === "checkbox" ||
-                props.pos.type === radioButtonWidget
-                  ? "-27px"
-                  : "-8px",
-              top:
-                props.pos.type === "checkbox" ||
-                props.pos.type === radioButtonWidget
-                  ? "-28px"
-                  : "-18px"
-            }}
+            style={{ color: "#188ae2", right: "-8px", top: "-18px" }}
           ></i>
         </>
       )
@@ -528,6 +499,7 @@ function Placeholder(props) {
 
   return (
     <Rnd
+      id={props.pos.key}
       data-tut={props.pos.key === props.unSignedWidgetId ? "IsSigned" : ""}
       key={props.pos.key}
       lockAspectRatio={
@@ -637,20 +609,7 @@ function Placeholder(props) {
       props.pos.type !== radioButtonWidget &&
       props.pos.type !== "checkbox" &&
       props.pos.key === props.selectWidgetId ? (
-        <BorderResize
-          right={
-            props.pos.type === "checkbox" ||
-            props.pos.type === radioButtonWidget
-              ? -21
-              : -12
-          }
-          top={
-            props.pos.type === "checkbox" ||
-            props.pos.type === radioButtonWidget
-              ? -21
-              : -11
-          }
-        />
+        <BorderResize right={-12} top={-11} />
       ) : props.data && props.isNeedSign && props.pos.type !== "checkbox" ? (
         props.data?.signerObjId === props.signerObjId &&
         props.pos.type !== radioButtonWidget &&
@@ -670,6 +629,7 @@ function Placeholder(props) {
           setDraggingEnabled={setDraggingEnabled}
           pos={props.pos}
           isPlaceholder={props.isPlaceholder}
+          getCheckboxRenderWidth={getCheckboxRenderWidth}
         />
       )}
       {isMobile ? (
@@ -677,7 +637,7 @@ function Placeholder(props) {
           style={{
             left: props.xPos(props.pos, props.isSignYourself),
             top: props.yPos(props.pos, props.isSignYourself),
-            width: props.posWidth(props.pos, props.isSignYourself),
+            width: "auto", //props.posWidth(props.pos, props.isSignYourself),
             // height: props.posHeight(props.pos, props.isSignYourself),
             zIndex: "10"
           }}
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
index 22907f296..f209307c2 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
@@ -6,16 +6,13 @@ import {
   resizeBorderExtraWidth
 } from "../../constant/Utils";
 function PlaceholderBorder(props) {
-  const getResizeBorderExtraWidth =
-    props.pos.type === "checkbox" || props.pos.type === radioButtonWidget
-      ? 38
-      : resizeBorderExtraWidth();
+  const getResizeBorderExtraWidth = resizeBorderExtraWidth();
   const defaultWidth = defaultWidthHeight(props.pos.type).width;
   const defaultHeight = defaultWidthHeight(props.pos.type).height;
 
   const handleMinWidth = () => {
     if (props.pos.type === "checkbox" || props.pos.type === radioButtonWidget) {
-      return "120%";
+      return props.getCheckboxRenderWidth.width + getResizeBorderExtraWidth;
     } else {
       return props.pos.Width
         ? props.pos.Width + getResizeBorderExtraWidth
@@ -24,7 +21,7 @@ function PlaceholderBorder(props) {
   };
   const handleMinHeight = () => {
     if (props.pos.type === "checkbox" || props.pos.type === radioButtonWidget) {
-      return "120%";
+      return props.getCheckboxRenderWidth.height + getResizeBorderExtraWidth;
     } else {
       return props.pos.Height
         ? props.pos.Height + getResizeBorderExtraWidth
diff --git a/apps/OpenSign/src/styles/signature.css b/apps/OpenSign/src/styles/signature.css
index 47c3d9e73..8229cdb05 100644
--- a/apps/OpenSign/src/styles/signature.css
+++ b/apps/OpenSign/src/styles/signature.css
@@ -339,8 +339,6 @@
   display: flex !important;
   justify-content: center !important;
   align-items: center !important;
-  min-width:max-content;
-  min-height: max-content;
 }
 
 .finishBtn {

From 7882c61b815b56bff1fa5636462d9a54e546d393 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Thu, 14 Mar 2024 21:22:48 +0530
Subject: [PATCH 20/21] fix: checkbox not embeding in pdf

---
 .../src/components/pdf/PlaceholderType.js        | 16 ++--------------
 apps/OpenSign/src/constant/Utils.js              |  5 ++++-
 2 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/PlaceholderType.js b/apps/OpenSign/src/components/pdf/PlaceholderType.js
index 8f5b78ce8..0b851f258 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderType.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderType.js
@@ -334,7 +334,6 @@ function PlaceholderType(props) {
             return (
               <div key={ind} className="flex items-center text-center gap-0.5">
                 <input
-                  id={data}
                   style={{
                     width: props.pos.Width,
                     display: "flex",
@@ -374,12 +373,7 @@ function PlaceholderType(props) {
                   }}
                 />
                 {!props.pos.options?.isHideLabel && (
-                  <label
-                    htmlFor={!props.isPlaceholder && data}
-                    className="text-xs mb-0 text-center"
-                  >
-                    {data}
-                  </label>
+                  <label className="text-xs mb-0 text-center">{data}</label>
                 )}
               </div>
             );
@@ -714,7 +708,6 @@ function PlaceholderType(props) {
             return (
               <div key={ind} className="flex items-center text-center gap-0.5">
                 <input
-                  id={data}
                   style={{
                     width: props.pos.Width,
                     display: "flex",
@@ -735,12 +728,7 @@ function PlaceholderType(props) {
                   }}
                 />
                 {!props.pos.options?.isHideLabel && (
-                  <label
-                    htmlFor={!props.isPlaceholder && data}
-                    className="text-xs mb-0"
-                  >
-                    {data}
-                  </label>
+                  <label className="text-xs mb-0">{data}</label>
                 )}
               </div>
             );
diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js
index ee89a2666..ba6556930 100644
--- a/apps/OpenSign/src/constant/Utils.js
+++ b/apps/OpenSign/src/constant/Utils.js
@@ -238,7 +238,10 @@ export const addWidgetOptions = (type) => {
     case "stamp":
       return defaultOpt;
     case "checkbox":
-      return { defaultOpt, options: { isReadOnly: false, isHideLabel: false } };
+      return {
+        ...defaultOpt,
+        options: { isReadOnly: false, isHideLabel: false }
+      };
     case textInputWidget:
       return { ...defaultOpt, validation: { type: "text", pattern: "" } };
     case "initials":

From db9ae71d67eaccd323f44b61ba5834d02f701324 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Thu, 14 Mar 2024 21:39:22 +0530
Subject: [PATCH 21/21] fix: date is not changable in signyourself flow of
 mobile

---
 apps/OpenSign/src/components/pdf/Placeholder.js   | 15 +++++++++++++++
 .../src/components/pdf/PlaceholderBorder.js       |  3 ++-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 3f8ba02c0..d786efa9b 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -144,6 +144,21 @@ function Placeholder(props) {
 
     return () => clearTimeout(timer);
   }, [props.pos]);
+
+  useEffect(() => {
+    const closeMenuOnOutsideClick = (e) => {
+      if (!isDraggingEnabled && !e.target.closest("#changeIsDragging")) {
+        setDraggingEnabled(true);
+      }
+    };
+
+    document.addEventListener("click", closeMenuOnOutsideClick);
+
+    return () => {
+      // Cleanup the event listener when the component unmounts
+      document.removeEventListener("click", closeMenuOnOutsideClick);
+    };
+  }, [isDraggingEnabled]);
   //function change format array list with selected date and format
   const changeDateFormat = () => {
     const updateDate = [];
diff --git a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
index f209307c2..182f85991 100644
--- a/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
+++ b/apps/OpenSign/src/components/pdf/PlaceholderBorder.js
@@ -2,6 +2,7 @@ import React from "react";
 import { themeColor } from "../../constant/const";
 import {
   defaultWidthHeight,
+  isMobile,
   radioButtonWidget,
   resizeBorderExtraWidth
 } from "../../constant/Utils";
@@ -30,7 +31,7 @@ function PlaceholderBorder(props) {
   };
   return (
     <div
-      onMouseEnter={props?.setDraggingEnabled(true)}
+      onMouseEnter={!isMobile && props?.setDraggingEnabled(true)}
       className="borderResize"
       style={{
         borderColor: themeColor,