@djb25/digit-ui-module-common 1.0.8 → 1.0.9

package/dist/index.modern.js

@@ -16,18 +16,6 @@ function _extends() {
     return n;
   }, _extends.apply(null, arguments);
 }
-function _objectDestructuringEmpty(t) {
-  if (null == t) throw new TypeError("Cannot destructure " + t);
-}
-function _objectWithoutPropertiesLoose(r, e) {
-  if (null == r) return {};
-  var t = {};
-  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (-1 !== e.indexOf(n)) continue;
-    t[n] = r[n];
-  }
-  return t;
-}
 
 const stringReplaceAll = function (str, searcher, replaceWith) {
   if (str === void 0) {
@@ -53,7 +41,6 @@ const timerEnabledForBusinessService = businessService => {
   return false;
 };
 
-const _excluded = ["state"];
 const SelectPaymentType = props => {
   var _Digit$UserService$ge, _Digit$UserService$ge2, _data$Bill, _data$Bill$, _bill$billDetails, _bill$billDetails$sor, _bill$billDetails2, _bill$billDetails2$so;
   const optionFirst = {
@@ -69,34 +56,37 @@ const SelectPaymentType = props => {
   const userInfo = (_Digit$UserService$ge = Digit.UserService.getUser()) === null || _Digit$UserService$ge === void 0 ? void 0 : _Digit$UserService$ge.info;
   const payersActiveName = userInfo === null || userInfo === void 0 ? void 0 : userInfo.name;
   const payersActiveMobileNumber = userInfo === null || userInfo === void 0 ? void 0 : userInfo.mobileNumber;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  const {
+    t
+  } = useTranslation();
   const history = useHistory();
-  const _useLocation = useLocation(),
-    state = _useLocation.state,
-    location = _objectWithoutPropertiesLoose(_useLocation, _excluded);
-  const _useParams = useParams(),
-    consumerCode = _useParams.consumerCode,
-    businessService = _useParams.businessService,
-    paymentAmt = _useParams.paymentAmt;
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    wrkflow = _Digit$Hooks$useQuery.workflow,
-    _tenantId = _Digit$Hooks$useQuery.tenantId,
-    ConsumerName = _Digit$Hooks$useQuery.ConsumerName;
-  const _useState = useState(state === null || state === void 0 ? void 0 : state.bill),
-    bill = _useState[0],
-    setBill = _useState[1];
+  const {
+    state,
+    ...location
+  } = useLocation();
+  const {
+    consumerCode,
+    businessService,
+    paymentAmt
+  } = useParams();
+  const {
+    workflow: wrkflow,
+    tenantId: _tenantId,
+    ConsumerName
+  } = Digit.Hooks.useQueryParams();
+  const [bill, setBill] = useState(state === null || state === void 0 ? void 0 : state.bill);
   const tenantId = (state === null || state === void 0 ? void 0 : state.tenantId) || _tenantId || ((_Digit$UserService$ge2 = Digit.UserService.getUser().info) === null || _Digit$UserService$ge2 === void 0 ? void 0 : _Digit$UserService$ge2.tenantId);
   const isLoggedIn = Digit.UserService.getUser();
-  const _ref = state !== null && state !== void 0 && state.bill ? {
-      isLoading: false
-    } : Digit.Hooks.useFetchPayment({
-      tenantId,
-      businessService,
-      consumerCode
-    }),
-    data = _ref.data,
-    isLoading = _ref.isLoading;
+  const {
+    data,
+    isLoading
+  } = state !== null && state !== void 0 && state.bill ? {
+    isLoading: false
+  } : Digit.Hooks.useFetchPayment({
+    tenantId,
+    businessService,
+    consumerCode
+  });
   let Useruuid = (data === null || data === void 0 ? void 0 : (_data$Bill = data.Bill) === null || _data$Bill === void 0 ? void 0 : (_data$Bill$ = _data$Bill[0]) === null || _data$Bill$ === void 0 ? void 0 : _data$Bill$.userId) || "";
   let requestCriteria = ["/user/_search", {}, {
     data: {
@@ -109,42 +99,31 @@ const SelectPaymentType = props => {
     enabled: Useruuid ? true : false,
     cacheTime: 100
   }];
-  const _Digit$Hooks$useCusto = Digit.Hooks.useCustomAPIHook(...requestCriteria),
-    isUserLoading = _Digit$Hooks$useCusto.isLoading,
-    userData = _Digit$Hooks$useCusto.data;
+  const {
+    isLoading: isUserLoading,
+    data: userData,
+    revalidate
+  } = Digit.Hooks.useCustomAPIHook(...requestCriteria);
   const billDetails = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails = bill.billDetails) === null || _bill$billDetails === void 0 ? void 0 : (_bill$billDetails$sor = _bill$billDetails.sort((a, b) => b.fromPeriod - a.fromPeriod)) === null || _bill$billDetails$sor === void 0 ? void 0 : _bill$billDetails$sor[0]) || [];
   const Arrears = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails2 = bill.billDetails) === null || _bill$billDetails2 === void 0 ? void 0 : (_bill$billDetails2$so = _bill$billDetails2.sort((a, b) => b.fromPeriod - a.fromPeriod)) === null || _bill$billDetails2$so === void 0 ? void 0 : _bill$billDetails2$so.reduce((total, current, index) => index === 0 ? total : total + current.amount, 0)) || 0;
-  const _useState2 = useState(optionFirst),
-    paymentType = _useState2[0],
-    setPaymentType = _useState2[1];
-  const _useState3 = useState(""),
-    payersName = _useState3[0],
-    setPayersName = _useState3[1];
-  const _useState4 = useState(""),
-    payersMobileNumber = _useState4[0],
-    setPayersMobileNumber = _useState4[1];
-  const _useForm = useForm(),
-    handleSubmit = _useForm.handleSubmit;
-  const _useState5 = useState(false),
-    canSubmit = _useState5[0],
-    setCanSubmit = _useState5[1];
-  const _useState6 = useState(null),
-    mobileNumberError = _useState6[0],
-    setmobileNumberError = _useState6[1];
-  const _useState7 = useState(false),
-    isCheckBox = _useState7[0],
-    setIsCheckBox = _useState7[1];
-  const _useState8 = useState(false),
-    isCCFEnabled = _useState8[0],
-    setisCCFEnabled = _useState8[1];
-  const _useState9 = useState(""),
-    mdmsConfig = _useState9[0],
-    setMdmsConfig = _useState9[1];
-  const _Digit$Hooks$useCusto2 = Digit.Hooks.useCustomMDMS(Digit.ULBService.getStateId(), "common-masters", [{
-      name: "CitizenConsentForm"
-    }]),
-    citizenConcentFormLoading = _Digit$Hooks$useCusto2.isLoading,
-    ccfData = _Digit$Hooks$useCusto2.data;
+  const [paymentType, setPaymentType] = useState(optionFirst);
+  const [payersName, setPayersName] = useState("");
+  const [payersMobileNumber, setPayersMobileNumber] = useState("");
+  const {
+    control,
+    handleSubmit
+  } = useForm();
+  const [canSubmit, setCanSubmit] = useState(false);
+  const [mobileNumberError, setmobileNumberError] = useState(null);
+  const [isCheckBox, setIsCheckBox] = useState(false);
+  const [isCCFEnabled, setisCCFEnabled] = useState(false);
+  const [mdmsConfig, setMdmsConfig] = useState("");
+  const {
+    isLoading: citizenConcentFormLoading,
+    data: ccfData
+  } = Digit.Hooks.useCustomMDMS(Digit.ULBService.getStateId(), "common-masters", [{
+    name: "CitizenConsentForm"
+  }]);
   function setTermsAndPolicyDetails(e) {
     setIsCheckBox(e.target.checked);
   }
@@ -172,7 +151,7 @@ const SelectPaymentType = props => {
     var _isCCFEnabled$checkBo;
     return /*#__PURE__*/React.createElement("span", null, isCCFEnabled === null || isCCFEnabled === void 0 ? void 0 : (_isCCFEnabled$checkBo = isCCFEnabled.checkBoxLabels) === null || _isCCFEnabled$checkBo === void 0 ? void 0 : _isCCFEnabled$checkBo.map((data, index) => {
       var _isCCFEnabled$checkBo2;
-      return /*#__PURE__*/React.createElement("span", null, (data === null || data === void 0 ? void 0 : data.linkPrefix) && /*#__PURE__*/React.createElement("span", null, t((data === null || data === void 0 ? void 0 : data.linkPrefix) + "_")), (data === null || data === void 0 ? void 0 : data.link) && /*#__PURE__*/React.createElement("span", {
+      return /*#__PURE__*/React.createElement("span", null, (data === null || data === void 0 ? void 0 : data.linkPrefix) && /*#__PURE__*/React.createElement("span", null, t(`${data === null || data === void 0 ? void 0 : data.linkPrefix}_`)), (data === null || data === void 0 ? void 0 : data.link) && /*#__PURE__*/React.createElement("span", {
         id: data === null || data === void 0 ? void 0 : data.linkId,
         onClick: e => {
           onLinkClick(e);
@@ -181,7 +160,7 @@ const SelectPaymentType = props => {
           color: "#a82227",
           cursor: "pointer"
         }
-      }, t((data === null || data === void 0 ? void 0 : data.link) + "_")), (data === null || data === void 0 ? void 0 : data.linkPostfix) && /*#__PURE__*/React.createElement("span", null, t((data === null || data === void 0 ? void 0 : data.linkPostfix) + "_")), index == (isCCFEnabled === null || isCCFEnabled === void 0 ? void 0 : (_isCCFEnabled$checkBo2 = isCCFEnabled.checkBoxLabels) === null || _isCCFEnabled$checkBo2 === void 0 ? void 0 : _isCCFEnabled$checkBo2.length) - 1 && t("LABEL"));
+      }, t(`${data === null || data === void 0 ? void 0 : data.link}_`)), (data === null || data === void 0 ? void 0 : data.linkPostfix) && /*#__PURE__*/React.createElement("span", null, t(`${data === null || data === void 0 ? void 0 : data.linkPostfix}_`)), index == (isCCFEnabled === null || isCCFEnabled === void 0 ? void 0 : (_isCCFEnabled$checkBo2 = isCCFEnabled.checkBoxLabels) === null || _isCCFEnabled$checkBo2 === void 0 ? void 0 : _isCCFEnabled$checkBo2.length) - 1 && t("LABEL"));
     }));
   };
   useEffect(() => {
@@ -208,7 +187,7 @@ const SelectPaymentType = props => {
   const onSubmit = () => {
     if (wrkflow === "WNS") {
       var _bill$mobileNumber, _userData$user, _userData$user$;
-      history.push("/digit-ui/citizen/payment/collect/" + businessService + "/" + consumerCode + "?workflow=WNS&consumerCode=" + stringReplaceAll(consumerCode, "+", "/"), {
+      history.push(`/digit-ui/citizen/payment/collect/${businessService}/${consumerCode}?workflow=WNS&consumerCode=${stringReplaceAll(consumerCode, "+", "/")}`, {
         paymentAmount: paymentAmt,
         tenantId: billDetails.tenantId,
         name: (paymentType === null || paymentType === void 0 ? void 0 : paymentType.code) !== (optionSecound === null || optionSecound === void 0 ? void 0 : optionSecound.code) && ConsumerName !== "undefined" ? ConsumerName : userInfo ? payersActiveName : payersName,
@@ -216,7 +195,7 @@ const SelectPaymentType = props => {
       });
     } else {
       var _bill$mobileNumber2, _userData$user2, _userData$user2$;
-      history.push("/digit-ui/citizen/payment/collect/" + businessService + "/" + consumerCode, {
+      history.push(`/digit-ui/citizen/payment/collect/${businessService}/${consumerCode}`, {
         paymentAmount: paymentAmt,
         tenantId: billDetails.tenantId,
         name: (paymentType === null || paymentType === void 0 ? void 0 : paymentType.code) !== (optionSecound === null || optionSecound === void 0 ? void 0 : optionSecound.code) ? bill === null || bill === void 0 ? void 0 : bill.payerName : userInfo ? payersActiveName : payersName,
@@ -282,15 +261,18 @@ const SelectPaymentType = props => {
 
 const MyBill = _ref => {
   var _bill$totalAmount;
-  let bill = _ref.bill,
-    currentPath = _ref.currentPath,
-    businessService = _ref.businessService,
-    getKeyNotesConfig = _ref.getKeyNotesConfig;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  let {
+    bill,
+    currentPath,
+    businessService,
+    getKeyNotesConfig
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
   const history = useHistory();
   const onSubmit = () => {
-    history.push(currentPath + "/" + bill.consumerCode, {
+    history.push(`${currentPath}/${bill.consumerCode}`, {
       tenantId: bill === null || bill === void 0 ? void 0 : bill.tenantId
     });
   };
@@ -313,11 +295,14 @@ const MyBill = _ref => {
 };
 
 const BillList = _ref => {
-  let billsList = _ref.billsList,
-    currentPath = _ref.currentPath,
-    businessService = _ref.businessService;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  let {
+    billsList,
+    currentPath,
+    businessService
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
   const history = useHistory();
   const consumerCodes = billsList.map(bill => bill.consumerCode);
   const searchResult = Digit.Hooks.useApplicationsForBusinessServiceSearch({
@@ -327,14 +312,11 @@ const BillList = _ref => {
     businessService
   });
   const keyForConsumerCode = searchResult.key;
-  const _useState = useState([]),
-    applicationList = _useState[0],
-    setApplicationList = _useState[1];
-  const _useState2 = useState(() => {
-      var _Digit$ComponentRegis;
-      return (_Digit$ComponentRegis = Digit.ComponentRegistryService) === null || _Digit$ComponentRegis === void 0 ? void 0 : _Digit$ComponentRegis.getComponent("getBillDetailsConfigWithBusinessService");
-    }),
-    getKeyNotesConfig = _useState2[0];
+  const [applicationList, setApplicationList] = useState([]);
+  const [getKeyNotesConfig, setConfig] = useState(() => {
+    var _Digit$ComponentRegis;
+    return (_Digit$ComponentRegis = Digit.ComponentRegistryService) === null || _Digit$ComponentRegis === void 0 ? void 0 : _Digit$ComponentRegis.getComponent("getBillDetailsConfigWithBusinessService");
+  });
   const billableApplicationsObj = useMemo(() => ({}), []);
   const billsListObj = useMemo(() => ({}), []);
   useEffect(() => {
@@ -350,7 +332,10 @@ const BillList = _ref => {
       billsList.forEach(bill => {
         billsListObj[bill.consumerCode] = bill;
       });
-      const newBillsList = billableIDs.map(e => _extends({}, billsListObj[e], billableApplicationsObj[e]));
+      const newBillsList = billableIDs.map(e => ({
+        ...billsListObj[e],
+        ...billableApplicationsObj[e]
+      }));
       setApplicationList(newBillsList);
     }
   }, [searchResult.data, getKeyNotesConfig]);
@@ -359,7 +344,7 @@ const BillList = _ref => {
   }
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: "static"
-  }, /*#__PURE__*/React.createElement(Header, null, t("CS_TITLE_MY_BILLS") + (" (" + applicationList.length + ")")), (applicationList === null || applicationList === void 0 ? void 0 : applicationList.length) > 0 && getKeyNotesConfig && applicationList.map((bill, index) => /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(Header, null, t("CS_TITLE_MY_BILLS") + ` (${applicationList.length})`), (applicationList === null || applicationList === void 0 ? void 0 : applicationList.length) > 0 && getKeyNotesConfig && applicationList.map((bill, index) => /*#__PURE__*/React.createElement("div", {
     key: index
   }, /*#__PURE__*/React.createElement(MyBill, {
     bill,
@@ -390,7 +375,7 @@ const styles = {
     boxShadow: "none"
   },
   table: {
-    minWidth: 700,
+    width: "100%",
     backgroundColor: "rgba(250, 250, 250, var(--bg-opacity))"
   },
   cell: {
@@ -410,62 +395,81 @@ const styles = {
   cellRight: {}
 };
 const ArrearTable = _ref => {
-  let _ref$headers = _ref.headers,
-    headers = _ref$headers === void 0 ? [] : _ref$headers,
-    _ref$values = _ref.values,
-    values = _ref$values === void 0 ? [] : _ref$values,
-    _ref$arrears = _ref.arrears,
-    arrears = _ref$arrears === void 0 ? 0 : _ref$arrears;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  let {
+    className = "table",
+    headers = [],
+    values = [],
+    arrears = 0
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     style: styles.root
   }, /*#__PURE__*/React.createElement("table", {
     className: "table-fixed-column-common-pay",
     style: styles.table
   }, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
-    style: _extends({}, styles.cell, styles.cellLeft, styles.cellHeader)
+    style: {
+      ...styles.cell,
+      ...styles.cellLeft,
+      ...styles.cellHeader
+    }
   }, t("CS_BILL_PERIOD")), headers.map((header, ind) => {
     let styleRight = headers.length == ind + 1 ? styles.cellRight : {};
     return /*#__PURE__*/React.createElement("th", {
-      style: _extends({}, styles.cell, styleRight, styles.cellHeader),
+      style: {
+        ...styles.cell,
+        ...styleRight,
+        ...styles.cellHeader
+      },
       key: ind
     }, t(header));
   }))), /*#__PURE__*/React.createElement("tbody", null, Object.values(values).map((row, ind) => /*#__PURE__*/React.createElement("tr", {
     key: ind
   }, /*#__PURE__*/React.createElement("td", {
-    style: _extends({}, styles.cell, styles.cellLeft),
+    style: {
+      ...styles.cell,
+      ...styles.cellLeft
+    },
     component: "th",
     scope: "row"
   }, Object.keys(values)[ind]), headers.map((header, i) => {
     let styleRight = headers.length == i + 1 ? styles.cellRight : {};
     return /*#__PURE__*/React.createElement("td", {
-      style: _extends({}, styles.cell, {
-        textAlign: "left"
-      }, styleRight, {
+      style: {
+        ...styles.cell,
+        textAlign: "left",
+        ...styleRight,
         whiteSpace: "pre"
-      }),
+      },
       key: i,
       numeric: true
     }, i > 1 && "₹", row[header] && row[header]["value"] || "0");
   }))), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    style: _extends({}, styles.cell, styles.cellLeft)
+    style: {
+      ...styles.cell,
+      ...styles.cellLeft
+    }
   }), headers.map((header, ind) => {
     if (ind == headers.length - 1) {
       return /*#__PURE__*/React.createElement("td", {
-        style: _extends({}, styles.cell, styles.cellRight, {
+        style: {
+          ...styles.cell,
+          ...styles.cellRight,
           textAlign: "left",
           fontWeight: "700",
           whiteSpace: "pre"
-        }),
+        },
         key: ind,
         numeric: true
       }, arrears);
     } else if (ind == headers.length - 2) {
       return /*#__PURE__*/React.createElement("td", {
-        style: _extends({}, styles.cell, {
+        style: {
+          ...styles.cell,
           textAlign: "left"
-        }),
+        },
         key: ind,
         numeric: true
       }, t("COMMON_ARREARS_TOTAL"));
@@ -483,7 +487,11 @@ const styles$1 = {
   buttonStyle: {
     display: "flex",
     justifyContent: "flex-end",
-    color: "#a82227"
+    color: "#a82227",
+    marginTop: "10px",
+    marginBottom: "10px",
+    cursor: "pointer",
+    fontWeight: "bold"
   },
   headerStyle: {
     marginTop: "10px",
@@ -493,21 +501,102 @@ const styles$1 = {
     color: " rgba(11, 12, 12, var(--text-opacity))"
   }
 };
+const thStyle = {
+  textAlign: "left",
+  borderBottom: "#D6D5D4 1px solid",
+  padding: "16px 12px",
+  whiteSpace: "break-spaces",
+  fontSize: "14px",
+  fontWeight: "bold"
+};
+const tdStyle = {
+  textAlign: "left",
+  borderBottom: "#D6D5D4 1px solid",
+  padding: "8px 10px",
+  wordBreak: "keep-all",
+  fontSize: "14px"
+};
 const ArrearSummary = _ref => {
-  var _bill$billDetails, _sortedBillDetails, _arrears$toFixed;
-  let _ref$bill = _ref.bill,
-    bill = _ref$bill === void 0 ? {} : _ref$bill;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  var _bill$billDetails, _bill$billDetails2, _sortedBillDetails, _arrears$toFixed;
+  let {
+    bill = {},
+    businessService
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const [showArrear, setShowArrear] = useState(false);
+  const isWNS = businessService === "WS" || businessService === "SW";
+  const yearWiseBills = bill === null || bill === void 0 ? void 0 : (_bill$billDetails = bill.billDetails) === null || _bill$billDetails === void 0 ? void 0 : _bill$billDetails.sort((a, b) => b.fromPeriod - a.fromPeriod);
+  const getBillingPeriod = _bill => {
+    const {
+      fromPeriod,
+      toPeriod
+    } = _bill;
+    let from = new Date(fromPeriod).toLocaleDateString();
+    let to = new Date(toPeriod).toLocaleDateString();
+    return from + "-" + to;
+  };
+  const renderArrearDetailsForWNS = () => {
+    var _yearWiseBills$filter, _yearWiseBills$filter2, _yearWiseBills$filter3, _yearWiseBills$filter4, _yearWiseBills$filter5;
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        maxWidth: "100%",
+        overflowX: "auto",
+        backgroundColor: "#EEEEEE",
+        marginTop: "10px"
+      }
+    }, /*#__PURE__*/React.createElement("table", {
+      className: "table-fixed-column-common-pay",
+      style: {
+        width: "100%",
+        borderCollapse: "collapse"
+      }
+    }, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
+      style: thStyle
+    }, t("CS_BILL_NO")), /*#__PURE__*/React.createElement("th", {
+      style: {
+        ...thStyle
+      }
+    }, t("CS_PAYMENT_BILLING_PERIOD")), /*#__PURE__*/React.createElement("th", {
+      style: {
+        ...thStyle
+      }
+    }, t("CS_BILL_DUEDATE")), yearWiseBills === null || yearWiseBills === void 0 ? void 0 : (_yearWiseBills$filter = yearWiseBills.filter((e, ind) => ind > 0)) === null || _yearWiseBills$filter === void 0 ? void 0 : (_yearWiseBills$filter2 = _yearWiseBills$filter[0]) === null || _yearWiseBills$filter2 === void 0 ? void 0 : (_yearWiseBills$filter3 = _yearWiseBills$filter2.billAccountDetails) === null || _yearWiseBills$filter3 === void 0 ? void 0 : (_yearWiseBills$filter4 = _yearWiseBills$filter3.sort((a, b) => a.order - b.order)) === null || _yearWiseBills$filter4 === void 0 ? void 0 : _yearWiseBills$filter4.map((head, index) => /*#__PURE__*/React.createElement("th", {
+      style: {
+        ...thStyle
+      },
+      key: index
+    }, t(head.taxHeadCode))), /*#__PURE__*/React.createElement("th", {
+      style: thStyle
+    }, t("TOTAL_TAX")))), /*#__PURE__*/React.createElement("tbody", null, yearWiseBills === null || yearWiseBills === void 0 ? void 0 : (_yearWiseBills$filter5 = yearWiseBills.filter((e, ind) => ind > 0)) === null || _yearWiseBills$filter5 === void 0 ? void 0 : _yearWiseBills$filter5.map((year_bill, index) => {
+      var _year_bill$billAccoun;
+      const sorted_tax_heads = year_bill === null || year_bill === void 0 ? void 0 : (_year_bill$billAccoun = year_bill.billAccountDetails) === null || _year_bill$billAccoun === void 0 ? void 0 : _year_bill$billAccoun.sort((a, b) => a.order - b.order);
+      return /*#__PURE__*/React.createElement("tr", {
+        key: index
+      }, /*#__PURE__*/React.createElement("td", {
+        style: tdStyle
+      }, year_bill === null || year_bill === void 0 ? void 0 : year_bill.billNumber), /*#__PURE__*/React.createElement("td", {
+        style: tdStyle
+      }, getBillingPeriod(year_bill)), /*#__PURE__*/React.createElement("td", {
+        style: tdStyle
+      }, (year_bill === null || year_bill === void 0 ? void 0 : year_bill.expiryDate) && new Date(year_bill === null || year_bill === void 0 ? void 0 : year_bill.expiryDate).toLocaleDateString()), sorted_tax_heads === null || sorted_tax_heads === void 0 ? void 0 : sorted_tax_heads.map((e, i) => /*#__PURE__*/React.createElement("td", {
+        style: tdStyle,
+        key: i
+      }, e.amount)), /*#__PURE__*/React.createElement("td", {
+        style: tdStyle
+      }, year_bill.amount));
+    }))));
+  };
   const formatTaxHeaders = function (billDetail) {
-    var _billDetail2, _billDetail3, _billDetail4;
+    var _billDetail, _billDetail2, _billDetail3;
     if (billDetail === void 0) {
       billDetail = {};
     }
     let formattedFees = {};
-    const _billDetail = billDetail,
-      _billDetail$billAccou = _billDetail.billAccountDetails,
-      billAccountDetails = _billDetail$billAccou === void 0 ? [] : _billDetail$billAccou;
+    const {
+      billAccountDetails = []
+    } = billDetail;
     billAccountDetails.map(taxHead => {
       formattedFees[taxHead.taxHeadCode] = {
         value: taxHead.amount,
@@ -515,11 +604,11 @@ const ArrearSummary = _ref => {
       };
     });
     formattedFees["CS_BILL_NO"] = {
-      value: ((_billDetail2 = billDetail) === null || _billDetail2 === void 0 ? void 0 : _billDetail2.billNumber) || "NA",
+      value: ((_billDetail = billDetail) === null || _billDetail === void 0 ? void 0 : _billDetail.billNumber) || "NA",
       order: -2
     };
     formattedFees["CS_BILL_DUEDATE"] = {
-      value: ((_billDetail3 = billDetail) === null || _billDetail3 === void 0 ? void 0 : _billDetail3.expiryDate) && new Date((_billDetail4 = billDetail) === null || _billDetail4 === void 0 ? void 0 : _billDetail4.expiryDate).toLocaleDateString() || "NA",
+      value: ((_billDetail2 = billDetail) === null || _billDetail2 === void 0 ? void 0 : _billDetail2.expiryDate) && new Date((_billDetail3 = billDetail) === null || _billDetail3 === void 0 ? void 0 : _billDetail3.expiryDate).toLocaleDateString() || "NA",
       order: -1
     };
     formattedFees["TL_COMMON_TOTAL_AMT"] = {
@@ -532,15 +621,15 @@ const ArrearSummary = _ref => {
     const fromDate = new Date(from);
     const toDate = new Date(to);
     if (toDate.getYear() - fromDate.getYear() != 0) {
-      return "FY" + (fromDate.getYear() + 1900) + "-" + (toDate.getYear() - 100);
+      return `FY${fromDate.getYear() + 1900}-${toDate.getYear() - 100}`;
     }
-    return fromDate.toLocaleDateString() + "-" + toDate.toLocaleDateString();
+    return `${fromDate.toLocaleDateString()}-${toDate.toLocaleDateString()}`;
   };
   let fees = {};
-  let sortedBillDetails = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails = bill.billDetails) === null || _bill$billDetails === void 0 ? void 0 : _bill$billDetails.sort((a, b) => b.fromPeriod - a.fromPeriod)) || [];
+  let sortedBillDetails = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails2 = bill.billDetails) === null || _bill$billDetails2 === void 0 ? void 0 : _bill$billDetails2.sort((a, b) => b.fromPeriod - a.fromPeriod)) || [];
   sortedBillDetails = [...sortedBillDetails];
   const arrears = ((_sortedBillDetails = sortedBillDetails) === null || _sortedBillDetails === void 0 ? void 0 : _sortedBillDetails.reduce((total, current, index) => index === 0 ? total : total + current.amount, 0)) || 0;
-  let arrearsAmount = "\u20B9 " + ((arrears === null || arrears === void 0 ? void 0 : (_arrears$toFixed = arrears.toFixed) === null || _arrears$toFixed === void 0 ? void 0 : _arrears$toFixed.call(arrears, 0)) || Number(0).toFixed(0));
+  let arrearsAmount = `₹ ${(arrears === null || arrears === void 0 ? void 0 : (_arrears$toFixed = arrears.toFixed) === null || _arrears$toFixed === void 0 ? void 0 : _arrears$toFixed.call(arrears, 0)) || Number(0).toFixed(0)}`;
   sortedBillDetails.shift();
   sortedBillDetails.map(bill => {
     let fee = formatTaxHeaders(bill);
@@ -555,9 +644,18 @@ const ArrearSummary = _ref => {
   let keys = [];
   keys = Object.keys(head);
   keys.sort((x, y) => head[x] - head[y]);
-  const _useState = useState(false),
-    showArrear = _useState[0],
-    setShowArrear = _useState[1];
+  if (isWNS) {
+    if (!yearWiseBills || yearWiseBills.length <= 1) {
+      return /*#__PURE__*/React.createElement("span", null);
+    }
+    return /*#__PURE__*/React.createElement(React.Fragment, null, showArrear && renderArrearDetailsForWNS(), /*#__PURE__*/React.createElement("div", {
+      style: styles$1.buttonStyle
+    }, /*#__PURE__*/React.createElement("div", {
+      onClick: () => {
+        setShowArrear(!showArrear);
+      }
+    }, showArrear ? t("ES_COMMON_HIDE_DETAILS") : t("ES_COMMON_VIEW_DETAILS"))));
+  }
   if (arrears == 0 || arrears < 0) {
     return /*#__PURE__*/React.createElement("span", null);
   }
@@ -620,13 +718,18 @@ const ReceiptSlashIconSVG = () => /*#__PURE__*/React.createElement("svg", {
   y2: "21"
 }));
 const BillSumary = _ref => {
-  let billAccountDetails = _ref.billAccountDetails,
-    total = _ref.total,
-    arrears = _ref.arrears;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    ModuleWorkflow = _Digit$Hooks$useQuery.workflow;
+  let {
+    billAccountDetails,
+    total,
+    businessService,
+    arrears
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const {
+    workflow: ModuleWorkflow
+  } = Digit.Hooks.useQueryParams();
   useEffect(() => {
     ModuleWorkflow === "mcollect" && billAccountDetails && billAccountDetails.map(ob => {
       if (ob.taxHeadCode.includes("CGST")) ob.order = 3;else if (ob.taxHeadCode.includes("SGST")) ob.order = 4;
@@ -745,33 +848,30 @@ function _catch(body, recover) {
 }
 
 const TimerServices = _ref => {
-  let businessService = _ref.businessService,
-    t = _ref.t,
-    _ref$SlotSearchData = _ref.SlotSearchData,
-    SlotSearchData = _ref$SlotSearchData === void 0 ? "" : _ref$SlotSearchData,
-    setTime = _ref.setTime;
-  const _useState = useState(0),
-    timeRemaining = _useState[0],
-    setTimeRemaining = _useState[1];
-  const _useState2 = useState(null),
-    showToast = _useState2[0],
-    setShowToast = _useState2[1];
-  const _useState3 = useState(false),
-    hasFetched = _useState3[0],
-    setHasFetched = _useState3[1];
-  const _Digit$Hooks$chb$useC = Digit.Hooks.chb.useChbSlotSearch({
-      tenantId: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.tenantId,
-      filters: {
-        bookingId: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.bookingId,
-        communityHallCode: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.communityHallCode,
-        bookingStartDate: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.bookingStartDate,
-        bookingEndDate: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.bookingEndDate,
-        hallCode: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.hallCode,
-        isTimerRequired: true
-      },
-      enabled: false
-    }),
-    refetch = _Digit$Hooks$chb$useC.refetch;
+  let {
+    businessService,
+    t,
+    timerValues,
+    SlotSearchData = "",
+    setTime
+  } = _ref;
+  const [timeRemaining, setTimeRemaining] = useState(0);
+  const [showToast, setShowToast] = useState(null);
+  const [hasFetched, setHasFetched] = useState(false);
+  const {
+    refetch
+  } = Digit.Hooks.chb.useChbSlotSearch({
+    tenantId: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.tenantId,
+    filters: {
+      bookingId: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.bookingId,
+      communityHallCode: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.communityHallCode,
+      bookingStartDate: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.bookingStartDate,
+      bookingEndDate: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.bookingEndDate,
+      hallCode: SlotSearchData === null || SlotSearchData === void 0 ? void 0 : SlotSearchData.hallCode,
+      isTimerRequired: true
+    },
+    enabled: false
+  });
   const slotSearchData = Digit.Hooks.ads.useADSSlotSearch();
   useEffect(() => {
     const fetchSlotData = function () {
@@ -867,7 +967,7 @@ const TimerServices = _ref => {
   const formatTime = seconds => {
     const minutes = Math.floor(seconds / 60);
     const remainingSeconds = seconds % 60;
-    return minutes + ":" + (remainingSeconds < 10 ? '0' : '') + remainingSeconds;
+    return `${minutes}:${remainingSeconds < 10 ? '0' : ''}${remainingSeconds}`;
   };
   return /*#__PURE__*/React.createElement("div", null, t("CS_TIME_REMAINING"), ": ", /*#__PURE__*/React.createElement("span", {
     className: "astericColor"
@@ -883,40 +983,44 @@ const TimerServices = _ref => {
 
 const BillDetails = _ref => {
   var _Digit$UserService$ge, _data$Bill, _data$Bill$, _bill$billDetails, _bill$billDetails$sor, _bill$billDetails2, _bill$billDetails2$so, _application$pdfData6, _application$pdfData7, _application$pdfData8, _application$pdfData9, _application$pdfData0, _application$pdfData1, _application$pdfData10, _application$pdfData11, _application$pdfData12;
-  let paymentRules = _ref.paymentRules,
-    businessService = _ref.businessService;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  let {
+    paymentRules,
+    businessService
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
   const history = useHistory();
-  const _useLocation = useLocation(),
-    state = _useLocation.state,
-    pathname = _useLocation.pathname,
-    search = _useLocation.search;
+  const {
+    state,
+    pathname,
+    search
+  } = useLocation();
   const userInfo = Digit.UserService.getUser();
-  let _useParams = useParams(),
-    consumerCode = _useParams.consumerCode;
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    wrkflow = _Digit$Hooks$useQuery.workflow,
-    _tenantId = _Digit$Hooks$useQuery.tenantId,
-    authorization = _Digit$Hooks$useQuery.authorization,
-    ConsumerName = _Digit$Hooks$useQuery.ConsumerName;
-  const _useState = useState(state === null || state === void 0 ? void 0 : state.bill),
-    bill = _useState[0],
-    setBill = _useState[1];
+  let {
+    consumerCode
+  } = useParams();
+  const {
+    workflow: wrkflow,
+    tenantId: _tenantId,
+    authorization,
+    ConsumerName
+  } = Digit.Hooks.useQueryParams();
+  const [bill, setBill] = useState(state === null || state === void 0 ? void 0 : state.bill);
   const tenantId = (state === null || state === void 0 ? void 0 : state.tenantId) || _tenantId || ((_Digit$UserService$ge = Digit.UserService.getUser().info) === null || _Digit$UserService$ge === void 0 ? void 0 : _Digit$UserService$ge.tenantId);
   const propertyId = state === null || state === void 0 ? void 0 : state.propertyId;
-  const _useState2 = useState(0),
-    setTime = _useState2[1];
+  const [Time, setTime] = useState(0);
   if (wrkflow === "WNS" && consumerCode.includes("?")) consumerCode = consumerCode.substring(0, consumerCode.indexOf("?"));
-  const _ref2 = state !== null && state !== void 0 && state.bill ? {
-      isLoading: false
-    } : Digit.Hooks.useFetchPayment({
-      tenantId,
-      businessService,
-      consumerCode: wrkflow === "WNS" ? stringReplaceAll(consumerCode, "+", "/") : consumerCode
-    }),
-    data = _ref2.data,
-    isLoading = _ref2.isLoading;
+  const {
+    data,
+    isLoading
+  } = state !== null && state !== void 0 && state.bill ? {
+    isLoading: false
+  } : Digit.Hooks.useFetchPayment({
+    tenantId,
+    businessService,
+    consumerCode: wrkflow === "WNS" ? stringReplaceAll(consumerCode, "+", "/") : consumerCode
+  });
   let Useruuid = (data === null || data === void 0 ? void 0 : (_data$Bill = data.Bill) === null || _data$Bill === void 0 ? void 0 : (_data$Bill$ = _data$Bill[0]) === null || _data$Bill$ === void 0 ? void 0 : _data$Bill$.userId) || "";
   let requestCriteria = ["/user/_search", {}, {
     data: {
@@ -929,27 +1033,40 @@ const BillDetails = _ref => {
     enabled: Useruuid ? true : false,
     cacheTime: 100
   }];
-  const _Digit$Hooks$useCusto = Digit.Hooks.useCustomAPIHook(...requestCriteria),
-    userData = _Digit$Hooks$useCusto.data;
-  const _Digit$Hooks$fsm$useA = Digit.Hooks.fsm.useApplicationDetail(t, tenantId, consumerCode, {
-      enabled: pathname.includes("FSM") ? true : false
-    }, "CITIZEN"),
-    isFSMLoading = _Digit$Hooks$fsm$useA.isLoading,
-    application = _Digit$Hooks$fsm$useA.data;
-  let minAmountPayable = paymentRules.minAmountPayable,
-    isAdvanceAllowed = paymentRules.isAdvanceAllowed;
+  const {
+    isLoading: isUserLoading,
+    data: userData,
+    revalidate
+  } = Digit.Hooks.useCustomAPIHook(...requestCriteria);
+  const {
+    isLoading: isFSMLoading,
+    isError,
+    error,
+    data: application,
+    error: errorApplication
+  } = Digit.Hooks.fsm.useApplicationDetail(t, tenantId, consumerCode, {
+    enabled: pathname.includes("FSM") ? true : false
+  }, "CITIZEN");
+  let {
+    minAmountPayable,
+    isAdvanceAllowed
+  } = paymentRules;
   minAmountPayable = wrkflow === "WNS" ? 100 : minAmountPayable;
   const billDetails = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails = bill.billDetails) === null || _bill$billDetails === void 0 ? void 0 : (_bill$billDetails$sor = _bill$billDetails.sort((a, b) => b.fromPeriod - a.fromPeriod)) === null || _bill$billDetails$sor === void 0 ? void 0 : _bill$billDetails$sor[0]) || [];
   const Arrears = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails2 = bill.billDetails) === null || _bill$billDetails2 === void 0 ? void 0 : (_bill$billDetails2$so = _bill$billDetails2.sort((a, b) => b.fromPeriod - a.fromPeriod)) === null || _bill$billDetails2$so === void 0 ? void 0 : _bill$billDetails2$so.reduce((total, current, index) => index === 0 ? total : total + current.amount, 0)) || 0;
-  const _Digit$Hooks$useAppli = Digit.Hooks.useApplicationsForBusinessServiceSearch({
-      businessService
-    }, {
-      enabled: false
-    }),
-    label = _Digit$Hooks$useAppli.label;
+  const {
+    key,
+    label
+  } = Digit.Hooks.useApplicationsForBusinessServiceSearch({
+    businessService
+  }, {
+    enabled: false
+  });
   const getBillingPeriod = () => {
-    const fromPeriod = billDetails.fromPeriod,
-      toPeriod = billDetails.toPeriod;
+    const {
+      fromPeriod,
+      toPeriod
+    } = billDetails;
     if (fromPeriod && toPeriod) {
       let from, to;
       if (wrkflow === "mcollect" || wrkflow === "WNS") {
@@ -981,23 +1098,15 @@ const BillDetails = _ref => {
     var _application$pdfData;
     return application === null || application === void 0 ? void 0 : (_application$pdfData = application.pdfData) === null || _application$pdfData === void 0 ? void 0 : _application$pdfData.advanceAmount;
   };
-  const _useState3 = useState(t("CS_PAYMENT_FULL_AMOUNT")),
-    paymentType = _useState3[0],
-    setPaymentType = _useState3[1];
-  const _useState4 = useState(getTotal()),
-    amount = _useState4[0],
-    setAmount = _useState4[1];
-  const _useState5 = useState(true),
-    paymentAllowed = _useState5[0],
-    setPaymentAllowed = _useState5[1];
-  const _useState6 = useState(""),
-    formError = _useState6[0],
-    setError = _useState6[1];
+  const [paymentType, setPaymentType] = useState(t("CS_PAYMENT_FULL_AMOUNT"));
+  const [amount, setAmount] = useState(getTotal());
+  const [paymentAllowed, setPaymentAllowed] = useState(true);
+  const [formError, setError] = useState("");
   const kc = window.keycloak;
   if (authorization === "true" && !(kc !== null && kc !== void 0 && kc.authenticated)) {
     localStorage.clear();
     sessionStorage.clear();
-    window.location.href = "/digit-ui/citizen/login?from=" + encodeURIComponent(pathname + search);
+    window.location.href = `/digit-ui/citizen/login?from=${encodeURIComponent(pathname + search)}`;
   }
   useEffect(() => {
     window.scroll({
@@ -1031,13 +1140,13 @@ const BillDetails = _ref => {
     var _application$pdfData4, _application$pdfData5;
     let paymentAmount = paymentType === t("CS_PAYMENT_FULL_AMOUNT") ? businessService === "FSM.TRIP_CHARGES" ? application === null || application === void 0 ? void 0 : (_application$pdfData4 = application.pdfData) === null || _application$pdfData4 === void 0 ? void 0 : _application$pdfData4.advanceAmount : getTotal() : amount || businessService === "FSM.TRIP_CHARGES" ? application === null || application === void 0 ? void 0 : (_application$pdfData5 = application.pdfData) === null || _application$pdfData5 === void 0 ? void 0 : _application$pdfData5.advanceAmount : amount;
     if (window.location.href.includes("mcollect")) {
-      history.push("/digit-ui/citizen/payment/collect/" + businessService + "/" + consumerCode + "?workflow=mcollect", {
+      history.push(`/digit-ui/citizen/payment/collect/${businessService}/${consumerCode}?workflow=mcollect`, {
         paymentAmount,
         tenantId: billDetails.tenantId
       });
     } else if (wrkflow === "WNS") {
       var _bill$mobileNumber, _userData$user, _userData$user$;
-      history.push("/digit-ui/citizen/payment/billDetails/" + businessService + "/" + consumerCode + "/" + paymentAmount + "?workflow=WNS&ConsumerName=" + ConsumerName, {
+      history.push(`/digit-ui/citizen/payment/billDetails/${businessService}/${consumerCode}/${paymentAmount}?workflow=WNS&ConsumerName=${ConsumerName}`, {
         paymentAmount,
         tenantId: billDetails.tenantId,
         name: bill.payerName,
@@ -1045,14 +1154,14 @@ const BillDetails = _ref => {
       });
     } else if (businessService === "PT") {
       var _bill$mobileNumber2, _userData$user2, _userData$user2$;
-      history.push("/digit-ui/citizen/payment/billDetails/" + businessService + "/" + consumerCode + "/" + paymentAmount, {
+      history.push(`/digit-ui/citizen/payment/billDetails/${businessService}/${consumerCode}/${paymentAmount}`, {
         paymentAmount,
         tenantId: billDetails.tenantId,
         name: bill.payerName,
         mobileNumber: bill.mobileNumber && (_bill$mobileNumber2 = bill.mobileNumber) !== null && _bill$mobileNumber2 !== void 0 && _bill$mobileNumber2.includes("*") ? userData === null || userData === void 0 ? void 0 : (_userData$user2 = userData.user) === null || _userData$user2 === void 0 ? void 0 : (_userData$user2$ = _userData$user2[0]) === null || _userData$user2$ === void 0 ? void 0 : _userData$user2$.mobileNumber : bill.mobileNumber
       });
     } else if (timerEnabledForBusinessService(businessService)) {
-      history.push("/digit-ui/citizen/payment/collect/" + businessService + "/" + consumerCode, {
+      history.push(`/digit-ui/citizen/payment/collect/${businessService}/${consumerCode}`, {
         paymentAmount,
         tenantId: billDetails.tenantId,
         propertyId: propertyId,
@@ -1060,7 +1169,7 @@ const BillDetails = _ref => {
         SlotSearchData: state === null || state === void 0 ? void 0 : state.SlotSearchData
       });
     } else {
-      history.push("/digit-ui/citizen/payment/collect/" + businessService + "/" + consumerCode, {
+      history.push(`/digit-ui/citizen/payment/collect/${businessService}/${consumerCode}`, {
         paymentAmount,
         tenantId: billDetails.tenantId,
         propertyId: propertyId
@@ -1135,7 +1244,8 @@ const BillDetails = _ref => {
     businessService: businessService,
     arrears: Arrears
   }), /*#__PURE__*/React.createElement(ArrearSummary, {
-    bill: bill
+    bill: bill,
+    businessService: businessService
   })), /*#__PURE__*/React.createElement("div", {
     className: "bill-payment-amount"
   }, /*#__PURE__*/React.createElement("hr", {
@@ -1153,7 +1263,7 @@ const BillDetails = _ref => {
   }, /*#__PURE__*/React.createElement("span", {
     className: "payment-amount-front",
     style: {
-      border: "1px solid " + (paymentType === t("CS_PAYMENT_FULL_AMOUNT") ? "#9a9a9a" : "#9a9a9a")
+      border: `1px solid ${paymentType === t("CS_PAYMENT_FULL_AMOUNT") ? "#9a9a9a" : "#9a9a9a"}`
     }
   }, "\u20B9"), paymentType !== t("CS_PAYMENT_FULL_AMOUNT") ? businessService === "FSM.TRIP_CHARGES" ? /*#__PURE__*/React.createElement(TextInput, {
     className: "text-indent-xl",
@@ -1191,17 +1301,19 @@ const BillDetails = _ref => {
   })))));
 };
 
-const _excluded$1 = ["url"];
 const BillRoutes = _ref => {
-  let billsList = _ref.billsList,
-    paymentRules = _ref.paymentRules,
-    businessService = _ref.businessService;
-  const _useRouteMatch = useRouteMatch(),
-    currentPath = _useRouteMatch.url,
-    match = _objectWithoutPropertiesLoose(_useRouteMatch, _excluded$1);
+  let {
+    billsList,
+    paymentRules,
+    businessService
+  } = _ref;
+  const {
+    url: currentPath,
+    ...match
+  } = useRouteMatch();
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Switch, null, /*#__PURE__*/React.createElement(Route, {
     exact: true,
-    path: "" + currentPath,
+    path: `${currentPath}`,
     component: () => /*#__PURE__*/React.createElement(BillList, {
       billsList,
       currentPath,
@@ -1209,7 +1321,7 @@ const BillRoutes = _ref => {
       businessService
     })
   }), /*#__PURE__*/React.createElement(Route, {
-    path: currentPath + "/:consumerCode",
+    path: `${currentPath}/:consumerCode`,
     component: () => /*#__PURE__*/React.createElement(BillDetails, {
       paymentRules,
       businessService
@@ -1218,41 +1330,49 @@ const BillRoutes = _ref => {
 };
 
 const MyBills = _ref => {
-  var _Digit$UserService$ge, _location$state, _location$state2;
-  let stateCode = _ref.stateCode;
-  const _useParams = useParams(),
-    businessService = _useParams.businessService;
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    _tenantId = _Digit$Hooks$useQuery.tenantId,
-    isDisoconnectFlow = _Digit$Hooks$useQuery.isDisoconnectFlow;
-  const _Digit$Services$useSt = Digit.Services.useStore({
-      stateCode,
-      moduleCode: businessService,
-      language: Digit.StoreData.getCurrentLanguage()
-    });
+  var _Digit$UserService$ge, _Digit$UserService$ge2, _location$state, _location$state2, _location$state3;
+  let {
+    stateCode
+  } = _ref;
+  const {
+    businessService
+  } = useParams();
+  const {
+    tenantId: _tenantId,
+    isDisoconnectFlow
+  } = Digit.Hooks.useQueryParams();
+  const {
+    isLoading: storeLoading,
+    data: store
+  } = Digit.Services.useStore({
+    stateCode,
+    moduleCode: businessService,
+    language: Digit.StoreData.getCurrentLanguage()
+  });
   const history = useHistory();
-  const _useRouteMatch = useRouteMatch(),
-    url = _useRouteMatch.url;
+  const {
+    url
+  } = useRouteMatch();
   const location = useLocation();
-  const _ref2 = ((_Digit$UserService$ge = Digit.UserService.getUser()) === null || _Digit$UserService$ge === void 0 ? void 0 : _Digit$UserService$ge.info) || (location === null || location === void 0 ? void 0 : location.state) || {
-      tenantId: _tenantId
-    } || {},
-    tenantId = _ref2.tenantId;
-  if (!tenantId && !(location !== null && location !== void 0 && (_location$state = location.state) !== null && _location$state !== void 0 && _location$state.fromSearchResults)) {
-    history.replace("/digit-ui/citizen/login", {
+  const tenantId = ((_Digit$UserService$ge = Digit.UserService.getUser()) === null || _Digit$UserService$ge === void 0 ? void 0 : (_Digit$UserService$ge2 = _Digit$UserService$ge.info) === null || _Digit$UserService$ge2 === void 0 ? void 0 : _Digit$UserService$ge2.tenantId) || (location === null || location === void 0 ? void 0 : (_location$state = location.state) === null || _location$state === void 0 ? void 0 : _location$state.tenantId) || _tenantId;
+  if (!tenantId && !(location !== null && location !== void 0 && (_location$state2 = location.state) !== null && _location$state2 !== void 0 && _location$state2.fromSearchResults)) {
+    history.replace(`/digit-ui/citizen/login`, {
       from: url
     });
   }
-  const _Digit$Hooks$useFetch = Digit.Hooks.useFetchCitizenBillsForBuissnessService({
-      businessService
-    }, {
-      refetchOnMount: true,
-      enabled: !(location !== null && location !== void 0 && (_location$state2 = location.state) !== null && _location$state2 !== void 0 && _location$state2.fromSearchResults)
-    }),
-    data = _Digit$Hooks$useFetch.data;
-  const _Digit$Hooks$useGetPa = Digit.Hooks.useGetPaymentRulesForBusinessServices(tenantId),
-    mdmsLoading = _Digit$Hooks$useGetPa.isLoading,
-    mdmsBillingData = _Digit$Hooks$useGetPa.data;
+  const {
+    isLoading,
+    data
+  } = Digit.Hooks.useFetchCitizenBillsForBuissnessService({
+    businessService
+  }, {
+    refetchOnMount: true,
+    enabled: !(location !== null && location !== void 0 && (_location$state3 = location.state) !== null && _location$state3 !== void 0 && _location$state3.fromSearchResults)
+  });
+  const {
+    isLoading: mdmsLoading,
+    data: mdmsBillingData
+  } = Digit.Hooks.useGetPaymentRulesForBusinessServices(tenantId);
   const billsList = (data === null || data === void 0 ? void 0 : data.Bill) || [];
   const getPaymentRestrictionDetails = () => {
     var _mdmsBillingData$Mdms, _mdmsBillingData$Mdms2, _payRestrictiondetail;
@@ -1297,47 +1417,50 @@ const makePayment = function (url, data) {
 
 const SelectPaymentType$1 = props => {
   var _paymentdetails$Bill;
-  const _useLocation = useLocation(),
-    _useLocation$state = _useLocation.state,
-    state = _useLocation$state === void 0 ? {} : _useLocation$state;
+  const {
+    state = {}
+  } = useLocation();
   const userInfo = Digit.UserService.getUser();
-  const _useState = useState(null),
-    showToast = _useState[0],
-    setShowToast = _useState[1];
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    __tenantId = _Digit$Hooks$useQuery.tenantId,
-    authorization = _Digit$Hooks$useQuery.authorization,
-    wrkflow = _Digit$Hooks$useQuery.workflow,
-    connectionNo = _Digit$Hooks$useQuery.consumerCode;
+  const [showToast, setShowToast] = useState(null);
+  const {
+    tenantId: __tenantId,
+    authorization,
+    workflow: wrkflow,
+    consumerCode: connectionNo
+  } = Digit.Hooks.useQueryParams();
   const paymentAmount = state === null || state === void 0 ? void 0 : state.paymentAmount;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  const {
+    t
+  } = useTranslation();
   const history = useHistory();
-  const _useLocation2 = useLocation(),
-    pathname = _useLocation2.pathname,
-    search = _useLocation2.search;
-  let _useParams = useParams(),
-    consumerCode = _useParams.consumerCode,
-    businessService = _useParams.businessService;
+  const {
+    pathname,
+    search
+  } = useLocation();
+  let {
+    consumerCode,
+    businessService
+  } = useParams();
   const tenantId = (state === null || state === void 0 ? void 0 : state.tenantId) || __tenantId || Digit.ULBService.getCurrentTenantId();
   const kc = window.keycloak;
   const stateTenant = Digit.ULBService.getStateId();
-  const _useForm = useForm(),
-    control = _useForm.control,
-    handleSubmit = _useForm.handleSubmit;
-  const _useState2 = useState(0),
-    Time = _useState2[0],
-    setTime = _useState2[1];
-  const _Digit$Hooks$useCommo = Digit.Hooks.useCommonMDMS(stateTenant, "DIGIT-UI", "PaymentGateway"),
-    menu = _Digit$Hooks$useCommo.data,
-    isLoading = _Digit$Hooks$useCommo.isLoading;
-  const _Digit$Hooks$useFetch = Digit.Hooks.useFetchPayment({
-      tenantId: tenantId,
-      consumerCode: wrkflow === "WNS" ? connectionNo : consumerCode,
-      businessService
-    }, {}),
-    paymentdetails = _Digit$Hooks$useFetch.data,
-    paymentLoading = _Digit$Hooks$useFetch.isLoading;
+  const {
+    control,
+    handleSubmit
+  } = useForm();
+  const [Time, setTime] = useState(0);
+  const {
+    data: menu,
+    isLoading
+  } = Digit.Hooks.useCommonMDMS(stateTenant, "DIGIT-UI", "PaymentGateway");
+  const {
+    data: paymentdetails,
+    isLoading: paymentLoading
+  } = Digit.Hooks.useFetchPayment({
+    tenantId: tenantId,
+    consumerCode: wrkflow === "WNS" ? connectionNo : consumerCode,
+    businessService
+  }, {});
   if (window.location.href.includes("ISWSCON") || wrkflow === "WNS") consumerCode = decodeURIComponent(consumerCode);
   if (wrkflow === "WNS") consumerCode = stringReplaceAll(consumerCode, "+", "/");
   useEffect(() => {
@@ -1351,8 +1474,10 @@ const SelectPaymentType$1 = props => {
   useEffect(() => {
     localStorage.setItem("BillPaymentEnabled", "true");
   }, []);
-  const name = state.name,
-    mobileNumber = state.mobileNumber;
+  const {
+    name,
+    mobileNumber
+  } = state;
   const billDetails = paymentdetails !== null && paymentdetails !== void 0 && (_paymentdetails$Bill = paymentdetails.Bill) !== null && _paymentdetails$Bill !== void 0 && _paymentdetails$Bill.length ? paymentdetails === null || paymentdetails === void 0 ? void 0 : paymentdetails.Bill[0] : {};
   const onSubmit = function (d) {
     try {
@@ -1378,7 +1503,7 @@ const SelectPaymentType$1 = props => {
             emailId: (userInfo === null || userInfo === void 0 ? void 0 : (_userInfo$info4 = userInfo.info) === null || _userInfo$info4 === void 0 ? void 0 : _userInfo$info4.emailId) || (billDetails === null || billDetails === void 0 ? void 0 : billDetails.emailId),
             username: (userInfo === null || userInfo === void 0 ? void 0 : (_userInfo$info5 = userInfo.info) === null || _userInfo$info5 === void 0 ? void 0 : _userInfo$info5.userName) || (billDetails === null || billDetails === void 0 ? void 0 : billDetails.userName)
           },
-          callbackUrl: window.location.href.includes("mcollect") || wrkflow === "WNS" ? window.location.protocol + "//" + window.location.host + "/digit-ui/citizen/payment/success/" + businessService + "/" + encodeURIComponent(consumerCode) + "/" + tenantId + "?workflow=" + (wrkflow === "WNS" ? wrkflow : "mcollect") : window.location.protocol + "//" + window.location.host + "/digit-ui/citizen/payment/success/" + businessService + "/" + encodeURIComponent(consumerCode) + "/" + tenantId + "?propertyId=" + encodeURIComponent(consumerCode),
+          callbackUrl: window.location.href.includes("mcollect") || wrkflow === "WNS" ? `${window.location.protocol}//${window.location.host}/digit-ui/citizen/payment/success/${businessService}/${encodeURIComponent(consumerCode)}/${tenantId}?workflow=${wrkflow === "WNS" ? wrkflow : "mcollect"}` : `${window.location.protocol}//${window.location.host}/digit-ui/citizen/payment/success/${businessService}/${encodeURIComponent(consumerCode)}/${tenantId}?propertyId=${encodeURIComponent(consumerCode)}`,
           additionalDetails: {
             isWhatsapp: false
           }
@@ -1415,7 +1540,7 @@ const SelectPaymentType$1 = props => {
                 target: "_top"
               });
               const orderForNDSLPaymentSite = ["checksum", "messageType", "merchantId", "serviceId", "orderId", "customerId", "transactionAmount", "currencyCode", "requestDateTime", "successUrl", "failUrl", "additionalField1", "additionalField2", "additionalField3", "additionalField4", "additionalField5"];
-              gatewayParam["requestDateTime"] = (_gatewayParam$request = gatewayParam["requestDateTime"]) === null || _gatewayParam$request === void 0 ? void 0 : _gatewayParam$request.split(new Date().getFullYear()).join(new Date().getFullYear() + " ");
+              gatewayParam["requestDateTime"] = (_gatewayParam$request = gatewayParam["requestDateTime"]) === null || _gatewayParam$request === void 0 ? void 0 : _gatewayParam$request.split(new Date().getFullYear()).join(`${new Date().getFullYear()} `);
               gatewayParam["successUrl"] = (redirectUrl === null || redirectUrl === void 0 ? void 0 : (_redirectUrl$split2 = redirectUrl.split("successUrl=")) === null || _redirectUrl$split2 === void 0 ? void 0 : (_redirectUrl$split2$ = _redirectUrl$split2[1]) === null || _redirectUrl$split2$ === void 0 ? void 0 : (_redirectUrl$split2$$ = _redirectUrl$split2$.split("eg_pg_txnid=")) === null || _redirectUrl$split2$$ === void 0 ? void 0 : _redirectUrl$split2$$[0]) + "eg_pg_txnid=" + (gatewayParam === null || gatewayParam === void 0 ? void 0 : gatewayParam.orderId);
               gatewayParam["failUrl"] = (redirectUrl === null || redirectUrl === void 0 ? void 0 : (_redirectUrl$split3 = redirectUrl.split("failUrl=")) === null || _redirectUrl$split3 === void 0 ? void 0 : (_redirectUrl$split3$ = _redirectUrl$split3[1]) === null || _redirectUrl$split3$ === void 0 ? void 0 : (_redirectUrl$split3$$ = _redirectUrl$split3$.split("eg_pg_txnid=")) === null || _redirectUrl$split3$$ === void 0 ? void 0 : _redirectUrl$split3$$[0]) + "eg_pg_txnid=" + (gatewayParam === null || gatewayParam === void 0 ? void 0 : gatewayParam.orderId);
               for (var key of orderForNDSLPaymentSite) {
@@ -1437,9 +1562,10 @@ const SelectPaymentType$1 = props => {
         let messageToShow = "CS_PAYMENT_UNKNOWN_ERROR_ON_SERVER";
         if ((_error$response = error.response) !== null && _error$response !== void 0 && (_error$response$data = _error$response.data) !== null && _error$response$data !== void 0 && (_error$response$data$ = _error$response$data.Errors) !== null && _error$response$data$ !== void 0 && _error$response$data$[0]) {
           var _error$response2, _error$response2$data, _error$response2$data2;
-          const _error$response$data$2 = (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : (_error$response2$data = _error$response2.data) === null || _error$response2$data === void 0 ? void 0 : (_error$response2$data2 = _error$response2$data.Errors) === null || _error$response2$data2 === void 0 ? void 0 : _error$response2$data2[0],
-            code = _error$response$data$2.code,
-            message = _error$response$data$2.message;
+          const {
+            code,
+            message
+          } = (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : (_error$response2$data = _error$response2.data) === null || _error$response2$data === void 0 ? void 0 : (_error$response2$data2 = _error$response2$data.Errors) === null || _error$response2$data2 === void 0 ? void 0 : _error$response2$data2[0];
           messageToShow = code;
         }
         setShowToast({
@@ -1455,7 +1581,7 @@ const SelectPaymentType$1 = props => {
   if (authorization === "true" && !kc.authenticated) {
     localStorage.clear();
     sessionStorage.clear();
-    window.location.href = "/digit-ui/citizen/login?from=" + encodeURIComponent(pathname + search);
+    window.location.href = `/digit-ui/citizen/login?from=${encodeURIComponent(pathname + search)}`;
   }
   if (isLoading || paymentLoading) {
     return /*#__PURE__*/React.createElement(Loader, null);
@@ -1521,86 +1647,94 @@ const convertEpochToDate = dateEpoch => {
     let year = dateFromApi.getFullYear();
     month = (month > 9 ? "" : "0") + month;
     day = (day > 9 ? "" : "0") + day;
-    return day + "/" + month + "/" + year;
+    return `${day}/${month}/${year}`;
   } else {
     return "NA";
   }
 };
 const WrapPaymentComponent = props => {
   var _data$payments, _data$payments$Paymen, _data$payments$Paymen2, _data$payments2, _paymentData$paymentD0, _paymentData$paymentD1, _reciept_data$payment3, _reciept_data$payment4, _reciept_data$payment5, _reciept_data$payment6, _reciept_data$payment7, _reciept_data$payment8, _reciept_data$payment9, _reciept_data$payment0, _reciept_data$payment1, _reciept_data$payment10, _reciept_data$payment11, _reciept_data$payment12, _bpaData$5, _bpaData$6, _bpaData$7, _bpaData$8, _bpaData$9, _bpaData$0, _bpaData$1, _bpaData$10, _bpaData$11, _business_service$spl;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  const {
+    t
+  } = useTranslation();
   const queryClient = useQueryClient();
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    egId = _Digit$Hooks$useQuery.eg_pg_txnid,
-    workflw = _Digit$Hooks$useQuery.workflow;
-  const _useState = useState(false),
-    printing = _useState[0],
-    setPrinting = _useState[1];
-  const _useState2 = useState(false),
-    allowFetchBill = _useState2[0],
-    setallowFetchBill = _useState2[1];
-  const _useParams = useParams(),
-    business_service = _useParams.businessService,
-    consumerCode = _useParams.consumerCode,
-    tenantId = _useParams.tenantId;
-  const _Digit$Hooks$obps$use = Digit.Hooks.obps.useOBPSSearch("", {}, tenantId, {
-      applicationNo: consumerCode
-    }, {}, {
-      enabled: window.location.href.includes("bpa") || window.location.href.includes("BPA")
-    }),
-    _Digit$Hooks$obps$use2 = _Digit$Hooks$obps$use.data,
-    bpaData = _Digit$Hooks$obps$use2 === void 0 ? {} : _Digit$Hooks$obps$use2,
-    isBpaSearchLoading = _Digit$Hooks$obps$use.isLoading;
-  const _Digit$Hooks$usePayme = Digit.Hooks.usePaymentUpdate({
-      egId,
-      tenantId
-    }, business_service, {
-      retry: false,
-      staleTime: Infinity,
-      refetchOnWindowFocus: false
-    }),
-    isLoading = _Digit$Hooks$usePayme.isLoading,
-    data = _Digit$Hooks$usePayme.data,
-    isError = _Digit$Hooks$usePayme.isError;
+  const {
+    eg_pg_txnid: egId,
+    workflow: workflw,
+    propertyId
+  } = Digit.Hooks.useQueryParams();
+  const [printing, setPrinting] = useState(false);
+  const [allowFetchBill, setallowFetchBill] = useState(false);
+  const {
+    businessService: business_service,
+    consumerCode,
+    tenantId
+  } = useParams();
+  const {
+    data: bpaData = {},
+    isLoading: isBpaSearchLoading,
+    isSuccess: isBpaSuccess,
+    error: bpaerror
+  } = Digit.Hooks.obps.useOBPSSearch("", {}, tenantId, {
+    applicationNo: consumerCode
+  }, {}, {
+    enabled: window.location.href.includes("bpa") || window.location.href.includes("BPA")
+  });
+  const {
+    isLoading,
+    data,
+    isError
+  } = Digit.Hooks.usePaymentUpdate({
+    egId,
+    tenantId
+  }, business_service, {
+    retry: false,
+    staleTime: Infinity,
+    refetchOnWindowFocus: false
+  });
   console.log("datatatataty", data);
-  const _Digit$Hooks$useAppli = Digit.Hooks.useApplicationsForBusinessServiceSearch({
-      businessService: business_service
-    }, {
-      enabled: false
-    }),
-    label = _Digit$Hooks$useAppli.label;
+  const {
+    label
+  } = Digit.Hooks.useApplicationsForBusinessServiceSearch({
+    businessService: business_service
+  }, {
+    enabled: false
+  });
   const mutation = Digit.Hooks.chb.useChbCreateAPI(tenantId, false);
   const AdvertisementCreateApi = Digit.Hooks.ads.useADSCreateAPI(tenantId, false);
   const newTenantId = business_service.includes("WS.ONE_TIME_FEE" ) ? Digit.ULBService.getStateId() : tenantId;
-  const _Digit$Hooks$useRecie = Digit.Hooks.useRecieptSearch({
-      tenantId,
-      businessService: business_service,
-      receiptNumbers: data === null || data === void 0 ? void 0 : (_data$payments = data.payments) === null || _data$payments === void 0 ? void 0 : (_data$payments$Paymen = _data$payments.Payments) === null || _data$payments$Paymen === void 0 ? void 0 : (_data$payments$Paymen2 = _data$payments$Paymen[0]) === null || _data$payments$Paymen2 === void 0 ? void 0 : _data$payments$Paymen2.paymentDetails[0].receiptNumber
-    }, {
-      retry: false,
-      staleTime: Infinity,
-      refetchOnWindowFocus: false,
-      select: dat => {
-        return dat.Payments[0];
-      },
-      enabled: allowFetchBill
-    }),
-    reciept_data = _Digit$Hooks$useRecie.data,
-    recieptDataLoading = _Digit$Hooks$useRecie.isLoading;
-  const _Digit$Hooks$useCommo = Digit.Hooks.useCommonMDMS(newTenantId, "common-masters", "ReceiptKey", {
-      select: data => {
-        var _data$commonMasters, _data$commonMasters$u, _data$commonMasters$u2;
-        return ((_data$commonMasters = data["common-masters"]) === null || _data$commonMasters === void 0 ? void 0 : (_data$commonMasters$u = _data$commonMasters.uiCommonPay) === null || _data$commonMasters$u === void 0 ? void 0 : (_data$commonMasters$u2 = _data$commonMasters$u.filter(_ref => {
-          let code = _ref.code;
-          return business_service === null || business_service === void 0 ? void 0 : business_service.includes(code);
-        })[0]) === null || _data$commonMasters$u2 === void 0 ? void 0 : _data$commonMasters$u2.receiptKey) || "consolidatedreceipt";
-      },
-      retry: false,
-      staleTime: Infinity,
-      refetchOnWindowFocus: false
-    }),
-    generatePdfKey = _Digit$Hooks$useCommo.data;
+  const {
+    data: reciept_data,
+    isLoading: recieptDataLoading
+  } = Digit.Hooks.useRecieptSearch({
+    tenantId,
+    businessService: business_service,
+    receiptNumbers: data === null || data === void 0 ? void 0 : (_data$payments = data.payments) === null || _data$payments === void 0 ? void 0 : (_data$payments$Paymen = _data$payments.Payments) === null || _data$payments$Paymen === void 0 ? void 0 : (_data$payments$Paymen2 = _data$payments$Paymen[0]) === null || _data$payments$Paymen2 === void 0 ? void 0 : _data$payments$Paymen2.paymentDetails[0].receiptNumber
+  }, {
+    retry: false,
+    staleTime: Infinity,
+    refetchOnWindowFocus: false,
+    select: dat => {
+      return dat.Payments[0];
+    },
+    enabled: allowFetchBill
+  });
+  const {
+    data: generatePdfKey
+  } = Digit.Hooks.useCommonMDMS(newTenantId, "common-masters", "ReceiptKey", {
+    select: data => {
+      var _data$commonMasters, _data$commonMasters$u, _data$commonMasters$u2;
+      return ((_data$commonMasters = data["common-masters"]) === null || _data$commonMasters === void 0 ? void 0 : (_data$commonMasters$u = _data$commonMasters.uiCommonPay) === null || _data$commonMasters$u === void 0 ? void 0 : (_data$commonMasters$u2 = _data$commonMasters$u.filter(_ref => {
+        let {
+          code
+        } = _ref;
+        return business_service === null || business_service === void 0 ? void 0 : business_service.includes(code);
+      })[0]) === null || _data$commonMasters$u2 === void 0 ? void 0 : _data$commonMasters$u2.receiptKey) || "consolidatedreceipt";
+    },
+    retry: false,
+    staleTime: Infinity,
+    refetchOnWindowFocus: false
+  });
   const payments = data === null || data === void 0 ? void 0 : data.payments;
   useEffect(() => {
     return () => {
@@ -1625,11 +1759,11 @@ const WrapPaymentComponent = props => {
       applicationNumber: egId,
       successful: false
     }), /*#__PURE__*/React.createElement(CardText, null, t("CS_PAYMENT_FAILURE_MESSAGE")), !(business_service !== null && business_service !== void 0 && business_service.includes("PT")) ? /*#__PURE__*/React.createElement(Link, {
-      to: "/digit-ui/citizen"
+      to: `/digit-ui/citizen`
     }, /*#__PURE__*/React.createElement(SubmitBar, {
       label: t("CORE_COMMON_GO_TO_HOME")
     })) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Link, {
-      to: applicationNo && "/digit-ui/citizen/payment/my-bills/" + business_service + "/" + applicationNo || "/digit-ui/citizen"
+      to: applicationNo && `/digit-ui/citizen/payment/my-bills/${business_service}/${applicationNo}` || "/digit-ui/citizen"
     }, /*#__PURE__*/React.createElement(SubmitBar, {
       label: t("CS_PAYMENT_TRY_AGAIN")
     })), /*#__PURE__*/React.createElement("div", {
@@ -1642,7 +1776,7 @@ const WrapPaymentComponent = props => {
         marginTop: "8px"
       }
     }, /*#__PURE__*/React.createElement(Link, {
-      to: "/digit-ui/citizen"
+      to: `/digit-ui/citizen`
     }, t("CORE_COMMON_GO_TO_HOME")))));
   }
   const paymentData = data === null || data === void 0 ? void 0 : (_data$payments2 = data.payments) === null || _data$payments2 === void 0 ? void 0 : _data$payments2.Payments[0];
@@ -1740,9 +1874,10 @@ const WrapPaymentComponent = props => {
               let details;
               let businessServ = payments.Payments[0].paymentDetails[0].businessService;
               if (payments.Payments[0].paymentDetails[0].businessService == "BPAREG") {
-                details = _extends({}, payments.Payments[0].additionalDetails, {
+                details = {
+                  ...payments.Payments[0].additionalDetails,
                   "stakeholderType": "Application"
-                });
+                };
               }
               payments.Payments[0].additionalDetails = details;
               paymentArray[0] = payments.Payments[0];
@@ -1750,13 +1885,17 @@ const WrapPaymentComponent = props => {
               const _temp4 = function () {
                 if (business_service !== null && business_service !== void 0 && business_service.includes("WS") || business_service !== null && business_service !== void 0 && business_service.includes("SW")) {
                   return Promise.resolve(Digit.PaymentService.generatePdf(state, {
-                    Payments: [_extends({}, paymentData)]
+                    Payments: [{
+                      ...paymentData
+                    }]
                   }, generatePdfKeyForWs)).then(function (_Digit$PaymentService) {
                     response = _Digit$PaymentService;
                     const _temp2 = function (_response3, _response3$filestoreI, _response4, _response4$fileStoreI) {
                       if (!((_response3 = response) !== null && _response3 !== void 0 && (_response3$filestoreI = _response3.filestoreIds) !== null && _response3$filestoreI !== void 0 && _response3$filestoreI[0]) && !((_response4 = response) !== null && _response4 !== void 0 && (_response4$fileStoreI = _response4.fileStoreIds) !== null && _response4$fileStoreI !== void 0 && _response4$fileStoreI[0])) {
                         return Promise.resolve(Digit.PaymentService.generatePdf(state, {
-                          Payments: [_extends({}, paymentData)]
+                          Payments: [{
+                            ...paymentData
+                          }]
                         }, generatePdfKey)).then(function (_Digit$PaymentService2) {
                           response = _Digit$PaymentService2;
                         });
@@ -1774,23 +1913,30 @@ const WrapPaymentComponent = props => {
                       return Promise.resolve(Digit.OBPSService.BPASearch(payments.Payments[0].tenantId, queryObj)).then(function (bpaResponse) {
                         var _bpaResponse$BPA$, _bpaResponse$BPA$$add, _paymentData$paymentD, _bpaResponse$BPA$2, _bpaResponse$BPA$2$ad;
                         const formattedStakeholderType = bpaResponse === null || bpaResponse === void 0 ? void 0 : (_bpaResponse$BPA$ = bpaResponse.BPA[0]) === null || _bpaResponse$BPA$ === void 0 ? void 0 : (_bpaResponse$BPA$$add = _bpaResponse$BPA$.additionalDetails) === null || _bpaResponse$BPA$$add === void 0 ? void 0 : _bpaResponse$BPA$$add.typeOfArchitect;
-                        const updatedpayments = _extends({}, paymentData, {
-                          paymentDetails: [_extends({}, (_paymentData$paymentD = paymentData.paymentDetails) === null || _paymentData$paymentD === void 0 ? void 0 : _paymentData$paymentD[0], {
-                            additionalDetails: _extends({}, paymentData.paymentDetails[0].additionalDetails, {
+                        const updatedpayments = {
+                          ...paymentData,
+                          paymentDetails: [{
+                            ...((_paymentData$paymentD = paymentData.paymentDetails) === null || _paymentData$paymentD === void 0 ? void 0 : _paymentData$paymentD[0]),
+                            additionalDetails: {
+                              ...paymentData.paymentDetails[0].additionalDetails,
                               "propertyID": bpaResponse === null || bpaResponse === void 0 ? void 0 : (_bpaResponse$BPA$2 = bpaResponse.BPA[0]) === null || _bpaResponse$BPA$2 === void 0 ? void 0 : (_bpaResponse$BPA$2$ad = _bpaResponse$BPA$2.additionalDetails) === null || _bpaResponse$BPA$2$ad === void 0 ? void 0 : _bpaResponse$BPA$2$ad.propertyID,
                               "stakeholderType": formattedStakeholderType.charAt(0).toUpperCase() + formattedStakeholderType.slice(1).toLowerCase()
-                            })
-                          })]
-                        });
+                            }
+                          }]
+                        };
                         return Promise.resolve(Digit.PaymentService.generatePdf(state, {
-                          Payments: [_extends({}, updatedpayments)]
+                          Payments: [{
+                            ...updatedpayments
+                          }]
                         }, generatePdfKey)).then(function (_Digit$PaymentService3) {
                           response = _Digit$PaymentService3;
                         });
                       });
                     } else {
                       return Promise.resolve(Digit.PaymentService.generatePdf(state, {
-                        Payments: [_extends({}, paymentData)]
+                        Payments: [{
+                          ...paymentData
+                        }]
                       }, generatePdfKey)).then(function (_Digit$PaymentService4) {
                         response = _Digit$PaymentService4;
                       });
@@ -1874,9 +2020,12 @@ const WrapPaymentComponent = props => {
             edcrData = edcrResponse === null || edcrResponse === void 0 ? void 0 : (_edcrResponse$edcrDet = edcrResponse.edcrDetail) === null || _edcrResponse$edcrDet === void 0 ? void 0 : _edcrResponse$edcrDet[0];
           let currentDate = new Date();
           bpaDataDetails.additionalDetails.runDate = convertDateToEpoch(currentDate.getFullYear() + "-" + (currentDate.getMonth() + 1) + "-" + currentDate.getDate());
-          let reqData = _extends({}, bpaDataDetails, {
-            edcrDetail: [_extends({}, edcrData)]
-          });
+          let reqData = {
+            ...bpaDataDetails,
+            edcrDetail: [{
+              ...edcrData
+            }]
+          };
           console.log("reqData", reqData);
           return Promise.resolve(Digit.PaymentService.generatePdf(bpaDataDetails === null || bpaDataDetails === void 0 ? void 0 : bpaDataDetails.tenantId, {
             Bpa: [reqData]
@@ -1888,7 +2037,9 @@ const WrapPaymentComponent = props => {
               window.open(fileStore[response === null || response === void 0 ? void 0 : response.filestoreIds[0]], "_blank");
               reqData["applicationType"] = bpaDataDetails === null || bpaDataDetails === void 0 ? void 0 : (_bpaDataDetails$addit = bpaDataDetails.additionalDetails) === null || _bpaDataDetails$addit === void 0 ? void 0 : _bpaDataDetails$addit.applicationType;
               return Promise.resolve(Digit.OBPSService.edcr_report_download({
-                BPA: _extends({}, reqData)
+                BPA: {
+                  ...reqData
+                }
               })).then(function (edcrresponse) {
                 const responseStatus = parseInt(edcrresponse.status, 10);
                 if (responseStatus === 201 || responseStatus === 200) {
@@ -1896,7 +2047,7 @@ const WrapPaymentComponent = props => {
                     type: "application/pdf"
                   })) : downloadPdf(new Blob([edcrresponse.data], {
                     type: "application/pdf"
-                  }), "edcrReport.pdf");
+                  }), `edcrReport.pdf`);
                 }
               });
             });
@@ -1908,11 +2059,12 @@ const WrapPaymentComponent = props => {
     }
   };
   const getBillingPeriod = billDetails => {
-    const _ref2 = billDetails || {},
-      taxPeriodFrom = _ref2.taxPeriodFrom,
-      taxPeriodTo = _ref2.taxPeriodTo,
-      fromPeriod = _ref2.fromPeriod,
-      toPeriod = _ref2.toPeriod;
+    const {
+      taxPeriodFrom,
+      taxPeriodTo,
+      fromPeriod,
+      toPeriod
+    } = billDetails || {};
     if (taxPeriodFrom && taxPeriodTo) {
       let from = new Date(taxPeriodFrom).getFullYear().toString();
       let to = new Date(taxPeriodTo).getFullYear().toString();
@@ -1934,19 +2086,19 @@ const WrapPaymentComponent = props => {
   };
   let bannerText;
   if (workflw) {
-    bannerText = "CITIZEN_SUCCESS_UC_PAYMENT_MESSAGE";
+    bannerText = `CITIZEN_SUCCESS_UC_PAYMENT_MESSAGE`;
   } else {
     var _paymentData$paymentD2, _paymentData$paymentD3, _paymentData$paymentD4, _paymentData$paymentD5, _paymentData$paymentD6;
     if (paymentData !== null && paymentData !== void 0 && (_paymentData$paymentD2 = paymentData.paymentDetails) !== null && _paymentData$paymentD2 !== void 0 && (_paymentData$paymentD3 = _paymentData$paymentD2[0]) !== null && _paymentData$paymentD3 !== void 0 && _paymentData$paymentD3.businessService && paymentData !== null && paymentData !== void 0 && (_paymentData$paymentD4 = paymentData.paymentDetails) !== null && _paymentData$paymentD4 !== void 0 && (_paymentData$paymentD5 = _paymentData$paymentD4[0]) !== null && _paymentData$paymentD5 !== void 0 && (_paymentData$paymentD6 = _paymentData$paymentD5.businessService) !== null && _paymentData$paymentD6 !== void 0 && _paymentData$paymentD6.includes("BPA")) {
       var _paymentData$paymentD7;
       let nameOfAchitect = sessionStorage.getItem("BPA_ARCHITECT_NAME");
       let parsedArchitectName = nameOfAchitect ? JSON.parse(nameOfAchitect) : "ARCHITECT";
-      bannerText = "CITIZEN_SUCCESS_" + (paymentData === null || paymentData === void 0 ? void 0 : (_paymentData$paymentD7 = paymentData.paymentDetails[0]) === null || _paymentData$paymentD7 === void 0 ? void 0 : _paymentData$paymentD7.businessService.replace(/\./g, "_")) + "_" + parsedArchitectName + "_PAYMENT_MESSAGE";
+      bannerText = `CITIZEN_SUCCESS_${paymentData === null || paymentData === void 0 ? void 0 : (_paymentData$paymentD7 = paymentData.paymentDetails[0]) === null || _paymentData$paymentD7 === void 0 ? void 0 : _paymentData$paymentD7.businessService.replace(/\./g, "_")}_${parsedArchitectName}_PAYMENT_MESSAGE`;
     } else if (business_service !== null && business_service !== void 0 && business_service.includes("WS") || business_service !== null && business_service !== void 0 && business_service.includes("SW")) {
-      bannerText = t("CITIZEN_SUCCESS_" + (paymentData === null || paymentData === void 0 ? void 0 : paymentData.paymentDetails[0].businessService.replace(/\./g, "_")) + "_WS_PAYMENT_MESSAGE");
+      bannerText = t(`CITIZEN_SUCCESS_${paymentData === null || paymentData === void 0 ? void 0 : paymentData.paymentDetails[0].businessService.replace(/\./g, "_")}_WS_PAYMENT_MESSAGE`);
     } else {
       var _paymentData$paymentD8, _paymentData$paymentD9;
-      bannerText = paymentData !== null && paymentData !== void 0 && (_paymentData$paymentD8 = paymentData.paymentDetails[0]) !== null && _paymentData$paymentD8 !== void 0 && _paymentData$paymentD8.businessService ? "CITIZEN_SUCCESS_" + (paymentData === null || paymentData === void 0 ? void 0 : (_paymentData$paymentD9 = paymentData.paymentDetails[0]) === null || _paymentData$paymentD9 === void 0 ? void 0 : _paymentData$paymentD9.businessService.replace(/\./g, "_")) + "_PAYMENT_MESSAGE" : t("CITIZEN_SUCCESS_UC_PAYMENT_MESSAGE");
+      bannerText = paymentData !== null && paymentData !== void 0 && (_paymentData$paymentD8 = paymentData.paymentDetails[0]) !== null && _paymentData$paymentD8 !== void 0 && _paymentData$paymentD8.businessService ? `CITIZEN_SUCCESS_${paymentData === null || paymentData === void 0 ? void 0 : (_paymentData$paymentD9 = paymentData.paymentDetails[0]) === null || _paymentData$paymentD9 === void 0 ? void 0 : _paymentData$paymentD9.businessService.replace(/\./g, "_")}_PAYMENT_MESSAGE` : t("CITIZEN_SUCCESS_UC_PAYMENT_MESSAGE");
     }
   }
   const rowContainerStyle = {
@@ -1976,9 +2128,10 @@ const WrapPaymentComponent = props => {
             return Promise.resolve(Digit.PaymentService.generatePdf(tenantId, {
               hallsBookingApplication: [applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0]]
             }, generatePdfKeyForTL)).then(function (response) {
-              const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0], {
+              const updatedApplication = {
+                ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0]),
                 permissionLetterFilestoreId: response === null || response === void 0 ? void 0 : response.filestoreIds[0]
-              });
+              };
               return Promise.resolve(mutation.mutateAsync({
                 hallsBookingApplication: updatedApplication
               })).then(function () {
@@ -2016,9 +2169,10 @@ const WrapPaymentComponent = props => {
             return Promise.resolve(Digit.PaymentService.generatePdf(tenantId, {
               bookingApplication: [applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0]]
             }, generatePdfKeyForTL)).then(function (response) {
-              const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0], {
+              const updatedApplication = {
+                ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0]),
                 permissionLetterFilestoreId: response === null || response === void 0 ? void 0 : response.filestoreIds[0]
-              });
+              };
               return Promise.resolve(AdvertisementCreateApi.mutateAsync({
                 bookingApplication: updatedApplication
               })).then(function () {
@@ -2148,13 +2302,16 @@ const WrapPaymentComponent = props => {
               filestoreIds: [payments === null || payments === void 0 ? void 0 : payments.fileStoreId]
             };
             return Promise.resolve(Digit.PaymentService.generatePdf(tenantId, {
-              Payments: [_extends({}, paymentData)]
+              Payments: [{
+                ...paymentData
+              }]
             }, "advservice-receipt")).then(function (_Digit$PaymentService5) {
               var _response5;
               response = _Digit$PaymentService5;
-              const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0], {
+              const updatedApplication = {
+                ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0]),
                 paymentReceiptFilestoreId: (_response5 = response) === null || _response5 === void 0 ? void 0 : _response5.filestoreIds[0]
-              });
+              };
               return Promise.resolve(AdvertisementCreateApi.mutateAsync({
                 bookingApplication: updatedApplication
               })).then(function () {
@@ -2193,13 +2350,16 @@ const WrapPaymentComponent = props => {
               filestoreIds: [payments === null || payments === void 0 ? void 0 : payments.fileStoreId]
             };
             return Promise.resolve(Digit.PaymentService.generatePdf(tenantId, {
-              Payments: [_extends({}, paymentData)]
+              Payments: [{
+                ...paymentData
+              }]
             }, "chbservice-receipt")).then(function (_Digit$PaymentService6) {
               var _response7;
               response = _Digit$PaymentService6;
-              const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0], {
+              const updatedApplication = {
+                ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0]),
                 paymentReceiptFilestoreId: (_response7 = response) === null || _response7 === void 0 ? void 0 : _response7.filestoreIds[0]
-              });
+              };
               return Promise.resolve(mutation.mutateAsync({
                 hallsBookingApplication: updatedApplication
               })).then(function () {
@@ -2502,7 +2662,7 @@ const WrapPaymentComponent = props => {
     rowContainerStyle: rowContainerStyle,
     last: true,
     label: t("CS_PAYMENT_AMOUNT_PENDING"),
-    text: (paymentData === null || paymentData === void 0 ? void 0 : paymentData.totalDue) - (paymentData === null || paymentData === void 0 ? void 0 : paymentData.totalAmountPaid) || reciept_data !== null && reciept_data !== void 0 && (_reciept_data$payment3 = reciept_data.paymentDetails) !== null && _reciept_data$payment3 !== void 0 && (_reciept_data$payment4 = _reciept_data$payment3[0]) !== null && _reciept_data$payment4 !== void 0 && _reciept_data$payment4.totalDue && reciept_data !== null && reciept_data !== void 0 && (_reciept_data$payment5 = reciept_data.paymentDetails) !== null && _reciept_data$payment5 !== void 0 && (_reciept_data$payment6 = _reciept_data$payment5[0]) !== null && _reciept_data$payment6 !== void 0 && _reciept_data$payment6.totalAmountPaid ? "\u20B9 " + ((reciept_data === null || reciept_data === void 0 ? void 0 : (_reciept_data$payment7 = reciept_data.paymentDetails) === null || _reciept_data$payment7 === void 0 ? void 0 : (_reciept_data$payment8 = _reciept_data$payment7[0]) === null || _reciept_data$payment8 === void 0 ? void 0 : _reciept_data$payment8.totalDue) - (reciept_data === null || reciept_data === void 0 ? void 0 : (_reciept_data$payment9 = reciept_data.paymentDetails) === null || _reciept_data$payment9 === void 0 ? void 0 : (_reciept_data$payment0 = _reciept_data$payment9[0]) === null || _reciept_data$payment0 === void 0 ? void 0 : _reciept_data$payment0.totalAmountPaid)) : "\u20B9 " + 0
+    text: (paymentData === null || paymentData === void 0 ? void 0 : paymentData.totalDue) - (paymentData === null || paymentData === void 0 ? void 0 : paymentData.totalAmountPaid) || reciept_data !== null && reciept_data !== void 0 && (_reciept_data$payment3 = reciept_data.paymentDetails) !== null && _reciept_data$payment3 !== void 0 && (_reciept_data$payment4 = _reciept_data$payment3[0]) !== null && _reciept_data$payment4 !== void 0 && _reciept_data$payment4.totalDue && reciept_data !== null && reciept_data !== void 0 && (_reciept_data$payment5 = reciept_data.paymentDetails) !== null && _reciept_data$payment5 !== void 0 && (_reciept_data$payment6 = _reciept_data$payment5[0]) !== null && _reciept_data$payment6 !== void 0 && _reciept_data$payment6.totalAmountPaid ? `₹ ${(reciept_data === null || reciept_data === void 0 ? void 0 : (_reciept_data$payment7 = reciept_data.paymentDetails) === null || _reciept_data$payment7 === void 0 ? void 0 : (_reciept_data$payment8 = _reciept_data$payment7[0]) === null || _reciept_data$payment8 === void 0 ? void 0 : _reciept_data$payment8.totalDue) - (reciept_data === null || reciept_data === void 0 ? void 0 : (_reciept_data$payment9 = reciept_data.paymentDetails) === null || _reciept_data$payment9 === void 0 ? void 0 : (_reciept_data$payment0 = _reciept_data$payment9[0]) === null || _reciept_data$payment0 === void 0 ? void 0 : _reciept_data$payment0.totalAmountPaid)}` : `₹ ${0}`
   }), /*#__PURE__*/React.createElement(Row, {
     rowContainerStyle: rowContainerStyle,
     last: true,
@@ -2512,7 +2672,7 @@ const WrapPaymentComponent = props => {
     rowContainerStyle: rowContainerStyle,
     last: true,
     label: t(ommitRupeeSymbol ? "CS_PAYMENT_AMOUNT_PAID_WITHOUT_SYMBOL" : "CS_PAYMENT_AMOUNT_PAID"),
-    text: (paymentData === null || paymentData === void 0 ? void 0 : paymentData.totalAmountPaid) || (reciept_data !== null && reciept_data !== void 0 && (_reciept_data$payment1 = reciept_data.paymentDetails) !== null && _reciept_data$payment1 !== void 0 && (_reciept_data$payment10 = _reciept_data$payment1[0]) !== null && _reciept_data$payment10 !== void 0 && _reciept_data$payment10.totalAmountPaid ? "₹ " + (reciept_data === null || reciept_data === void 0 ? void 0 : (_reciept_data$payment11 = reciept_data.paymentDetails) === null || _reciept_data$payment11 === void 0 ? void 0 : (_reciept_data$payment12 = _reciept_data$payment11[0]) === null || _reciept_data$payment12 === void 0 ? void 0 : _reciept_data$payment12.totalAmountPaid) : "\u20B9 0")
+    text: (paymentData === null || paymentData === void 0 ? void 0 : paymentData.totalAmountPaid) || (reciept_data !== null && reciept_data !== void 0 && (_reciept_data$payment1 = reciept_data.paymentDetails) !== null && _reciept_data$payment1 !== void 0 && (_reciept_data$payment10 = _reciept_data$payment1[0]) !== null && _reciept_data$payment10 !== void 0 && _reciept_data$payment10.totalAmountPaid ? "₹ " + (reciept_data === null || reciept_data === void 0 ? void 0 : (_reciept_data$payment11 = reciept_data.paymentDetails) === null || _reciept_data$payment11 === void 0 ? void 0 : (_reciept_data$payment12 = _reciept_data$payment11[0]) === null || _reciept_data$payment12 === void 0 ? void 0 : _reciept_data$payment12.totalAmountPaid) : `₹ 0`)
   }), (business_service !== "PT" || workflw) && /*#__PURE__*/React.createElement(Row, {
     rowContainerStyle: rowContainerStyle,
     last: true,
@@ -2623,7 +2783,7 @@ const WrapPaymentComponent = props => {
       marginTop: "10px"
     }
   }, /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen/feedback?redirectedFrom=" + "digit-ui/citizen/payment/success" + "&propertyId=" + (consumerCode ? consumerCode : "") + "&acknowldgementNumber=" + (egId ? egId : "") + "&tenantId=" + tenantId + "&creationReason=" + (business_service === null || business_service === void 0 ? void 0 : (_business_service$spl = business_service.split(".")) === null || _business_service$spl === void 0 ? void 0 : _business_service$spl[1])
+    to: `/digit-ui/citizen/feedback?redirectedFrom=${"digit-ui/citizen/payment/success"}&propertyId=${consumerCode ? consumerCode : ""}&acknowldgementNumber=${egId ? egId : ""}&tenantId=${tenantId}&creationReason=${business_service === null || business_service === void 0 ? void 0 : (_business_service$spl = business_service.split(".")) === null || _business_service$spl === void 0 ? void 0 : _business_service$spl[1]}`
   }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CS_REVIEW_AND_FEEDBACK")
   }))), business_service !== null && business_service !== void 0 && business_service.includes("PT") ? /*#__PURE__*/React.createElement("div", {
@@ -2823,25 +2983,25 @@ const WrapPaymentComponent = props => {
       marginTop: "8px"
     }
   }, /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen"
+    to: `/digit-ui/citizen`
   }, t("CORE_COMMON_GO_TO_HOME"))), business_service == "TL" && /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen"
+    to: `/digit-ui/citizen`
   }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CORE_COMMON_GO_TO_HOME")
   })), business_service == "pet-services" && /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen"
+    to: `/digit-ui/citizen`
   }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CORE_COMMON_GO_TO_HOME")
   })), business_service == "chb-services" && /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen"
+    to: `/digit-ui/citizen`
   }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CORE_COMMON_GO_TO_HOME")
   })), business_service == "adv-services" && /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen"
+    to: `/digit-ui/citizen`
   }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CORE_COMMON_GO_TO_HOME")
   })), business_service == "sv-services" && /*#__PURE__*/React.createElement(Link, {
-    to: "/digit-ui/citizen"
+    to: `/digit-ui/citizen`
   }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CORE_COMMON_GO_TO_HOME"),
     style: {
@@ -2850,10 +3010,12 @@ const WrapPaymentComponent = props => {
   })));
 };
 const FailedPayment = props => {
-  const _useTranslation2 = useTranslation(),
-    t = _useTranslation2.t;
-  const _useParams2 = useParams(),
-    consumerCode = _useParams2.consumerCode;
+  const {
+    t
+  } = useTranslation();
+  const {
+    consumerCode
+  } = useParams();
   const getMessage = () => "Failure !";
   return /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement(Banner, {
     message: getMessage(),
@@ -2863,20 +3025,25 @@ const FailedPayment = props => {
 };
 
 const CitizenPayment = _ref => {
-  let stateCode = _ref.stateCode,
-    cityCode = _ref.cityCode,
-    moduleCode = _ref.moduleCode;
-  const _useRouteMatch = useRouteMatch(),
-    currentPath = _useRouteMatch.path;
-  const _useLocation = useLocation(),
-    routerState = _useLocation.state;
+  let {
+    stateCode,
+    cityCode,
+    moduleCode
+  } = _ref;
+  const {
+    path: currentPath
+  } = useRouteMatch();
+  const {
+    state: routerState
+  } = useLocation();
   const commonProps = {
     stateCode,
     cityCode,
     moduleCode
   };
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  const {
+    t
+  } = useTranslation();
   let isMobile = window.Digit.Utils.browser.isMobile();
   const pathname = window.location.pathname;
   const crumbs = [{
@@ -2954,23 +3121,23 @@ const CitizenPayment = _ref => {
   }, /*#__PURE__*/React.createElement("div", {
     className: "employee-form-content"
   }, /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/my-bills/:businessService"
+    path: `${currentPath}/my-bills/:businessService`
   }, /*#__PURE__*/React.createElement(MyBills, {
     stateCode: stateCode
   })), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/billDetails/:businessService/:consumerCode/:paymentAmt"
+    path: `${currentPath}/billDetails/:businessService/:consumerCode/:paymentAmt`
   }, /*#__PURE__*/React.createElement(SelectPaymentType, _extends({}, commonProps, {
     stateCode: stateCode,
     basePath: currentPath
   }))), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/collect/:businessService/:consumerCode"
+    path: `${currentPath}/collect/:businessService/:consumerCode`
   }, /*#__PURE__*/React.createElement(SelectPaymentType$1, _extends({}, commonProps, {
     stateCode: stateCode,
     basePath: currentPath
   }))), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/success/:businessService/:consumerCode/:tenantId"
+    path: `${currentPath}/success/:businessService/:consumerCode/:tenantId`
   }, /*#__PURE__*/React.createElement(SuccessfulPayment, commonProps)), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/failure"
+    path: `${currentPath}/failure`
   }, /*#__PURE__*/React.createElement(FailedPayment, commonProps))))))));
 };
 
@@ -2991,7 +3158,7 @@ const getKeyNotesConfig = (businessService, t) => {
                 fontSize: "16px",
                 fontWeight: "normal"
               }
-            }, " ( " + t("CS_PAYMENT_OVERDUE") + " " + days + " " + t(days === 1 ? "CS_COMMON_DAY" : "CS_COMMON_DAYS") + ")") : null);
+            }, ` ( ${t("CS_PAYMENT_OVERDUE")} ${days} ${t(days === 1 ? "CS_COMMON_DAY" : "CS_COMMON_DAYS")})`) : null);
           }],
           fallback: "N/A",
           noteStyle: {
@@ -3014,9 +3181,10 @@ const getKeyNotesConfig = (businessService, t) => {
         }, {
           keyValue: "CS_PAYMENT_BILLING_PERIOD",
           keyPath: ["billDetails", d => {
-            const _d$ = d[0],
-              fromPeriod = _d$.fromPeriod,
-              toPeriod = _d$.toPeriod;
+            const {
+              fromPeriod,
+              toPeriod
+            } = d[0];
             if (fromPeriod && toPeriod) {
               let from = new Date(fromPeriod).getFullYear().toString();
               let to = new Date(toPeriod).getFullYear().toString();
@@ -3027,11 +3195,11 @@ const getKeyNotesConfig = (businessService, t) => {
         }, {
           keyValue: "PT_DUE_DATE",
           keyPath: ["billDetails", d => {
-            var _d$2, _d$3;
-            if (!((_d$2 = d[0]) !== null && _d$2 !== void 0 && _d$2.toPeriod)) return "N/A";
-            const date = new Date((_d$3 = d[0]) === null || _d$3 === void 0 ? void 0 : _d$3.toPeriod);
+            var _d$, _d$2;
+            if (!((_d$ = d[0]) !== null && _d$ !== void 0 && _d$.toPeriod)) return "N/A";
+            const date = new Date((_d$2 = d[0]) === null || _d$2 === void 0 ? void 0 : _d$2.toPeriod);
             const month = Digit.Utils.date.monthNames[date.getMonth()];
-            return date.getDate() + " " + month + " " + date.getFullYear();
+            return `${date.getDate()} ${month} ${date.getFullYear()}`;
           }],
           fallback: "N/A"
         }],
@@ -3082,15 +3250,14 @@ const useCashPaymentDetails = (props, t) => {
 };
 const CashDetailsComponent = _ref => {
   var _props$value, _props$value2;
-  let props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _useState = useState(props === null || props === void 0 ? void 0 : (_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.manualReceiptDate),
-    manualReceiptDate = _useState[0],
-    setManualReceiptDate = _useState[1];
-  const _useState2 = useState(props === null || props === void 0 ? void 0 : (_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.manualReceiptNumber),
-    manualReceiptNumber = _useState2[0],
-    setManualReceiptNumber = _useState2[1];
+  let {
+    ...props
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const [manualReceiptDate, setManualReceiptDate] = useState(props === null || props === void 0 ? void 0 : (_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.manualReceiptDate);
+  const [manualReceiptNumber, setManualReceiptNumber] = useState(props === null || props === void 0 ? void 0 : (_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.manualReceiptNumber);
   useEffect(() => {
     if (props.onChange) {
       let errorObj = {};
@@ -3141,18 +3308,15 @@ const useCardPaymentDetails = (props, t) => {
 };
 const CardDetailsComponent = _ref => {
   var _props$value, _props$value2, _props$value3;
-  let props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _useState = useState(props === null || props === void 0 ? void 0 : (_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.last4Digits),
-    last4Digits = _useState[0],
-    setLast4Digits = _useState[1];
-  const _useState2 = useState(props === null || props === void 0 ? void 0 : (_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.transactionNumber),
-    transactionNumber = _useState2[0],
-    setTransactionNumber = _useState2[1];
-  const _useState3 = useState(props === null || props === void 0 ? void 0 : (_props$value3 = props.value) === null || _props$value3 === void 0 ? void 0 : _props$value3.reTransanctionNumber),
-    reTransanctionNumber = _useState3[0],
-    setReTransanctionNumber = _useState3[1];
+  let {
+    ...props
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const [last4Digits, setLast4Digits] = useState(props === null || props === void 0 ? void 0 : (_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.last4Digits);
+  const [transactionNumber, setTransactionNumber] = useState(props === null || props === void 0 ? void 0 : (_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.transactionNumber);
+  const [reTransanctionNumber, setReTransanctionNumber] = useState(props === null || props === void 0 ? void 0 : (_props$value3 = props.value) === null || _props$value3 === void 0 ? void 0 : _props$value3.reTransanctionNumber);
   useEffect(() => {
     if (props.onChange) {
       let errorObj = {};
@@ -3169,19 +3333,19 @@ const CardDetailsComponent = _ref => {
   }, [last4Digits, transactionNumber, reTransanctionNumber]);
   return /*#__PURE__*/React.createElement("div", {
     className: "formcomposer-section-grid"
-  }, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("NOC_PAYMENT_CARD_LAST_DIGITS_LABEL") + " *"), /*#__PURE__*/React.createElement(TextInput, {
+  }, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, `${t("NOC_PAYMENT_CARD_LAST_DIGITS_LABEL")} *`), /*#__PURE__*/React.createElement(TextInput, {
     value: last4Digits,
     name: "instrumentNumber",
     maxLength: "4",
     minLength: "4",
     required: true,
     onChange: e => setLast4Digits(e.target.value)
-  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("NOC_PAYMENT_TRANS_NO_LABEL") + " *"), /*#__PURE__*/React.createElement(TextInput, {
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, `${t("NOC_PAYMENT_TRANS_NO_LABEL")} *`), /*#__PURE__*/React.createElement(TextInput, {
     value: transactionNumber,
     name: "instrumentNumber",
     required: true,
     onChange: e => setTransactionNumber(e.target.value)
-  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("NOC_PAYMENT_RENTR_TRANS_LABEL") + " *"), /*#__PURE__*/React.createElement(TextInput, {
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, `${t("NOC_PAYMENT_RENTR_TRANS_LABEL")} *`), /*#__PURE__*/React.createElement(TextInput, {
     value: reTransanctionNumber,
     name: "instrumentNumber",
     required: true,
@@ -3220,26 +3384,15 @@ const useChequeDetails = (props, t) => {
 };
 const ChequeDetailsComponent = props => {
   var _props$chequeDetails$;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _useState = useState(props.chequeDetails.instrumentDate),
-    instrumentDate = _useState[0],
-    setChequeDate = _useState[1];
-  const _useState2 = useState(props.chequeDetails.instrumentNumber),
-    instrumentNumber = _useState2[0],
-    setChequeNo = _useState2[1];
-  const _useState3 = useState(props.chequeDetails.ifscCode),
-    ifscCode = _useState3[0],
-    setIfsc = _useState3[1];
-  const _useState4 = useState(""),
-    ifscCodeError = _useState4[0],
-    setIfscCodeError = _useState4[1];
-  const _useState5 = useState(props.chequeDetails.bankName),
-    bankName = _useState5[0],
-    setBankName = _useState5[1];
-  const _useState6 = useState((_props$chequeDetails$ = props.chequeDetails.bankBranch) === null || _props$chequeDetails$ === void 0 ? void 0 : _props$chequeDetails$.replace(" ", " ")),
-    bankBranch = _useState6[0],
-    setBankBranch = _useState6[1];
+  const {
+    t
+  } = useTranslation();
+  const [instrumentDate, setChequeDate] = useState(props.chequeDetails.instrumentDate);
+  const [instrumentNumber, setChequeNo] = useState(props.chequeDetails.instrumentNumber);
+  const [ifscCode, setIfsc] = useState(props.chequeDetails.ifscCode);
+  const [ifscCodeError, setIfscCodeError] = useState("");
+  const [bankName, setBankName] = useState(props.chequeDetails.bankName);
+  const [bankBranch, setBankBranch] = useState((_props$chequeDetails$ = props.chequeDetails.bankBranch) === null || _props$chequeDetails$ === void 0 ? void 0 : _props$chequeDetails$.replace(" ", " "));
   useEffect(() => {
     if (props.onChange) {
       let errorObj = {};
@@ -3260,12 +3413,14 @@ const ChequeDetailsComponent = props => {
   const setBankDetailsFromIFSC = function () {
     try {
       const _temp2 = _catch(function () {
-        return Promise.resolve(window.fetch("https://ifsc.razorpay.com/" + ifscCode)).then(function (res) {
+        return Promise.resolve(window.fetch(`https://ifsc.razorpay.com/${ifscCode}`)).then(function (res) {
           const _temp = function () {
             if (res.ok) {
               return Promise.resolve(res.json()).then(function (_ref) {
-                let BANK = _ref.BANK,
-                  BRANCH = _ref.BRANCH;
+                let {
+                  BANK,
+                  BRANCH
+                } = _ref;
                 setBankName(BANK);
                 setBankBranch(BRANCH === null || BRANCH === void 0 ? void 0 : BRANCH.replace(" ", " "));
               });
@@ -3287,18 +3442,18 @@ const ChequeDetailsComponent = props => {
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: "formcomposer-section-grid"
-  }, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("PAYMENT_CHQ_NO_LABEL") + " *"), /*#__PURE__*/React.createElement(TextInput, {
+  }, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, `${t("PAYMENT_CHQ_NO_LABEL")} *`), /*#__PURE__*/React.createElement(TextInput, {
     value: instrumentNumber,
     onChange: e => setChequeNo(e.target.value),
     name: "instrumentNumber",
     required: true
-  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("PAYMENT_CHEQUE_DATE_LABEL") + " *"), /*#__PURE__*/React.createElement(DatePicker, {
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, `${t("PAYMENT_CHEQUE_DATE_LABEL")} *`), /*#__PURE__*/React.createElement(DatePicker, {
     isRequired: true,
     date: instrumentDate,
     onChange: d => {
       setChequeDate(d);
     }
-  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("PAYMENT_IFSC_CODE_LABEL") + " *"), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, `${t("PAYMENT_IFSC_CODE_LABEL")} *`), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement("div", {
     className: "cheque-date"
@@ -4317,9 +4472,10 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_PAYMENT_BILLING_PERIOD",
       keyPath: ["billDetails", d => {
-        const _d$ = d[0],
-          fromPeriod = _d$.fromPeriod,
-          toPeriod = _d$.toPeriod;
+        const {
+          fromPeriod,
+          toPeriod
+        } = d[0];
         if (fromPeriod && toPeriod) {
           let from = new Date(fromPeriod).getFullYear().toString();
           let to = new Date(toPeriod).getFullYear().toString();
@@ -4330,7 +4486,9 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_BILL_NO",
       keyPath: ["billDetails", d => {
-        const currentBillNo = d[0].currentBillNo;
+        const {
+          currentBillNo
+        } = d[0];
         if (currentBillNo) {
           return currentBillNo;
         } else return "N/A";
@@ -4339,7 +4497,9 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_BILL_DUEDATE",
       keyPath: ["billDetails", d => {
-        const currentExpiryDate = d[0].currentExpiryDate;
+        const {
+          currentExpiryDate
+        } = d[0];
         if (currentExpiryDate) {
           return new Date(currentExpiryDate).toLocaleDateString();
         } else return "N/A";
@@ -4364,7 +4524,9 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_BILL_NO",
       keyPath: ["billDetails", d => {
-        const currentBillNo = d[0].currentBillNo;
+        const {
+          currentBillNo
+        } = d[0];
         if (currentBillNo) {
           return currentBillNo;
         } else return "N/A";
@@ -4373,7 +4535,9 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_BILL_DUEDATE",
       keyPath: ["billDetails", d => {
-        const currentExpiryDate = d[0].currentExpiryDate;
+        const {
+          currentExpiryDate
+        } = d[0];
         if (currentExpiryDate) {
           return new Date(currentExpiryDate).toLocaleDateString();
         } else return "N/A";
@@ -4430,9 +4594,10 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_PAYMENT_BILLING_PERIOD",
       keyPath: ["billDetails", d => {
-        const _d$2 = d[0],
-          fromPeriod = _d$2.fromPeriod,
-          toPeriod = _d$2.toPeriod;
+        const {
+          fromPeriod,
+          toPeriod
+        } = d[0];
         if (fromPeriod && toPeriod) {
           let from = new Date(fromPeriod).toLocaleDateString();
           let to = new Date(toPeriod).toLocaleDateString();
@@ -4447,7 +4612,9 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_BILL_DUEDATE",
       keyPath: ["billDetails", d => {
-        const currentExpiryDate = d[0].currentExpiryDate;
+        const {
+          currentExpiryDate
+        } = d[0];
         if (currentExpiryDate) {
           return new Date(currentExpiryDate).toLocaleDateString();
         } else return "N/A";
@@ -4464,9 +4631,10 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_PAYMENT_BILLING_PERIOD",
       keyPath: ["billDetails", d => {
-        const _d$3 = d[0],
-          fromPeriod = _d$3.fromPeriod,
-          toPeriod = _d$3.toPeriod;
+        const {
+          fromPeriod,
+          toPeriod
+        } = d[0];
         if (fromPeriod && toPeriod) {
           let from = new Date(fromPeriod).toLocaleDateString();
           let to = new Date(toPeriod).toLocaleDateString();
@@ -4481,7 +4649,9 @@ const BillDetailsKeyNoteConfig = () => ({
     }, {
       keyValue: "CS_BILL_DUEDATE",
       keyPath: ["billDetails", d => {
-        const expiryDate = d[0].expiryDate;
+        const {
+          expiryDate
+        } = d[0];
         if (expiryDate) {
           return new Date(expiryDate).toLocaleDateString();
         } else return "N/A";
@@ -4704,40 +4874,49 @@ const BillDetailsFormConfig = (props, t) => ({
 });
 const BillDetails$1 = _ref => {
   var _businessService$toUp, _bill$billDetails, _bill$billDetails2, _bill$billDetails2$so, _billDetails$billAcco, _arrears$toFixed, _arrears$toFixed2, _yearWiseBills$filter6, _yearWiseBills$filter7, _yearWiseBills$filter8, _yearWiseBills$filter9, _yearWiseBills$filter0;
-  let businessService = _ref.businessService,
-    consumerCode = _ref.consumerCode,
-    onChange = _ref.onChange;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    ModuleWorkflow = _Digit$Hooks$useQuery.workflow,
-    IsDisconnectionFlow = _Digit$Hooks$useQuery.IsDisconnectionFlow;
+  let {
+    businessService,
+    consumerCode,
+    _amount,
+    onChange
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const {
+    workflow: ModuleWorkflow,
+    IsDisconnectionFlow
+  } = Digit.Hooks.useQueryParams();
   const tenantId = Digit.ULBService.getCurrentTenantId();
-  const _Digit$Hooks$useFetch = Digit.Hooks.useFetchPayment({
-      tenantId,
-      businessService,
-      consumerCode
-    }),
-    data = _Digit$Hooks$useFetch.data,
-    isLoading = _Digit$Hooks$useFetch.isLoading;
+  const {
+    data,
+    isLoading
+  } = Digit.Hooks.useFetchPayment({
+    tenantId,
+    businessService,
+    consumerCode
+  });
   const checkFSM = window.location.href.includes("FSM");
-  const _Digit$Hooks$fsm$useS = Digit.Hooks.fsm.useSearch(tenantId, {
-      applicationNos: consumerCode
-    }, {
-      staleTime: Infinity,
-      enabled: businessService !== null && businessService !== void 0 && (_businessService$toUp = businessService.toUpperCase()) !== null && _businessService$toUp !== void 0 && _businessService$toUp.includes("FSM") ? true : false
-    }),
-    applicationData = _Digit$Hooks$fsm$useS.data;
-  const _useState = useState(),
-    bill = _useState[0],
-    setBill = _useState[1];
-  const _useState2 = useState(true),
-    showDetails = _useState2[0],
-    setShowDetails = _useState2[1];
-  const _Digit$Hooks$fsm$useA = Digit.Hooks.fsm.useApplicationDetail(t, tenantId, consumerCode, {
-      enabled: checkFSM ? true : false
-    }, "EMPLOYEE"),
-    application = _Digit$Hooks$fsm$useA.data;
+  const {
+    isLoading: isDataLoading,
+    data: applicationData
+  } = Digit.Hooks.fsm.useSearch(tenantId, {
+    applicationNos: consumerCode
+  }, {
+    staleTime: Infinity,
+    enabled: businessService !== null && businessService !== void 0 && (_businessService$toUp = businessService.toUpperCase()) !== null && _businessService$toUp !== void 0 && _businessService$toUp.includes("FSM") ? true : false
+  });
+  const [bill, setBill] = useState();
+  const [showDetails, setShowDetails] = useState(true);
+  const {
+    isLoading: isFSMLoading,
+    isError,
+    error,
+    data: application,
+    error: errorApplication
+  } = Digit.Hooks.fsm.useApplicationDetail(t, tenantId, consumerCode, {
+    enabled: checkFSM ? true : false
+  }, "EMPLOYEE");
   const yearWiseBills = bill === null || bill === void 0 ? void 0 : (_bill$billDetails = bill.billDetails) === null || _bill$billDetails === void 0 ? void 0 : _bill$billDetails.sort((a, b) => b.fromPeriod - a.fromPeriod);
   const billDetails = (yearWiseBills === null || yearWiseBills === void 0 ? void 0 : yearWiseBills[0]) || [];
   const getTotal = () => bill !== null && bill !== void 0 && bill.totalAmount ? bill === null || bill === void 0 ? void 0 : bill.totalAmount : 0;
@@ -4755,38 +4934,31 @@ const BillDetails$1 = _ref => {
     return application !== null && application !== void 0 && (_application$addition = application.additionalDetails) !== null && _application$addition !== void 0 && _application$addition.tripAmount ? application === null || application === void 0 ? void 0 : (_application$addition2 = application.additionalDetails) === null || _application$addition2 === void 0 ? void 0 : _application$addition2.tripAmount : 0;
   };
   const arrears = (bill === null || bill === void 0 ? void 0 : (_bill$billDetails2 = bill.billDetails) === null || _bill$billDetails2 === void 0 ? void 0 : (_bill$billDetails2$so = _bill$billDetails2.sort((a, b) => b.fromPeriod - a.fromPeriod)) === null || _bill$billDetails2$so === void 0 ? void 0 : _bill$billDetails2$so.reduce((total, current, index) => index === 0 ? total : total + current.amount, 0)) || 0;
-  const _Digit$Hooks$useGetPa = Digit.Hooks.useGetPaymentRulesForBusinessServices(tenantId),
-    mdmsLoading = _Digit$Hooks$useGetPa.isLoading,
-    mdmsBillingData = _Digit$Hooks$useGetPa.data;
-  const _useState3 = useState(),
-    paymentRules = _useState3[0],
-    setPaymentRules = _useState3[1];
+  const {
+    isLoading: mdmsLoading,
+    data: mdmsBillingData
+  } = Digit.Hooks.useGetPaymentRulesForBusinessServices(tenantId);
+  const [paymentRules, setPaymentRules] = useState();
   useEffect(() => {
     var _mdmsBillingData$Mdms, _mdmsBillingData$Mdms2;
     const payRestrictiondetails = mdmsBillingData === null || mdmsBillingData === void 0 ? void 0 : (_mdmsBillingData$Mdms = mdmsBillingData.MdmsRes) === null || _mdmsBillingData$Mdms === void 0 ? void 0 : (_mdmsBillingData$Mdms2 = _mdmsBillingData$Mdms.BillingService) === null || _mdmsBillingData$Mdms2 === void 0 ? void 0 : _mdmsBillingData$Mdms2.BusinessService;
     if (payRestrictiondetails !== null && payRestrictiondetails !== void 0 && payRestrictiondetails.length) {
       if (IsDisconnectionFlow) {
-        setPaymentRules(_extends({}, payRestrictiondetails.filter(e => e.code == businessService)[0], {
+        setPaymentRules({
+          ...payRestrictiondetails.filter(e => e.code == businessService)[0],
           partPaymentAllowed: false
-        }));
+        });
       } else setPaymentRules(payRestrictiondetails.filter(e => e.code == businessService)[0]);
     } else setPaymentRules({});
   }, [mdmsBillingData]);
-  const _ref2 = paymentRules || {},
-    minAmountPayable = _ref2.minAmountPayable,
-    isAdvanceAllowed = _ref2.isAdvanceAllowed;
-  const _useState4 = useState(t("CS_PAYMENT_FULL_AMOUNT")),
-    paymentType = _useState4[0],
-    setPaymentType = _useState4[1];
-  const _useState5 = useState(getTotal()),
-    amount = _useState5[0],
-    setAmount = _useState5[1];
-  const _useState6 = useState(true),
-    paymentAllowed = _useState6[0],
-    setPaymentAllowed = _useState6[1];
-  const _useState7 = useState(""),
-    formError = _useState7[0],
-    setError = _useState7[1];
+  const {
+    minAmountPayable,
+    isAdvanceAllowed
+  } = paymentRules || {};
+  const [paymentType, setPaymentType] = useState(t("CS_PAYMENT_FULL_AMOUNT"));
+  const [amount, setAmount] = useState(getTotal());
+  const [paymentAllowed, setPaymentAllowed] = useState(true);
+  const [formError, setError] = useState("");
   const changeAmount = value => {
     setAmount(value);
   };
@@ -4840,15 +5012,19 @@ const BillDetails$1 = _ref => {
   };
   if (isLoading || mdmsLoading) return /*#__PURE__*/React.createElement(Loader, null);
   const getFinancialYear = _bill => {
-    const fromPeriod = _bill.fromPeriod,
-      toPeriod = _bill.toPeriod;
+    const {
+      fromPeriod,
+      toPeriod
+    } = _bill;
     let from = new Date(fromPeriod).getFullYear().toString();
     let to = new Date(toPeriod).getFullYear().toString();
     return from + "-" + to;
   };
   const getBillingPeriod = _bill => {
-    const fromPeriod = _bill.fromPeriod,
-      toPeriod = _bill.toPeriod;
+    const {
+      fromPeriod,
+      toPeriod
+    } = _bill;
     let from = new Date(fromPeriod).toLocaleDateString();
     let to = new Date(toPeriod).toLocaleDateString();
     return from + "-" + to;
@@ -4874,11 +5050,17 @@ const BillDetails$1 = _ref => {
     }, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
       style: thStyle
     }, t("CS_BILL_NO")), /*#__PURE__*/React.createElement("th", {
-      style: _extends({}, thStyle)
+      style: {
+        ...thStyle
+      }
     }, t("CS_PAYMENT_BILLING_PERIOD")), /*#__PURE__*/React.createElement("th", {
-      style: _extends({}, thStyle)
+      style: {
+        ...thStyle
+      }
     }, t("CS_BILL_DUEDATE")), yearWiseBills === null || yearWiseBills === void 0 ? void 0 : (_yearWiseBills$filter = yearWiseBills.filter((e, ind) => ind > 0)) === null || _yearWiseBills$filter === void 0 ? void 0 : (_yearWiseBills$filter2 = _yearWiseBills$filter[0]) === null || _yearWiseBills$filter2 === void 0 ? void 0 : (_yearWiseBills$filter3 = _yearWiseBills$filter2.billAccountDetails) === null || _yearWiseBills$filter3 === void 0 ? void 0 : (_yearWiseBills$filter4 = _yearWiseBills$filter3.sort((a, b) => a.order - b.order)) === null || _yearWiseBills$filter4 === void 0 ? void 0 : _yearWiseBills$filter4.map((head, index) => /*#__PURE__*/React.createElement("th", {
-      style: _extends({}, thStyle),
+      style: {
+        ...thStyle
+      },
       key: index
     }, t(head.taxHeadCode))), /*#__PURE__*/React.createElement("th", {
       style: thStyle
@@ -5036,11 +5218,17 @@ const BillDetails$1 = _ref => {
   }, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
     style: thStyle
   }, t("FINANCIAL_YEAR")), /*#__PURE__*/React.createElement("th", {
-    style: _extends({}, thStyle)
+    style: {
+      ...thStyle
+    }
   }, t("CS_BILL_NO")), /*#__PURE__*/React.createElement("th", {
-    style: _extends({}, thStyle)
+    style: {
+      ...thStyle
+    }
   }, t("CS_BILL_DUEDATE")), yearWiseBills === null || yearWiseBills === void 0 ? void 0 : (_yearWiseBills$filter6 = yearWiseBills.filter((e, ind) => ind > 0)) === null || _yearWiseBills$filter6 === void 0 ? void 0 : (_yearWiseBills$filter7 = _yearWiseBills$filter6[0]) === null || _yearWiseBills$filter7 === void 0 ? void 0 : (_yearWiseBills$filter8 = _yearWiseBills$filter7.billAccountDetails) === null || _yearWiseBills$filter8 === void 0 ? void 0 : (_yearWiseBills$filter9 = _yearWiseBills$filter8.sort((a, b) => a.order - b.order)) === null || _yearWiseBills$filter9 === void 0 ? void 0 : _yearWiseBills$filter9.map((head, index) => /*#__PURE__*/React.createElement("th", {
-    style: _extends({}, thStyle),
+    style: {
+      ...thStyle
+    },
     key: index
   }, t(head.taxHeadCode))), /*#__PURE__*/React.createElement("th", {
     style: thStyle
@@ -5095,7 +5283,7 @@ const BillDetails$1 = _ref => {
   }, /*#__PURE__*/React.createElement("span", {
     className: "payment-amount-front",
     style: {
-      border: "1px solid " + (paymentType === t("CS_PAYMENT_FULL_AMOUNT") ? "#9a9a9a" : "black")
+      border: `1px solid ${paymentType === t("CS_PAYMENT_FULL_AMOUNT") ? "#9a9a9a" : "black"}`
     }
   }, "\u20B9"), paymentType !== t("CS_PAYMENT_FULL_AMOUNT") ? /*#__PURE__*/React.createElement(TextInput, {
     style: {
@@ -5119,58 +5307,61 @@ const BillDetails$1 = _ref => {
   }, t(formError)))));
 };
 
-const _excluded$2 = ["ManualRecieptDetails", "paymentModeDetails"],
-  _excluded2 = ["errorObj"];
 const CollectPayment = props => {
   var _paymentdetails$Bill, _businessService$toUp;
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    ModuleWorkflow = _Digit$Hooks$useQuery.workflow,
-    IsDisconnectionFlow = _Digit$Hooks$useQuery.IsDisconnectionFlow;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  const {
+    workflow: ModuleWorkflow,
+    IsDisconnectionFlow
+  } = Digit.Hooks.useQueryParams();
+  const {
+    t
+  } = useTranslation();
   const history = useHistory();
   const queryClient = useQueryClient();
-  const _useLocation = useLocation(),
-    state = _useLocation.state,
-    search = _useLocation.search;
-  const _useRouteMatch = useRouteMatch();
-  let _useParams = useParams(),
-    consumerCode = _useParams.consumerCode,
-    businessService = _useParams.businessService;
+  const {
+    state,
+    search
+  } = useLocation();
+  const {
+    path: currentPath
+  } = useRouteMatch();
+  let {
+    consumerCode,
+    businessService
+  } = useParams();
   const tenantId = Digit.ULBService.getCurrentTenantId();
-  const _useState = useState(0),
-    Time = _useState[0],
-    setTime = _useState[1];
+  const [Time, setTime] = useState(0);
   if (window.location.href.includes("ISWSAPP")) consumerCode = new URLSearchParams(search).get("applicationNumber");
   if (window.location.href.includes("ISWSCON") || ModuleWorkflow === "WS") consumerCode = decodeURIComponent(consumerCode);
-  const _Digit$Hooks$useFetch = Digit.Hooks.useFetchPayment({
-      tenantId: tenantId,
-      consumerCode,
-      businessService
-    }),
-    paymentdetails = _Digit$Hooks$useFetch.data,
-    isLoading = _Digit$Hooks$useFetch.isLoading;
+  const {
+    data: paymentdetails,
+    isLoading
+  } = Digit.Hooks.useFetchPayment({
+    tenantId: tenantId,
+    consumerCode,
+    businessService
+  });
   const bill = (paymentdetails === null || paymentdetails === void 0 ? void 0 : (_paymentdetails$Bill = paymentdetails.Bill) === null || _paymentdetails$Bill === void 0 ? void 0 : _paymentdetails$Bill.length) > 0 ? paymentdetails === null || paymentdetails === void 0 ? void 0 : paymentdetails.Bill[0] : {};
-  const _Digit$Hooks$fsm$useS = Digit.Hooks.fsm.useSearch(tenantId, {
-      applicationNos: consumerCode
-    }, {
-      staleTime: Infinity,
-      enabled: businessService !== null && businessService !== void 0 && (_businessService$toUp = businessService.toUpperCase()) !== null && _businessService$toUp !== void 0 && _businessService$toUp.includes("FSM") ? true : false
-    }),
-    applicationData = _Digit$Hooks$fsm$useS.data;
+  const {
+    data: applicationData
+  } = Digit.Hooks.fsm.useSearch(tenantId, {
+    applicationNos: consumerCode
+  }, {
+    staleTime: Infinity,
+    enabled: businessService !== null && businessService !== void 0 && (_businessService$toUp = businessService.toUpperCase()) !== null && _businessService$toUp !== void 0 && _businessService$toUp.includes("FSM") ? true : false
+  });
   const advanceBill = applicationData === null || applicationData === void 0 ? void 0 : applicationData.advanceAmount;
-  const _useCardPaymentDetail = useCardPaymentDetails(props, t),
-    cardConfig = _useCardPaymentDetail.cardConfig;
-  const _useChequeDetails = useChequeDetails(props, t),
-    chequeConfig = _useChequeDetails.chequeConfig;
-  const _useCashPaymentDetail = useCashPaymentDetails(props, t),
-    cashConfig = _useCashPaymentDetail.cashConfig;
-  const _useState2 = useState({}),
-    formState = _useState2[0],
-    setFormState = _useState2[1];
-  const _useState3 = useState(null),
-    toast = _useState3[0],
-    setToast = _useState3[1];
+  const {
+    cardConfig
+  } = useCardPaymentDetails(props, t);
+  const {
+    chequeConfig
+  } = useChequeDetails(props, t);
+  const {
+    cashConfig
+  } = useCashPaymentDetails(props, t);
+  const [formState, setFormState] = useState({});
+  const [toast, setToast] = useState(null);
   useEffect(() => {
     if (paymentdetails !== null && paymentdetails !== void 0 && paymentdetails.Bill && paymentdetails.Bill.length === 0) {
       setToast({
@@ -5204,15 +5395,11 @@ const CollectPayment = props => {
     code: "OTHER",
     name: t("COMMON_OTHER")
   }];
-  const _useState4 = useState((formState === null || formState === void 0 ? void 0 : formState.selectedPaymentMode) || getPaymentModes()[0]),
-    selectedPaymentMode = _useState4[0],
-    setPaymentMode = _useState4[1];
-  const _useState5 = useState((formState === null || formState === void 0 ? void 0 : formState.paidBy) || {
-      code: "OWNER",
-      name: t("COMMON_OWNER")
-    }),
-    selectedPaidBy = _useState5[0],
-    setselectedPaidBy = _useState5[1];
+  const [selectedPaymentMode, setPaymentMode] = useState((formState === null || formState === void 0 ? void 0 : formState.selectedPaymentMode) || getPaymentModes()[0]);
+  const [selectedPaidBy, setselectedPaidBy] = useState((formState === null || formState === void 0 ? void 0 : formState.paidBy) || {
+    code: "OWNER",
+    name: t("COMMON_OWNER")
+  });
   const onSubmit = function (data) {
     try {
       var _data$amount, _data$amount6, _data$amount7, _data$paymentMode, _data$paymentModeDeta, _recieptRequest$Payme2, _recieptRequest$Payme3, _recieptRequest$Payme4, _recieptRequest$Payme5, _recieptRequest$Payme6;
@@ -5230,12 +5417,15 @@ const CollectPayment = props => {
         });
         return Promise.resolve();
       }
-      const ManualRecieptDetails = data.ManualRecieptDetails,
-        paymentModeDetails = data.paymentModeDetails,
-        rest = _objectWithoutPropertiesLoose(data, _excluded$2);
-      const _ref = paymentModeDetails || {},
-        errorObj = _ref.errorObj,
-        details = _objectWithoutPropertiesLoose(_ref, _excluded2);
+      const {
+        ManualRecieptDetails,
+        paymentModeDetails,
+        ...rest
+      } = data;
+      const {
+        errorObj,
+        ...details
+      } = paymentModeDetails || {};
       let recieptRequest = {
         Payment: {
           mobileNumber: data.payerMobile,
@@ -5265,7 +5455,10 @@ const CollectPayment = props => {
       recieptRequest.Payment.paymentMode = data === null || data === void 0 ? void 0 : (_data$paymentMode = data.paymentMode) === null || _data$paymentMode === void 0 ? void 0 : _data$paymentMode.code;
       if (data.paymentModeDetails) {
         var _recieptRequest$Payme;
-        recieptRequest.Payment = _extends({}, recieptRequest.Payment, details);
+        recieptRequest.Payment = {
+          ...recieptRequest.Payment,
+          ...details
+        };
         delete recieptRequest.Payment.paymentModeDetails;
         if (data.paymentModeDetails.errorObj) {
           const errors = data.paymentModeDetails.errorObj;
@@ -5273,7 +5466,7 @@ const CollectPayment = props => {
           if (messages) {
             setToast({
               key: "error",
-              action: messages + " " + t("ES_ERROR_REQUIRED")
+              action: `${messages} ${t("ES_ERROR_REQUIRED")}`
             });
             setTimeout(() => setToast(null), 5000);
             return Promise.resolve();
@@ -5310,7 +5503,7 @@ const CollectPayment = props => {
         return Promise.resolve(Digit.PaymentService.createReciept(tenantId, recieptRequest)).then(function (resposne) {
           var _resposne$Payments$, _resposne$Payments$$p, _resposne$Payments$2, _resposne$Payments$2$, _resposne$Payments$2$2, _resposne$Payments$3, _resposne$Payments$3$, _resposne$Payments$4, _resposne$Payments$4$, _resposne$Payments$4$2;
           queryClient.invalidateQueries();
-          history.push(IsDisconnectionFlow ? props.basePath + "/success/" + businessService + "/" + (resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$ = resposne.Payments[0]) === null || _resposne$Payments$ === void 0 ? void 0 : (_resposne$Payments$$p = _resposne$Payments$.paymentDetails[0]) === null || _resposne$Payments$$p === void 0 ? void 0 : _resposne$Payments$$p.receiptNumber.replace(/\//g, "%2F")) + "/" + (resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$2 = resposne.Payments[0]) === null || _resposne$Payments$2 === void 0 ? void 0 : (_resposne$Payments$2$ = _resposne$Payments$2.paymentDetails[0]) === null || _resposne$Payments$2$ === void 0 ? void 0 : (_resposne$Payments$2$2 = _resposne$Payments$2$.bill) === null || _resposne$Payments$2$2 === void 0 ? void 0 : _resposne$Payments$2$2.consumerCode) + "?IsDisconnectionFlow=" + IsDisconnectionFlow : props.basePath + "/success/" + businessService + "/" + (resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$3 = resposne.Payments[0]) === null || _resposne$Payments$3 === void 0 ? void 0 : (_resposne$Payments$3$ = _resposne$Payments$3.paymentDetails[0]) === null || _resposne$Payments$3$ === void 0 ? void 0 : _resposne$Payments$3$.receiptNumber.replace(/\//g, "%2F")) + "/" + (resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$4 = resposne.Payments[0]) === null || _resposne$Payments$4 === void 0 ? void 0 : (_resposne$Payments$4$ = _resposne$Payments$4.paymentDetails[0]) === null || _resposne$Payments$4$ === void 0 ? void 0 : (_resposne$Payments$4$2 = _resposne$Payments$4$.bill) === null || _resposne$Payments$4$2 === void 0 ? void 0 : _resposne$Payments$4$2.consumerCode) + "?IsDisconnectionFlow=" + IsDisconnectionFlow);
+          history.push(IsDisconnectionFlow ? `${props.basePath}/success/${businessService}/${resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$ = resposne.Payments[0]) === null || _resposne$Payments$ === void 0 ? void 0 : (_resposne$Payments$$p = _resposne$Payments$.paymentDetails[0]) === null || _resposne$Payments$$p === void 0 ? void 0 : _resposne$Payments$$p.receiptNumber.replace(/\//g, "%2F")}/${resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$2 = resposne.Payments[0]) === null || _resposne$Payments$2 === void 0 ? void 0 : (_resposne$Payments$2$ = _resposne$Payments$2.paymentDetails[0]) === null || _resposne$Payments$2$ === void 0 ? void 0 : (_resposne$Payments$2$2 = _resposne$Payments$2$.bill) === null || _resposne$Payments$2$2 === void 0 ? void 0 : _resposne$Payments$2$2.consumerCode}?IsDisconnectionFlow=${IsDisconnectionFlow}` : `${props.basePath}/success/${businessService}/${resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$3 = resposne.Payments[0]) === null || _resposne$Payments$3 === void 0 ? void 0 : (_resposne$Payments$3$ = _resposne$Payments$3.paymentDetails[0]) === null || _resposne$Payments$3$ === void 0 ? void 0 : _resposne$Payments$3$.receiptNumber.replace(/\//g, "%2F")}/${resposne === null || resposne === void 0 ? void 0 : (_resposne$Payments$4 = resposne.Payments[0]) === null || _resposne$Payments$4 === void 0 ? void 0 : (_resposne$Payments$4$ = _resposne$Payments$4.paymentDetails[0]) === null || _resposne$Payments$4$ === void 0 ? void 0 : (_resposne$Payments$4$2 = _resposne$Payments$4$.bill) === null || _resposne$Payments$4$2 === void 0 ? void 0 : _resposne$Payments$4$2.consumerCode}?IsDisconnectionFlow=${IsDisconnectionFlow}`);
         });
       }, function (error) {
         var _setToast, _error$response, _error$response$data, _error$response$data$;
@@ -5341,7 +5534,7 @@ const CollectPayment = props => {
           marginBottom: 0,
           textAlign: "right"
         }
-      }, " ", "\u20B9 " + (bill === null || bill === void 0 ? void 0 : bill.totalAmount), " ")
+      }, " ", `₹ ${bill === null || bill === void 0 ? void 0 : bill.totalAmount}`, " ")
     }]
   }, {
     head: t("PAYMENT_PAID_BY_HEAD"),
@@ -5501,7 +5694,7 @@ const CollectPayment = props => {
     }
   }), toast && /*#__PURE__*/React.createElement(Toast, {
     error: toast.key === "error",
-    label: t(toast.key === "success" ? "ES_" + businessService.split(".")[0].toLowerCase() + "_" + toast.action + "_UPDATE_SUCCESS" : toast.action),
+    label: t(toast.key === "success" ? `ES_${businessService.split(".")[0].toLowerCase()}_${toast.action}_UPDATE_SUCCESS` : toast.action),
     onClose: () => setToast(null),
     style: {
       maxWidth: "670px"
@@ -5517,7 +5710,7 @@ const convertEpochToDate$1 = dateEpoch => {
     let year = dateFromApi.getFullYear();
     month = (month > 9 ? "" : "0") + month;
     day = (day > 9 ? "" : "0") + day;
-    return day + "/" + month + "/" + year;
+    return `${day}/${month}/${year}`;
   } else {
     return "NA";
   }
@@ -5525,34 +5718,35 @@ const convertEpochToDate$1 = dateEpoch => {
 const SuccessfulPayment$1 = props => {
   var _location, _location$pathname, _data$6, _data$7, _data$8, _data$9, _data$0, _data$1, _data$10, _data$11, _data$12;
   const history = useHistory();
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
+  const {
+    t
+  } = useTranslation();
   const queryClient = useQueryClient();
-  const _Digit$Hooks$useQuery = Digit.Hooks.useQueryParams(),
-    IsDisconnectionFlow = _Digit$Hooks$useQuery.IsDisconnectionFlow;
-  const _useState = useState(false),
-    displayMenu = _useState[0],
-    setDisplayMenu = _useState[1];
-  const _useState2 = useState(null),
-    selectedAction = _useState2[0],
-    setSelectedAction = _useState2[1];
+  const {
+    IsDisconnectionFlow
+  } = Digit.Hooks.useQueryParams();
+  const [displayMenu, setDisplayMenu] = useState(false);
+  const [selectedAction, setSelectedAction] = useState(null);
   const isFSMResponse = (_location = location) === null || _location === void 0 ? void 0 : (_location$pathname = _location.pathname) === null || _location$pathname === void 0 ? void 0 : _location$pathname.includes("payment/success/FSM.TRIP_CHARGES");
-  const combineResponseFSM = isFSMResponse ? t("PAYMENT_COLLECT_LABEL") + " / " + t("PAYMENT_COLLECT") : t("PAYMENT_LOCALIZATION_RESPONSE");
+  const combineResponseFSM = isFSMResponse ? `${t("PAYMENT_COLLECT_LABEL")} / ${t("PAYMENT_COLLECT")}` : t("PAYMENT_LOCALIZATION_RESPONSE");
   props.setLink(combineResponseFSM);
-  let _useParams = useParams(),
-    consumerCode = _useParams.consumerCode,
-    receiptNumber = _useParams.receiptNumber,
-    businessService = _useParams.businessService;
+  let {
+    consumerCode,
+    receiptNumber,
+    businessService
+  } = useParams();
   const tenantId = Digit.ULBService.getCurrentTenantId();
   receiptNumber = receiptNumber.replace(/%2F/g, "/");
-  const _Digit$Hooks$obps$use = Digit.Hooks.obps.useOBPSSearch("", {}, tenantId, {
-      applicationNo: consumerCode
-    }, {}, {
-      enabled: businessService !== null && businessService !== void 0 && businessService.includes("BPA") ? true : false
-    }),
-    _Digit$Hooks$obps$use2 = _Digit$Hooks$obps$use.data,
-    data = _Digit$Hooks$obps$use2 === void 0 ? {} : _Digit$Hooks$obps$use2,
-    isBpaSearchLoading = _Digit$Hooks$obps$use.isLoading;
+  const {
+    data = {},
+    isLoading: isBpaSearchLoading,
+    isSuccess: isBpaSuccess,
+    error: bpaerror
+  } = Digit.Hooks.obps.useOBPSSearch("", {}, tenantId, {
+    applicationNo: consumerCode
+  }, {}, {
+    enabled: businessService !== null && businessService !== void 0 && businessService.includes("BPA") ? true : false
+  });
   const FSM_EDITOR = Digit.UserService.hasAccess("FSM_EDITOR_EMP") || false;
   function onActionSelect(action) {
     setSelectedAction(action);
@@ -5595,7 +5789,7 @@ const SuccessfulPayment$1 = props => {
       case "GO_TO_HOME":
         return history.push("/digit-ui/employee");
       case "ASSIGN_TO_DSO":
-        return history.push("/digit-ui/employee/fsm/application-details/" + consumerCode);
+        return history.push(`/digit-ui/employee/fsm/application-details/${consumerCode}`);
       default:
         return null;
     }
@@ -5610,23 +5804,26 @@ const SuccessfulPayment$1 = props => {
     if (businessService !== null && businessService !== void 0 && businessService.includes("BPA")) {
       let nameOfAchitect = sessionStorage.getItem("BPA_ARCHITECT_NAME");
       let parsedArchitectName = nameOfAchitect ? JSON.parse(nameOfAchitect) : "ARCHITECT";
-      return t("ES_PAYMENT_" + businessService + "_" + parsedArchitectName + "_SUCCESSFUL_DESCRIPTION");
+      return t(`ES_PAYMENT_${businessService}_${parsedArchitectName}_SUCCESSFUL_DESCRIPTION`);
     } else if (businessService !== null && businessService !== void 0 && businessService.includes("WS") || businessService !== null && businessService !== void 0 && businessService.includes("SW")) {
-      return t("ES_PAYMENT_WS_" + (businessService === null || businessService === void 0 ? void 0 : businessService.replace(/\./g, "_")) + "_SUCCESSFUL_DESCRIPTION");
+      return t(`ES_PAYMENT_WS_${businessService === null || businessService === void 0 ? void 0 : businessService.replace(/\./g, "_")}_SUCCESSFUL_DESCRIPTION`);
     } else {
       return t("ES_PAYMENT_SUCCESSFUL_DESCRIPTION");
     }
   };
-  const _Digit$Hooks$useCommo = Digit.Hooks.useCommonMDMS(tenantId, "common-masters", "ReceiptKey", {
-      select: data => {
-        var _data$commonMasters, _data$commonMasters$u, _data$commonMasters$u2;
-        return ((_data$commonMasters = data["common-masters"]) === null || _data$commonMasters === void 0 ? void 0 : (_data$commonMasters$u = _data$commonMasters.uiCommonPay) === null || _data$commonMasters$u === void 0 ? void 0 : (_data$commonMasters$u2 = _data$commonMasters$u.filter(_ref => {
-          let code = _ref.code;
-          return businessService === null || businessService === void 0 ? void 0 : businessService.includes(code);
-        })[0]) === null || _data$commonMasters$u2 === void 0 ? void 0 : _data$commonMasters$u2.receiptKey) || "consolidatedreceipt";
-      }
-    }),
-    generatePdfKey = _Digit$Hooks$useCommo.data;
+  const {
+    data: generatePdfKey
+  } = Digit.Hooks.useCommonMDMS(tenantId, "common-masters", "ReceiptKey", {
+    select: data => {
+      var _data$commonMasters, _data$commonMasters$u, _data$commonMasters$u2;
+      return ((_data$commonMasters = data["common-masters"]) === null || _data$commonMasters === void 0 ? void 0 : (_data$commonMasters$u = _data$commonMasters.uiCommonPay) === null || _data$commonMasters$u === void 0 ? void 0 : (_data$commonMasters$u2 = _data$commonMasters$u.filter(_ref => {
+        let {
+          code
+        } = _ref;
+        return businessService === null || businessService === void 0 ? void 0 : businessService.includes(code);
+      })[0]) === null || _data$commonMasters$u2 === void 0 ? void 0 : _data$commonMasters$u2.receiptKey) || "consolidatedreceipt";
+    }
+  });
   const printCertificate = function () {
     try {
       const tenantId = Digit.ULBService.getCurrentTenantId();
@@ -5719,9 +5916,12 @@ const SuccessfulPayment$1 = props => {
             edcrData = edcrResponse === null || edcrResponse === void 0 ? void 0 : (_edcrResponse$edcrDet = edcrResponse.edcrDetail) === null || _edcrResponse$edcrDet === void 0 ? void 0 : _edcrResponse$edcrDet[0];
           let currentDate = new Date();
           bpaData.additionalDetails.runDate = convertDateToEpoch(currentDate.getFullYear() + "-" + (currentDate.getMonth() + 1) + "-" + currentDate.getDate());
-          let reqData = _extends({}, bpaData, {
-            edcrDetail: [_extends({}, edcrData)]
-          });
+          let reqData = {
+            ...bpaData,
+            edcrDetail: [{
+              ...edcrData
+            }]
+          };
           return Promise.resolve(Digit.PaymentService.generatePdf(bpaData === null || bpaData === void 0 ? void 0 : bpaData.tenantId, {
             Bpa: [reqData]
           }, order)).then(function (response) {
@@ -5732,7 +5932,9 @@ const SuccessfulPayment$1 = props => {
               window.open(fileStore[response === null || response === void 0 ? void 0 : response.filestoreIds[0]], "_blank");
               reqData["applicationType"] = data === null || data === void 0 ? void 0 : (_data$5 = data[0]) === null || _data$5 === void 0 ? void 0 : (_data$5$additionalDet = _data$5.additionalDetails) === null || _data$5$additionalDet === void 0 ? void 0 : _data$5$additionalDet.applicationType;
               return Promise.resolve(Digit.OBPSService.edcr_report_download({
-                BPA: _extends({}, reqData)
+                BPA: {
+                  ...reqData
+                }
               })).then(function (edcrResponseData) {
                 const responseStatus = parseInt(edcrResponseData.status, 10);
                 if (responseStatus === 201 || responseStatus === 200) {
@@ -5740,7 +5942,7 @@ const SuccessfulPayment$1 = props => {
                     type: "application/pdf"
                   })) : downloadPdf(new Blob([edcrResponseData.data], {
                     type: "application/pdf"
-                  }), "edcrReport.pdf");
+                  }), `edcrReport.pdf`);
                 }
               });
             });
@@ -5809,16 +6011,21 @@ const SuccessfulPayment$1 = props => {
                     return Promise.resolve(Digit.OBPSService.BPASearch(payments.Payments[0].tenantId, queryObj)).then(function (bpaResponse) {
                       var _bpaResponse$BPA$, _bpaResponse$BPA$$add, _paymentData$paymentD, _bpaResponse$BPA$2, _bpaResponse$BPA$2$ad;
                       const formattedStakeholderType = bpaResponse === null || bpaResponse === void 0 ? void 0 : (_bpaResponse$BPA$ = bpaResponse.BPA[0]) === null || _bpaResponse$BPA$ === void 0 ? void 0 : (_bpaResponse$BPA$$add = _bpaResponse$BPA$.additionalDetails) === null || _bpaResponse$BPA$$add === void 0 ? void 0 : _bpaResponse$BPA$$add.typeOfArchitect;
-                      const updatedpayments = _extends({}, paymentData, {
-                        paymentDetails: [_extends({}, (_paymentData$paymentD = paymentData.paymentDetails) === null || _paymentData$paymentD === void 0 ? void 0 : _paymentData$paymentD[0], {
-                          additionalDetails: _extends({}, paymentData.paymentDetails[0].additionalDetails, {
+                      const updatedpayments = {
+                        ...paymentData,
+                        paymentDetails: [{
+                          ...((_paymentData$paymentD = paymentData.paymentDetails) === null || _paymentData$paymentD === void 0 ? void 0 : _paymentData$paymentD[0]),
+                          additionalDetails: {
+                            ...paymentData.paymentDetails[0].additionalDetails,
                             "propertyID": bpaResponse === null || bpaResponse === void 0 ? void 0 : (_bpaResponse$BPA$2 = bpaResponse.BPA[0]) === null || _bpaResponse$BPA$2 === void 0 ? void 0 : (_bpaResponse$BPA$2$ad = _bpaResponse$BPA$2.additionalDetails) === null || _bpaResponse$BPA$2$ad === void 0 ? void 0 : _bpaResponse$BPA$2$ad.propertyID,
                             "stakeholderType": formattedStakeholderType.charAt(0).toUpperCase() + formattedStakeholderType.slice(1).toLowerCase()
-                          })
-                        })]
-                      });
+                          }
+                        }]
+                      };
                       return Promise.resolve(Digit.PaymentService.generatePdf(state, {
-                        Payments: [_extends({}, updatedpayments)]
+                        Payments: [{
+                          ...updatedpayments
+                        }]
                       }, generatePdfKey)).then(function (_Digit$PaymentService2) {
                         response = _Digit$PaymentService2;
                       });
@@ -6197,9 +6404,10 @@ const SuccessfulPayment$1 = props => {
             return Promise.resolve(Digit.PaymentService.generatePdf(tenantId, {
               hallsBookingApplication: [applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0]]
             }, generatePdfKeyForTL)).then(function (response) {
-              const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0], {
+              const updatedApplication = {
+                ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0]),
                 permissionLetterFilestoreId: response === null || response === void 0 ? void 0 : response.filestoreIds[0]
-              });
+              };
               return Promise.resolve(mutation.mutateAsync({
                 hallsBookingApplication: updatedApplication
               })).then(function () {
@@ -6237,9 +6445,10 @@ const SuccessfulPayment$1 = props => {
             return Promise.resolve(Digit.PaymentService.generatePdf(tenantId, {
               bookingApplication: [applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0]]
             }, generatePdfKeyForTL)).then(function (response) {
-              const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0], {
+              const updatedApplication = {
+                ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0]),
                 permissionLetterFilestoreId: response === null || response === void 0 ? void 0 : response.filestoreIds[0]
-              });
+              };
               return Promise.resolve(AdvertisementCreateApi.mutateAsync({
                 bookingApplication: updatedApplication
               })).then(function () {
@@ -6315,9 +6524,10 @@ const SuccessfulPayment$1 = props => {
               }, "advservice-receipt")).then(function (_Digit$PaymentService8) {
                 var _response;
                 response = _Digit$PaymentService8;
-                const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0], {
+                const updatedApplication = {
+                  ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.bookingApplication[0]),
                   paymentReceiptFilestoreId: (_response = response) === null || _response === void 0 ? void 0 : _response.filestoreIds[0]
-                });
+                };
                 return Promise.resolve(AdvertisementCreateApi.mutateAsync({
                   bookingApplication: updatedApplication
                 })).then(function () {
@@ -6365,9 +6575,10 @@ const SuccessfulPayment$1 = props => {
               }, "chbservice-receipt")).then(function (_Digit$PaymentService9) {
                 var _response3;
                 response = _Digit$PaymentService9;
-                const updatedApplication = _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0], {
+                const updatedApplication = {
+                  ...(applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.hallsBookingApplication[0]),
                   paymentReceiptFilestoreId: (_response3 = response) === null || _response3 === void 0 ? void 0 : _response3.filestoreIds[0]
-                });
+                };
                 return Promise.resolve(mutation.mutateAsync({
                   hallsBookingApplication: updatedApplication
                 })).then(function () {
@@ -6642,10 +6853,12 @@ const SuccessfulPayment$1 = props => {
 };
 const FailedPayment$1 = props => {
   props.setLink("Response");
-  const _useTranslation2 = useTranslation(),
-    t = _useTranslation2.t;
-  const _useParams2 = useParams(),
-    consumerCode = _useParams2.consumerCode;
+  const {
+    t
+  } = useTranslation();
+  const {
+    consumerCode
+  } = useParams();
   const getMessage = () => t("ES_PAYMENT_COLLECTED_ERROR");
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement(Banner, {
     message: getMessage(),
@@ -6689,12 +6902,14 @@ const middleWare_3 = function (data, _break, _next) {
     const _temp3 = function () {
       if (data.b === "b") {
         const _temp2 = _catch(function () {
-          return Promise.resolve(window.fetch("https://ifsc.razorpay.com/hdfc0000090")).then(function (res) {
+          return Promise.resolve(window.fetch(`https://ifsc.razorpay.com/hdfc0000090`)).then(function (res) {
             const _temp = function () {
               if (res.ok) {
                 return Promise.resolve(res.json()).then(function (_ref) {
-                  let BANK = _ref.BANK,
-                    BRANCH = _ref.BRANCH;
+                  let {
+                    BANK,
+                    BRANCH
+                  } = _ref;
                   data.BANKFROMMiddleWare = BANK;
                 });
               } else alert("Wrong IFSC Code");
@@ -6789,12 +7004,14 @@ const testForm = {
       setBankDetailsFromIFSC: function (props) {
         try {
           const _temp6 = _catch(function () {
-            return Promise.resolve(window.fetch("https://ifsc.razorpay.com/" + props.getValues("ifsc"))).then(function (res) {
+            return Promise.resolve(window.fetch(`https://ifsc.razorpay.com/${props.getValues("ifsc")}`)).then(function (res) {
               const _temp5 = function () {
                 if (res.ok) {
                   return Promise.resolve(res.json()).then(function (_ref2) {
-                    let BANK = _ref2.BANK,
-                      BRANCH = _ref2.BRANCH;
+                    let {
+                      BANK,
+                      BRANCH
+                    } = _ref2;
                     props.setValue("bank", BANK);
                     props.setValue("branch", BRANCH);
                   });
@@ -6849,28 +7066,29 @@ const testForm = {
 };
 
 const IFrameInterface = props => {
-  const stateCode = props.stateCode;
-  const _useParams = useParams(),
-    moduleName = _useParams.moduleName,
-    pageName = _useParams.pageName;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _useState = useState(""),
-    url = _useState[0],
-    setUrl = _useState[1];
-  const _useState2 = useState(""),
-    title = _useState2[0],
-    setTitle = _useState2[1];
-  const _Digit$Hooks$dss$useM = Digit.Hooks.dss.useMDMS(stateCode, "common-masters", ["uiCommonConstants"], {
-      select: data => {
-        var _data$commonMasters, _data$commonMasters$u;
-        let formattedResponse = (data === null || data === void 0 ? void 0 : (_data$commonMasters = data["common-masters"]) === null || _data$commonMasters === void 0 ? void 0 : (_data$commonMasters$u = _data$commonMasters["uiCommonConstants"]) === null || _data$commonMasters$u === void 0 ? void 0 : _data$commonMasters$u[0]) || {};
-        return formattedResponse;
-      },
-      enabled: true
-    }),
-    data = _Digit$Hooks$dss$useM.data,
-    isLoading = _Digit$Hooks$dss$useM.isLoading;
+  const {
+    stateCode
+  } = props;
+  const {
+    moduleName,
+    pageName
+  } = useParams();
+  const {
+    t
+  } = useTranslation();
+  const [url, setUrl] = useState("");
+  const [title, setTitle] = useState("");
+  const {
+    data,
+    isLoading
+  } = Digit.Hooks.dss.useMDMS(stateCode, "common-masters", ["uiCommonConstants"], {
+    select: data => {
+      var _data$commonMasters, _data$commonMasters$u;
+      let formattedResponse = (data === null || data === void 0 ? void 0 : (_data$commonMasters = data["common-masters"]) === null || _data$commonMasters === void 0 ? void 0 : (_data$commonMasters$u = _data$commonMasters["uiCommonConstants"]) === null || _data$commonMasters$u === void 0 ? void 0 : _data$commonMasters$u[0]) || {};
+      return formattedResponse;
+    },
+    enabled: true
+  });
   useEffect(() => {
     var _data$moduleName, _data$moduleName$ifra;
     const pageObject = (data === null || data === void 0 ? void 0 : (_data$moduleName = data[moduleName]) === null || _data$moduleName === void 0 ? void 0 : (_data$moduleName$ifra = _data$moduleName["iframe-routes"]) === null || _data$moduleName$ifra === void 0 ? void 0 : _data$moduleName$ifra[pageName]) || {};
@@ -6878,7 +7096,7 @@ const IFrameInterface = props => {
     const domain = isOrign ? process.env.NODE_ENV === "development" ? "https://qa.digit.org" : document.location.origin : pageObject === null || pageObject === void 0 ? void 0 : pageObject["domain"];
     const contextPath = (pageObject === null || pageObject === void 0 ? void 0 : pageObject["routePath"]) || "";
     const title = (pageObject === null || pageObject === void 0 ? void 0 : pageObject["title"]) || "";
-    let url = "" + domain + contextPath;
+    let url = `${domain}${contextPath}`;
     setUrl(url);
     setTitle(title);
   }, [data, moduleName, pageName]);
@@ -6900,15 +7118,18 @@ const IFrameInterface = props => {
 subFormRegistry === null || subFormRegistry === void 0 ? void 0 : subFormRegistry.addSubForm("testForm", testForm);
 const EmployeePayment = _ref => {
   var _location, _location$pathname, _location2, _location2$pathname;
-  let stateCode = _ref.stateCode,
-    cityCode = _ref.cityCode,
-    moduleCode = _ref.moduleCode;
-  const _useRouteMatch = useRouteMatch(),
-    currentPath = _useRouteMatch.path;
-  const _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  const _useState = useState(null),
-    setLink = _useState[1];
+  let {
+    stateCode,
+    cityCode,
+    moduleCode
+  } = _ref;
+  const {
+    path: currentPath
+  } = useRouteMatch();
+  const {
+    t
+  } = useTranslation();
+  const [link, setLink] = useState(null);
   const commonProps = {
     stateCode,
     cityCode,
@@ -6965,29 +7186,32 @@ const EmployeePayment = _ref => {
   }, /*#__PURE__*/React.createElement("div", {
     className: "employee-form-content"
   }, /*#__PURE__*/React.createElement(Switch, null, /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/collect/:businessService/:consumerCode"
+    path: `${currentPath}/collect/:businessService/:consumerCode`
   }, /*#__PURE__*/React.createElement(LayoutWrapper, {
     layoutClass: "action"
   }, /*#__PURE__*/React.createElement(CollectPayment, _extends({}, commonProps, {
     basePath: currentPath
   })))), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/success/:businessService/:receiptNumber/:consumerCode"
+    path: `${currentPath}/success/:businessService/:receiptNumber/:consumerCode`
   }, /*#__PURE__*/React.createElement(SuccessfulPayment$1, commonProps)), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/integration/:moduleName/:pageName"
+    path: `${currentPath}/integration/:moduleName/:pageName`
   }, /*#__PURE__*/React.createElement(IFrameInterface, commonProps)), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: currentPath + "/failure"
+    path: `${currentPath}/failure`
   }, /*#__PURE__*/React.createElement(FailedPayment$1, commonProps)))))));
 };
 
 const PaymentModule = _ref => {
-  let stateCode = _ref.stateCode,
-    cityCode = _ref.cityCode,
-    _ref$moduleCode = _ref.moduleCode,
-    moduleCode = _ref$moduleCode === void 0 ? "Payment" : _ref$moduleCode,
-    userType = _ref.userType;
-  const _useRouteMatch = useRouteMatch(),
-    path = _useRouteMatch.path,
-    url = _useRouteMatch.url;
+  let {
+    deltaConfig = {},
+    stateCode,
+    cityCode,
+    moduleCode = "Payment",
+    userType
+  } = _ref;
+  const {
+    path,
+    url
+  } = useRouteMatch();
   const store = {
     data: {}
   };
@@ -7010,7 +7234,9 @@ const PaymentModule = _ref => {
   return /*#__PURE__*/React.createElement(React.Fragment, null, getPaymentHome());
 };
 const PaymentLinks = _ref2 => {
-  const _useTranslation = useTranslation();
+  const {
+    t
+  } = useTranslation();
   return null;
 };
 const paymentConfigs = {