@djb25/digit-ui-module-common 1.0.5 → 1.0.7

package/dist/index.js

@@ -2871,6 +2871,8 @@ const CitizenPayment = _ref => {
     moduleCode = _ref.moduleCode;
   const _useRouteMatch = reactRouterDom.useRouteMatch(),
     currentPath = _useRouteMatch.path;
+  const _useLocation = reactRouterDom.useLocation(),
+    routerState = _useLocation.state;
   const commonProps = {
     stateCode,
     cityCode,
@@ -2909,7 +2911,33 @@ const CitizenPayment = _ref => {
     show: pathname.includes("/failure")
   }];
   const getDynamicBreadcrumbs = () => {
-    return crumbs.filter(crumb => crumb.show);
+    let activeCrumbs = crumbs.filter(crumb => crumb.show);
+    const isWNS = pathname.includes("/WS") || pathname.includes("/SW") || window.location.search.includes("workflow=WNS");
+    if (isWNS) {
+      activeCrumbs.splice(1, 0, {
+        path: "/digit-ui/citizen/ws-home",
+        label: t("ES_TITLE_WATER_AND_SEWERAGE"),
+        show: true
+      });
+      if (routerState !== null && routerState !== void 0 && routerState.fromMyApplications || routerState !== null && routerState !== void 0 && routerState.fromApplicationDetails) {
+        activeCrumbs.splice(2, 0, {
+          path: "/digit-ui/citizen/ws/my-applications",
+          label: t("CS_HOME_MY_APPLICATIONS"),
+          show: true
+        });
+      }
+      if (routerState !== null && routerState !== void 0 && routerState.fromApplicationDetails) {
+        activeCrumbs.splice(3, 0, {
+          label: t("WS_APPLICATION_DETAILS_HEADER"),
+          show: true,
+          onClick: () => window.history.back()
+        });
+      }
+    }
+    if (activeCrumbs.length > 0) {
+      activeCrumbs[activeCrumbs.length - 1].path = "";
+    }
+    return activeCrumbs;
   };
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(reactRouterDom.Switch, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.AppContainer, null, /*#__PURE__*/React__default.createElement("div", {
     className: "ground-container employee-app-container form-container"
@@ -3031,6 +3059,7 @@ const useCashPaymentDetails = (props, t) => {
     body: [{
       withoutLabel: true,
       type: "custom",
+      colSpan: "span 2",
       populators: {
         name: "ManualRecieptDetails",
         customProps: {},
@@ -3092,6 +3121,7 @@ const useCardPaymentDetails = (props, t) => {
     body: [{
       withoutLabel: true,
       type: "custom",
+      colSpan: "span 2",
       populators: {
         name: "paymentModeDetails",
         customProps: {},
@@ -3135,54 +3165,26 @@ const CardDetailsComponent = _ref => {
       });
     }
   }, [last4Digits, transactionNumber, reTransanctionNumber]);
-  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("NOC_PAYMENT_CARD_LAST_DIGITS_LABEL") + " *"), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement("input", {
-    className: "employee-card-input",
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "formcomposer-section-grid"
+  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("NOC_PAYMENT_CARD_LAST_DIGITS_LABEL") + " *"), /*#__PURE__*/React__default.createElement(digitUiReactComponents.TextInput, {
     value: last4Digits,
-    type: "text",
     name: "instrumentNumber",
     maxLength: "4",
     minLength: "4",
     required: true,
     onChange: e => setLast4Digits(e.target.value)
-  })))), /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("NOC_PAYMENT_TRANS_NO_LABEL") + " *"), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement("input", {
-    className: "employee-card-input",
+  })), /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("NOC_PAYMENT_TRANS_NO_LABEL") + " *"), /*#__PURE__*/React__default.createElement(digitUiReactComponents.TextInput, {
     value: transactionNumber,
-    type: "text",
     name: "instrumentNumber",
     required: true,
     onChange: e => setTransactionNumber(e.target.value)
-  })))), /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("NOC_PAYMENT_RENTR_TRANS_LABEL") + " *"), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement("input", {
-    className: "employee-card-input",
+  })), /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("NOC_PAYMENT_RENTR_TRANS_LABEL") + " *"), /*#__PURE__*/React__default.createElement(digitUiReactComponents.TextInput, {
     value: reTransanctionNumber,
-    type: "text",
     name: "instrumentNumber",
     required: true,
     onChange: e => setReTransanctionNumber(e.target.value)
-  })))));
+  })));
 };
 
 const useChequeDetails = (props, t) => {
@@ -3192,6 +3194,7 @@ const useChequeDetails = (props, t) => {
     body: [{
       withoutLabel: true,
       type: "custom",
+      colSpan: "span 2",
       populators: {
         name: "paymentModeDetails",
         customProps: {},
@@ -3281,92 +3284,46 @@ const ChequeDetailsComponent = props => {
     setIfscCodeError("");
   };
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("PAYMENT_CHQ_NO_LABEL"), " *"), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement("input", {
-    className: "employee-card-input",
+    className: "formcomposer-section-grid"
+  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("PAYMENT_CHQ_NO_LABEL") + " *"), /*#__PURE__*/React__default.createElement(digitUiReactComponents.TextInput, {
     value: instrumentNumber,
-    type: "text",
-    name: "instrumentNumber",
     onChange: e => setChequeNo(e.target.value),
+    name: "instrumentNumber",
     required: true
-  })))), /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("PAYMENT_CHEQUE_DATE_LABEL"), " *"), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.DatePicker, {
+  })), /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("PAYMENT_CHEQUE_DATE_LABEL") + " *"), /*#__PURE__*/React__default.createElement(digitUiReactComponents.DatePicker, {
     isRequired: true,
     date: instrumentDate,
     onChange: d => {
       setChequeDate(d);
     }
-  })))),
-  /*#__PURE__*/
-  React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("PAYMENT_IFSC_CODE_LABEL"), " *"), /*#__PURE__*/React__default.createElement("div", {
+  })), /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("PAYMENT_IFSC_CODE_LABEL") + " *"), /*#__PURE__*/React__default.createElement("div", {
     className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement("div", {
     className: "cheque-date"
   }, /*#__PURE__*/React__default.createElement("input", {
     value: ifscCode,
     type: "text",
     onChange: handleIFSCChange,
-    minlength: "11",
-    maxlength: "11",
+    minLength: "11",
+    maxLength: "11",
     required: true
   }), /*#__PURE__*/React__default.createElement("button", {
     type: "button",
     onClick: setBankDetailsFromIFSC
-  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.SearchIconSvg, null)))))), ifscCodeError && /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabelError, {
+  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.SearchIconSvg, null))), ifscCodeError && /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabelError, {
     style: {
-      width: "70%",
-      marginLeft: "30%",
       fontSize: "12px",
       marginTop: "-21px"
     }
-  }, ifscCodeError), /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("PAYMENT_BANK_NAME_LABEL")), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement("input", {
-    className: "employee-card-input",
+  }, ifscCodeError))), /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("PAYMENT_BANK_NAME_LABEL")), /*#__PURE__*/React__default.createElement(digitUiReactComponents.TextInput, {
     value: bankName,
-    type: "text",
-    className: "employee-card-input",
     readOnly: true,
     disabled: true
-  })))), /*#__PURE__*/React__default.createElement("div", {
-    className: "label-field-pair"
-  }, /*#__PURE__*/React__default.createElement("h2", {
-    className: "card-label"
-  }, t("PAYMENT_BANK_BRANCH_LABEL")), /*#__PURE__*/React__default.createElement("div", {
-    className: "field"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "field-container"
-  }, /*#__PURE__*/React__default.createElement("input", {
-    className: "employee-card-input",
+  })), /*#__PURE__*/React__default.createElement(digitUiReactComponents.LabelFieldPair, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.CardLabel, null, t("PAYMENT_BANK_BRANCH_LABEL")), /*#__PURE__*/React__default.createElement(digitUiReactComponents.TextInput, {
     value: bankBranch,
-    type: "text",
-    className: "employee-card-input",
     readOnly: true,
     disabled: true
-  }))))));
+  }))));
 };
 
 function listCacheClear() {
@@ -4908,7 +4865,6 @@ const BillDetails$1 = _ref => {
   };
   const config = BillDetailsKeyNoteConfig()[ModuleWorkflow ? ModuleWorkflow : businessService];
   const getAdvanceAmountPaid = (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "DSO_INPROGRESS";
-  console.log(bill, "bill");
   const renderArrearDetailsForWNS = () => {
     var _yearWiseBills$filter, _yearWiseBills$filter2, _yearWiseBills$filter3, _yearWiseBills$filter4, _yearWiseBills$filter5;
     return /*#__PURE__*/React__default.createElement("table", {
@@ -5518,10 +5474,17 @@ const CollectPayment = props => {
     timerValues: state === null || state === void 0 ? void 0 : state.timerValue,
     t: t,
     SlotSearchData: state === null || state === void 0 ? void 0 : state.SlotSearchData
-  }))), /*#__PURE__*/React__default.createElement(digitUiReactComponents.FormComposer, {
-    cardStyle: {
-      paddingBottom: "100px"
-    },
+  }))), /*#__PURE__*/React__default.createElement("div", {
+    className: "employee-form-section-wrapper"
+  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.VerticalTimeline, {
+    config: [{
+      timeLine: [{
+        actions: t("PAYMENT_COLLECT_LABEL"),
+        currentStep: 1
+      }]
+    }],
+    showFinalStep: false
+  }), /*#__PURE__*/React__default.createElement(digitUiReactComponents.FormComposer, {
     label: t("PAYMENT_COLLECT_LABEL"),
     config: getFormConfig(),
     onSubmit: onSubmit,
@@ -5541,7 +5504,7 @@ const CollectPayment = props => {
     style: {
       maxWidth: "670px"
     }
-  }));
+  })));
 };
 
 const convertEpochToDate$1 = dateEpoch => {
@@ -6956,24 +6919,38 @@ const EmployeePayment = _ref => {
     let crumbs = [{
       icon: digitUiReactComponents.HomeIcon,
       path: "/digit-ui/employee"
-    }, {
-      label: t("ES_COMMON_HOME"),
-      path: "/digit-ui/employee"
     }];
-    if (pathname.includes("/fsm/home")) {
+    if (pathname.includes("/payment/collect")) {
+      crumbs.push({
+        label: t("PAYMENT_COLLECT_LABEL"),
+        path: ""
+      });
+    } else if (pathname.includes("/payment/success")) {
       crumbs.push({
-        label: t("ES_TITLE_FSM"),
-        path: "/digit-ui/employee/fsm/home"
+        label: t("CS_PAYMENT_SUCCESSFUL"),
+        path: ""
       });
-    } else if (pathname.includes("/fsm/inbox")) {
+    } else if (pathname.includes("/payment/failure")) {
       crumbs.push({
-        label: t("ES_TITLE_INBOX"),
-        path: "/digit-ui/employee/fsm/inbox"
+        label: t("CS_PAYMENT_FAILED"),
+        path: ""
       });
+    } else {
+      if (pathname.includes("/fsm/home")) {
+        crumbs.push({
+          label: t("ES_TITLE_FSM"),
+          path: "/digit-ui/employee/fsm/home"
+        });
+      } else if (pathname.includes("/fsm/inbox")) {
+        crumbs.push({
+          label: t("ES_TITLE_INBOX"),
+          path: "/digit-ui/employee/fsm/inbox"
+        });
+      }
     }
     return crumbs;
   };
-  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(reactRouterDom.Switch, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.AppContainer, null, /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
     className: "ground-container employee-app-container form-container"
   }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.ModuleHeader, {
     leftContent: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.ArrowLeft, {
@@ -6985,17 +6962,19 @@ const EmployeePayment = _ref => {
     className: "employee-form"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "employee-form-content"
-  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.PrivateRoute, {
+  }, /*#__PURE__*/React__default.createElement(reactRouterDom.Switch, null, /*#__PURE__*/React__default.createElement(digitUiReactComponents.PrivateRoute, {
     path: currentPath + "/collect/:businessService/:consumerCode"
+  }, /*#__PURE__*/React__default.createElement(digitUiReactComponents.LayoutWrapper, {
+    layoutClass: "action"
   }, /*#__PURE__*/React__default.createElement(CollectPayment, _extends({}, commonProps, {
     basePath: currentPath
-  }))), /*#__PURE__*/React__default.createElement(digitUiReactComponents.PrivateRoute, {
+  })))), /*#__PURE__*/React__default.createElement(digitUiReactComponents.PrivateRoute, {
     path: currentPath + "/success/:businessService/:receiptNumber/:consumerCode"
   }, /*#__PURE__*/React__default.createElement(SuccessfulPayment$1, commonProps)), /*#__PURE__*/React__default.createElement(digitUiReactComponents.PrivateRoute, {
     path: currentPath + "/integration/:moduleName/:pageName"
   }, /*#__PURE__*/React__default.createElement(IFrameInterface, commonProps)), /*#__PURE__*/React__default.createElement(digitUiReactComponents.PrivateRoute, {
     path: currentPath + "/failure"
-  }, /*#__PURE__*/React__default.createElement(FailedPayment$1, commonProps))))))));
+  }, /*#__PURE__*/React__default.createElement(FailedPayment$1, commonProps)))))));
 };
 
 const PaymentModule = _ref => {