@djb25/digit-ui-module-ws 1.0.54 → 1.0.56

package/dist/index.modern.js

@@ -1,7 +1,7 @@
 import React, { useState, useMemo, useEffect, useRef, Fragment as Fragment$1, useReducer, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Link, useHistory, useLocation, Switch, Route, useRouteMatch, Redirect, useParams } from 'react-router-dom';
-import { Loader, Card, KeyNote, SubmitBar, InfoBannerIcon, SearchForm, SearchField, Dropdown, TextInput, Table, Banner, CardText, ActionBar, HomeIcon, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, VerticalTimeline, CollapsibleCardPage, LabelFieldPair, CardLabel, CardLabelError, LayoutWrapper, PrintBtnCommon, MultiLink, LinkButton, Toast, TickMark, FormStep, RadioOrSelect, CardHeader, CitizenInfoLabel, CardSubHeader, DatePicker, RadioButtons, UploadFile, ViewsIcon, Modal, DeleteIcon, WrapUnMaskComponent, MobileNumber, CheckBox, StatusTable, Row, Header, CardSectionHeader, InfoIcon, TextArea, FilterFormField, RemoveableTag, MultiSelectDropdown, InboxComposer, DropIcon, WSICon, EmployeeModuleCard, SearchAction, PopUp, DetailsCard, CloseSvg, Localities, DownloadBtnCommon, CollectionIcon, ResponseComposer, TelePhone, DisplayPhotos, PDFSvg, GenericFileIcon, EditIcon, Label, CardSectionSubText, DownloadIcon, CardLabelDesc, FormComposer, MultiUploadWrapper, Close as Close$e, BreakLine, AddIcon, CheckPoint, ConnectingCheckPoints, Menu, ButtonSelector, CitizenHomeCard } from '@djb25/digit-ui-react-components';
+import { Loader, Card, KeyNote, SubmitBar, InfoBannerIcon, SearchForm, SearchField, Dropdown, TextInput, Table, Banner, CardText, ActionBar, HomeIcon, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, VerticalTimeline, CollapsibleCardPage, LabelFieldPair, CardLabel, CardLabelError, CheckBox, LayoutWrapper, PrintBtnCommon, MultiLink, LinkButton, Toast, TickMark, FormStep, RadioOrSelect, CardHeader, CitizenInfoLabel, CardSubHeader, DatePicker, RadioButtons, UploadFile, ViewsIcon, Modal, DeleteIcon, WrapUnMaskComponent, MobileNumber, StatusTable, Row, Header, CardSectionHeader, InfoIcon, TextArea, FilterFormField, RemoveableTag, MultiSelectDropdown, InboxComposer, DropIcon, WSICon, EmployeeModuleCard, SearchAction, PopUp, DetailsCard, CloseSvg, Localities, DownloadBtnCommon, CollectionIcon, ResponseComposer, TelePhone, DisplayPhotos, PDFSvg, GenericFileIcon, EditIcon, Label, CardSectionSubText, DownloadIcon, CardLabelDesc, FormComposer, MultiUploadWrapper, Close as Close$e, BreakLine, AddIcon, CheckPoint, ConnectingCheckPoints, Menu, ButtonSelector, CitizenHomeCard } from '@djb25/digit-ui-react-components';
 import { useForm, Controller, useWatch, useFormContext } from 'react-hook-form';
 import { read, utils as utils$1 } from 'xlsx';
 import { useQueryClient } from 'react-query';
@@ -1870,7 +1870,8 @@ const WSCalculationPayload = (data, tenantId) => {
     numberOfFloors: useDetails !== null && useDetails !== void 0 && (_useDetails$noOfFloor = useDetails.noOfFloors) !== null && _useDetails$noOfFloor !== void 0 && _useDetails$noOfFloor.code ? Number(useDetails.noOfFloors.code) : 0,
     numberOfStudents: useDetails !== null && useDetails !== void 0 && useDetails.numberOfStudents ? Number(useDetails.numberOfStudents) : 0,
     numberOfBeds: useDetails !== null && useDetails !== void 0 && useDetails.numberOfBeds ? Number(useDetails.numberOfBeds) : 0,
-    servantQuarterArea: useDetails !== null && useDetails !== void 0 && useDetails.servantQuarterArea ? Number(useDetails.servantQuarterArea) : 0
+    servantQuarterArea: useDetails !== null && useDetails !== void 0 && useDetails.servantQuarterArea ? Number(useDetails.servantQuarterArea) : 0,
+    is12ABCertificate: useDetails !== null && useDetails !== void 0 && useDetails.is12ABCertificate ? true : false
   };
   if (useDetails !== null && useDetails !== void 0 && useDetails.NumberofRooms) payload.numberOfRooms = Number(useDetails.NumberofRooms);
   if (useDetails !== null && useDetails !== void 0 && useDetails.NumberofDwellingUnits) payload.numberOfDwellingUnits = Number(useDetails.NumberofDwellingUnits);
@@ -9666,7 +9667,8 @@ const WSCalculation = _ref => {
           numberOfBeds: "",
           numberOfStudents: "",
           servantQuarterArea: "",
-          colonyName: ""
+          colonyName: "",
+          is12ABCertificate: false
         }
       }
     }),
@@ -9713,7 +9715,7 @@ const WSCalculation = _ref => {
   const watchPropertyCategory = watch("useDetails.propertyCategory");
   const watchWaterConnectionUsageType = watch("useDetails.WaterConnectionUsageType");
   const watchColonyName = watch("useDetails.colonyName");
-  const isCalculateButtonEnabled = watchCategoryType && watchPropertyCategory && watchPropertyType && watchWaterConnectionUsageType && watchColonyName && !calculationData;
+  const isCalculateButtonEnabled = watchCategoryType && watchPropertyCategory && watchPropertyType && watchWaterConnectionUsageType && watchColonyName;
   const isHospitalProperty = (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "HOSPITAL_NURSING_HOME" || (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "DharamshalasOrHostels" || (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "HospitalNursingHome";
   const isHotelRestaurantProperty = (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "HOTEL_OR_RESTAURANT" || (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "HotelOrRestaurant";
   const isSchoolCollegeProperty = (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "School" || (watchPropertyType === null || watchPropertyType === void 0 ? void 0 : watchPropertyType.code) === "College";
@@ -9825,6 +9827,7 @@ const WSCalculation = _ref => {
       setValue("useDetails.numberOfStudents", "");
       setValue("useDetails.servantQuarterArea", "");
       setValue("useDetails.colonyName", "");
+      setValue("useDetails.is12ABCertificate", false);
     }
   }, [formData === null || formData === void 0 ? void 0 : (_formData$cpt2 = formData.cpt) === null || _formData$cpt2 === void 0 ? void 0 : _formData$cpt2.details, formData === null || formData === void 0 ? void 0 : formData.cpt, categoryOptions, propertyTypeOptions, usageTypeOptions, categoryTypeList, setValue]);
   const lastErrorState = React.useRef(null);
@@ -10357,7 +10360,21 @@ const WSCalculation = _ref => {
     name: "useDetails.servantQuarterArea"
   }))) : null, isServentHouse && (errors === null || errors === void 0 ? void 0 : (_errors$useDetails11 = errors.useDetails) === null || _errors$useDetails11 === void 0 ? void 0 : _errors$useDetails11.servantQuarterArea) && /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, errors.useDetails.servantQuarterArea.message))), /*#__PURE__*/React.createElement("div", {
+  }, errors.useDetails.servantQuarterArea.message), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement("div", {
+    className: "form-field"
+  }, /*#__PURE__*/React.createElement(Controller, {
+    control: control,
+    name: "useDetails.is12ABCertificate",
+    render: _ref3 => {
+      let value = _ref3.value,
+        onChange = _ref3.onChange;
+      return /*#__PURE__*/React.createElement(CheckBox, {
+        checked: value,
+        onChange: e => onChange(e.target.checked),
+        label: t("WS_12_AB_CERTIFICATE_LABEL")
+      });
+    }
+  }))))), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
       marginTop: "24px",
@@ -15124,7 +15141,7 @@ const WSActivationConnectionDetails = _ref => {
   }, commonProps)))));
 };
 const ConnectionDetails$2 = _props => {
-  var _errors$connectionTyp2, _errors$waterSource2, _errors$sourceSubData2, _errors$pipeSize2, _errors$noOfTaps2, _errors$noOfWaterClos2, _errors$noOfToilets2;
+  var _errors$connectionTyp2, _errors$connectionTyp3, _errors$waterSource2, _errors$waterSource3, _errors$sourceSubData2, _errors$sourceSubData3, _errors$pipeSize2, _errors$pipeSize3, _errors$noOfTaps2, _errors$noOfTaps3, _errors$noOfWaterClos2, _errors$noOfWaterClos3, _errors$noOfToilets2, _errors$noOfToilets3;
   const connectionDetail = _props.connectionDetail,
     focusIndex = _props.focusIndex,
     setFocusIndex = _props.setFocusIndex,
@@ -15191,35 +15208,17 @@ const ConnectionDetails$2 = _props => {
     }
   }, [errors]);
   const errorStyle = {
-    width: "70%",
-    marginLeft: "30%",
+    width: "100%",
+    marginLeft: "0px",
     fontSize: "12px",
     marginTop: "-21px"
   };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "formcomposer-section-grid"
-  }, !window.location.href.includes("by-config") && !window.location.href.includes("ws/modify-application") ? /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_ACK_COMMON_APP_NO_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !window.location.href.includes("by-config") && !window.location.href.includes("ws/modify-application") ? /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_ACK_COMMON_APP_NO_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(TextInput, {
     disabled: true,
     value: filters === null || filters === void 0 ? void 0 : filters.applicationNumber
-  }))) : null, (filters === null || filters === void 0 ? void 0 : filters.service) === "WATER" ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_CONN_TYPE") + "*"), /*#__PURE__*/React.createElement(Controller, {
+  }))) : null, (filters === null || filters === void 0 ? void 0 : filters.service) === "WATER" ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_CONN_TYPE") + "*"), /*#__PURE__*/React.createElement(Controller, {
     control: control,
     name: "connectionType",
     defaultValue: connectionDetail === null || connectionDetail === void 0 ? void 0 : connectionDetail.connectionType,
@@ -15243,17 +15242,9 @@ const ConnectionDetails$2 = _props => {
         t: t
       });
     }
-  })), localFormState.touched.connectionType ? /*#__PURE__*/React.createElement(CardLabelError, {
+  }), localFormState.touched.connectionType && errors !== null && errors !== void 0 && (_errors$connectionTyp2 = errors.connectionType) !== null && _errors$connectionTyp2 !== void 0 && _errors$connectionTyp2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$connectionTyp2 = errors.connectionType) === null || _errors$connectionTyp2 === void 0 ? void 0 : _errors$connectionTyp2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_WATER_SOURCE") + "*"), /*#__PURE__*/React.createElement(Controller, {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$connectionTyp3 = errors.connectionType) === null || _errors$connectionTyp3 === void 0 ? void 0 : _errors$connectionTyp3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_WATER_SOURCE") + "*"), /*#__PURE__*/React.createElement(Controller, {
     control: control,
     name: "waterSource",
     defaultValue: connectionDetail === null || connectionDetail === void 0 ? void 0 : connectionDetail.waterSource,
@@ -15293,17 +15284,9 @@ const ConnectionDetails$2 = _props => {
         t: t
       });
     }
-  })), localFormState.touched.waterSource ? /*#__PURE__*/React.createElement(CardLabelError, {
+  }), localFormState.touched.waterSource && errors !== null && errors !== void 0 && (_errors$waterSource2 = errors.waterSource) !== null && _errors$waterSource2 !== void 0 && _errors$waterSource2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$waterSource2 = errors.waterSource) === null || _errors$waterSource2 === void 0 ? void 0 : _errors$waterSource2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_WATER_SUB_SOURCE") + "*"), /*#__PURE__*/React.createElement(Controller, {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$waterSource3 = errors.waterSource) === null || _errors$waterSource3 === void 0 ? void 0 : _errors$waterSource3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_WATER_SUB_SOURCE") + "*"), /*#__PURE__*/React.createElement(Controller, {
     control: control,
     name: "sourceSubData",
     defaultValue: connectionDetail === null || connectionDetail === void 0 ? void 0 : connectionDetail.sourceSubData,
@@ -15327,17 +15310,9 @@ const ConnectionDetails$2 = _props => {
         t: t
       });
     }
-  })), localFormState.touched.sourceSubData ? /*#__PURE__*/React.createElement(CardLabelError, {
+  }), localFormState.touched.sourceSubData && errors !== null && errors !== void 0 && (_errors$sourceSubData2 = errors.sourceSubData) !== null && _errors$sourceSubData2 !== void 0 && _errors$sourceSubData2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$sourceSubData2 = errors.sourceSubData) === null || _errors$sourceSubData2 === void 0 ? void 0 : _errors$sourceSubData2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_PIPE_SIZE_IN_INCHES_LABEL") + "*"), /*#__PURE__*/React.createElement(Controller, {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$sourceSubData3 = errors.sourceSubData) === null || _errors$sourceSubData3 === void 0 ? void 0 : _errors$sourceSubData3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_PIPE_SIZE_IN_INCHES_LABEL") + "*"), /*#__PURE__*/React.createElement(Controller, {
     control: control,
     name: "pipeSize",
     defaultValue: connectionDetail === null || connectionDetail === void 0 ? void 0 : connectionDetail.pipeSize,
@@ -15361,17 +15336,9 @@ const ConnectionDetails$2 = _props => {
         t: t
       });
     }
-  })), localFormState.touched.pipeSize ? /*#__PURE__*/React.createElement(CardLabelError, {
+  }), localFormState.touched.pipeSize && errors !== null && errors !== void 0 && (_errors$pipeSize2 = errors.pipeSize) !== null && _errors$pipeSize2 !== void 0 && _errors$pipeSize2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$pipeSize2 = errors.pipeSize) === null || _errors$pipeSize2 === void 0 ? void 0 : _errors$pipeSize2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_NO_OF_TAPS") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$pipeSize3 = errors.pipeSize) === null || _errors$pipeSize3 === void 0 ? void 0 : _errors$pipeSize3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_NO_OF_TAPS") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -15403,17 +15370,9 @@ const ConnectionDetails$2 = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), localFormState.touched.noOfTaps ? /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.noOfTaps && errors !== null && errors !== void 0 && (_errors$noOfTaps2 = errors.noOfTaps) !== null && _errors$noOfTaps2 !== void 0 && _errors$noOfTaps2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$noOfTaps2 = errors.noOfTaps) === null || _errors$noOfTaps2 === void 0 ? void 0 : _errors$noOfTaps2.message) : null)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_NUMBER_WATER_CLOSETS_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$noOfTaps3 = errors.noOfTaps) === null || _errors$noOfTaps3 === void 0 ? void 0 : _errors$noOfTaps3.message) : null)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_NUMBER_WATER_CLOSETS_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -15445,17 +15404,9 @@ const ConnectionDetails$2 = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), localFormState.touched.noOfWaterClosets ? /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.noOfWaterClosets && errors !== null && errors !== void 0 && (_errors$noOfWaterClos2 = errors.noOfWaterClosets) !== null && _errors$noOfWaterClos2 !== void 0 && _errors$noOfWaterClos2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$noOfWaterClos2 = errors.noOfWaterClosets) === null || _errors$noOfWaterClos2 === void 0 ? void 0 : _errors$noOfWaterClos2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_NO_OF_TOILETS") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$noOfWaterClos3 = errors.noOfWaterClosets) === null || _errors$noOfWaterClos3 === void 0 ? void 0 : _errors$noOfWaterClos3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_NO_OF_TOILETS") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -15487,9 +15438,9 @@ const ConnectionDetails$2 = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), localFormState.touched.noOfToilets ? /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.noOfToilets && errors !== null && errors !== void 0 && (_errors$noOfToilets2 = errors.noOfToilets) !== null && _errors$noOfToilets2 !== void 0 && _errors$noOfToilets2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$noOfToilets2 = errors.noOfToilets) === null || _errors$noOfToilets2 === void 0 ? void 0 : _errors$noOfToilets2.message) : null)));
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$noOfToilets3 = errors.noOfToilets) === null || _errors$noOfToilets3 === void 0 ? void 0 : _errors$noOfToilets3.message) : null)));
 };
 
 const createPlumberDetails = () => ({
@@ -15559,7 +15510,7 @@ const WSActivationPlumberDetails = _ref => {
   }, commonProps))));
 };
 const PlumberDetails = _props => {
-  var _plumberDetails$, _formData$disConnecti, _errors$detailsProvid2, _plumberDetail$detail, _plumberDetail$detail2, _errors$plumberLicens2, _errors$plumberName2, _errors$plumberMobile2;
+  var _plumberDetails$, _formData$disConnecti, _errors$detailsProvid2, _errors$detailsProvid3, _plumberDetail$detail, _plumberDetail$detail2, _errors$plumberLicens2, _errors$plumberLicens3, _errors$plumberName2, _errors$plumberName3, _errors$plumberMobile2, _errors$plumberMobile3;
   const plumberDetail = _props.plumberDetail,
     focusIndex = _props.focusIndex,
     setFocusIndex = _props.setFocusIndex,
@@ -15621,22 +15572,12 @@ const PlumberDetails = _props => {
     }
   }, [errors]);
   const errorStyle = {
-    width: "70%",
-    marginLeft: "30%",
+    width: "100%",
+    marginLeft: "0px",
     fontSize: "12px",
     marginTop: "-21px"
   };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "formcomposer-section-grid"
-  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_ADDN_DETAILS_PLUMBER_PROVIDED_BY") + "*"), /*#__PURE__*/React.createElement(Controller, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_ADDN_DETAILS_PLUMBER_PROVIDED_BY") + "*"), /*#__PURE__*/React.createElement(Controller, {
     control: control,
     name: "detailsProvidedBy",
     defaultValue: plumberDetail === null || plumberDetail === void 0 ? void 0 : plumberDetail.detailsProvidedBy,
@@ -15674,17 +15615,9 @@ const PlumberDetails = _props => {
         t: t
       });
     }
-  })), localFormState.touched.detailsProvidedBy ? /*#__PURE__*/React.createElement(CardLabelError, {
+  }), localFormState.touched.detailsProvidedBy && errors !== null && errors !== void 0 && (_errors$detailsProvid2 = errors.detailsProvidedBy) !== null && _errors$detailsProvid2 !== void 0 && _errors$detailsProvid2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$detailsProvid2 = errors.detailsProvidedBy) === null || _errors$detailsProvid2 === void 0 ? void 0 : _errors$detailsProvid2.message) : null), !(plumberDetail !== null && plumberDetail !== void 0 && (_plumberDetail$detail = plumberDetail.detailsProvidedBy) !== null && _plumberDetail$detail !== void 0 && _plumberDetail$detail.code) || (plumberDetail === null || plumberDetail === void 0 ? void 0 : (_plumberDetail$detail2 = plumberDetail.detailsProvidedBy) === null || _plumberDetail$detail2 === void 0 ? void 0 : _plumberDetail$detail2.code) == "ULB" ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_PLIMBER_LICENSE_NO_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$detailsProvid3 = errors.detailsProvidedBy) === null || _errors$detailsProvid3 === void 0 ? void 0 : _errors$detailsProvid3.message) : null), !(plumberDetail !== null && plumberDetail !== void 0 && (_plumberDetail$detail = plumberDetail.detailsProvidedBy) !== null && _plumberDetail$detail !== void 0 && _plumberDetail$detail.code) || (plumberDetail === null || plumberDetail === void 0 ? void 0 : (_plumberDetail$detail2 = plumberDetail.detailsProvidedBy) === null || _plumberDetail$detail2 === void 0 ? void 0 : _plumberDetail$detail2.code) == "ULB" ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_PLIMBER_LICENSE_NO_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -15714,17 +15647,9 @@ const PlumberDetails = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), localFormState.touched.plumberLicenseNo ? /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.plumberLicenseNo && errors !== null && errors !== void 0 && (_errors$plumberLicens2 = errors.plumberLicenseNo) !== null && _errors$plumberLicens2 !== void 0 && _errors$plumberLicens2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, errors === null || errors === void 0 ? void 0 : (_errors$plumberLicens2 = errors.plumberLicenseNo) === null || _errors$plumberLicens2 === void 0 ? void 0 : _errors$plumberLicens2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_ADDN_DETAILS_PLUMBER_NAME_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, errors === null || errors === void 0 ? void 0 : (_errors$plumberLicens3 = errors.plumberLicenseNo) === null || _errors$plumberLicens3 === void 0 ? void 0 : _errors$plumberLicens3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_ADDN_DETAILS_PLUMBER_NAME_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -15754,17 +15679,9 @@ const PlumberDetails = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), localFormState.touched.plumberName ? /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.plumberName && errors !== null && errors !== void 0 && (_errors$plumberName2 = errors.plumberName) !== null && _errors$plumberName2 !== void 0 && _errors$plumberName2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$plumberName2 = errors.plumberName) === null || _errors$plumberName2 === void 0 ? void 0 : _errors$plumberName2.message) : null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_PLUMBER_MOBILE_NO_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$plumberName3 = errors.plumberName) === null || _errors$plumberName3 === void 0 ? void 0 : _errors$plumberName3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_PLUMBER_MOBILE_NO_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -15839,9 +15756,9 @@ const PlumberDetails = _props => {
         }
       })));
     }
-  }))), localFormState.touched.plumberMobileNo ? /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.plumberMobileNo && errors !== null && errors !== void 0 && (_errors$plumberMobile2 = errors.plumberMobileNo) !== null && _errors$plumberMobile2 !== void 0 && _errors$plumberMobile2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$plumberMobile2 = errors.plumberMobileNo) === null || _errors$plumberMobile2 === void 0 ? void 0 : _errors$plumberMobile2.message) : null)) : null);
+  }, " ", errors === null || errors === void 0 ? void 0 : (_errors$plumberMobile3 = errors.plumberMobileNo) === null || _errors$plumberMobile3 === void 0 ? void 0 : _errors$plumberMobile3.message) : null)) : null);
 };
 
 const createActivationDetails = () => ({
@@ -15910,7 +15827,7 @@ const WSActivationPageDetails = _ref => {
   }, commonProps))));
 };
 const ConnectionDetails$3 = _props => {
-  var _formData$connectionD, _formData$connectionD2, _formData$connectionD3, _formData$connectionD4, _formData$connectionD5, _formData$connectionD6, _formData2$connection, _formData2$connection2, _formData2$connection3, _formData2$connection4, _errors$meterId2, _errors$meterInstalla, _errors$meterInitialR2, _errors$connectionExe2, _errors$dateEffective2;
+  var _formData$connectionD, _formData$connectionD2, _formData$connectionD3, _formData$connectionD4, _formData$connectionD5, _formData$connectionD6, _formData2$connection, _formData2$connection2, _formData2$connection3, _formData2$connection4, _errors$meterId2, _errors$meterId3, _errors$meterInstalla, _errors$meterInstalla2, _errors$meterInitialR2, _errors$meterInitialR3, _errors$connectionExe2, _errors$connectionExe3, _errors$dateEffective2, _errors$dateEffective3;
   const activationDetail = _props.activationDetail,
     focusIndex = _props.focusIndex,
     setFocusIndex = _props.setFocusIndex,
@@ -15975,25 +15892,12 @@ const ConnectionDetails$3 = _props => {
     }
   }, [errors]);
   const errorStyle = {
-    width: "70%",
-    marginLeft: "30%",
+    width: "100%",
+    marginLeft: "0px",
     fontSize: "12px",
     marginTop: "-21px"
   };
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
-    style: {
-      marginBottom: "16px"
-    }
-  }, (filters === null || filters === void 0 ? void 0 : filters.service) === "WATER" && (formData === null || formData === void 0 ? void 0 : (_formData$connectionD3 = formData.connectionDetails) === null || _formData$connectionD3 === void 0 ? void 0 : (_formData$connectionD4 = _formData$connectionD3[0]) === null || _formData$connectionD4 === void 0 ? void 0 : (_formData$connectionD5 = _formData$connectionD4.connectionType) === null || _formData$connectionD5 === void 0 ? void 0 : (_formData$connectionD6 = _formData$connectionD5.code) === null || _formData$connectionD6 === void 0 ? void 0 : _formData$connectionD6.toUpperCase()) === "METERED" && (formData2 === null || formData2 === void 0 ? void 0 : (_formData2$connection = formData2.connectionDetails) === null || _formData2$connection === void 0 ? void 0 : (_formData2$connection2 = _formData2$connection[0]) === null || _formData2$connection2 === void 0 ? void 0 : (_formData2$connection3 = _formData2$connection2.formDetails) === null || _formData2$connection3 === void 0 ? void 0 : (_formData2$connection4 = _formData2$connection3.applicationData) === null || _formData2$connection4 === void 0 ? void 0 : _formData2$connection4.applicationType) !== "WATER_RECONNECTION" ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      marginTop: "-5px",
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_METER_ID") + "*"), /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, (filters === null || filters === void 0 ? void 0 : filters.service) === "WATER" && (formData === null || formData === void 0 ? void 0 : (_formData$connectionD3 = formData.connectionDetails) === null || _formData$connectionD3 === void 0 ? void 0 : (_formData$connectionD4 = _formData$connectionD3[0]) === null || _formData$connectionD4 === void 0 ? void 0 : (_formData$connectionD5 = _formData$connectionD4.connectionType) === null || _formData$connectionD5 === void 0 ? void 0 : (_formData$connectionD6 = _formData$connectionD5.code) === null || _formData$connectionD6 === void 0 ? void 0 : _formData$connectionD6.toUpperCase()) === "METERED" && (formData2 === null || formData2 === void 0 ? void 0 : (_formData2$connection = formData2.connectionDetails) === null || _formData2$connection === void 0 ? void 0 : (_formData2$connection2 = _formData2$connection[0]) === null || _formData2$connection2 === void 0 ? void 0 : (_formData2$connection3 = _formData2$connection2.formDetails) === null || _formData2$connection3 === void 0 ? void 0 : (_formData2$connection4 = _formData2$connection3.applicationData) === null || _formData2$connection4 === void 0 ? void 0 : _formData2$connection4.applicationType) !== "WATER_RECONNECTION" ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_METER_ID") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     control: control,
@@ -16025,18 +15929,9 @@ const ConnectionDetails$3 = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.meterId && errors !== null && errors !== void 0 && (_errors$meterId2 = errors.meterId) !== null && _errors$meterId2 !== void 0 && _errors$meterId2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, localFormState.touched.meterId ? errors === null || errors === void 0 ? void 0 : (_errors$meterId2 = errors.meterId) === null || _errors$meterId2 === void 0 ? void 0 : _errors$meterId2.message : ""), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      marginTop: "-5px",
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_ADDN_DETAIL_METER_INSTALL_DATE") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, errors === null || errors === void 0 ? void 0 : (_errors$meterId3 = errors.meterId) === null || _errors$meterId3 === void 0 ? void 0 : _errors$meterId3.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_ADDN_DETAIL_METER_INSTALL_DATE") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     name: "meterInstallationDate",
@@ -16050,18 +15945,9 @@ const ConnectionDetails$3 = _props => {
       name: "meterInstallationDate",
       onChange: props.onChange
     })
-  }))), /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.meterInstallationDate && errors !== null && errors !== void 0 && (_errors$meterInstalla = errors.meterInstallationDate) !== null && _errors$meterInstalla !== void 0 && _errors$meterInstalla.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, localFormState.touched.meterInstallationDate ? errors === null || errors === void 0 ? void 0 : (_errors$meterInstalla = errors.meterInstallationDate) === null || _errors$meterInstalla === void 0 ? void 0 : _errors$meterInstalla.message : ""), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      marginTop: "-5px",
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_INITIAL_METER_READING_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, errors === null || errors === void 0 ? void 0 : (_errors$meterInstalla2 = errors.meterInstallationDate) === null || _errors$meterInstalla2 === void 0 ? void 0 : _errors$meterInstalla2.message) : null), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_INITIAL_METER_READING_LABEL") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     type: "number",
@@ -16093,18 +15979,9 @@ const ConnectionDetails$3 = _props => {
         onBlur: props.onBlur
       });
     }
-  }))), /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.meterInitialReading && errors !== null && errors !== void 0 && (_errors$meterInitialR2 = errors.meterInitialReading) !== null && _errors$meterInitialR2 !== void 0 && _errors$meterInitialR2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, localFormState.touched.meterInitialReading ? errors === null || errors === void 0 ? void 0 : (_errors$meterInitialR2 = errors.meterInitialReading) === null || _errors$meterInitialR2 === void 0 ? void 0 : _errors$meterInitialR2.message : "")) : null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      marginTop: "-5px",
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_SERV_DETAIL_CONN_EXECUTION_DATE") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, errors === null || errors === void 0 ? void 0 : (_errors$meterInitialR3 = errors.meterInitialReading) === null || _errors$meterInitialR3 === void 0 ? void 0 : _errors$meterInitialR3.message) : null)) : null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_SERV_DETAIL_CONN_EXECUTION_DATE") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     name: "connectionExecutionDate",
@@ -16123,18 +16000,9 @@ const ConnectionDetails$3 = _props => {
         errorStyle: localFormState.touched.connectionExecutionDate && errors !== null && errors !== void 0 && (_errors$connectionExe = errors.connectionExecutionDate) !== null && _errors$connectionExe !== void 0 && _errors$connectionExe.message ? true : false
       });
     }
-  }))), /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.connectionExecutionDate && errors !== null && errors !== void 0 && (_errors$connectionExe2 = errors.connectionExecutionDate) !== null && _errors$connectionExe2 !== void 0 && _errors$connectionExe2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, localFormState.touched.connectionExecutionDate ? errors === null || errors === void 0 ? void 0 : (_errors$connectionExe2 = errors.connectionExecutionDate) === null || _errors$connectionExe2 === void 0 ? void 0 : _errors$connectionExe2.message : ""), window.location.href.includes("modify") || window.location.href.includes("mutation") ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: isMobile && isEmployee ? {
-      fontWeight: "700",
-      width: "100%"
-    } : {
-      marginTop: "-5px",
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WS_MODIFICATIONS_EFFECTIVE_FROM") + "*"), /*#__PURE__*/React.createElement("div", {
+  }, errors === null || errors === void 0 ? void 0 : (_errors$connectionExe3 = errors.connectionExecutionDate) === null || _errors$connectionExe3 === void 0 ? void 0 : _errors$connectionExe3.message) : null), window.location.href.includes("modify") || window.location.href.includes("mutation") ? /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WS_MODIFICATIONS_EFFECTIVE_FROM") + "*"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(Controller, {
     name: "dateEffectiveFrom",
@@ -16154,9 +16022,9 @@ const ConnectionDetails$3 = _props => {
         errorStyle: localFormState.touched.dateEffectiveFrom && errors !== null && errors !== void 0 && (_errors$dateEffective = errors.dateEffectiveFrom) !== null && _errors$dateEffective !== void 0 && _errors$dateEffective.message ? true : false
       });
     }
-  }))), /*#__PURE__*/React.createElement(CardLabelError, {
+  })), localFormState.touched.dateEffectiveFrom && errors !== null && errors !== void 0 && (_errors$dateEffective2 = errors.dateEffectiveFrom) !== null && _errors$dateEffective2 !== void 0 && _errors$dateEffective2.message ? /*#__PURE__*/React.createElement(CardLabelError, {
     style: errorStyle
-  }, localFormState.touched.dateEffectiveFrom ? errors === null || errors === void 0 ? void 0 : (_errors$dateEffective2 = errors.dateEffectiveFrom) === null || _errors$dateEffective2 === void 0 ? void 0 : _errors$dateEffective2.message : "")) : null));
+  }, errors === null || errors === void 0 ? void 0 : (_errors$dateEffective3 = errors.dateEffectiveFrom) === null || _errors$dateEffective3 === void 0 ? void 0 : _errors$dateEffective3.message) : null) : null);
 };
 
 const WSActivationCommentsDetails = _ref => {
@@ -16178,12 +16046,7 @@ const WSActivationCommentsDetails = _ref => {
       onSelect(config.key, _extends({}, formData[config.key], comments));
     }
   }, [comments]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    style: {
-      fontWeight: "700"
-    },
-    className: "card-label-smaller"
-  }, t("WF_COMMON_COMMENTS"), ":"), /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WF_COMMON_COMMENTS"), ":"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(TextInput, {
     key: config.key,
@@ -16286,12 +16149,7 @@ const WSActivationSupportingDocuments = _ref => {
       });
     }
   }, [uploadedFile]);
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    className: "card-label-smaller",
-    style: {
-      fontWeight: "700"
-    }
-  }, t("WF_APPROVAL_UPLOAD_HEAD"), ":"), /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("WF_APPROVAL_UPLOAD_HEAD"), ":"), /*#__PURE__*/React.createElement("div", {
     className: "field"
   }, /*#__PURE__*/React.createElement(UploadFile, {
     onUpload: e => {
@@ -44536,8 +44394,8 @@ const DueVerification = _ref => {
       return newData;
     });
   }, [applicationData]);
-  const isPendingApproval = (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_APPROVAL_FOR_CONNECTION" || (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_CONNECTION_ACTIVATION";
-  const isActivation = (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_CONNECTION_ACTIVATION";
+  const isPendingApproval = (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_FIELD_INSPECTION";
+  const isActivation = ["PENDING_FOR_BILLING_CLERK_REVIEW", "PENDING_FOR_ASO_APPROVAL", "PENDING_FOR_ZRO_APPROVAL", "PENDING_FOR_AE_APPROVAL", "PENDING_FOR_FINAL_PAYMENT"].includes(applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus);
   const columns = useMemo(() => {
     const baseColumns = [{
       Header: t("K No."),
@@ -44555,7 +44413,7 @@ const DueVerification = _ref => {
       Header: t("Total Amount"),
       accessor: "totalAmount"
     }];
-    if (isPendingApproval) {
+    if (isPendingApproval || isActivation) {
       baseColumns.push({
         Header: t("Remarks"),
         accessor: "remarks",
@@ -44574,7 +44432,7 @@ const DueVerification = _ref => {
       });
     }
     return baseColumns;
-  }, [t, handleRemarkChange, isPendingApproval]);
+  }, [t, handleRemarkChange, isPendingApproval, isActivation]);
   useEffect(() => {
     if (applicationData !== null && applicationData !== void 0 && applicationData.dueVerification && Array.isArray(applicationData.dueVerification)) {
       setTableData(applicationData.dueVerification);
@@ -44676,7 +44534,11 @@ const InspectionInformation = _ref => {
   let applicationData = _ref.applicationData;
   const _useTranslation = useTranslation(),
     t = _useTranslation.t;
-  const _useState = useState(null),
+  const defaultInspectionType = {
+    i18nKey: "New Connection Visit",
+    code: "new_connection_visit"
+  };
+  const _useState = useState(defaultInspectionType),
     inspectionType = _useState[0],
     setInspectionType = _useState[1];
   const _useState2 = useState(""),
@@ -44686,20 +44548,23 @@ const InspectionInformation = _ref => {
     inspectorName = _useState3[0],
     setInspectorName = _useState3[1];
   useEffect(() => {
-    if (applicationData !== null && applicationData !== void 0 && applicationData.inspectionInformation) {
+    if (applicationData) {
+      if (!applicationData.inspectionInformation) {
+        applicationData.inspectionInformation = {};
+      }
+      if (!applicationData.inspectionInformation.inspectionType) {
+        applicationData.inspectionInformation.inspectionType = defaultInspectionType;
+      }
       const apiInspectionType = applicationData.inspectionInformation.inspectionType;
       let matchedType = null;
       const inspectionCode = typeof apiInspectionType === "object" && apiInspectionType !== null ? apiInspectionType.code : apiInspectionType;
       if (inspectionCode) {
         matchedType = [{
-          i18nKey: "ES_COMMON_SELECT",
-          code: ""
-        }, {
           i18nKey: "New Connection Visit",
           code: "new_connection_visit"
         }].find(opt => opt.code === inspectionCode || opt.i18nKey === inspectionCode);
       }
-      setInspectionType(matchedType || null);
+      setInspectionType(matchedType || defaultInspectionType);
       let dateValue = applicationData.inspectionInformation.inspectionDate || "";
       if (dateValue && typeof dateValue === 'number') {
         const d = new Date(dateValue);
@@ -44716,9 +44581,6 @@ const InspectionInformation = _ref => {
     }
   }, [applicationData]);
   const inspectionTypeOptions = [{
-    i18nKey: "ES_COMMON_SELECT",
-    code: ""
-  }, {
     i18nKey: "New Connection Visit",
     code: "new_connection_visit"
   }];
@@ -44738,7 +44600,7 @@ const InspectionInformation = _ref => {
     if (!applicationData.inspectionInformation) applicationData.inspectionInformation = {};
     applicationData.inspectionInformation.inspectorName = val;
   };
-  const readOnly = (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_CONNECTION_ACTIVATION";
+  const readOnly = ["PENDING_FOR_BILLING_CLERK_REVIEW", "PENDING_FOR_ASO_APPROVAL", "PENDING_FOR_ZRO_APPROVAL", "PENDING_FOR_AE_APPROVAL", "PENDING_FOR_FINAL_PAYMENT"].includes(applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus);
   return /*#__PURE__*/React.createElement("div", {
     style: {
       marginBottom: "20px"
@@ -45320,9 +45182,9 @@ function ApplicationDetailsContent(_ref) {
     }), (detail === null || detail === void 0 ? void 0 : (_detail$additionalDet17 = detail.additionalDetails) === null || _detail$additionalDet17 === void 0 ? void 0 : _detail$additionalDet17.documents) && /*#__PURE__*/React.createElement(PropertyDocuments, {
       documents: detail === null || detail === void 0 ? void 0 : (_detail$additionalDet18 = detail.additionalDetails) === null || _detail$additionalDet18 === void 0 ? void 0 : _detail$additionalDet18.documents,
       applicationStatus: applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus
-    }), (detail === null || detail === void 0 ? void 0 : (_detail$additionalDet19 = detail.additionalDetails) === null || _detail$additionalDet19 === void 0 ? void 0 : _detail$additionalDet19.documents) && ((applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_FIELD_INSPECTION" || (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_APPROVAL_FOR_CONNECTION" || (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_CONNECTION_ACTIVATION" || (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_RECONNECTION") && /*#__PURE__*/React.createElement(DueVerification, {
+    }), (detail === null || detail === void 0 ? void 0 : (_detail$additionalDet19 = detail.additionalDetails) === null || _detail$additionalDet19 === void 0 ? void 0 : _detail$additionalDet19.documents) && ["PENDING_FOR_FIELD_INSPECTION", "PENDING_APPROVAL_FOR_CONNECTION", "PENDING_FOR_CONNECTION_ACTIVATION", "PENDING_FOR_RECONNECTION", "PENDING_FOR_DUE_VERIFICATION", "PENDING_FOR_BILLING_CLERK_REVIEW", "PENDING_FOR_ASO_APPROVAL", "PENDING_FOR_ZRO_APPROVAL", "PENDING_FOR_AE_APPROVAL", "PENDING_FOR_FINAL_PAYMENT", "CONNECTION_ACTIVATED"].includes(applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) && /*#__PURE__*/React.createElement(DueVerification, {
       applicationData: applicationData
-    }), " ", (detail === null || detail === void 0 ? void 0 : (_detail$additionalDet20 = detail.additionalDetails) === null || _detail$additionalDet20 === void 0 ? void 0 : _detail$additionalDet20.documents) && ((applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_APPROVAL_FOR_CONNECTION" || (applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) === "PENDING_FOR_CONNECTION_ACTIVATION") && /*#__PURE__*/React.createElement(InspectionInformation, {
+    }), " ", (detail === null || detail === void 0 ? void 0 : (_detail$additionalDet20 = detail.additionalDetails) === null || _detail$additionalDet20 === void 0 ? void 0 : _detail$additionalDet20.documents) && ["PENDING_FOR_FIELD_INSPECTION", "PENDING_FOR_BILLING_CLERK_REVIEW", "PENDING_FOR_ASO_APPROVAL", "PENDING_FOR_ZRO_APPROVAL", "PENDING_FOR_AE_APPROVAL", "PENDING_FOR_FINAL_PAYMENT", "CONNECTION_ACTIVATED"].includes(applicationData === null || applicationData === void 0 ? void 0 : applicationData.applicationStatus) && /*#__PURE__*/React.createElement(InspectionInformation, {
       applicationData: applicationData
     }), (detail === null || detail === void 0 ? void 0 : (_detail$additionalDet21 = detail.additionalDetails) === null || _detail$additionalDet21 === void 0 ? void 0 : _detail$additionalDet21.taxHeadEstimatesCalculation) && /*#__PURE__*/React.createElement(PropertyEstimates, {
       taxHeadEstimatesCalculation: detail === null || detail === void 0 ? void 0 : (_detail$additionalDet22 = detail.additionalDetails) === null || _detail$additionalDet22 === void 0 ? void 0 : _detail$additionalDet22.taxHeadEstimatesCalculation
@@ -45965,7 +45827,7 @@ const ApplicationDetails = props => {
 };
 
 const ApplicationDetails$1 = () => {
-  var _mdmsCommonmastersDat, _commonPayInfo, _applicationDetails$p4, _applicationDetails$p5, _applicationDetails$p6, _applicationDetails$p7, _applicationDetails$a3, _applicationDetails$a4, _applicationDetails$a5, _newValueFilter$, _applicationDetails$a6, _applicationDetails$a7, _applicationDetails$a8, _applicationDetails$a9, _workflowDetails$data, _workflowDetails$data2, _workflowDetails$data3, _workflowDetails$data4, _workflowDetails$data5, _workflowDetails$data6, _workflowDetails$data7, _workflowDetails$data8, _workflowDetails$data9, _workflowDetails$data0, _workflowDetails$data1, _workflowDetails$data10, _workflowDetails$data11, _workflowDetails$data12, _workflowDetails$data13, _workflowDetails$data14, _workflowDetails$data15, _workflowDetails$data16, _workflowDetails$data17, _workflowDetails$data18, _workflowDetails$data21, _workflowDetails$data22, _workflowDetails$data23, _workflowDetails$data24, _workflowDetails$data25, _workflowDetails$data26, _workflowDetails$data27, _workflowDetails$data28, _workflowDetails$data29, _workflowDetails$data30, _workflowDetails$data37, _workflowDetails$data38, _workflowDetails$data39, _oldData$WaterConnect, _oldData$WaterConnect2, _oldData$SewerageConn, _oldData$SewerageConn2, _applicationDetails$a18, _applicationDetails$a19, _reciept_data$Payment2, _applicationDetails$p11, _applicationDetails$p12, _applicationDetails$p13, _applicationDetails$p14, _applicationDetails$p15, _applicationDetails$p16;
+  var _mdmsCommonmastersDat, _commonPayInfo, _applicationDetails$p4, _applicationDetails$p5, _applicationDetails$p6, _applicationDetails$p7, _applicationDetails$a3, _applicationDetails$a4, _applicationDetails$a5, _newValueFilter$, _applicationDetails$a6, _applicationDetails$a7, _applicationDetails$a8, _applicationDetails$a9, _applicationDetails$p8, _applicationDetails$p9, _workflowDetails$data2, _workflowDetails$data3, _workflowDetails$data4, _workflowDetails$data5, _workflowDetails$data6, _workflowDetails$data7, _workflowDetails$data8, _workflowDetails$data9, _workflowDetails$data0, _workflowDetails$data1, _workflowDetails$data10, _workflowDetails$data11, _workflowDetails$data12, _workflowDetails$data13, _workflowDetails$data14, _workflowDetails$data15, _workflowDetails$data16, _workflowDetails$data17, _workflowDetails$data18, _workflowDetails$data19, _workflowDetails$data22, _workflowDetails$data23, _workflowDetails$data24, _workflowDetails$data25, _workflowDetails$data26, _workflowDetails$data27, _workflowDetails$data28, _workflowDetails$data29, _workflowDetails$data30, _workflowDetails$data31, _workflowDetails$data38, _workflowDetails$data39, _workflowDetails$data40, _oldData$WaterConnect, _oldData$WaterConnect2, _oldData$SewerageConn, _oldData$SewerageConn2, _applicationDetails$a18, _applicationDetails$a19, _reciept_data$Payment2, _applicationDetails$p14, _applicationDetails$p15, _applicationDetails$p16, _applicationDetails$p17, _applicationDetails$p18, _applicationDetails$p19;
   const getRecieptSearch = function (tenantId, payments, consumerCodes, receiptKey) {
     try {
       let response = null;
@@ -46124,7 +45986,37 @@ const ApplicationDetails$1 = () => {
   };
   let dowloadOptions = [],
     appStatus = (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a9 = applicationDetails.applicationData) === null || _applicationDetails$a9 === void 0 ? void 0 : _applicationDetails$a9.applicationStatus) || "";
-  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data = workflowDetails.data) === null || _workflowDetails$data === void 0 ? void 0 : (_workflowDetails$data2 = _workflowDetails$data.actionState) === null || _workflowDetails$data2 === void 0 ? void 0 : (_workflowDetails$data3 = _workflowDetails$data2.nextActions) === null || _workflowDetails$data3 === void 0 ? void 0 : _workflowDetails$data3.forEach(action => {
+  if (workflowDetails !== null && workflowDetails !== void 0 && workflowDetails.data && (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p8 = applicationDetails.processInstancesDetails) === null || _applicationDetails$p8 === void 0 ? void 0 : (_applicationDetails$p9 = _applicationDetails$p8[0]) === null || _applicationDetails$p9 === void 0 ? void 0 : _applicationDetails$p9.businessService) === "NewWS1" && appStatus === "PENDING_FOR_BILLING_CLERK_REVIEW") {
+    var _applicationDetails$p0, _workflowDetails$data;
+    const landArea = applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p0 = applicationDetails.propertyDetails) === null || _applicationDetails$p0 === void 0 ? void 0 : _applicationDetails$p0.landArea;
+    if ((_workflowDetails$data = workflowDetails.data.actionState) !== null && _workflowDetails$data !== void 0 && _workflowDetails$data.nextActions) {
+      workflowDetails.data.actionState.nextActions = workflowDetails.data.actionState.nextActions.filter(action => {
+        if (action.action === "VERIFY_AND_FORWARD") {
+          if (landArea && landArea >= 200) {
+            return action.state === "PENDING_FOR_AE_APPROVAL" || action.applicationStatus === "PENDING_FOR_AE_APPROVAL";
+          } else {
+            return action.state === "PENDING_FOR_ASO_APPROVAL" || action.applicationStatus === "PENDING_FOR_ASO_APPROVAL";
+          }
+        }
+        return true;
+      });
+    }
+    if (workflowDetails.data.nextActions) {
+      workflowDetails.data.nextActions = workflowDetails.data.nextActions.filter(action => {
+        if (action.action === "VERIFY_AND_FORWARD") {
+          var _action$state;
+          const targetStateCode = (_action$state = action.state) === null || _action$state === void 0 ? void 0 : _action$state.state;
+          if (landArea && landArea >= 200) {
+            return targetStateCode === "PENDING_FOR_AE_APPROVAL";
+          } else {
+            return targetStateCode === "PENDING_FOR_ASO_APPROVAL";
+          }
+        }
+        return true;
+      });
+    }
+  }
+  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data2 = workflowDetails.data) === null || _workflowDetails$data2 === void 0 ? void 0 : (_workflowDetails$data3 = _workflowDetails$data2.actionState) === null || _workflowDetails$data3 === void 0 ? void 0 : (_workflowDetails$data4 = _workflowDetails$data3.nextActions) === null || _workflowDetails$data4 === void 0 ? void 0 : _workflowDetails$data4.forEach(action => {
     if ((action === null || action === void 0 ? void 0 : action.action) === "ACTIVATE_CONNECTION") {
       action.redirectionUrll = {
         action: "ACTIVATE_CONNECTION",
@@ -46133,8 +46025,8 @@ const ApplicationDetails$1 = () => {
       };
     }
     if ((action === null || action === void 0 ? void 0 : action.action) === "RESUBMIT_APPLICATION") {
-      var _applicationDetails$p8, _servicesMasterData$w, _userConfig$, _userConfig$2;
-      let pathName = "/digit-ui/employee/ws/edit-application?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p8 = applicationDetails.propertyDetails) === null || _applicationDetails$p8 === void 0 ? void 0 : _applicationDetails$p8.propertyId);
+      var _applicationDetails$p1, _servicesMasterData$w, _userConfig$, _userConfig$2;
+      let pathName = "/digit-ui/employee/ws/edit-application?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p1 = applicationDetails.propertyDetails) === null || _applicationDetails$p1 === void 0 ? void 0 : _applicationDetails$p1.propertyId);
       const userConfig = (servicesMasterData === null || servicesMasterData === void 0 ? void 0 : (_servicesMasterData$w = servicesMasterData["ws-services-masters"]) === null || _servicesMasterData$w === void 0 ? void 0 : _servicesMasterData$w.WSEditApplicationByConfigUser) || [];
       const editApplicationUserRole = (userConfig === null || userConfig === void 0 ? void 0 : (_userConfig$ = userConfig[0]) === null || _userConfig$ === void 0 ? void 0 : _userConfig$.roles) || [];
       const mdmsApplicationStatus = userConfig === null || userConfig === void 0 ? void 0 : (_userConfig$2 = userConfig[0]) === null || _userConfig$2 === void 0 ? void 0 : _userConfig$2.status;
@@ -46144,8 +46036,8 @@ const ApplicationDetails$1 = () => {
         if (isFieldInspector) return false;else return true;
       });
       if (isFieldInspector && appStatus === mdmsApplicationStatus) {
-        var _applicationDetails$p9;
-        pathName = "/digit-ui/employee/ws/edit-application-by-config?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p9 = applicationDetails.propertyDetails) === null || _applicationDetails$p9 === void 0 ? void 0 : _applicationDetails$p9.propertyId);
+        var _applicationDetails$p10;
+        pathName = "/digit-ui/employee/ws/edit-application-by-config?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p10 = applicationDetails.propertyDetails) === null || _applicationDetails$p10 === void 0 ? void 0 : _applicationDetails$p10.propertyId);
       }
       action.redirectionUrll = {
         action: "ACTIVATE_CONNECTION",
@@ -46157,24 +46049,24 @@ const ApplicationDetails$1 = () => {
       };
     }
     if ((action === null || action === void 0 ? void 0 : action.action) === "SUBMIT_APPLICATION") {
-      var _applicationDetails$p0;
+      var _applicationDetails$p11;
       action.redirectionUrll = {
         action: "ACTIVATE_CONNECTION",
-        pathname: "/digit-ui/employee/ws/modify-application-edit?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p0 = applicationDetails.propertyDetails) === null || _applicationDetails$p0 === void 0 ? void 0 : _applicationDetails$p0.propertyId),
+        pathname: "/digit-ui/employee/ws/modify-application-edit?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p11 = applicationDetails.propertyDetails) === null || _applicationDetails$p11 === void 0 ? void 0 : _applicationDetails$p11.propertyId),
         state: applicationDetails
       };
     }
   });
-  if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data4 = workflowDetails.data) === null || _workflowDetails$data4 === void 0 ? void 0 : (_workflowDetails$data5 = _workflowDetails$data4.nextActions) === null || _workflowDetails$data5 === void 0 ? void 0 : _workflowDetails$data5.length) > 0 && (workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data6 = workflowDetails.data) === null || _workflowDetails$data6 === void 0 ? void 0 : (_workflowDetails$data7 = _workflowDetails$data6.actionState) === null || _workflowDetails$data7 === void 0 ? void 0 : (_workflowDetails$data8 = _workflowDetails$data7.nextActions) === null || _workflowDetails$data8 === void 0 ? void 0 : _workflowDetails$data8.length) > 0 && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data9 = workflowDetails.data) !== null && _workflowDetails$data9 !== void 0 && (_workflowDetails$data0 = _workflowDetails$data9.actionState) !== null && _workflowDetails$data0 !== void 0 && (_workflowDetails$data1 = _workflowDetails$data0.nextActions) !== null && _workflowDetails$data1 !== void 0 && _workflowDetails$data1.find(e => e.action === "EDIT")) && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data10 = workflowDetails.data) !== null && _workflowDetails$data10 !== void 0 && (_workflowDetails$data11 = _workflowDetails$data10.actionState) !== null && _workflowDetails$data11 !== void 0 && (_workflowDetails$data12 = _workflowDetails$data11.nextActions) !== null && _workflowDetails$data12 !== void 0 && _workflowDetails$data12.find(e => e.action === "RESUBMIT_APPLICATION")) && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data13 = workflowDetails.data) !== null && _workflowDetails$data13 !== void 0 && (_workflowDetails$data14 = _workflowDetails$data13.actionState) !== null && _workflowDetails$data14 !== void 0 && (_workflowDetails$data15 = _workflowDetails$data14.nextActions) !== null && _workflowDetails$data15 !== void 0 && _workflowDetails$data15.find(e => e.action === "ACTIVATE_CONNECTION")) && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data16 = workflowDetails.data) !== null && _workflowDetails$data16 !== void 0 && (_workflowDetails$data17 = _workflowDetails$data16.actionState) !== null && _workflowDetails$data17 !== void 0 && (_workflowDetails$data18 = _workflowDetails$data17.nextActions) !== null && _workflowDetails$data18 !== void 0 && _workflowDetails$data18.find(e => e.action === "SUBMIT_APPLICATION"))) {
-    var _workflowDetails$data19, _workflowDetails$data20;
-    workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data19 = workflowDetails.data) === null || _workflowDetails$data19 === void 0 ? void 0 : (_workflowDetails$data20 = _workflowDetails$data19.nextActions) === null || _workflowDetails$data20 === void 0 ? void 0 : _workflowDetails$data20.forEach(data => {
+  if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data5 = workflowDetails.data) === null || _workflowDetails$data5 === void 0 ? void 0 : (_workflowDetails$data6 = _workflowDetails$data5.nextActions) === null || _workflowDetails$data6 === void 0 ? void 0 : _workflowDetails$data6.length) > 0 && (workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data7 = workflowDetails.data) === null || _workflowDetails$data7 === void 0 ? void 0 : (_workflowDetails$data8 = _workflowDetails$data7.actionState) === null || _workflowDetails$data8 === void 0 ? void 0 : (_workflowDetails$data9 = _workflowDetails$data8.nextActions) === null || _workflowDetails$data9 === void 0 ? void 0 : _workflowDetails$data9.length) > 0 && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data0 = workflowDetails.data) !== null && _workflowDetails$data0 !== void 0 && (_workflowDetails$data1 = _workflowDetails$data0.actionState) !== null && _workflowDetails$data1 !== void 0 && (_workflowDetails$data10 = _workflowDetails$data1.nextActions) !== null && _workflowDetails$data10 !== void 0 && _workflowDetails$data10.find(e => e.action === "EDIT")) && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data11 = workflowDetails.data) !== null && _workflowDetails$data11 !== void 0 && (_workflowDetails$data12 = _workflowDetails$data11.actionState) !== null && _workflowDetails$data12 !== void 0 && (_workflowDetails$data13 = _workflowDetails$data12.nextActions) !== null && _workflowDetails$data13 !== void 0 && _workflowDetails$data13.find(e => e.action === "RESUBMIT_APPLICATION")) && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data14 = workflowDetails.data) !== null && _workflowDetails$data14 !== void 0 && (_workflowDetails$data15 = _workflowDetails$data14.actionState) !== null && _workflowDetails$data15 !== void 0 && (_workflowDetails$data16 = _workflowDetails$data15.nextActions) !== null && _workflowDetails$data16 !== void 0 && _workflowDetails$data16.find(e => e.action === "ACTIVATE_CONNECTION")) && !(workflowDetails !== null && workflowDetails !== void 0 && (_workflowDetails$data17 = workflowDetails.data) !== null && _workflowDetails$data17 !== void 0 && (_workflowDetails$data18 = _workflowDetails$data17.actionState) !== null && _workflowDetails$data18 !== void 0 && (_workflowDetails$data19 = _workflowDetails$data18.nextActions) !== null && _workflowDetails$data19 !== void 0 && _workflowDetails$data19.find(e => e.action === "SUBMIT_APPLICATION"))) {
+    var _workflowDetails$data20, _workflowDetails$data21;
+    workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data20 = workflowDetails.data) === null || _workflowDetails$data20 === void 0 ? void 0 : (_workflowDetails$data21 = _workflowDetails$data20.nextActions) === null || _workflowDetails$data21 === void 0 ? void 0 : _workflowDetails$data21.forEach(data => {
       if (data.action === "EDIT") workflowDetails.data.actionState.nextActions.push(data);
     });
   }
-  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data21 = workflowDetails.data) === null || _workflowDetails$data21 === void 0 ? void 0 : (_workflowDetails$data22 = _workflowDetails$data21.actionState) === null || _workflowDetails$data22 === void 0 ? void 0 : (_workflowDetails$data23 = _workflowDetails$data22.nextActions) === null || _workflowDetails$data23 === void 0 ? void 0 : _workflowDetails$data23.forEach(action => {
+  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data22 = workflowDetails.data) === null || _workflowDetails$data22 === void 0 ? void 0 : (_workflowDetails$data23 = _workflowDetails$data22.actionState) === null || _workflowDetails$data23 === void 0 ? void 0 : (_workflowDetails$data24 = _workflowDetails$data23.nextActions) === null || _workflowDetails$data24 === void 0 ? void 0 : _workflowDetails$data24.forEach(action => {
     if ((action === null || action === void 0 ? void 0 : action.action) === "EDIT") {
-      var _applicationDetails$p1, _servicesMasterData$w2, _userConfig$3, _userConfig$4;
-      let pathName = "/digit-ui/employee/ws/edit-application?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p1 = applicationDetails.propertyDetails) === null || _applicationDetails$p1 === void 0 ? void 0 : _applicationDetails$p1.propertyId);
+      var _applicationDetails$p12, _servicesMasterData$w2, _userConfig$3, _userConfig$4;
+      let pathName = "/digit-ui/employee/ws/edit-application?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p12 = applicationDetails.propertyDetails) === null || _applicationDetails$p12 === void 0 ? void 0 : _applicationDetails$p12.propertyId);
       const userConfig = (servicesMasterData === null || servicesMasterData === void 0 ? void 0 : (_servicesMasterData$w2 = servicesMasterData["ws-services-masters"]) === null || _servicesMasterData$w2 === void 0 ? void 0 : _servicesMasterData$w2.WSEditApplicationByConfigUser) || [];
       const editApplicationUserRole = (userConfig === null || userConfig === void 0 ? void 0 : (_userConfig$3 = userConfig[0]) === null || _userConfig$3 === void 0 ? void 0 : _userConfig$3.roles) || [];
       const mdmsApplicationStatus = userConfig === null || userConfig === void 0 ? void 0 : (_userConfig$4 = userConfig[0]) === null || _userConfig$4 === void 0 ? void 0 : _userConfig$4.status;
@@ -46184,8 +46076,8 @@ const ApplicationDetails$1 = () => {
         if (isFieldInspector) return false;else return true;
       });
       if (isFieldInspector && appStatus === mdmsApplicationStatus) {
-        var _applicationDetails$p10;
-        pathName = "/digit-ui/employee/ws/edit-application-by-config?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p10 = applicationDetails.propertyDetails) === null || _applicationDetails$p10 === void 0 ? void 0 : _applicationDetails$p10.propertyId);
+        var _applicationDetails$p13;
+        pathName = "/digit-ui/employee/ws/edit-application-by-config?applicationNumber=" + applicationNumber + "&service=" + serviceType + "&propertyId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p13 = applicationDetails.propertyDetails) === null || _applicationDetails$p13 === void 0 ? void 0 : _applicationDetails$p13.propertyId);
       }
       action.redirectionUrll = {
         action: "ACTIVATE_CONNECTION",
@@ -46197,27 +46089,27 @@ const ApplicationDetails$1 = () => {
       };
     }
   });
-  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data24 = workflowDetails.data) === null || _workflowDetails$data24 === void 0 ? void 0 : (_workflowDetails$data25 = _workflowDetails$data24.nextActions) === null || _workflowDetails$data25 === void 0 ? void 0 : _workflowDetails$data25.forEach(action => {
+  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data25 = workflowDetails.data) === null || _workflowDetails$data25 === void 0 ? void 0 : (_workflowDetails$data26 = _workflowDetails$data25.nextActions) === null || _workflowDetails$data26 === void 0 ? void 0 : _workflowDetails$data26.forEach(action => {
     if ((action === null || action === void 0 ? void 0 : action.action) === "VERIFY_AND_FORWARD" && appStatus === "PENDING_FOR_FIELD_INSPECTION" && !checkWSAdditionalDetails()) {
       action.isToast = true;
       action.toastMessage = "MISSING_ADDITIONAL_DETAILS";
     }
   });
-  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data26 = workflowDetails.data) === null || _workflowDetails$data26 === void 0 ? void 0 : (_workflowDetails$data27 = _workflowDetails$data26.actionState) === null || _workflowDetails$data27 === void 0 ? void 0 : (_workflowDetails$data28 = _workflowDetails$data27.nextActions) === null || _workflowDetails$data28 === void 0 ? void 0 : _workflowDetails$data28.forEach(action => {
+  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data27 = workflowDetails.data) === null || _workflowDetails$data27 === void 0 ? void 0 : (_workflowDetails$data28 = _workflowDetails$data27.actionState) === null || _workflowDetails$data28 === void 0 ? void 0 : (_workflowDetails$data29 = _workflowDetails$data28.nextActions) === null || _workflowDetails$data29 === void 0 ? void 0 : _workflowDetails$data29.forEach(action => {
     if ((action === null || action === void 0 ? void 0 : action.action) === "VERIFY_AND_FORWARD" && appStatus === "PENDING_FOR_FIELD_INSPECTION" && !checkWSAdditionalDetails()) {
       action.isToast = true;
       action.toastMessage = "MISSING_ADDITIONAL_DETAILS";
     }
   });
-  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data29 = workflowDetails.data) === null || _workflowDetails$data29 === void 0 ? void 0 : (_workflowDetails$data30 = _workflowDetails$data29.nextActions) === null || _workflowDetails$data30 === void 0 ? void 0 : _workflowDetails$data30.forEach(action => {
+  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data30 = workflowDetails.data) === null || _workflowDetails$data30 === void 0 ? void 0 : (_workflowDetails$data31 = _workflowDetails$data30.nextActions) === null || _workflowDetails$data31 === void 0 ? void 0 : _workflowDetails$data31.forEach(action => {
     if ((action === null || action === void 0 ? void 0 : action.action) === "PAY") {
-      var _workflowDetails$data31, _workflowDetails$data32, _workflowDetails$data33, _workflowDetails$data34, _workflowDetails$data35, _workflowDetails$data36;
-      if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data31 = workflowDetails.data) === null || _workflowDetails$data31 === void 0 ? void 0 : (_workflowDetails$data32 = _workflowDetails$data31.processInstances) === null || _workflowDetails$data32 === void 0 ? void 0 : (_workflowDetails$data33 = _workflowDetails$data32[0]) === null || _workflowDetails$data33 === void 0 ? void 0 : _workflowDetails$data33.businessService) === "WSReconnection") {
+      var _workflowDetails$data32, _workflowDetails$data33, _workflowDetails$data34, _workflowDetails$data35, _workflowDetails$data36, _workflowDetails$data37;
+      if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data32 = workflowDetails.data) === null || _workflowDetails$data32 === void 0 ? void 0 : (_workflowDetails$data33 = _workflowDetails$data32.processInstances) === null || _workflowDetails$data33 === void 0 ? void 0 : (_workflowDetails$data34 = _workflowDetails$data33[0]) === null || _workflowDetails$data34 === void 0 ? void 0 : _workflowDetails$data34.businessService) === "WSReconnection") {
         action.redirectionUrll = {
           pathname: "WSReconnection/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo) + "/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "?tenantId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "&ISWSAPP&applicationNumber=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo),
           state: applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId
         };
-      } else if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data34 = workflowDetails.data) === null || _workflowDetails$data34 === void 0 ? void 0 : (_workflowDetails$data35 = _workflowDetails$data34.processInstances) === null || _workflowDetails$data35 === void 0 ? void 0 : (_workflowDetails$data36 = _workflowDetails$data35[0]) === null || _workflowDetails$data36 === void 0 ? void 0 : _workflowDetails$data36.businessService) === "SWReconnection") {
+      } else if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data35 = workflowDetails.data) === null || _workflowDetails$data35 === void 0 ? void 0 : (_workflowDetails$data36 = _workflowDetails$data35.processInstances) === null || _workflowDetails$data36 === void 0 ? void 0 : (_workflowDetails$data37 = _workflowDetails$data36[0]) === null || _workflowDetails$data37 === void 0 ? void 0 : _workflowDetails$data37.businessService) === "SWReconnection") {
         action.redirectionUrll = {
           pathname: "SWReconnection/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo) + "/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "?tenantId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "&ISWSAPP&applicationNumber=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo),
           state: applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId
@@ -46230,15 +46122,15 @@ const ApplicationDetails$1 = () => {
       }
     }
   });
-  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data37 = workflowDetails.data) === null || _workflowDetails$data37 === void 0 ? void 0 : (_workflowDetails$data38 = _workflowDetails$data37.actionState) === null || _workflowDetails$data38 === void 0 ? void 0 : (_workflowDetails$data39 = _workflowDetails$data38.nextActions) === null || _workflowDetails$data39 === void 0 ? void 0 : _workflowDetails$data39.forEach(action => {
+  workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data38 = workflowDetails.data) === null || _workflowDetails$data38 === void 0 ? void 0 : (_workflowDetails$data39 = _workflowDetails$data38.actionState) === null || _workflowDetails$data39 === void 0 ? void 0 : (_workflowDetails$data40 = _workflowDetails$data39.nextActions) === null || _workflowDetails$data40 === void 0 ? void 0 : _workflowDetails$data40.forEach(action => {
     if ((action === null || action === void 0 ? void 0 : action.action) === "PAY") {
-      var _workflowDetails$data40, _workflowDetails$data41, _workflowDetails$data42, _workflowDetails$data43, _workflowDetails$data44, _workflowDetails$data45;
-      if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data40 = workflowDetails.data) === null || _workflowDetails$data40 === void 0 ? void 0 : (_workflowDetails$data41 = _workflowDetails$data40.processInstances) === null || _workflowDetails$data41 === void 0 ? void 0 : (_workflowDetails$data42 = _workflowDetails$data41[0]) === null || _workflowDetails$data42 === void 0 ? void 0 : _workflowDetails$data42.businessService) === "WSReconnection") {
+      var _workflowDetails$data41, _workflowDetails$data42, _workflowDetails$data43, _workflowDetails$data44, _workflowDetails$data45, _workflowDetails$data46;
+      if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data41 = workflowDetails.data) === null || _workflowDetails$data41 === void 0 ? void 0 : (_workflowDetails$data42 = _workflowDetails$data41.processInstances) === null || _workflowDetails$data42 === void 0 ? void 0 : (_workflowDetails$data43 = _workflowDetails$data42[0]) === null || _workflowDetails$data43 === void 0 ? void 0 : _workflowDetails$data43.businessService) === "WSReconnection") {
         action.redirectionUrll = {
           pathname: "WSReconnection/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo) + "/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "?tenantId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "&ISWSAPP&applicationNumber=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo),
           state: applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId
         };
-      } else if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data43 = workflowDetails.data) === null || _workflowDetails$data43 === void 0 ? void 0 : (_workflowDetails$data44 = _workflowDetails$data43.processInstances) === null || _workflowDetails$data44 === void 0 ? void 0 : (_workflowDetails$data45 = _workflowDetails$data44[0]) === null || _workflowDetails$data45 === void 0 ? void 0 : _workflowDetails$data45.businessService) === "SWReconnection") {
+      } else if ((workflowDetails === null || workflowDetails === void 0 ? void 0 : (_workflowDetails$data44 = workflowDetails.data) === null || _workflowDetails$data44 === void 0 ? void 0 : (_workflowDetails$data45 = _workflowDetails$data44.processInstances) === null || _workflowDetails$data45 === void 0 ? void 0 : (_workflowDetails$data46 = _workflowDetails$data45[0]) === null || _workflowDetails$data46 === void 0 ? void 0 : _workflowDetails$data46.businessService) === "SWReconnection") {
         action.redirectionUrll = {
           pathname: "SWReconnection/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo) + "/" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "?tenantId=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId) + "&ISWSAPP&applicationNumber=" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationNo),
           state: applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.tenantId
@@ -46408,12 +46300,12 @@ const ApplicationDetails$1 = () => {
     mutate: mutate,
     id: "timeline",
     workflowDetails: workflowDetails,
-    businessService: applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p11 = applicationDetails.processInstancesDetails) === null || _applicationDetails$p11 === void 0 ? void 0 : (_applicationDetails$p12 = _applicationDetails$p11[0]) === null || _applicationDetails$p12 === void 0 ? void 0 : (_applicationDetails$p13 = _applicationDetails$p12.businessService) === null || _applicationDetails$p13 === void 0 ? void 0 : _applicationDetails$p13.toUpperCase(),
+    businessService: applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p14 = applicationDetails.processInstancesDetails) === null || _applicationDetails$p14 === void 0 ? void 0 : (_applicationDetails$p15 = _applicationDetails$p14[0]) === null || _applicationDetails$p15 === void 0 ? void 0 : (_applicationDetails$p16 = _applicationDetails$p15.businessService) === null || _applicationDetails$p16 === void 0 ? void 0 : _applicationDetails$p16.toUpperCase(),
     moduleCode: "WS",
     showToast: showToast,
     setShowToast: setShowToast,
     closeToast: closeToast,
-    timelineStatusPrefix: "WF_" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p14 = applicationDetails.processInstancesDetails) === null || _applicationDetails$p14 === void 0 ? void 0 : (_applicationDetails$p15 = _applicationDetails$p14[0]) === null || _applicationDetails$p15 === void 0 ? void 0 : (_applicationDetails$p16 = _applicationDetails$p15.businessService) === null || _applicationDetails$p16 === void 0 ? void 0 : _applicationDetails$p16.toUpperCase()) + "_",
+    timelineStatusPrefix: "WF_" + (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$p17 = applicationDetails.processInstancesDetails) === null || _applicationDetails$p17 === void 0 ? void 0 : (_applicationDetails$p18 = _applicationDetails$p17[0]) === null || _applicationDetails$p18 === void 0 ? void 0 : (_applicationDetails$p19 = _applicationDetails$p18.businessService) === null || _applicationDetails$p19 === void 0 ? void 0 : _applicationDetails$p19.toUpperCase()) + "_",
     oldValue: res,
     isInfoLabel: checkforPrivacyenablement(),
     clearDataDetails: clearDataDetails,
@@ -46736,17 +46628,7 @@ const GetConnectionDetails = () => {
     style: {
       display: "flex"
     }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      width: "80%"
-    }
-  }, /*#__PURE__*/React.createElement(Header, {
-    styles: {
-      marginLeft: "0px",
-      paddingTop: "10px",
-      fontSize: "32px"
-    }
-  }, t("WS_CONNECTION_DETAILS"))), dowloadOptions && dowloadOptions.length > 0 && /*#__PURE__*/React.createElement("div", {
+  }, dowloadOptions && dowloadOptions.length > 0 && /*#__PURE__*/React.createElement("div", {
     style: {
       maxWidth: "100% !imnportant",
       zIndex: "10"
@@ -46873,7 +46755,6 @@ const ActivateConnection = () => {
     isAppDetailsPage = _useState5[0],
     setIsAppDetailsPage = _useState5[1];
   const _React$useState = React.useState({
-      head: "",
       body: []
     }),
     config = _React$useState[0],
@@ -46906,7 +46787,7 @@ const ActivateConnection = () => {
     } : "",
     waterSource: (_state7 = state) !== null && _state7 !== void 0 && (_state7$data = _state7.data) !== null && _state7$data !== void 0 && _state7$data.waterSource ? {
       code: (_state8 = state) === null || _state8 === void 0 ? void 0 : (_state8$data = _state8.data) === null || _state8$data === void 0 ? void 0 : _state8$data.waterSource,
-      i18nKey: "WS_SERVICES_MASTERS_WATERSOURCE_" + stringReplaceAll((_state9 = state) === null || _state9 === void 0 ? void 0 : (_state9$data = _state9.data) === null || _state9$data === void 0 ? void 0 : (_state9$data$waterSou = _state9$data.waterSource) === null || _state9$data$waterSou === void 0 ? void 0 : (_state9$data$waterSou2 = _state9$data$waterSou.split('.')[0]) === null || _state9$data$waterSou2 === void 0 ? void 0 : _state9$data$waterSou2.toUpperCase(), " ", "_")
+      i18nKey: "WS_SERVICES_MASTERS_WATERSOURCE_" + stringReplaceAll((_state9 = state) === null || _state9 === void 0 ? void 0 : (_state9$data = _state9.data) === null || _state9$data === void 0 ? void 0 : (_state9$data$waterSou = _state9$data.waterSource) === null || _state9$data$waterSou === void 0 ? void 0 : (_state9$data$waterSou2 = _state9$data$waterSou.split(".")[0]) === null || _state9$data$waterSou2 === void 0 ? void 0 : _state9$data$waterSou2.toUpperCase(), " ", "_")
     } : "",
     sourceSubData: (_state0 = state) !== null && _state0 !== void 0 && (_state0$data = _state0.data) !== null && _state0$data !== void 0 && _state0$data.waterSource ? {
       code: (_state1 = state) === null || _state1 === void 0 ? void 0 : (_state1$data = _state1.data) === null || _state1$data === void 0 ? void 0 : _state1$data.waterSource,
@@ -46955,9 +46836,18 @@ const ActivateConnection = () => {
   }, []);
   useEffect(() => {
     if (!isLoading && newConfig && Array.isArray(newConfig)) {
-      const config = newConfig.find(conf => conf.hideInCitizen);
-      if (config) {
-        setConfig(config);
+      const configObj = newConfig.find(conf => conf.hideInCitizen);
+      if (configObj && configObj.body) {
+        let flattenedBody = [];
+        configObj.body.forEach(section => {
+          if (section.body && Array.isArray(section.body)) {
+            flattenedBody = [...flattenedBody, ...section.body];
+          }
+        });
+        setConfig([{
+          head: "WF_EMPLOYEE_NEWSW1_ACTIVATE_CONNECTION",
+          body: flattenedBody
+        }]);
       }
     }
   }, [newConfig]);
@@ -47090,19 +46980,37 @@ const ActivateConnection = () => {
   if (isEnableLoader || isLoading || isappdetailsLoading) {
     return /*#__PURE__*/React.createElement(Loader, null);
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormComposer, {
-    config: config.body,
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "employee-form-section-wrapper"
+  }, /*#__PURE__*/React.createElement(VerticalTimeline, {
+    config: [{
+      timeLine: [{
+        actions: t("WF_EMPLOYEE_NEWSW1_ACTIVATE_CONNECTION"),
+        currentStep: 1
+      }]
+    }],
+    showFinalStep: false
+  }), /*#__PURE__*/React.createElement(FormComposer, {
+    config: config.map(config => {
+      return _extends({}, config, {
+        isCollapsible: true,
+        isDefaultOpen: true,
+        body: config.body
+      });
+    }),
     userType: "employee",
     defaultValues: defaultValues,
     onSubmit: onSubmit,
     label: t("WF_EMPLOYEE_NEWSW1_ACTIVATE_CONNECTION"),
-    onFormValueChange: onFormValueChange
+    onFormValueChange: onFormValueChange,
+    noBreakLine: true,
+    noCard: true
   }), showToast && /*#__PURE__*/React.createElement(Toast, {
     error: showToast.key,
     label: t(showToast === null || showToast === void 0 ? void 0 : showToast.message),
     warning: showToast === null || showToast === void 0 ? void 0 : showToast.warning,
     onClose: closeToast
-  }));
+  })));
 };
 
 const ApplicationDetailsBillAmendment = () => {
@@ -47613,7 +47521,7 @@ const EditApplication$1 = () => {
 };
 
 const ConsumptionDetails = _ref => {
-  var _user$info, _mdmsBillingPeriod$Md, _mdmsBillingPeriod$Md2, _mdmsMeterStatus$Mdms, _mdmsMeterStatus$Mdms2, _details$4, _details$5;
+  var _user$info, _mdmsBillingPeriod$Md, _mdmsBillingPeriod$Md2, _mdmsBillingPeriod$Md3, _mdmsMeterStatus$Mdms, _mdmsMeterStatus$Mdms2, _mdmsMeterStatus$Mdms3, _details$4, _details$5;
   const _useTranslation = useTranslation(),
     t = _useTranslation.t;
   const user = Digit.UserService.getUser();
@@ -47717,7 +47625,7 @@ const ConsumptionDetails = _ref => {
       return dateString;
     }
   };
-  const getBillingPeriodFromMdms = mdmsBillingPeriod === null || mdmsBillingPeriod === void 0 ? void 0 : (_mdmsBillingPeriod$Md = mdmsBillingPeriod.MdmsRes) === null || _mdmsBillingPeriod$Md === void 0 ? void 0 : (_mdmsBillingPeriod$Md2 = _mdmsBillingPeriod$Md["ws-services-masters"]) === null || _mdmsBillingPeriod$Md2 === void 0 ? void 0 : _mdmsBillingPeriod$Md2.billingPeriod.filter(e => e.connectionType === "Metered");
+  const getBillingPeriodFromMdms = mdmsBillingPeriod === null || mdmsBillingPeriod === void 0 ? void 0 : (_mdmsBillingPeriod$Md = mdmsBillingPeriod.MdmsRes) === null || _mdmsBillingPeriod$Md === void 0 ? void 0 : (_mdmsBillingPeriod$Md2 = _mdmsBillingPeriod$Md["ws-services-masters"]) === null || _mdmsBillingPeriod$Md2 === void 0 ? void 0 : (_mdmsBillingPeriod$Md3 = _mdmsBillingPeriod$Md2.billingPeriod) === null || _mdmsBillingPeriod$Md3 === void 0 ? void 0 : _mdmsBillingPeriod$Md3.filter(e => e.connectionType === "Metered");
   const popUp = () => {
     var _response$meterReadin, _response$meterReadin2;
     setOpenModal(true);
@@ -47823,7 +47731,7 @@ const ConsumptionDetails = _ref => {
       return Promise.reject(e);
     }
   };
-  let optionsList = mdmsMeterStatus === null || mdmsMeterStatus === void 0 ? void 0 : (_mdmsMeterStatus$Mdms = mdmsMeterStatus.MdmsRes) === null || _mdmsMeterStatus$Mdms === void 0 ? void 0 : (_mdmsMeterStatus$Mdms2 = _mdmsMeterStatus$Mdms["ws-services-calculation"]) === null || _mdmsMeterStatus$Mdms2 === void 0 ? void 0 : _mdmsMeterStatus$Mdms2.MeterStatus.map(status => ({
+  let optionsList = mdmsMeterStatus === null || mdmsMeterStatus === void 0 ? void 0 : (_mdmsMeterStatus$Mdms = mdmsMeterStatus.MdmsRes) === null || _mdmsMeterStatus$Mdms === void 0 ? void 0 : (_mdmsMeterStatus$Mdms2 = _mdmsMeterStatus$Mdms["ws-services-calculation"]) === null || _mdmsMeterStatus$Mdms2 === void 0 ? void 0 : (_mdmsMeterStatus$Mdms3 = _mdmsMeterStatus$Mdms2.MeterStatus) === null || _mdmsMeterStatus$Mdms3 === void 0 ? void 0 : _mdmsMeterStatus$Mdms3.map(status => ({
     code: status,
     i18nKey: "WS_SERVICES_CALCULATION_METERSTATUS_" + Digit.Utils.locale.getTransformedLocale(status)
   }));