Merge pull request #961 from OpenSignLabs/raktima-opensignlabs-patch-11

fix: signer selection removed after clicking widget settings and some widget's issue

apps/OpenSign/src/components/pdf/PlaceholderCopy.js

@@ -189,9 +189,7 @@ function PlaceholderCopy(props) {
     <ModalUi
       isOpen={props.isPageCopy}
       title={"Copy to all pages"}
-      handleClose={() => {
-        props.setIsPageCopy(false);
-      }}
+      handleClose={() => handleUniqueId()}
     >
       <div className="h-full p-[20px] text-base-content">
         {copyType.map((data, key) => {

apps/OpenSign/src/components/pdf/PlaceholderType.js

@@ -14,9 +14,9 @@ import "react-datepicker/dist/react-datepicker.css";
 import "../../styles/signature.css";
 import RegexParser from "regex-parser";
 const textWidgetCls =
-  "w-full h-full md:min-w-full md:min-h-full z-[999] text-[12px] rounded-[2px] border-[1px] border-[#007bff] overflow-hidden resize-none outline-none text-base-content item-center bg-base-100 whitespace-pre-wrap";
+  "w-full h-full md:min-w-full md:min-h-full z-[999] text-[12px] rounded-[2px] border-[1px] border-[#007bff] overflow-hidden resize-none outline-none text-base-content item-center whitespace-pre-wrap";
 const selectWidgetCls =
-  "w-full h-full absolute left-0 top-0 border-[1px] border-[#007bff] rounded-[2px] focus:outline-none bg-base-100 text-base-content";
+  "w-full h-full absolute left-0 top-0 border-[1px] border-[#007bff] rounded-[2px] focus:outline-none text-base-content";
 function PlaceholderType(props) {
   const type = props?.pos?.type;
   const [selectOption, setSelectOption] = useState("");
@@ -618,7 +618,8 @@ function PlaceholderType(props) {
         </div>
       );
     case "date":
-      return (
+      return props.isSignYourself ||
+        (props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
         <div>
           <DatePicker
             renderCustomHeader={({ date, changeYear, changeMonth }) => (
@@ -675,6 +676,16 @@ function PlaceholderType(props) {
             }
           />
         </div>
+      ) : (
+        <div className="text-[12px] text-black uppercase items-center">
+          <span>
+            {props.selectDate
+              ? props.selectDate?.format
+              : props.pos?.options?.validation?.format
+                ? props.pos?.options?.validation?.format
+                : "MM/dd/yyyy"}
+          </span>
+        </div>
       );
     case "image":
       return props.pos.SignUrl ? (

apps/OpenSign/src/components/pdf/WidgetNameModal.js

@@ -23,7 +23,7 @@ const WidgetNameModal = (props) => {
   useEffect(() => {
     if (props.defaultdata) {
       setFormdata({
-        name: props.defaultdata?.options?.name || props?.widgetName || "",
+        name: props.defaultdata?.options?.name || "",
         defaultValue: props.defaultdata?.options?.defaultValue || "",
         status: props.defaultdata?.options?.status || "required",
         hint: props.defaultdata?.options?.hint || "",
@@ -35,11 +35,11 @@ const WidgetNameModal = (props) => {
     } else {
       setFormdata({
         ...formdata,
-        name: props.defaultdata?.options?.name || props?.widgetName || ""
+        name: props.defaultdata?.options?.name || ""
       });
     }
     // eslint-disable-next-line
-  }, [props.defaultdata, props.widgetName]);
+  }, [props.defaultdata]);
   const handleSubmit = (e) => {
     e.preventDefault();
     if (props.handleData) {
@@ -109,10 +109,7 @@ const WidgetNameModal = (props) => {
       <form
         onSubmit={handleSubmit}
         className={`${
-          props.defaultdata?.type === textInputWidget ||
-          props.widgetName === textInputWidget
-            ? "pt-0"
-            : ""
+          props.defaultdata?.type === textInputWidget ? "pt-0" : ""
         } p-[20px] text-base-content`}
       >
         <div className="mb-[0.75rem] text-[13px]">
@@ -128,8 +125,7 @@ const WidgetNameModal = (props) => {
             required
           />
         </div>
-        {(props.defaultdata?.type === textInputWidget ||
-          props.widgetName === textInputWidget) && (
+        {props.defaultdata?.type === textInputWidget && (
           <>
             {isEnableSubscription && (
               <div className="mb-[0.75rem]">
@@ -248,8 +244,7 @@ const WidgetNameModal = (props) => {
             })}
           </div>
         </div>
-        {(props.defaultdata?.type === textInputWidget ||
-          props?.widgetName === textInputWidget) && (
+        {props.defaultdata?.type === textInputWidget && (
           <div className="mb-[0.75rem]">
             <label htmlFor="hint" className="text-[13px]">
               Hint
@@ -269,15 +264,13 @@ const WidgetNameModal = (props) => {
           "company",
           "job title",
           "email"
-        ].includes(props.defaultdata?.type || props?.widgetName) && (
+        ].includes(props.defaultdata?.type) && (
           <div className="flex items-center mb-[0.75rem]">
             <span>Font size:</span>
             <select
               className="ml-[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
               value={
-                props.fontSize ||
-                props.currWidgetsDetails?.options?.fontSize ||
-                "12"
+                props.fontSize || props.defaultdata?.options?.fontSize || "12"
               }
               onChange={(e) => props.setFontSize(e.target.value)}
             >
@@ -294,7 +287,7 @@ const WidgetNameModal = (props) => {
               <select
                 value={
                   props.fontColor ||
-                  props.currWidgetsDetails?.options?.fontColor ||
+                  props.defaultdata?.options?.fontColor ||
                   "black"
                 }
                 onChange={(e) => props.setFontColor(e.target.value)}
@@ -312,7 +305,7 @@ const WidgetNameModal = (props) => {
                 style={{
                   background:
                     props.fontColor ||
-                    props.currWidgetsDetails?.options?.fontColor ||
+                    props.defaultdata?.options?.fontColor ||
                     "black"
                 }}
                 className="w-5 h-[19px] ml-1"

apps/OpenSign/src/constant/Utils.js

@@ -353,7 +353,7 @@ export const getDate = () => {
 };
 export const addWidgetOptions = (type) => {
   const defaultOpt = {
-    name: "",
+    name: type,
     status: "required"
   };
   switch (type) {

apps/OpenSign/src/pages/PlaceHolderSign.js

@@ -1520,16 +1520,9 @@ function PlaceHolderSign() {
       }
     }
     setCurrWidgetsDetails({});
-    handleNameModal();
     setFontSize();
     setFontColor();
-    //condition for text widget type after set all values for text widget
-    //change setUniqueId which is set in tempsignerId
-    //because textwidget do not have signer user so for selected signers we have to do
-    if (currWidgetsDetails.type === textWidget) {
-      setUniqueId(tempSignerId);
-      setTempSignerId("");
-    }
+    handleNameModal();
   };
 
   const handleNameModal = () => {
@@ -1538,6 +1531,14 @@ function PlaceHolderSign() {
     setShowDropdown(false);
     setIsRadio(false);
     setIsCheckbox(false);
+    setIsPageCopy(false);
+    //condition for text widget type after set all values for text widget
+    //change setUniqueId which is set in tempsignerId
+    //because textwidget do not have signer user so for selected signers we have to do
+    if (currWidgetsDetails.type === textWidget) {
+      setUniqueId(tempSignerId);
+      setTempSignerId("");
+    }
   };
   //function for update TourStatus
   const closeTour = async () => {
@@ -1620,13 +1621,11 @@ function PlaceHolderSign() {
           setCurrentId(getCurrentUserDeatils[0].Email);
         }
       }
-
       setSignersData(updateSigner);
       const index = signersdata.findIndex((x) => x.Id === uniqueId);
       setIsSelectId(index);
     }
   };
-
   //function to add new signer in document signers list
   const handleAddNewRecipients = (data) => {
     const newId = randomId();