@mseva/upyog-ui-module-ads 1.1.62 → 1.1.64

package/dist/index.modern.js

@@ -20390,6 +20390,208 @@ function get(object, path, defaultValue) {
 }
 var get_1 = get;
 
+const PDFSvg$1 = React.memo(({
+  width: _width = 20,
+  height: _height = 20,
+  style
+}) => /*#__PURE__*/React.createElement("svg", {
+  style: style,
+  xmlns: "http://www.w3.org/2000/svg",
+  width: _width,
+  height: _height,
+  viewBox: "0 0 20 20",
+  fill: "gray"
+}, /*#__PURE__*/React.createElement("path", {
+  d: "M20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-8.5 7.5c0 .83-.67 1.5-1.5 1.5H9v2H7.5V7H10c.83 0 1.5.67 1.5 1.5v1zm5 2c0 .83-.67 1.5-1.5 1.5h-2.5V7H15c.83 0 1.5.67 1.5 1.5v3zm4-3H19v1h1.5V11H19v2h-1.5V7h3v1.5zM9 9.5h1v-1H9v1zM4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm10 5.5h1v-3h-1v3z"
+})));
+const pdfDownloadLink$2 = (documents, fileStoreId) => {
+  var _downloadLink$split;
+  const downloadLink = (documents === null || documents === void 0 ? void 0 : documents[fileStoreId]) || "";
+  const formats = (downloadLink === null || downloadLink === void 0 ? void 0 : (_downloadLink$split = downloadLink.split(",")) === null || _downloadLink$split === void 0 ? void 0 : _downloadLink$split.filter(Boolean)) || [];
+  return (formats === null || formats === void 0 ? void 0 : formats.find(link => !(link !== null && link !== void 0 && link.includes("large")) && !(link !== null && link !== void 0 && link.includes("medium")) && !(link !== null && link !== void 0 && link.includes("small")))) || (formats === null || formats === void 0 ? void 0 : formats[0]) || "";
+};
+const TimelineDocument$1 = React.memo(({
+  value,
+  Code,
+  index
+}) => {
+  const {
+    isLoading,
+    data
+  } = Digit.Hooks.ads.useADSDocumentSearch({
+    value
+  }, {
+    value
+  }, Code, index);
+  const documents = useMemo(() => {
+    var _value$documents;
+    const docs = value !== null && value !== void 0 && value.documents ? value === null || value === void 0 ? void 0 : (_value$documents = value.documents) === null || _value$documents === void 0 ? void 0 : _value$documents.documents : value;
+    return (docs === null || docs === void 0 ? void 0 : docs.filter(doc => (doc === null || doc === void 0 ? void 0 : doc.documentType) === Code)) || [];
+  }, [value, Code]);
+  if (isLoading) return /*#__PURE__*/React.createElement(Loader$2, null);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "custom-doc-container"
+  }, documents === null || documents === void 0 ? void 0 : documents.map((document, idx) => {
+    const documentLink = pdfDownloadLink$2(data === null || data === void 0 ? void 0 : data.pdfFiles, document === null || document === void 0 ? void 0 : document.fileStoreId);
+    if (!documentLink) return null;
+    return /*#__PURE__*/React.createElement("a", {
+      key: idx,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      href: documentLink,
+      className: "custom-doc-link"
+    }, /*#__PURE__*/React.createElement(PDFSvg$1, null), /*#__PURE__*/React.createElement("span", null, (document === null || document === void 0 ? void 0 : document.fileName) || "Document"));
+  }));
+});
+function NewApplicationTimeline({
+  workflowDetails,
+  t
+}) {
+  const parseActionDateTime = auditDetails => {
+    if (!(auditDetails !== null && auditDetails !== void 0 && auditDetails.created) || !(auditDetails !== null && auditDetails !== void 0 && auditDetails.timing)) return null;
+    const [day, month, year] = auditDetails.created.split("/");
+    return new Date(`${year}-${month}-${day} ${auditDetails.timing}`);
+  };
+  const calculateSLA = (currentDate, previousDate) => {
+    if (!currentDate || !previousDate) return null;
+    const diffMs = currentDate - previousDate;
+    const totalMinutes = Math.floor(diffMs / (1000 * 60));
+    const hours = Math.floor(totalMinutes / 60);
+    const days = Math.floor(hours / 24);
+    if (days > 0) return `${days} day(s)`;
+    if (hours > 0) return `${hours} hour(s)`;
+    return `${totalMinutes} minute(s)`;
+  };
+  const normalizeTimeline = workflowDetails => {
+    const details = (workflowDetails === null || workflowDetails === void 0 ? void 0 : workflowDetails.data) || workflowDetails;
+    const rawTimeline = details === null || details === void 0 ? void 0 : details.timeline;
+    if (!Array.isArray(rawTimeline)) return [];
+    const orderedTimeline = [...rawTimeline].reverse();
+    const normalized = orderedTimeline.map((item, index) => {
+      var _orderedTimeline;
+      const currentDate = parseActionDateTime(item.auditDetails);
+      const previousDate = index > 0 ? parseActionDateTime((_orderedTimeline = orderedTimeline[index - 1]) === null || _orderedTimeline === void 0 ? void 0 : _orderedTimeline.auditDetails) : null;
+      return {
+        ...item,
+        status: (item === null || item === void 0 ? void 0 : item.state) || (item === null || item === void 0 ? void 0 : item.status),
+        assigner: (item === null || item === void 0 ? void 0 : item.assigner) || null,
+        assignes: Array.isArray(item === null || item === void 0 ? void 0 : item.assignes) ? item.assignes : [],
+        wfComment: Array.isArray(item === null || item === void 0 ? void 0 : item.wfComment) ? item.wfComment : item !== null && item !== void 0 && item.comment ? [item.comment] : [],
+        wfDocuments: Array.isArray(item === null || item === void 0 ? void 0 : item.wfDocuments) ? item.wfDocuments : [],
+        actionDateTime: currentDate,
+        sla: calculateSLA(currentDate, previousDate)
+      };
+    });
+    return normalized.reverse();
+  };
+  const data = useMemo(() => normalizeTimeline(workflowDetails), [workflowDetails]);
+  const sortedData = data || [];
+  console.log("sortedData", sortedData);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "custom-timeline-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "custom-timeline-header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "custom-tracking-status-header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "custom-tracking-line"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "custom-tracking-status-text"
+  }, t("TRACKING STATUS")), /*#__PURE__*/React.createElement("div", {
+    className: "custom-tracking-line"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "custom-title-bar-row"
+  }, /*#__PURE__*/React.createElement("h2", {
+    className: "custom-timeline-title"
+  }, t("Application History")), /*#__PURE__*/React.createElement("div", {
+    className: "custom-blue-bar"
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "custom-timeline-entries"
+  }, sortedData === null || sortedData === void 0 ? void 0 : sortedData.map((item, index) => {
+    var _item$auditDetails, _item$auditDetails2, _item$assigner, _item$assigner2, _item$assigner3, _item$wfComment, _item$wfComment2, _item$wfComment3, _item$assignes, _item$assignes$, _item$wfDocuments, _item$wfDocuments2;
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      className: "custom-timeline-entry"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-vertical-line"
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "custom-date-badge"
+    }, item === null || item === void 0 ? void 0 : (_item$auditDetails = item.auditDetails) === null || _item$auditDetails === void 0 ? void 0 : _item$auditDetails.created, " ", item === null || item === void 0 ? void 0 : (_item$auditDetails2 = item.auditDetails) === null || _item$auditDetails2 === void 0 ? void 0 : _item$auditDetails2.timing), /*#__PURE__*/React.createElement("div", {
+      className: "custom-entry-content"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-icon-container"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-circular-icon"
+    }, /*#__PURE__*/React.createElement("svg", {
+      className: "custom-mail-icon",
+      viewBox: "0 0 24 24"
+    }, /*#__PURE__*/React.createElement("rect", {
+      x: "3",
+      y: "5",
+      width: "18",
+      height: "14",
+      rx: "2"
+    }), /*#__PURE__*/React.createElement("path", {
+      d: "M3 7l9 6 9-6"
+    })))), /*#__PURE__*/React.createElement("div", {
+      className: "custom-content-card"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-card-top"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-card-left"
+    }, /*#__PURE__*/React.createElement("h3", {
+      className: "custom-action-title"
+    }, t("Action taken by")), (item === null || item === void 0 ? void 0 : item.assigner) && /*#__PURE__*/React.createElement("div", {
+      className: "custom-officer-info"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-officer-name"
+    }, (item === null || item === void 0 ? void 0 : (_item$assigner = item.assigner) === null || _item$assigner === void 0 ? void 0 : _item$assigner.name) || t("CS_COMMON_NA")), (item === null || item === void 0 ? void 0 : (_item$assigner2 = item.assigner) === null || _item$assigner2 === void 0 ? void 0 : _item$assigner2.emailId) && /*#__PURE__*/React.createElement("div", {
+      className: "custom-officer-email"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "custom-email-label"
+    }, t("Email")), " ", item === null || item === void 0 ? void 0 : (_item$assigner3 = item.assigner) === null || _item$assigner3 === void 0 ? void 0 : _item$assigner3.emailId))), (item === null || item === void 0 ? void 0 : item.sla) && /*#__PURE__*/React.createElement("div", {
+      className: "custom-card-left"
+    }, /*#__PURE__*/React.createElement("h3", {
+      className: "custom-action-title"
+    }, t("Time Taken")), /*#__PURE__*/React.createElement("div", {
+      className: "custom-officer-email"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "custom-email-label"
+    }, item === null || item === void 0 ? void 0 : item.sla))), /*#__PURE__*/React.createElement("div", {
+      className: "custom-card-right"
+    }, /*#__PURE__*/React.createElement("h3", {
+      className: "custom-action-title"
+    }, t("Action")), /*#__PURE__*/React.createElement("div", {
+      className: "custom-status-text"
+    }, t((item === null || item === void 0 ? void 0 : item.performedAction) || "CS_COMMON_NA")))), (item === null || item === void 0 ? void 0 : item.wfComment) && (item === null || item === void 0 ? void 0 : (_item$wfComment = item.wfComment) === null || _item$wfComment === void 0 ? void 0 : _item$wfComment.length) > 0 && (item === null || item === void 0 ? void 0 : (_item$wfComment2 = item.wfComment) === null || _item$wfComment2 === void 0 ? void 0 : _item$wfComment2.some(c => c === null || c === void 0 ? void 0 : c.trim())) && /*#__PURE__*/React.createElement("div", {
+      className: "custom-comments-section"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-comment-text"
+    }, /*#__PURE__*/React.createElement("h4", {
+      className: "custom-comments-title"
+    }, t("Officer Comments")), item === null || item === void 0 ? void 0 : (_item$wfComment3 = item.wfComment) === null || _item$wfComment3 === void 0 ? void 0 : _item$wfComment3.map((comment, idx) => /*#__PURE__*/React.createElement("p", {
+      key: idx
+    }, comment))), (item === null || item === void 0 ? void 0 : (_item$assignes = item.assignes) === null || _item$assignes === void 0 ? void 0 : _item$assignes.length) > 0 && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
+      className: "custom-comments-title"
+    }, t("Assigned To")), /*#__PURE__*/React.createElement("div", {
+      className: "custom-officer-info"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "custom-officer-name"
+    }, (_item$assignes$ = item.assignes[0]) === null || _item$assignes$ === void 0 ? void 0 : _item$assignes$.name)))), (item === null || item === void 0 ? void 0 : item.wfDocuments) && (item === null || item === void 0 ? void 0 : (_item$wfDocuments = item.wfDocuments) === null || _item$wfDocuments === void 0 ? void 0 : _item$wfDocuments.length) > 0 && /*#__PURE__*/React.createElement("div", {
+      className: "custom-comments-section-no-border"
+    }, /*#__PURE__*/React.createElement("h4", {
+      className: "custom-comments-title"
+    }, "Document Attached:"), /*#__PURE__*/React.createElement("div", {
+      className: "custom-comment-text"
+    }, item === null || item === void 0 ? void 0 : (_item$wfDocuments2 = item.wfDocuments) === null || _item$wfDocuments2 === void 0 ? void 0 : _item$wfDocuments2.map((doc, index) => /*#__PURE__*/React.createElement(TimelineDocument$1, {
+      key: `${doc === null || doc === void 0 ? void 0 : doc.documentType}-${index}`,
+      value: item === null || item === void 0 ? void 0 : item.wfDocuments,
+      Code: doc === null || doc === void 0 ? void 0 : doc.documentType,
+      index: index
+    })))))));
+  }))));
+}
+
 var canPromise = function () {
   return typeof Promise === 'function' && Promise.prototype && Promise.prototype.then;
 };
@@ -22224,7 +22426,7 @@ const ADSApplicationDetails = () => {
     }
   });
   const new_data = transformBookingResponseToBookingData(adsData);
-  console.log('new_data my here', new_data);
+  console.log("new_data my here", new_data);
   const mutation = Digit.Hooks.ads.useADSCreateAPI(tenantId, false);
   useEffect(() => {
     refetch();
@@ -22453,10 +22655,9 @@ const ADSApplicationDetails = () => {
     style: {
       padding: "0 1.5rem"
     }
-  }, t("TL_NO_DOCUMENTS_MSG"))), /*#__PURE__*/React.createElement(ADSWFApplicationTimeline, {
-    application: application,
-    id: ads_details === null || ads_details === void 0 ? void 0 : ads_details.bookingNo,
-    userType: "citizen"
+  }, t("TL_NO_DOCUMENTS_MSG"))), /*#__PURE__*/React.createElement(NewApplicationTimeline, {
+    workflowDetails: workflowDetails,
+    t: t
   })), showToast && /*#__PURE__*/React.createElement(Toast, {
     error: showToast.key === "error",
     label: actionError || error,
@@ -22838,7 +23039,7 @@ if (_DataView && getTag(new _DataView(new ArrayBuffer(1))) != dataViewTag || _Ma
 }
 
 const ApplicationDetails = () => {
-  var _applicationDetails$b, _Digit$Hooks$ads, _Digit$Hooks$ads$useA, _displayData$applican, _displayData$applican2, _workflowDetails$data, _workflowDetails$data2, _reciept_data$Payment, _displayData$applican4, _displayData$applican5, _displayData$applican6, _displayData$applican7, _displayData$applican8, _application$document, _displayData$applican9, _displayData$applican0, _workflowDetails$data4, _workflowDetails$data5;
+  var _applicationDetails$b, _Digit$Hooks$ads, _Digit$Hooks$ads$useA, _displayData$applican, _displayData$applican2, _workflowDetails$data, _workflowDetails$data2, _reciept_data$Payment, _displayData$applican4, _displayData$applican5, _displayData$applican6, _displayData$applican7, _displayData$applican8, _application$document, _displayData$applican9, _workflowDetails$data4, _workflowDetails$data5;
   const {
     id
   } = useParams();
@@ -23258,10 +23459,9 @@ const ApplicationDetails = () => {
     style: {
       padding: "0 1.5rem"
     }
-  }, t("TL_NO_DOCUMENTS_MSG"))), /*#__PURE__*/React.createElement(ADSWFApplicationTimeline, {
-    application: application,
-    id: (displayData === null || displayData === void 0 ? void 0 : (_displayData$applican9 = displayData.applicantData) === null || _displayData$applican9 === void 0 ? void 0 : _displayData$applican9.applicationNo) || id,
-    userType: "employee"
+  }, t("TL_NO_DOCUMENTS_MSG"))), /*#__PURE__*/React.createElement(NewApplicationTimeline, {
+    workflowDetails: workflowDetails,
+    t: t
   })), !(workflowDetails !== null && workflowDetails !== void 0 && workflowDetails.isLoading) && Array.isArray(wfActions) && (wfActions === null || wfActions === void 0 ? void 0 : wfActions.length) > 0 && /*#__PURE__*/React.createElement(ActionBar, null, displayMenu && /*#__PURE__*/React.createElement(Menu, {
     localeKeyPrefix: `WF_EMPLOYEE_${"ADS"}`,
     options: wfActions,
@@ -23275,7 +23475,7 @@ const ApplicationDetails = () => {
     ref: menuRef,
     label: t("WF_TAKE_ACTION"),
     onSubmit: () => setDisplayMenu(!displayMenu),
-    disabled: expired || (displayData === null || displayData === void 0 ? void 0 : (_displayData$applican0 = displayData.applicantData) === null || _displayData$applican0 === void 0 ? void 0 : _displayData$applican0.bookingStatus) === "BOOKING_CREATED"
+    disabled: expired || (displayData === null || displayData === void 0 ? void 0 : (_displayData$applican9 = displayData.applicantData) === null || _displayData$applican9 === void 0 ? void 0 : _displayData$applican9.bookingStatus) === "BOOKING_CREATED"
   })), showModal ? /*#__PURE__*/React.createElement(ADSModal, {
     t: t,
     action: selectedAction,
@@ -23366,7 +23566,7 @@ const StepWrapper = ({
   const stepStyle = (isActive, isLast) => ({
     display: "flex",
     alignItems: "center",
-    justifyContent: "flex-end",
+    justifyContent: "flex-start",
     flex: "0 0 auto",
     color: isActive ? "#0D43A7" : "#9CA3AF",
     padding: "14px 12px",
@@ -23419,14 +23619,36 @@ const StepWrapper = ({
   };
   const isMobile = window.Digit.Utils.browser.isMobile();
   const totalSteps = _stepsList.length;
+  const mobileNavBarStyle = isMobile ? {
+    flexDirection: "row",
+    overflowX: "auto",
+    whiteSpace: "nowrap",
+    minWidth: "100%",
+    maxWidth: "100%",
+    gap: "8px",
+    padding: "10px"
+  } : {};
+  const mobileCircleStyle = isMobile ? {
+    width: "32px",
+    height: "32px",
+    fontSize: "12px"
+  } : {};
+  const mobileLabelStyle = isMobile ? {
+    fontSize: "10px"
+  } : {};
+  const mobileStepStyle = isMobile ? {
+    width: "auto",
+    padding: "6px",
+    marginBottom: "0",
+    flexDirection: "column",
+    alignItems: "center"
+  } : {};
   return /*#__PURE__*/React.createElement("div", {
     className: "stepper",
     style: {
       width: "100%",
       display: "flex",
-      flexDirection: "row",
-      alignItems: "flex-start",
-      justifyContent: "flex-start",
+      flexDirection: isMobile ? "column" : "row",
       gap: "24px"
     }
   }, /*#__PURE__*/React.createElement("div", {
@@ -23438,32 +23660,45 @@ const StepWrapper = ({
       padding: "18px",
       minWidth: "120px",
       maxWidth: "320px",
-      marginBottom: "20px"
+      marginBottom: "20px",
+      marginTop: isMobile ? "20px" : "0",
+      height: isMobile ? "106px" : "",
+      ...mobileNavBarStyle
     }
   }, [...Array(totalSteps)].map((_, index) => /*#__PURE__*/React.createElement("div", {
     className: "step-content",
     key: index,
-    style: stepStyle(index + 1 <= _currentStep, index === totalSteps - 1)
+    style: {
+      ...stepStyle(index + 1 <= _currentStep, index === totalSteps - 1),
+      ...mobileStepStyle
+    }
   }, /*#__PURE__*/React.createElement("div", {
+    className: "step-circle",
+    style: {
+      ...circleStyle(index + 1),
+      ...mobileCircleStyle
+    }
+  }, index + 1, index < totalSteps - 1 && !isMobile && /*#__PURE__*/React.createElement("div", {
+    style: lineStyle
+  })), /*#__PURE__*/React.createElement("div", {
     className: "step-sub-content",
     style: {
       display: "flex",
       flexDirection: "column",
-      alignItems: "flex-end",
-      margin: "10px"
+      alignItems: isMobile ? "center" : "flex-end",
+      margin: isMobile ? "4px" : "10px"
     }
   }, index + 1 === totalSteps ? null : /*#__PURE__*/React.createElement("div", {
     className: "step-number",
     style: stepNumberStyle
   }), /*#__PURE__*/React.createElement("div", {
     className: "step-label",
-    style: labelStyle
-  }, t(_stepsList[index].stepLabel))), /*#__PURE__*/React.createElement("div", {
-    className: "step-circle",
-    style: circleStyle(index + 1)
-  }, index + 1, index < totalSteps - 1 && /*#__PURE__*/React.createElement("div", {
-    style: lineStyle
-  }))))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      ...labelStyle,
+      ...mobileLabelStyle,
+      textAlign: isMobile ? "center" : "right"
+    }
+  }, t(_stepsList[index].stepLabel)))))), /*#__PURE__*/React.createElement("div", {
     className: "stepper-body",
     style: {
       width: "100%",
@@ -23775,7 +24010,7 @@ const NewADSStepperForm = ({
   const handleSubmit = dataGet => {};
   const createTime = formData === null || formData === void 0 ? void 0 : formData.reservationExpiry;
   return /*#__PURE__*/React.createElement("div", {
-    className: "pageCard"
+    className: "card"
   }, /*#__PURE__*/React.createElement(CardHeader$1, {
     className: "ads-heading-large",
     divider: true
@@ -25655,7 +25890,7 @@ const NewSiteMasterStepperForm = ({
   }, []);
   const handleSubmit = dataGet => {};
   return /*#__PURE__*/React.createElement("div", {
-    className: "pageCard"
+    className: "card"
   }, /*#__PURE__*/React.createElement(CardHeader$1, {
     styles: {
       fontSize: "28px",
@@ -26416,7 +26651,7 @@ const NewSiteInspectionStepperFormOne = ({
   }, []);
   const handleSubmit = dataGet => {};
   return /*#__PURE__*/React.createElement("div", {
-    className: "pageCard"
+    className: "card"
   }, /*#__PURE__*/React.createElement(CardHeader$1, {
     styles: {
       fontSize: "28px",