From 6b3abed782b1c5b883a32ae63a7c243f5e8cfbc8 Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 17 Apr 2024 16:14:21 +0530
Subject: [PATCH] fix:template report tour messsage

---
 apps/OpenSign/src/json/ReportJson.js          |  8 +-
 .../src/primitives/GetReportDisplay.js        | 85 +++++++++++++++++++
 2 files changed, 92 insertions(+), 1 deletion(-)

diff --git a/apps/OpenSign/src/json/ReportJson.js b/apps/OpenSign/src/json/ReportJson.js
index 21066f669..e7227acc7 100644
--- a/apps/OpenSign/src/json/ReportJson.js
+++ b/apps/OpenSign/src/json/ReportJson.js
@@ -320,7 +320,10 @@ export default function reportJson(id) {
             textColor: "white",
             btnIcon: "fa fa-plus",
             redirectUrl: "placeHolderSign",
-            action: "redirect"
+            action: "redirect",
+            selector: "reactourSecond",
+            message:
+              "Click the 'Use' button to create a new document from an existing template."
           },
           {
             btnId: "2234",
@@ -329,6 +332,9 @@ export default function reportJson(id) {
             textColor: "black",
             btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
             action: "option",
+            selector: "reactourThird",
+            message:
+              "Onclick option button you can see options such as Edit & Delete. Use the 'Edit' button to add signer roles, modify fields, and update your template. Changes will apply to all future documents created from this template but won’t affect existing documents.Use the Delete button you can delete template",
             subaction: [
               {
                 btnId: "2434",
diff --git a/apps/OpenSign/src/primitives/GetReportDisplay.js b/apps/OpenSign/src/primitives/GetReportDisplay.js
index 4684b3058..6ee660f27 100644
--- a/apps/OpenSign/src/primitives/GetReportDisplay.js
+++ b/apps/OpenSign/src/primitives/GetReportDisplay.js
@@ -8,6 +8,8 @@ import { modalSubmitBtnColor, modalCancelBtnColor } from "../constant/const";
 import Alert from "./Alert";
 import Tooltip from "./Tooltip";
 import { RWebShare } from "react-web-share";
+import Tour from "reactour";
+import Parse from "parse";
 
 const ReportTable = (props) => {
   const navigate = useNavigate();
@@ -23,6 +25,8 @@ const ReportTable = (props) => {
   const [copied, setCopied] = useState(false);
   const [isOption, setIsOption] = useState({});
   const [alertMsg, setAlertMsg] = useState({ type: "success", message: "" });
+  const [isTour, setIsTour] = useState(false);
+  const [tourStatusArr, setTourStatusArr] = useState([]);
   const startIndex = (currentPage - 1) * props.docPerPage;
   const { isMoreDocs, setIsNextRecord } = props;
   // For loop is used to calculate page numbers visible below table
@@ -36,6 +40,7 @@ const ReportTable = (props) => {
   }, [props.List, props.docPerPage]);
   //  below useEffect reset currenpage to 1 if user change route
   useEffect(() => {
+    checkTourStatus();
     return () => setCurrentPage(1);
   }, []);
 
@@ -346,6 +351,75 @@ const ReportTable = (props) => {
         setActLoader({});
       });
   };
+
+  async function checkTourStatus() {
+    const currentUser = Parse.User.current();
+    const cloudRes = await Parse.Cloud.run("getUserDetails", {
+      email: currentUser.get("email")
+    });
+    const res = { data: cloudRes.toJSON() };
+    if (res.data && res.data.TourStatus && res.data.TourStatus.length > 0) {
+      const tourStatus = res.data.TourStatus;
+      // console.log("res ", res.data.TourStatus);
+      setTourStatusArr(tourStatus);
+      const filteredtourStatus = tourStatus.filter(
+        (obj) => obj["templateTour"]
+      );
+      if (filteredtourStatus.length > 0) {
+        const templateTour = filteredtourStatus[0]["templateTour"];
+
+        if (templateTour) {
+          setIsTour(false);
+        } else {
+          setIsTour(true);
+        }
+      } else {
+        setIsTour(true);
+      }
+    } else {
+      setIsTour(true);
+    }
+  }
+
+  const closeTour = async () => {
+    // console.log("closeTour");
+    setIsTour(false);
+    if (props.isDontShow) {
+      const serverUrl = localStorage.getItem("baseUrl");
+      const appId = localStorage.getItem("parseAppId");
+      const extUserClass = localStorage.getItem("extended_class");
+      const json = JSON.parse(localStorage.getItem("Extand_Class"));
+      const extUserId = json && json.length > 0 && json[0].objectId;
+      // console.log("extUserId ", extUserId)
+
+      let updatedTourStatus = [];
+      if (tourStatusArr.length > 0) {
+        updatedTourStatus = [...tourStatusArr];
+        const templateTourIndex = tourStatusArr.findIndex(
+          (obj) => obj["templateTour"] === false || obj["templateTour"] === true
+        );
+        if (templateTourIndex !== -1) {
+          updatedTourStatus[templateTourIndex] = { templateTour: true };
+        } else {
+          updatedTourStatus.push({ templateTour: true });
+        }
+      } else {
+        updatedTourStatus = [{ templateTour: true }];
+      }
+
+      await axios.put(
+        serverUrl + "classes/" + extUserClass + "/" + extUserId,
+        {
+          TourStatus: updatedTourStatus
+        },
+        {
+          headers: {
+            "X-Parse-Application-Id": appId
+          }
+        }
+      );
+    }
+  };
   return (
     <div className="relative">
       {Object.keys(actLoader)?.length > 0 && (
@@ -358,6 +432,15 @@ const ReportTable = (props) => {
       )}
       <div className="p-2 overflow-x-scroll w-full bg-white rounded-md">
         {isAlert && <Alert type={alertMsg.type}>{alertMsg.message}</Alert>}
+        {props.tourData && props.ReportName === "Templates" && (
+          <Tour
+            onRequestClose={closeTour}
+            steps={props.tourData}
+            isOpen={isTour}
+            // rounded={5}
+            closeWithMask={false}
+          />
+        )}
         <div className="flex flex-row items-center justify-between my-2 mx-3 text-[20px] md:text-[23px]">
           <div className="font-light">
             {props.ReportName}{" "}
@@ -369,6 +452,7 @@ const ReportTable = (props) => {
           </div>
           {props.ReportName === "Templates" && (
             <i
+              data-tut="reactourFirst"
               onClick={() => navigate("/form/template")}
               className="fa-solid fa-square-plus text-sky-400 text-[25px]"
             ></i>
@@ -500,6 +584,7 @@ const ReportTable = (props) => {
                         {props.actions?.length > 0 &&
                           props.actions.map((act, index) => (
                             <button
+                              data-tut={act?.selector}
                               key={index}
                               onClick={() => handleActionBtn(act, item)}
                               className={`${