add reactour for template

Author: prafull-opensignlabs

apps/OpenSign/src/primitives/GetReportDisplay.js

@@ -77,7 +77,7 @@ const ReportTable = ({
             }
           );
 
-          console.log("templateDeatils.data ", templateDeatils.data);
+          // console.log("templateDeatils.data ", templateDeatils.data);
           const templateData =
             templateDeatils.data && templateDeatils.data.result;
           if (!templateData.error) {

apps/OpenSignServer/cloud/parsefunction/GetTemplate.js

@@ -12,8 +12,8 @@ export default async function GetTemplate(request) {
       },
     });
     const userId = userRes.data && userRes.data.objectId;
-    console.log("templateId ", templateId)
-    console.log("userId ",userId)
+    // console.log("templateId ", templateId)
+    // console.log("userId ",userId)
     if (templateId && userId) {
       try {
         const template = new Parse.Query('contracts_Template');
@@ -22,9 +22,9 @@ export default async function GetTemplate(request) {
         template.include('Signers');
         template.include('CreateBy');
         const res = await template.first({ useMasterKey: true });
-        console.log("res ", res)
+        // console.log("res ", res)
         if (res) {
-          console.log("res ",res)
+          // console.log("res ",res)
           const acl = res.getACL();
           console.log("acl", acl.getReadAccess(userId))
           if (acl && acl.getReadAccess(userId)) {

microfrontends/SignDocuments/src/Component/TemplatePlaceholder.js

@@ -58,7 +58,7 @@ const TemplatePlaceholder = () => {
   const [handleError, setHandleError] = useState();
   const [currentEmail, setCurrentEmail] = useState();
   const [pdfNewWidth, setPdfNewWidth] = useState();
-  const [placeholderTour, setPlaceholderTour] = useState(true);
+  const [templateTour, setTemplateTour] = useState(true);
   const [checkTourStatus, setCheckTourStatus] = useState(false);
   const [tourStatus, setTourStatus] = useState([]);
   const [signerUserId, setSignerUserId] = useState();
@@ -301,10 +301,10 @@ const TemplatePlaceholder = () => {
       if (tourstatus && tourstatus.length > 0) {
         setTourStatus(tourstatus);
         const checkTourRecipients = tourstatus.filter(
-          (data) => data.placeholder
+          (data) => data.templatetour
         );
         if (checkTourRecipients && checkTourRecipients.length > 0) {
-          setCheckTourStatus(checkTourRecipients[0].placeholder);
+          setCheckTourStatus(checkTourRecipients[0].templatetour);
         }
       }
       const loadObj = {
@@ -766,12 +766,19 @@ const TemplatePlaceholder = () => {
   //here you can add your messages in content and selector is key of particular steps
 
   const tourConfig = [
+    {
+      selector: '[data-tut="reactourAddbtn"]',
+      content: `Clicking "Add" button will show you popup of Add Role, fill role name or it will take by default name and create new receipent.`,
+      position: "top",
+      observe: '[data-tut="reactourAddbtn--observe"]',
+      style: { fontSize: "13px" }
+    },
     {
       selector: '[data-tut="reactourFirst"]',
       content: `Select a recipient from this list to add a place-holder where he is supposed to sign.The placeholder will appear in the same colour as the recipient name once you drop it on the document.`,
       position: "top",
-
-      style: { fontSize: "13px" }
+      style: { fontSize: "13px" },
+      action: () => handleCloseRoleModal()
     },
     {
       selector: '[data-tut="reactourSecond"]',
@@ -787,29 +794,29 @@ const TemplatePlaceholder = () => {
     },
     {
       selector: '[data-tut="reactourFour"]',
-      content: `Clicking "Send" button will share the document with all the recipients.It will also send out emails to everyone on the recipients list.`,
+      content: `Clicking "Save" button will save the template and will ask you for creating new document.`,
       position: "top",
       style: { fontSize: "13px" }
     }
   ];
 
   //function for update TourStatus
   const closeTour = async () => {
-    setPlaceholderTour(false);
+    setTemplateTour(false);
     const extUserClass = localStorage.getItem("extended_class");
     let updatedTourStatus = [];
     if (tourStatus.length > 0) {
       updatedTourStatus = [...tourStatus];
-      const placeholderIndex = tourStatus.findIndex(
-        (obj) => obj["placeholder"] === false || obj["placeholder"] === true
+      const templatetourIndex = tourStatus.findIndex(
+        (obj) => obj["templatetour"] === false || obj["templatetour"] === true
       );
-      if (placeholderIndex !== -1) {
-        updatedTourStatus[placeholderIndex] = { placeholder: true };
+      if (templatetourIndex !== -1) {
+        updatedTourStatus[templatetourIndex] = { templatetour: true };
       } else {
-        updatedTourStatus.push({ placeholder: true });
+        updatedTourStatus.push({ templatetour: true });
       }
     } else {
-      updatedTourStatus = [{ placeholder: true }];
+      updatedTourStatus = [{ templatetour: true }];
     }
     await axios
       .put(
@@ -989,7 +996,7 @@ const TemplatePlaceholder = () => {
               <Tour
                 onRequestClose={closeTour}
                 steps={tourConfig}
-                isOpen={placeholderTour}
+                isOpen={templateTour}
                 rounded={5}
                 closeWithMask={false}
               />
@@ -1214,7 +1221,7 @@ const TemplatePlaceholder = () => {
           </div>
         )}
       </DndProvider>
-      <div>
+      <div data-tut="reactourAddbtn--observe">
         <AddRoleModal
           isModalRole={isModalRole}
           roleName={roleName}

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

@@ -8,7 +8,9 @@ const AddRoleModal = (props) => {
       isOpen={props.isModalRole}
       handleClose={props.handleCloseRoleModal}
     >
-      <div className="addusercontainer">
+      <div 
+        className="addusercontainer"
+      >
         <form
           style={{ display: "flex", flexDirection: "column" }}
           onSubmit={props.handleAddRole}

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

@@ -20,7 +20,6 @@ function FieldsComponent({
   isDragSignatureSS,
   isSignYourself,
   addPositionOfSignature,
-
   signersdata,
   isSelectListId,
   setSignerObjId,
@@ -184,6 +183,7 @@ function FieldsComponent({
             )}
             {handleAddSigner && (
               <div
+                data-tut="reactourAddbtn"
                 style={{
                   margin: "5px 0 5px 0",
                   backgroundColor: themeColor(),

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

@@ -254,7 +254,7 @@ function SignerListPlace({
         </>
       </div>
       {handleAddSigner && (
-        <div className="addSignerBtn" onClick={() => handleAddSigner()}>
+        <div data-tut="reactourAddbtn" className="addSignerBtn" onClick={() => handleAddSigner()}>
           <i className="fa-solid fa-plus"></i>
           <span style={{ marginLeft: 2 }}>Add</span>
         </div>