Merge pull request #1137 from nxglabs/signers_completed_main

fix: not able update public username and save sign, initials not working

apps/OpenSign/src/components/pdf/WidgetsValueModal.jsx

@@ -551,8 +551,8 @@ function WidgetsValueModal(props) {
           // below code is used to save or update default signature, initials, stamp
           try {
             const signCls = new Parse.Object("contracts_Signature");
-            if (props?.saveSignCheckbox?.signId) {
-              signCls.id = props.saveSignCheckbox.signId;
+            if (saveSignCheckbox?.signId) {
+              signCls.id = saveSignCheckbox.signId;
             }
             if (currWidgetsDetails?.type === "initials") {
               signCls.set("Initials", imageUrl);

apps/OpenSign/src/constant/Utils.jsx

@@ -3729,4 +3729,3 @@ export function convertJpegToPng(base64Image, filename) {
     });
   }
 }
-

apps/OpenSign/src/pages/Form.jsx

@@ -680,9 +680,7 @@ const Forms = (props) => {
           </ModalUi>
           <form onSubmit={handleSubmit}>
             <div className="mb-[11px]">
-              <h1 className="text-[20px] font-semibold">
-                {t(`form-name.${props?.title}`)}
-              </h1>
+              <h1 className="text-[20px] font-semibold">{t(props?.title)}</h1>
               {props.title === "Sign Yourself" && (
                 <div className="text-gray-500 text-xs mt-1">
                   {t("signyour-self-description")}

apps/OpenSign/src/pages/Login.jsx

@@ -499,7 +499,7 @@ function Login() {
                               to="/forgetpassword"
                               className="text-[13px] op-link op-link-primary underline-offset-1 focus:outline-none ml-1"
                             >
-                              {t("forgot-password")}
+                              {t("forgot-password")}?
                             </NavLink>
                           </div>
                       </div>

apps/OpenSign/src/pages/Managesign.jsx

@@ -324,13 +324,8 @@ const ManageSign = () => {
                 hidden
               />
               <div className="relative">
-                {isLoader && (
-                  <div className="absolute bg-black bg-opacity-30 z-50 w-full h-full flex justify-center items-center">
-                    <Loader />
-                  </div>
-                )}
                 {image ? (
-                  <div className="signatureCanvas relative border-[2px] border-[#888] rounded-box overflow-hidden">
+                  <div className="mysignatureCanvas  relative border-[2px] border-[#888] rounded-box overflow-hidden">
                     <img
                       alt="signature"
                       src={image}
@@ -342,10 +337,8 @@ const ManageSign = () => {
                     ref={canvasRef}
                     penColor={penColor}
                     canvasProps={{
-                      width: "456px",
-                      height: "180px",
                       className:
-                        "signatureCanvas border-[2px] border-[#888] rounded-box"
+                        "mysignatureCanvas border-[2px] border-[#888] rounded-box"
                     }}
                     onEnd={() =>
                       handleSignatureChange(canvasRef.current.toDataURL())

apps/OpenSign/src/pages/Opensigndrive.jsx

@@ -712,14 +712,14 @@ function Opensigndrive() {
                       onClick={() => navigate("/form/sHAnZphf69")}
                     >
                       <i className="fa-light fa-pen-nib mr-[5px]"></i>
-                      {t("form-name.Sign Yourself")}
+                      {t("Sign Yourself")}
                     </span>
                     <span
                       className="dropdown-item text-[10px] md:text-[13px]"
                       onClick={() => navigate("/form/8mZzFxbG1z")}
                     >
                       <i className="fa-light fa-file-signature mr-[5px]"></i>
-                      {t("form-name.Request Signatures")}
+                      {t("Request Signatures")}
                     </span>
                   </div>
                 </div>
@@ -840,14 +840,14 @@ function Opensigndrive() {
                       onClick={() => navigate("/form/sHAnZphf69")}
                     >
                       <i className="fa-light fa-pen-nib mr-[5px]"></i>
-                      {t("form-name.Sign Yourself")}
+                      {t("Sign Yourself")}
                     </span>
                     <span
                       className="dropdown-item text-[10px] md:text-[13px]"
                       onClick={() => navigate("/form/8mZzFxbG1z")}
                     >
                       <i className="fa-light fa-file-signature mr-[5px]"></i>
-                      {t("form-name.Request Signatures")}
+                      {t("Request Signatures")}
                     </span>
                   </div>
                 </div>

apps/OpenSign/src/pages/PdfRequestFiles.jsx

@@ -75,9 +75,6 @@ function PdfRequestFiles(
   const { t } = useTranslation();
   const dispatch = useDispatch();
   const isShowModal = useSelector((state) => state.widget.isShowModal);
-  const saveSignCheckbox = useSelector(
-    (state) => state.widget.saveSignCheckbox
-  );
   const defaultSignImg = useSelector((state) => state.widget.defaultSignImg);
   const myInitial = useSelector((state) => state.widget.myInitial);
   const appName =
@@ -484,12 +481,7 @@ function PdfRequestFiles(
               } else {
                 setRequestSignTour(false);
               }
-              dispatch(
-                setSaveSignCheckbox({
-                  ...saveSignCheckbox,
-                  isVisible: true
-                })
-              );
+
               //function to get default signatur of current user from `contracts_Signature` class
               const defaultSignRes = await getDefaultSignature(
                 jsonSender?.objectId
@@ -497,7 +489,6 @@ function PdfRequestFiles(
               if (defaultSignRes?.status === "success") {
                 dispatch(
                   setSaveSignCheckbox({
-                    ...saveSignCheckbox,
                     isVisible: true,
                     signId: defaultSignRes?.res?.id
                   })
@@ -506,6 +497,8 @@ function PdfRequestFiles(
                 const initials = defaultSignRes?.res?.defaultInitial || "";
                 dispatch(setDefaultSignImg(sign));
                 dispatch(setMyInitial(initials));
+              } else {
+                dispatch(setSaveSignCheckbox({ isVisible: true }));
               }
             } else if (res?.length === 0) {
               const res = await contactBook(currUserId);
@@ -642,7 +635,7 @@ function PdfRequestFiles(
           (data) => data.signerObjId === signerObjectId
         );
         if (checkUser && checkUser.length > 0) {
-          const status = handleCheckResponse(checkUser,setminRequiredCount)      
+          const status = handleCheckResponse(checkUser, setminRequiredCount);
           if (status?.showAlert) {
             setUnSignedWidgetId(status?.widgetKey);
             setPageNumber(status?.tourPageNumber);
@@ -1377,7 +1370,7 @@ function PdfRequestFiles(
       setIsUiLoading(false);
       alert(t("expiry-date-error"));
     }
-  }; 
+  };
   // `handleRedirectCancel` is used to cancel redirecting to redirectUrl
   const handleRedirectCancel = () => {
     setIsredirectCanceled(true);

apps/OpenSign/src/pages/SignyourselfPdf.jsx

@@ -77,9 +77,6 @@ function SignYourSelf() {
   const { docId } = useParams();
   const dispatch = useDispatch();
   const isShowModal = useSelector((state) => state.widget.isShowModal);
-  const saveSignCheckbox = useSelector(
-    (state) => state.widget.saveSignCheckbox
-  );
   const appName =
     "OpenSign™";
   const divRef = useRef(null);
@@ -268,13 +265,14 @@ function SignYourSelf() {
       if (defaultSignRes?.status === "success") {
         dispatch(
           setSaveSignCheckbox({
-            ...saveSignCheckbox,
             isVisible: true,
             signId: defaultSignRes?.res?.id
           })
         );
         dispatch(setDefaultSignImg(defaultSignRes?.res?.defaultSignature));
         dispatch(setMyInitial(defaultSignRes?.res?.defaultInitial));
+      } else {
+        dispatch(setSaveSignCheckbox({ isVisible: true }));
       }
       const contractUsersRes = await contractUsers();
       if (contractUsersRes === "Error: Something went wrong!") {
@@ -283,8 +281,6 @@ function SignYourSelf() {
       } else if (contractUsersRes[0] && contractUsersRes.length > 0) {
         setContractName("_Users");
         setSignerUserId(contractUsersRes[0].objectId);
-        dispatch(setSaveSignCheckbox({ ...saveSignCheckbox, isVisible: true }));
-
         const tourstatuss =
           contractUsersRes[0].TourStatus && contractUsersRes[0].TourStatus;
         if (tourstatuss && tourstatuss.length > 0 && !isCompleted) {
@@ -1046,12 +1042,18 @@ function SignYourSelf() {
 
   const setCellCount = (key, newCount) => {
     setXyPosition((prev) => {
-      const getPageNumer = prev.filter((data) => data.pageNumber === pageNumber);
+      const getPageNumer = prev.filter(
+        (data) => data.pageNumber === pageNumber
+      );
       if (getPageNumer.length > 0) {
         const updatePos = getPageNumer[0].pos.map((p) =>
-          p.key === key ? { ...p, options: { ...p.options, cellCount: newCount } } : p
+          p.key === key
+            ? { ...p, options: { ...p.options, cellCount: newCount } }
+            : p
+        );
+        return prev.map((obj, ind) =>
+          ind === index ? { ...obj, pos: updatePos } : obj
         );
-        return prev.map((obj, ind) => (ind === index ? { ...obj, pos: updatePos } : obj));
       }
       return prev;
     });
@@ -1082,7 +1084,8 @@ function SignYourSelf() {
                 cellCount: count,
                 defaultValue: (defaultdata?.defaultValue || "").slice(0, count),
                 fontSize: newFontSize || position.options?.fontSize || 12,
-                fontColor: newFontColor || position.options?.fontColor || "black"
+                fontColor:
+                  newFontColor || position.options?.fontColor || "black"
               }
             };
           } else {

apps/OpenSign/src/pages/UserProfile.jsx

@@ -286,7 +286,9 @@ function UserProfile() {
                       style={{ width: `${percentage}%` }}
                     ></div>
                   </div>
-                  <span className="text-base-contentk text-sm">{percentage}%</span>
+                  <span className="text-base-contentk text-sm">
+                    {percentage}%
+                  </span>
                 </div>
               )}
               <div className="text-base font-semibold pt-4">

apps/OpenSign/src/styles/signature.css

@@ -6,18 +6,21 @@
 .react-datepicker__input-container {
   position: initial !important;
 }
+
 .select-none-cls {
   -webkit-user-select: none;
   /* Disable text selection in WebKit browsers */
   -moz-user-select: none;
   user-select: none;
 }
+
 .widgets {
   -webkit-user-select: none;
   /* Disable text selection in WebKit browsers */
   -moz-user-select: none;
   user-select: none;
 }
+
 .radioButton {
   width: 100%;
   height: 100%;
@@ -33,12 +36,18 @@
   width: 440px;
   height: 167px;
 }
+
 .tabWidth {
   border: 1px solid #f3f4f6;
   background-color: #f3f4f6;
   width: 440px;
 }
 
+.mysignatureCanvas {
+  width: 456px;
+  height: 180px;
+}
+
 [data-theme="opensigndark"] .tabWidth {
   border: 1px solid #1f2937 !important;
   background-color: #1f2937 !important;
@@ -48,6 +57,7 @@
   width: 150px;
   height: 150px;
 }
+
 .checked-radio::after {
   content: "";
   position: absolute;
@@ -56,14 +66,15 @@
   width: 50%;
   height: 50%;
   border-radius: 9999px;
-  background-color: #111111; /* blue-500 */
+  background-color: #111111;
+  /* blue-500 */
 }
 
 .intialSignature {
   border: 2px solid #888;
   background-color: rgb(255, 255, 255);
-  width: 183px;
-  height: 183px;
+  width: 180px;
+  height: 180px;
 }
 
 /* Dark mode support for initials box in /managesign */
@@ -100,6 +111,12 @@
   border-color: #4b5563 !important;
 }
 
+/* Also support signature canvas for consistency */
+[data-theme="opensigndark"] .mysignatureCanvas {
+  background-color: #1f2937 !important;
+  border-color: #4b5563 !important;
+}
+
 .penContainerDefault {
   width: 460px;
 }
@@ -115,6 +132,7 @@
 .ScrollbarsCustom-TrackY {
   width: 4px !important;
 }
+
 .ScrollbarsCustom-TrackX {
   height: 4px !important;
 }
@@ -143,6 +161,7 @@
   overflow: hidden !important;
   text-overflow: ellipsis;
 }
+
 .disabled {
   opacity: 0.5;
   /* Example: reduce opacity to visually indicate disabled state */
@@ -431,7 +450,7 @@ option {
   to prevent sudden quick movement (as the
   navigation bar gets a new position at the top of the
   page (position:fixed and top:0) */
-  .stickyHead + .content {
+  .stickyHead+.content {
     padding-top: 60px;
   }
 }
@@ -441,6 +460,12 @@ option {
     width: 300px;
     height: 120px;
   }
+
+  .mysignatureCanvas {
+    width: 300px;
+    height: 118px;
+  }
+
   .tabWidth {
     width: 300px;
   }
@@ -462,11 +487,18 @@ option {
 .scroll-hide::-webkit-scrollbar {
   display: none;
 }
+
 @media screen and (max-width: 350px) and (min-width: 311px) {
   .signatureCanvas {
     width: 280px;
     height: 112px;
   }
+
+  .mysignatureCanvas {
+    width: 280px;
+    height: 111px;
+  }
+
   .tabWidth {
     width: 280px;
   }
@@ -491,6 +523,12 @@ option {
     width: 230px;
     height: 92px;
   }
+
+  .mysignatureCanvas {
+    width: 230px;
+    height: 91px;
+  }
+
   .tabWidth {
     width: 230px;
   }
@@ -507,4 +545,4 @@ option {
   .uploadImgLogo {
     font-size: 20px;
   }
-}
+}