@djb25/digit-ui-module-ws 1.0.77 → 1.0.78

package/dist/index.modern.js

@@ -1593,19 +1593,59 @@ const convertApplicationData = function (data, serviceType, modify, editByConfig
   sessionStorage.setItem("WS_EDIT_APPLICATION_DETAILS", JSON.stringify(data));
   return payload;
 };
+const mapExistingDocIdsToPayload = function (uploadingDocs, existingDocs) {
+  if (uploadingDocs === void 0) {
+    uploadingDocs = [];
+  }
+  if (existingDocs === void 0) {
+    existingDocs = [];
+  }
+  if (!Array.isArray(uploadingDocs) || uploadingDocs.length === 0) return uploadingDocs;
+  if (!Array.isArray(existingDocs) || existingDocs.length === 0) return uploadingDocs;
+  return uploadingDocs.map(doc => {
+    if (doc !== null && doc !== void 0 && doc.id) return doc;
+    const uploadType = doc === null || doc === void 0 ? void 0 : doc.documentType;
+    if (!uploadType) return doc;
+    const normUpload = String(uploadType).trim().toUpperCase();
+    const uploadParts = normUpload.split(".");
+    const uploadCode = uploadParts[uploadParts.length - 1];
+    const matchedDoc = existingDocs.find(exDoc => {
+      if (!(exDoc !== null && exDoc !== void 0 && exDoc.id) || !(exDoc !== null && exDoc !== void 0 && exDoc.documentType)) return false;
+      const normExisting = String(exDoc.documentType).trim().toUpperCase();
+      const existingParts = normExisting.split(".");
+      const existingCode = existingParts[existingParts.length - 1];
+      if (normExisting === normUpload) return true;
+      if (existingCode === uploadCode) return true;
+      if (normExisting.endsWith("." + normUpload) || normUpload.endsWith("." + normExisting)) return true;
+      if (normExisting.includes(normUpload) || normUpload.includes(normExisting)) return true;
+      return false;
+    });
+    if (matchedDoc && matchedDoc.id) {
+      return _extends({}, doc, {
+        id: matchedDoc.id
+      });
+    }
+    return doc;
+  });
+};
 const convertEditApplicationDetails = function (data, appData, actionData) {
   try {
-    var _data$cpt30, _data$cpt30$details, _data$cpt30$details$o, _data$cpt31, _data$cpt31$details, _data$ConnectionDetai3, _data$ConnectionDetai4, _data$ConnectionDetai5, _data$ConnectionDetai6, _data$ConnectionDetai7, _data$ConnectionDetai8, _data$ConnectionDetai9, _data$ConnectionDetai0, _data$ConnectionDetai1, _data$ConnectionDetai10, _data$ConnectionDetai11, _data$ConnectionDetai12, _data$ConnectionDetai13, _data$ConnectionDetai14, _data$ConnectionDetai15, _data$ConnectionDetai16, _data$ConnectionDetai17, _data$ConnectionDetai18, _data$ConnectionHolde58, _data$ConnectionHolde59, _appData$applicationD, _appData$applicationD2, _data$ConnectionHolde60, _data$ConnectionHolde61, _data$ConnectionHolde62, _data$ConnectionHolde63, _data$ConnectionHolde64, _data$ConnectionHolde65, _data$ConnectionHolde66, _data$ConnectionHolde67, _data$ConnectionHolde68, _data$ConnectionHolde69, _data$ConnectionHolde70, _data$ConnectionHolde71, _data$ConnectionHolde72, _data$ConnectionHolde73, _data$ConnectionHolde74, _data$ConnectionHolde75, _data$ConnectionHolde76, _data$ConnectionHolde77, _data$ConnectionHolde78, _data$ConnectionHolde79, _data$ConnectionHolde80, _data$ConnectionHolde81, _data$ConnectionHolde82, _data$ConnectionHolde83, _data$ConnectionHolde84, _data$ConnectionHolde85, _data$ConnectionHolde86, _data$cpt32, _data$DocumentsRequir;
+    var _data$cpt30, _data$cpt30$details, _data$cpt30$details$o, _appData$applicationD, _data$DocumentsRequir, _data$cpt31, _data$cpt31$details, _data$ConnectionDetai3, _data$ConnectionDetai4, _data$ConnectionDetai5, _data$ConnectionDetai6, _data$ConnectionDetai7, _data$ConnectionDetai8, _data$ConnectionDetai9, _data$ConnectionDetai0, _data$ConnectionDetai1, _data$ConnectionDetai10, _data$ConnectionDetai11, _data$ConnectionDetai12, _data$ConnectionDetai13, _data$ConnectionDetai14, _data$ConnectionDetai15, _data$ConnectionDetai16, _data$ConnectionDetai17, _data$ConnectionDetai18, _data$ConnectionHolde58, _data$ConnectionHolde59, _appData$applicationD2, _appData$applicationD3, _data$ConnectionHolde60, _data$ConnectionHolde61, _data$ConnectionHolde62, _data$ConnectionHolde63, _data$ConnectionHolde64, _data$ConnectionHolde65, _data$ConnectionHolde66, _data$ConnectionHolde67, _data$ConnectionHolde68, _data$ConnectionHolde69, _data$ConnectionHolde70, _data$ConnectionHolde71, _data$ConnectionHolde72, _data$ConnectionHolde73, _data$ConnectionHolde74, _data$ConnectionHolde75, _data$ConnectionHolde76, _data$ConnectionHolde77, _data$ConnectionHolde78, _data$ConnectionHolde79, _data$ConnectionHolde80, _data$ConnectionHolde81, _data$ConnectionHolde82, _data$ConnectionHolde83, _data$ConnectionHolde84, _data$ConnectionHolde85, _data$ConnectionHolde86, _data$cpt32;
     data === null || data === void 0 ? void 0 : (_data$cpt30 = data.cpt) === null || _data$cpt30 === void 0 ? void 0 : (_data$cpt30$details = _data$cpt30.details) === null || _data$cpt30$details === void 0 ? void 0 : (_data$cpt30$details$o = _data$cpt30$details.owners) === null || _data$cpt30$details$o === void 0 ? void 0 : _data$cpt30$details$o.forEach(owner => {
       if (owner !== null && owner !== void 0 && owner.permanentAddress) owner.correspondenceAddress = owner === null || owner === void 0 ? void 0 : owner.permanentAddress;
     });
+    const existingDocs = (appData === null || appData === void 0 ? void 0 : (_appData$applicationD = appData.applicationData) === null || _appData$applicationD === void 0 ? void 0 : _appData$applicationD.documents) || (appData === null || appData === void 0 ? void 0 : appData.documents) || [];
+    let docs = (data === null || data === void 0 ? void 0 : (_data$DocumentsRequir = data.DocumentsRequired) === null || _data$DocumentsRequir === void 0 ? void 0 : _data$DocumentsRequir.documents) || [];
+    if (docs && docs.length > 0 && existingDocs && existingDocs.length > 0) {
+      docs = mapExistingDocIdsToPayload(docs, existingDocs);
+    }
     let payload = _extends({}, appData.applicationData, {
       propertyId: data === null || data === void 0 ? void 0 : (_data$cpt31 = data.cpt) === null || _data$cpt31 === void 0 ? void 0 : (_data$cpt31$details = _data$cpt31.details) === null || _data$cpt31$details === void 0 ? void 0 : _data$cpt31$details.propertyId,
       proposedTaps: (data === null || data === void 0 ? void 0 : (_data$ConnectionDetai3 = data.ConnectionDetails) === null || _data$ConnectionDetai3 === void 0 ? void 0 : (_data$ConnectionDetai4 = _data$ConnectionDetai3[0]) === null || _data$ConnectionDetai4 === void 0 ? void 0 : _data$ConnectionDetai4.proposedTaps) && Number(data === null || data === void 0 ? void 0 : (_data$ConnectionDetai5 = data.ConnectionDetails) === null || _data$ConnectionDetai5 === void 0 ? void 0 : (_data$ConnectionDetai6 = _data$ConnectionDetai5[0]) === null || _data$ConnectionDetai6 === void 0 ? void 0 : _data$ConnectionDetai6.proposedTaps),
       proposedPipeSize: (data === null || data === void 0 ? void 0 : (_data$ConnectionDetai7 = data.ConnectionDetails) === null || _data$ConnectionDetai7 === void 0 ? void 0 : (_data$ConnectionDetai8 = _data$ConnectionDetai7[0]) === null || _data$ConnectionDetai8 === void 0 ? void 0 : (_data$ConnectionDetai9 = _data$ConnectionDetai8.proposedPipeSize) === null || _data$ConnectionDetai9 === void 0 ? void 0 : _data$ConnectionDetai9.size) && Number(data === null || data === void 0 ? void 0 : (_data$ConnectionDetai0 = data.ConnectionDetails) === null || _data$ConnectionDetai0 === void 0 ? void 0 : (_data$ConnectionDetai1 = _data$ConnectionDetai0[0]) === null || _data$ConnectionDetai1 === void 0 ? void 0 : (_data$ConnectionDetai10 = _data$ConnectionDetai1.proposedPipeSize) === null || _data$ConnectionDetai10 === void 0 ? void 0 : _data$ConnectionDetai10.size),
       proposedWaterClosets: (data === null || data === void 0 ? void 0 : (_data$ConnectionDetai11 = data.ConnectionDetails) === null || _data$ConnectionDetai11 === void 0 ? void 0 : (_data$ConnectionDetai12 = _data$ConnectionDetai11[0]) === null || _data$ConnectionDetai12 === void 0 ? void 0 : _data$ConnectionDetai12.proposedWaterClosets) && Number(data === null || data === void 0 ? void 0 : (_data$ConnectionDetai13 = data.ConnectionDetails) === null || _data$ConnectionDetai13 === void 0 ? void 0 : (_data$ConnectionDetai14 = _data$ConnectionDetai13[0]) === null || _data$ConnectionDetai14 === void 0 ? void 0 : _data$ConnectionDetai14.proposedWaterClosets),
       proposedToilets: (data === null || data === void 0 ? void 0 : (_data$ConnectionDetai15 = data.ConnectionDetails) === null || _data$ConnectionDetai15 === void 0 ? void 0 : (_data$ConnectionDetai16 = _data$ConnectionDetai15[0]) === null || _data$ConnectionDetai16 === void 0 ? void 0 : _data$ConnectionDetai16.proposedToilets) && Number(data === null || data === void 0 ? void 0 : (_data$ConnectionDetai17 = data.ConnectionDetails) === null || _data$ConnectionDetai17 === void 0 ? void 0 : (_data$ConnectionDetai18 = _data$ConnectionDetai17[0]) === null || _data$ConnectionDetai18 === void 0 ? void 0 : _data$ConnectionDetai18.proposedToilets),
-      connectionHolders: !(data !== null && data !== void 0 && (_data$ConnectionHolde58 = data.ConnectionHolderDetails) !== null && _data$ConnectionHolde58 !== void 0 && (_data$ConnectionHolde59 = _data$ConnectionHolde58[0]) !== null && _data$ConnectionHolde59 !== void 0 && _data$ConnectionHolde59.sameAsOwnerDetails) ? [_extends({}, appData === null || appData === void 0 ? void 0 : (_appData$applicationD = appData.applicationData) === null || _appData$applicationD === void 0 ? void 0 : (_appData$applicationD2 = _appData$applicationD.connectionHolders) === null || _appData$applicationD2 === void 0 ? void 0 : _appData$applicationD2[0], {
+      connectionHolders: !(data !== null && data !== void 0 && (_data$ConnectionHolde58 = data.ConnectionHolderDetails) !== null && _data$ConnectionHolde58 !== void 0 && (_data$ConnectionHolde59 = _data$ConnectionHolde58[0]) !== null && _data$ConnectionHolde59 !== void 0 && _data$ConnectionHolde59.sameAsOwnerDetails) ? [_extends({}, appData === null || appData === void 0 ? void 0 : (_appData$applicationD2 = appData.applicationData) === null || _appData$applicationD2 === void 0 ? void 0 : (_appData$applicationD3 = _appData$applicationD2.connectionHolders) === null || _appData$applicationD3 === void 0 ? void 0 : _appData$applicationD3[0], {
         correspondenceAddress: (data === null || data === void 0 ? void 0 : (_data$ConnectionHolde60 = data.ConnectionHolderDetails) === null || _data$ConnectionHolde60 === void 0 ? void 0 : (_data$ConnectionHolde61 = _data$ConnectionHolde60[0]) === null || _data$ConnectionHolde61 === void 0 ? void 0 : _data$ConnectionHolde61.address) || "",
         fatherOrHusbandName: (data === null || data === void 0 ? void 0 : (_data$ConnectionHolde62 = data.ConnectionHolderDetails) === null || _data$ConnectionHolde62 === void 0 ? void 0 : (_data$ConnectionHolde63 = _data$ConnectionHolde62[0]) === null || _data$ConnectionHolde63 === void 0 ? void 0 : _data$ConnectionHolde63.guardian) || "",
         gender: (data === null || data === void 0 ? void 0 : (_data$ConnectionHolde64 = data.ConnectionHolderDetails) === null || _data$ConnectionHolde64 === void 0 ? void 0 : (_data$ConnectionHolde65 = _data$ConnectionHolde64[0]) === null || _data$ConnectionHolde65 === void 0 ? void 0 : (_data$ConnectionHolde66 = _data$ConnectionHolde65.gender) === null || _data$ConnectionHolde66 === void 0 ? void 0 : _data$ConnectionHolde66.code) || "",
@@ -1624,7 +1664,7 @@ const convertEditApplicationDetails = function (data, appData, actionData) {
         action: actionData ? actionData : "RESUBMIT_APPLICATION"
       },
       action: actionData ? actionData : "RESUBMIT_APPLICATION",
-      documents: data === null || data === void 0 ? void 0 : (_data$DocumentsRequir = data.DocumentsRequired) === null || _data$DocumentsRequir === void 0 ? void 0 : _data$DocumentsRequir.documents
+      documents: docs
     });
     return Promise.resolve(payload);
   } catch (e) {
@@ -1687,13 +1727,13 @@ const convertDisonnectApplicationData = function (data, serviceType, editByConfi
 };
 const convertDisonnectEditApplicationDetails = function (data, appData, actionData) {
   try {
-    var _data$plumberDetails7, _data$plumberDetails8, _data$plumberDetails9, _data$plumberDetails0, _data$plumberDetails1, _data$plumberDetails10, _appData$applicationD5, _appData$applicationD6, _appData$applicationD7, _data$disConnectionDe, _data$disConnectionDe2, _data$disConnectionDe3, _data$disConnectionDe4, _data$DocumentsRequir2, _data$disConnectionDe5, _data$disConnectionDe6;
+    var _data$plumberDetails7, _data$plumberDetails8, _data$plumberDetails9, _data$plumberDetails0, _data$plumberDetails1, _data$plumberDetails10, _appData$applicationD6, _appData$applicationD7, _appData$applicationD8, _data$disConnectionDe, _data$disConnectionDe2, _data$disConnectionDe3, _data$disConnectionDe4, _data$DocumentsRequir2, _data$disConnectionDe5, _data$disConnectionDe6;
     const docs = sessionStorage.getItem("DISCONNECTION_EDIT_DOCS");
     const docsData = docs ? JSON.parse(docs) : "";
     const documentsData = [];
     docsData === null || docsData === void 0 ? void 0 : docsData.map(data => {
-      var _appData$applicationD3, _appData$applicationD4, _doc$, _doc$2;
-      const doc = appData === null || appData === void 0 ? void 0 : (_appData$applicationD3 = appData.applicationData) === null || _appData$applicationD3 === void 0 ? void 0 : (_appData$applicationD4 = _appData$applicationD3.documents) === null || _appData$applicationD4 === void 0 ? void 0 : _appData$applicationD4.filter(appDoc => {
+      var _appData$applicationD4, _appData$applicationD5, _doc$, _doc$2;
+      const doc = appData === null || appData === void 0 ? void 0 : (_appData$applicationD4 = appData.applicationData) === null || _appData$applicationD4 === void 0 ? void 0 : (_appData$applicationD5 = _appData$applicationD4.documents) === null || _appData$applicationD5 === void 0 ? void 0 : _appData$applicationD5.filter(appDoc => {
         var _appDoc$documentType, _appDoc$documentType$, _appDoc$documentType2, _appDoc$documentType3, _data$documentType3, _data$documentType3$s, _data$documentType4, _data$documentType4$s;
         return (appDoc === null || appDoc === void 0 ? void 0 : (_appDoc$documentType = appDoc.documentType) === null || _appDoc$documentType === void 0 ? void 0 : (_appDoc$documentType$ = _appDoc$documentType.split(".")) === null || _appDoc$documentType$ === void 0 ? void 0 : _appDoc$documentType$[0]) + "." + (appDoc === null || appDoc === void 0 ? void 0 : (_appDoc$documentType2 = appDoc.documentType) === null || _appDoc$documentType2 === void 0 ? void 0 : (_appDoc$documentType3 = _appDoc$documentType2.split(".")) === null || _appDoc$documentType3 === void 0 ? void 0 : _appDoc$documentType3[1]) == (data === null || data === void 0 ? void 0 : (_data$documentType3 = data.documentType) === null || _data$documentType3 === void 0 ? void 0 : (_data$documentType3$s = _data$documentType3.split(".")) === null || _data$documentType3$s === void 0 ? void 0 : _data$documentType3$s[0]) + "." + (data === null || data === void 0 ? void 0 : (_data$documentType4 = data.documentType) === null || _data$documentType4 === void 0 ? void 0 : (_data$documentType4$s = _data$documentType4.split(".")) === null || _data$documentType4$s === void 0 ? void 0 : _data$documentType4$s[1]);
       });
@@ -1711,7 +1751,7 @@ const convertDisonnectEditApplicationDetails = function (data, appData, actionDa
       licenseNo: data === null || data === void 0 ? void 0 : (_data$plumberDetails7 = data.plumberDetails) === null || _data$plumberDetails7 === void 0 ? void 0 : (_data$plumberDetails8 = _data$plumberDetails7[0]) === null || _data$plumberDetails8 === void 0 ? void 0 : _data$plumberDetails8.plumberLicenseNo,
       mobileNumber: data === null || data === void 0 ? void 0 : (_data$plumberDetails9 = data.plumberDetails) === null || _data$plumberDetails9 === void 0 ? void 0 : (_data$plumberDetails0 = _data$plumberDetails9[0]) === null || _data$plumberDetails0 === void 0 ? void 0 : _data$plumberDetails0.plumberMobileNo,
       name: data === null || data === void 0 ? void 0 : (_data$plumberDetails1 = data.plumberDetails) === null || _data$plumberDetails1 === void 0 ? void 0 : (_data$plumberDetails10 = _data$plumberDetails1[0]) === null || _data$plumberDetails10 === void 0 ? void 0 : _data$plumberDetails10.plumberName,
-      id: appData === null || appData === void 0 ? void 0 : (_appData$applicationD5 = appData.applicationData) === null || _appData$applicationD5 === void 0 ? void 0 : (_appData$applicationD6 = _appData$applicationD5.plumberInfo) === null || _appData$applicationD6 === void 0 ? void 0 : (_appData$applicationD7 = _appData$applicationD6[0]) === null || _appData$applicationD7 === void 0 ? void 0 : _appData$applicationD7.id
+      id: appData === null || appData === void 0 ? void 0 : (_appData$applicationD6 = appData.applicationData) === null || _appData$applicationD6 === void 0 ? void 0 : (_appData$applicationD7 = _appData$applicationD6.plumberInfo) === null || _appData$applicationD7 === void 0 ? void 0 : (_appData$applicationD8 = _appData$applicationD7[0]) === null || _appData$applicationD8 === void 0 ? void 0 : _appData$applicationD8.id
     }];
     const _temp5 = (data === null || data === void 0 ? void 0 : (_data$disConnectionDe = data.disConnectionDetails) === null || _data$disConnectionDe === void 0 ? void 0 : (_data$disConnectionDe2 = _data$disConnectionDe[0]) === null || _data$disConnectionDe2 === void 0 ? void 0 : _data$disConnectionDe2.disConnectionReason) || "",
       _temp4 = (data === null || data === void 0 ? void 0 : (_data$disConnectionDe3 = data.disConnectionDetails) === null || _data$disConnectionDe3 === void 0 ? void 0 : (_data$disConnectionDe4 = _data$disConnectionDe3[0]) === null || _data$disConnectionDe4 === void 0 ? void 0 : _data$disConnectionDe4.disConnectionType) == "TEMPORARY" ? true : false,
@@ -1768,11 +1808,15 @@ const convertModifyApplicationDetails = function (data, appData, actionData) {
       var _data$activationDetai5, _data$activationDetai6, _data$activationDetai7, _data$activationDetai8;
       function _temp9() {
         function _temp7() {
-          var _data$DocumentsRequir3, _data$DocumentsRequir4, _data$DocumentsRequir5, _data$ConnectionHolde87, _data$ConnectionHolde88, _Digit$UserService$ge12, _Digit$UserService$ge13, _Digit$UserService$ge14, _data$DocumentsRequir6, _data$cpt33;
+          var _data$DocumentsRequir3, _data$DocumentsRequir4, _data$DocumentsRequir5, _appData$applicationD9, _data$ConnectionHolde87, _data$ConnectionHolde88, _Digit$UserService$ge12, _Digit$UserService$ge13, _Digit$UserService$ge14, _data$DocumentsRequir6, _data$cpt33;
           if (data !== null && data !== void 0 && (_data$DocumentsRequir3 = data.DocumentsRequired) !== null && _data$DocumentsRequir3 !== void 0 && (_data$DocumentsRequir4 = _data$DocumentsRequir3.documents) !== null && _data$DocumentsRequir4 !== void 0 && _data$DocumentsRequir4.length) formData.documents = data === null || data === void 0 ? void 0 : (_data$DocumentsRequir5 = data.DocumentsRequired) === null || _data$DocumentsRequir5 === void 0 ? void 0 : _data$DocumentsRequir5.documents;else formData.documents = null;
+          const existingDocs = (appData === null || appData === void 0 ? void 0 : (_appData$applicationD9 = appData.applicationData) === null || _appData$applicationD9 === void 0 ? void 0 : _appData$applicationD9.documents) || (appData === null || appData === void 0 ? void 0 : appData.documents) || [];
+          if (formData.documents && formData.documents.length > 0 && existingDocs && existingDocs.length > 0) {
+            formData.documents = mapExistingDocIdsToPayload(formData.documents, existingDocs);
+          }
           if (!(data !== null && data !== void 0 && (_data$ConnectionHolde87 = data.ConnectionHolderDetails) !== null && _data$ConnectionHolde87 !== void 0 && (_data$ConnectionHolde88 = _data$ConnectionHolde87[0]) !== null && _data$ConnectionHolde88 !== void 0 && _data$ConnectionHolde88.sameAsOwnerDetails)) {
-            var _appData$applicationD8, _appData$applicationD9, _data$ConnectionHolde89, _data$ConnectionHolde90, _data$ConnectionHolde91, _data$ConnectionHolde92, _data$ConnectionHolde93, _data$ConnectionHolde94, _data$ConnectionHolde95, _data$ConnectionHolde96, _data$ConnectionHolde97, _data$ConnectionHolde98, _data$ConnectionHolde99, _data$ConnectionHolde100, _data$ConnectionHolde101, _data$ConnectionHolde102, _data$ConnectionHolde103, _data$ConnectionHolde104, _data$ConnectionHolde105, _data$ConnectionHolde106, _data$ConnectionHolde107, _data$ConnectionHolde108, _data$ConnectionHolde109, _data$ConnectionHolde110, _data$ConnectionHolde111, _data$ConnectionHolde112, _data$ConnectionHolde113, _data$ConnectionHolde114, _data$ConnectionHolde115;
-            formData.connectionHolders = [_extends({}, appData === null || appData === void 0 ? void 0 : (_appData$applicationD8 = appData.applicationData) === null || _appData$applicationD8 === void 0 ? void 0 : (_appData$applicationD9 = _appData$applicationD8.connectionHolders) === null || _appData$applicationD9 === void 0 ? void 0 : _appData$applicationD9[0], {
+            var _appData$applicationD0, _appData$applicationD1, _data$ConnectionHolde89, _data$ConnectionHolde90, _data$ConnectionHolde91, _data$ConnectionHolde92, _data$ConnectionHolde93, _data$ConnectionHolde94, _data$ConnectionHolde95, _data$ConnectionHolde96, _data$ConnectionHolde97, _data$ConnectionHolde98, _data$ConnectionHolde99, _data$ConnectionHolde100, _data$ConnectionHolde101, _data$ConnectionHolde102, _data$ConnectionHolde103, _data$ConnectionHolde104, _data$ConnectionHolde105, _data$ConnectionHolde106, _data$ConnectionHolde107, _data$ConnectionHolde108, _data$ConnectionHolde109, _data$ConnectionHolde110, _data$ConnectionHolde111, _data$ConnectionHolde112, _data$ConnectionHolde113, _data$ConnectionHolde114, _data$ConnectionHolde115;
+            formData.connectionHolders = [_extends({}, appData === null || appData === void 0 ? void 0 : (_appData$applicationD0 = appData.applicationData) === null || _appData$applicationD0 === void 0 ? void 0 : (_appData$applicationD1 = _appData$applicationD0.connectionHolders) === null || _appData$applicationD1 === void 0 ? void 0 : _appData$applicationD1[0], {
               correspondenceAddress: (data === null || data === void 0 ? void 0 : (_data$ConnectionHolde89 = data.ConnectionHolderDetails) === null || _data$ConnectionHolde89 === void 0 ? void 0 : (_data$ConnectionHolde90 = _data$ConnectionHolde89[0]) === null || _data$ConnectionHolde90 === void 0 ? void 0 : _data$ConnectionHolde90.address) || "",
               fatherOrHusbandName: (data === null || data === void 0 ? void 0 : (_data$ConnectionHolde91 = data.ConnectionHolderDetails) === null || _data$ConnectionHolde91 === void 0 ? void 0 : (_data$ConnectionHolde92 = _data$ConnectionHolde91[0]) === null || _data$ConnectionHolde92 === void 0 ? void 0 : _data$ConnectionHolde92.guardian) || "",
               gender: (data === null || data === void 0 ? void 0 : (_data$ConnectionHolde93 = data.ConnectionHolderDetails) === null || _data$ConnectionHolde93 === void 0 ? void 0 : (_data$ConnectionHolde94 = _data$ConnectionHolde93[0]) === null || _data$ConnectionHolde94 === void 0 ? void 0 : (_data$ConnectionHolde95 = _data$ConnectionHolde94.gender) === null || _data$ConnectionHolde95 === void 0 ? void 0 : _data$ConnectionHolde95.code) || "",
@@ -7743,7 +7787,7 @@ var lodash = createCommonjsModule(function (module, exports) {
 });
 
 const WSApplication = _ref => {
-  var _user$info, _user$info$userName, _user$info2, _user$info3, _application$applicat, _application$applicat2, _application$applicat3, _application$applicat4, _application$applicat5, _application$applicat6, _application$applicat7, _application$connecti, _application$property, _application$property2, _application$property3, _application$property4, _application$property5, _application$property6, _application$applicat8, _application$connecti2, _application$connecti3, _PTData$Properties, _PTData$Properties$, _PTData$Properties$$o, _application$applicat9, _application$applicat0;
+  var _user$info, _user$info$userName, _user$info2, _user$info3, _application$applicat, _application$applicat2, _application$applicat3, _application$applicat4, _application$applicat5, _application$applicat6, _application$connecti, _application$property, _application$property2, _application$property3, _application$property4, _application$property5, _application$property6, _application$applicat7, _application$connecti2, _application$connecti3, _PTData$Properties, _PTData$Properties$, _PTData$Properties$$o, _application$applicat8, _application$applicat9;
   let application = _ref.application;
   const _useTranslation = useTranslation(),
     t = _useTranslation.t;
@@ -7774,9 +7818,10 @@ const WSApplication = _ref => {
       privacy: Digit.Utils.getPrivacyObject()
     }),
     PTData = _Digit$Hooks$pt$usePr.data;
-  const businessService = application !== null && application !== void 0 && (_application$applicat2 = application.applicationNo) !== null && _application$applicat2 !== void 0 && _application$applicat2.includes("SW") ? application !== null && application !== void 0 && (_application$applicat3 = application.applicationNo) !== null && _application$applicat3 !== void 0 && _application$applicat3.includes("DC") ? "SW" : application !== null && application !== void 0 && (_application$applicat4 = application.applicationNo) !== null && _application$applicat4 !== void 0 && _application$applicat4.includes("MUT") ? "SW.MUTATION" : "SW.ONE_TIME_FEE" : application !== null && application !== void 0 && (_application$applicat5 = application.applicationNo) !== null && _application$applicat5 !== void 0 && _application$applicat5.includes("DC") ? "WS" : application !== null && application !== void 0 && (_application$applicat6 = application.applicationNo) !== null && _application$applicat6 !== void 0 && _application$applicat6.includes("MUT") ? "WS.MUTATION" : "WS.ONE_TIME_FEE";
+  const isMutation = application === null || application === void 0 ? void 0 : (_application$applicat2 = application.applicationType) === null || _application$applicat2 === void 0 ? void 0 : _application$applicat2.includes("MUTATION");
+  const businessService = application !== null && application !== void 0 && (_application$applicat3 = application.applicationNo) !== null && _application$applicat3 !== void 0 && _application$applicat3.includes("SW") ? application !== null && application !== void 0 && (_application$applicat4 = application.applicationNo) !== null && _application$applicat4 !== void 0 && _application$applicat4.includes("DC") ? "SW" : isMutation ? "SW.MUTATION" : "SW.ONE_TIME_FEE" : application !== null && application !== void 0 && (_application$applicat5 = application.applicationNo) !== null && _application$applicat5 !== void 0 && _application$applicat5.includes("DC") ? "WS" : isMutation ? "WS.MUTATION" : "WS.ONE_TIME_FEE";
   const fetchBillParams = {
-    consumerCode: application !== null && application !== void 0 && (_application$applicat7 = application.applicationNo) !== null && _application$applicat7 !== void 0 && _application$applicat7.includes("DC") ? application === null || application === void 0 ? void 0 : application.connectionNo : application === null || application === void 0 ? void 0 : application.connectionNo
+    consumerCode: application !== null && application !== void 0 && (_application$applicat6 = application.applicationNo) !== null && _application$applicat6 !== void 0 && _application$applicat6.includes("DC") ? application === null || application === void 0 ? void 0 : application.connectionNo : application === null || application === void 0 ? void 0 : application.connectionNo
   };
   if (isLoading) {
     return /*#__PURE__*/React.createElement(Loader, null);
@@ -7831,8 +7876,8 @@ const WSApplication = _ref => {
     label: t("WS_VIEW_DETAILS_LABEL")
   })), (application === null || application === void 0 ? void 0 : application.applicationStatus) === "PENDING_FOR_PAYMENT" ? /*#__PURE__*/React.createElement(Link, {
     to: {
-      pathname: "/digit-ui/citizen/payment/my-bills/" + businessService + "/" + (application !== null && application !== void 0 && (_application$applicat8 = application.applicationNo) !== null && _application$applicat8 !== void 0 && _application$applicat8.includes("DC") ? stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") : stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+")),
-      search: "?workflow=WNS&tenantId=" + (application === null || application === void 0 ? void 0 : application.tenantId) + "&ConsumerName=" + ((application === null || application === void 0 ? void 0 : (_application$connecti2 = application.connectionHolders) === null || _application$connecti2 === void 0 ? void 0 : _application$connecti2.map(owner => owner.name).join(",")) || (application === null || application === void 0 ? void 0 : (_application$connecti3 = application.connectionHolders) === null || _application$connecti3 === void 0 ? void 0 : _application$connecti3.map(owner => owner.name).join(",")) || (PTData === null || PTData === void 0 ? void 0 : (_PTData$Properties = PTData.Properties) === null || _PTData$Properties === void 0 ? void 0 : (_PTData$Properties$ = _PTData$Properties[0]) === null || _PTData$Properties$ === void 0 ? void 0 : (_PTData$Properties$$o = _PTData$Properties$.owners) === null || _PTData$Properties$$o === void 0 ? void 0 : _PTData$Properties$$o.map(owner => owner.name).join(","))) + "&isDisoconnectFlow=" + (application !== null && application !== void 0 && (_application$applicat9 = application.applicationNo) !== null && _application$applicat9 !== void 0 && _application$applicat9.includes("DC") ? true : false) + "&consumerCode=" + (application !== null && application !== void 0 && (_application$applicat0 = application.applicationNo) !== null && _application$applicat0 !== void 0 && _application$applicat0.includes("DC") ? application === null || application === void 0 ? void 0 : application.connectionNo : application === null || application === void 0 ? void 0 : application.applicationNo),
+      pathname: "/digit-ui/citizen/payment/my-bills/" + businessService + "/" + (application !== null && application !== void 0 && (_application$applicat7 = application.applicationNo) !== null && _application$applicat7 !== void 0 && _application$applicat7.includes("DC") ? stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") : stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+")),
+      search: "?workflow=WNS&tenantId=" + (application === null || application === void 0 ? void 0 : application.tenantId) + "&ConsumerName=" + ((application === null || application === void 0 ? void 0 : (_application$connecti2 = application.connectionHolders) === null || _application$connecti2 === void 0 ? void 0 : _application$connecti2.map(owner => owner.name).join(",")) || (application === null || application === void 0 ? void 0 : (_application$connecti3 = application.connectionHolders) === null || _application$connecti3 === void 0 ? void 0 : _application$connecti3.map(owner => owner.name).join(",")) || (PTData === null || PTData === void 0 ? void 0 : (_PTData$Properties = PTData.Properties) === null || _PTData$Properties === void 0 ? void 0 : (_PTData$Properties$ = _PTData$Properties[0]) === null || _PTData$Properties$ === void 0 ? void 0 : (_PTData$Properties$$o = _PTData$Properties$.owners) === null || _PTData$Properties$$o === void 0 ? void 0 : _PTData$Properties$$o.map(owner => owner.name).join(","))) + "&isDisoconnectFlow=" + (application !== null && application !== void 0 && (_application$applicat8 = application.applicationNo) !== null && _application$applicat8 !== void 0 && _application$applicat8.includes("DC") ? true : false) + "&consumerCode=" + (application !== null && application !== void 0 && (_application$applicat9 = application.applicationNo) !== null && _application$applicat9 !== void 0 && _application$applicat9.includes("DC") ? application === null || application === void 0 ? void 0 : application.connectionNo : application === null || application === void 0 ? void 0 : application.applicationNo),
       state: {}
     }
   }, /*#__PURE__*/React.createElement("div", {
@@ -8035,15 +8080,17 @@ const WSMyApplications = () => {
       Header: t("MAKE_PAYMENT"),
       disableSortBy: true,
       Cell: _ref8 => {
-        var _application$applicat, _application$applicat2, _application$applicat3, _application$applicat4, _application$connecti, _application$connecti2, _application$property, _application$property2, _application$applicat5;
+        var _application$applicat, _application$applicat2, _application$applicat3, _application$applicat4, _application$applicat5, _application$connecti, _application$property, _application$property2, _application$applicat6, _application$applicat7;
         let row = _ref8.row;
         const application = row.original;
-        const businessService = application !== null && application !== void 0 && (_application$applicat = application.applicationNo) !== null && _application$applicat !== void 0 && _application$applicat.includes("SW") ? application !== null && application !== void 0 && (_application$applicat2 = application.applicationNo) !== null && _application$applicat2 !== void 0 && _application$applicat2.includes("DC") ? "SW" : "SW.ONE_TIME_FEE" : application !== null && application !== void 0 && (_application$applicat3 = application.applicationNo) !== null && _application$applicat3 !== void 0 && _application$applicat3.includes("DC") ? "WS" : "WS.ONE_TIME_FEE";
+        const isMutation = application === null || application === void 0 ? void 0 : (_application$applicat = application.applicationType) === null || _application$applicat === void 0 ? void 0 : _application$applicat.includes("MUTATION");
+        const businessService = application !== null && application !== void 0 && (_application$applicat2 = application.applicationNo) !== null && _application$applicat2 !== void 0 && _application$applicat2.includes("SW") ? application !== null && application !== void 0 && (_application$applicat3 = application.applicationNo) !== null && _application$applicat3 !== void 0 && _application$applicat3.includes("DC") ? "SW" : isMutation ? "SW.MUTATION" : "SW.ONE_TIME_FEE" : application !== null && application !== void 0 && (_application$applicat4 = application.applicationNo) !== null && _application$applicat4 !== void 0 && _application$applicat4.includes("DC") ? "WS" : isMutation ? "WS.MUTATION" : "WS.ONE_TIME_FEE";
         return (application === null || application === void 0 ? void 0 : application.applicationStatus) === "PENDING_FOR_PAYMENT" ? /*#__PURE__*/React.createElement("span", {
           className: "link"
         }, /*#__PURE__*/React.createElement(Link, {
           to: {
-            pathname: "/digit-ui/citizen/payment/my-bills/" + businessService + "/" + (application !== null && application !== void 0 && (_application$applicat4 = application.applicationNo) !== null && _application$applicat4 !== void 0 && _application$applicat4.includes("DC") ? stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") : stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+")) + "?workflow=WNS&tenantId=" + (application === null || application === void 0 ? void 0 : application.tenantId) + "&ConsumerName=" + ((application === null || application === void 0 ? void 0 : (_application$connecti = application.connectionHolders) === null || _application$connecti === void 0 ? void 0 : _application$connecti.map(owner => owner.name).join(",")) || (application === null || application === void 0 ? void 0 : (_application$connecti2 = application.connectionHolders) === null || _application$connecti2 === void 0 ? void 0 : _application$connecti2.map(owner => owner.name).join(",")) || (application === null || application === void 0 ? void 0 : (_application$property = application.property) === null || _application$property === void 0 ? void 0 : (_application$property2 = _application$property.owners) === null || _application$property2 === void 0 ? void 0 : _application$property2.map(owner => owner.name).join(","))) + "&isDisoconnectFlow=" + (application !== null && application !== void 0 && (_application$applicat5 = application.applicationNo) !== null && _application$applicat5 !== void 0 && _application$applicat5.includes("DC") ? true : false),
+            pathname: "/digit-ui/citizen/payment/my-bills/" + businessService + "/" + (application !== null && application !== void 0 && (_application$applicat5 = application.applicationNo) !== null && _application$applicat5 !== void 0 && _application$applicat5.includes("DC") ? stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.connectionNo, "/", "+") : stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+") || stringReplaceAll(application === null || application === void 0 ? void 0 : application.applicationNo, "/", "+")),
+            search: "?workflow=WNS&tenantId=" + (application === null || application === void 0 ? void 0 : application.tenantId) + "&ConsumerName=" + ((application === null || application === void 0 ? void 0 : (_application$connecti = application.connectionHolders) === null || _application$connecti === void 0 ? void 0 : _application$connecti.map(owner => owner.name).join(",")) || (application === null || application === void 0 ? void 0 : (_application$property = application.property) === null || _application$property === void 0 ? void 0 : (_application$property2 = _application$property.owners) === null || _application$property2 === void 0 ? void 0 : _application$property2.map(owner => owner.name).join(","))) + "&isDisoconnectFlow=" + (application !== null && application !== void 0 && (_application$applicat6 = application.applicationNo) !== null && _application$applicat6 !== void 0 && _application$applicat6.includes("DC") ? true : false) + "&consumerCode=" + (application !== null && application !== void 0 && (_application$applicat7 = application.applicationNo) !== null && _application$applicat7 !== void 0 && _application$applicat7.includes("DC") ? application === null || application === void 0 ? void 0 : application.connectionNo : application === null || application === void 0 ? void 0 : application.applicationNo),
             state: {
               fromMyApplications: true
             }
@@ -11268,7 +11315,9 @@ const App$1 = _ref2 => {
     component: WSEditApplicationByConfig
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
     path: path + "/disconnection-details",
-    component: WSGetDisconnectionDetails
+    component: () => /*#__PURE__*/React.createElement(LayoutWrapper, {
+      layoutClass: "action"
+    }, /*#__PURE__*/React.createElement(WSGetDisconnectionDetails, null))
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
     path: path + "/water/bill-amendment/inbox",
     component: props => /*#__PURE__*/React.createElement(WSBillIAmendMentInbox, _extends({}, props, {
@@ -18198,6 +18247,7 @@ function SelectDocument(_ref2) {
           fileStoreId: uploadedFile,
           fileName: (file === null || file === void 0 ? void 0 : file.name) || (filteredDocument === null || filteredDocument === void 0 ? void 0 : filteredDocument.fileName) || "",
           documentUid: documentUid,
+          documentNumber: documentUid,
           i18nKey: selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.code,
           id: selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.id,
           status: "ACTIVE"
@@ -21112,22 +21162,18 @@ const WSDisconnectionForm = _ref => {
       config: config,
       onSelect: handleSubmit,
       onSkip: onSkip,
-      t: t
-    }, /*#__PURE__*/React.createElement("div", {
-      style: {
-        padding: "0px 10px 10px 10px"
-      }
-    }, /*#__PURE__*/React.createElement(CardHeader, null, isReSubmit ? t("RESUBMIT_DISCONNECTION_FORM") : t("WS_APPLICATION_FORM")), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
+      t: t,
+      title: isReSubmit ? t("RESUBMIT_DISCONNECTION_FORM") : t("WS_APPLICATION_FORM")
+    }, /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
       key: t("PDF_STATIC_LABEL_CONSUMER_NUMBER_LABEL"),
       label: "" + t("PDF_STATIC_LABEL_CONSUMER_NUMBER_LABEL"),
       text: applicationData === null || applicationData === void 0 ? void 0 : applicationData.connectionNo,
       className: "border-none"
-    })), /*#__PURE__*/React.createElement(CardLabel, {
-      className: "card-label-smaller",
-      style: {
-        display: "inline"
-      }
-    }, t("WS_DISCONNECTION_TYPE") + "*"), /*#__PURE__*/React.createElement(RadioButtons, {
+    })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+      className: "card-label-smaller"
+    }, t("WS_DISCONNECTION_TYPE") + "*"), /*#__PURE__*/React.createElement("div", {
+      className: "field"
+    }, /*#__PURE__*/React.createElement(RadioButtons, {
       t: t,
       options: disconnectionTypeList,
       optionsKey: "i18nKey",
@@ -21142,11 +21188,8 @@ const WSDisconnectionForm = _ref => {
       inputStyle: isMobile ? {
         marginLeft: "unset"
       } : {}
-    }), /*#__PURE__*/React.createElement(CardLabel, {
-      className: "card-label-smaller",
-      style: {
-        display: "inline"
-      }
+    }))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+      className: "card-label-smaller"
     }, t("WS_DISCONNECTION_PROPOSED_DATE") + "*", /*#__PURE__*/React.createElement("div", {
       className: "tooltip",
       style: {
@@ -21168,11 +21211,8 @@ const WSDisconnectionForm = _ref => {
           date: date
         }));
       }
-    })), ((_disconnectionData$ty4 = disconnectionData.type) === null || _disconnectionData$ty4 === void 0 ? void 0 : (_disconnectionData$ty5 = _disconnectionData$ty4.value) === null || _disconnectionData$ty5 === void 0 ? void 0 : _disconnectionData$ty5.code) === "Temporary" ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, {
-      className: "card-label-smaller",
-      style: {
-        display: "inline"
-      }
+    }))), ((_disconnectionData$ty4 = disconnectionData.type) === null || _disconnectionData$ty4 === void 0 ? void 0 : (_disconnectionData$ty5 = _disconnectionData$ty4.value) === null || _disconnectionData$ty5 === void 0 ? void 0 : _disconnectionData$ty5.code) === "Temporary" ? /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+      className: "card-label-smaller"
     }, t("WS_DISCONNECTION_PROPOSED_END_DATE") + "*", /*#__PURE__*/React.createElement("div", {
       className: "tooltip",
       style: {
@@ -21195,11 +21235,10 @@ const WSDisconnectionForm = _ref => {
         }));
       }
     }))) : "", /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-      className: "card-label-smaller",
-      style: {
-        display: "inline"
-      }
-    }, t("WS_DISCONNECTION_REASON") + "*"), /*#__PURE__*/React.createElement(Dropdown, {
+      className: "card-label-smaller"
+    }, t("WS_DISCONNECTION_REASON") + "*"), /*#__PURE__*/React.createElement("div", {
+      className: "field"
+    }, /*#__PURE__*/React.createElement(Dropdown, {
       option: disconnectionReasonList,
       isMandatory: false,
       optionKey: "i18nKey",
@@ -21212,7 +21251,14 @@ const WSDisconnectionForm = _ref => {
         code: "reason",
         value: e
       })
-    })), /*#__PURE__*/React.createElement(SubmitBar, {
+    }))), /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "flex-end",
+        width: "100%",
+        gridColumn: "1 / -1"
+      }
+    }, /*#__PURE__*/React.createElement(SubmitBar, {
       label: t("CS_COMMON_NEXT"),
       onSubmit: () => {
         var _disconnectionData$ty6, _disconnectionData$ty7;
@@ -21240,11 +21286,11 @@ const WSDisconnectionForm = _ref => {
         }
       },
       disabled: (disconnectionData === null || disconnectionData === void 0 ? void 0 : (_disconnectionData$re5 = disconnectionData.reason) === null || _disconnectionData$re5 === void 0 ? void 0 : _disconnectionData$re5.value) === "" || (disconnectionData === null || disconnectionData === void 0 ? void 0 : disconnectionData.reason) === "" || (disconnectionData === null || disconnectionData === void 0 ? void 0 : disconnectionData.date) === "" || (disconnectionData === null || disconnectionData === void 0 ? void 0 : disconnectionData.type) === "" ? true : false
-    }), error && /*#__PURE__*/React.createElement(Toast, {
+    })), error && /*#__PURE__*/React.createElement(Toast, {
       error: (error === null || error === void 0 ? void 0 : error.key) === "error" ? true : false,
       label: t(error === null || error === void 0 ? void 0 : error.message),
       onClose: () => setError(null)
-    })))));
+    }))));
   }
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FormStep, {
     config: config,
@@ -22005,7 +22051,7 @@ function WSDisconnectionDocumentsForm(_ref) {
     t: t,
     config: config,
     onSelect: handleSubmit
-  }, /*#__PURE__*/React.createElement(CardHeader, null, t("WS_DISCONNECTION_UPLOAD_DOCUMENTS")), wsDocs === null || wsDocs === void 0 ? void 0 : (_wsDocs$Disconnection = wsDocs.DisconnectionDocuments) === null || _wsDocs$Disconnection === void 0 ? void 0 : _wsDocs$Disconnection.map((document, index) => {
+  }, wsDocs === null || wsDocs === void 0 ? void 0 : (_wsDocs$Disconnection = wsDocs.DisconnectionDocuments) === null || _wsDocs$Disconnection === void 0 ? void 0 : _wsDocs$Disconnection.map((document, index) => {
     return /*#__PURE__*/React.createElement(SelectDocument$2, {
       key: index,
       document: document,
@@ -22016,20 +22062,28 @@ function WSDisconnectionDocumentsForm(_ref) {
       documents: documents,
       setCheckRequiredFields: setCheckRequiredFields
     });
-  }), /*#__PURE__*/React.createElement(SubmitBar, {
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      justifyContent: "flex-end",
+      width: "100%",
+      gridColumn: "1 / -1",
+      marginTop: "1rem"
+    }
+  }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CS_COMMON_NEXT"),
     onSubmit: () => {
       history.push(match.path.replace("documents-upload", "check"));
     },
     disabled: documents.length < 2 ? true : false
-  }), error && /*#__PURE__*/React.createElement(Toast, {
+  })), error && /*#__PURE__*/React.createElement(Toast, {
     error: (error === null || error === void 0 ? void 0 : error.key) === "error" ? true : false,
     label: t(error === null || error === void 0 ? void 0 : error.message),
     onClose: () => setError(null)
   })));
 }
 function SelectDocument$2(_ref2) {
-  var _doc$dropdownData;
+  var _doc$dropdownData, _selectedDocument$cod2, _selectedDocument$cod3, _selectedDocument$cod4, _selectedDocument$cod5, _selectedDocument$cod6, _selectedDocument$cod7, _selectedDocument$cod8, _selectedDocument$cod9, _selectedDocument$cod0, _selectedDocument$cod1, _selectedDocument$cod10, _selectedDocument$cod11, _selectedDocument$cod12, _selectedDocument$cod13, _selectedDocument$cod14, _selectedDocument$cod15;
   let t = _ref2.t,
     key = _ref2.key,
     doc = _ref2.document,
@@ -22056,6 +22110,32 @@ function SelectDocument$2(_ref2) {
   const _useState6 = useState(() => (filteredDocument === null || filteredDocument === void 0 ? void 0 : filteredDocument.fileStoreId) || null),
     uploadedFile = _useState6[0],
     setUploadedFile = _useState6[1];
+  const _useState7 = useState(() => filteredDocument !== null && filteredDocument !== void 0 && filteredDocument.documentUid && (filteredDocument === null || filteredDocument === void 0 ? void 0 : filteredDocument.documentUid) !== (filteredDocument === null || filteredDocument === void 0 ? void 0 : filteredDocument.fileStoreId) ? filteredDocument === null || filteredDocument === void 0 ? void 0 : filteredDocument.documentUid : ""),
+    documentNumber = _useState7[0],
+    setDocumentNumber = _useState7[1];
+  const _useState8 = useState(null),
+    docNumberError = _useState8[0],
+    setDocNumberError = _useState8[1];
+  const validateDocumentNumber = (value, docTypeCode, isReq, hasFile) => {
+    if (!isReq && !hasFile && (!value || !value.trim())) return null;
+    if (!value || !value.trim()) return t("WS_DOCUMENT_NUMBER_REQUIRED") || "Document number is required";
+    const trimmed = value.trim();
+    const upperCode = (docTypeCode || "").toUpperCase();
+    if (upperCode.includes("AADHAAR") || upperCode.includes("AADHAR")) {
+      if (!/^\d{12}$/.test(trimmed)) return t("WS_AADHAAR_VALIDATION_ERROR") || "Aadhaar number must be exactly 12 digits";
+    } else if (upperCode.includes("PAN")) {
+      if (!/^[A-Z]{5}[0-9]{4}[A-Z]{1}$/.test(trimmed.toUpperCase())) return t("WS_PAN_VALIDATION_ERROR") || "PAN must be in format ABCDE1234F";
+    } else if (upperCode.includes("VOTER") || upperCode.includes("VOTERID")) {
+      if (!/^[A-Z]{3}\d{7}$/.test(trimmed.toUpperCase())) return t("WS_VOTERID_VALIDATION_ERROR") || "Voter ID must be in format ABC1234567";
+    } else if (upperCode.includes("DRIVING") || upperCode.includes("DRVLC")) {
+      if (!/^[A-Z]{2}\d{13}$/.test(trimmed.toUpperCase())) return t("WS_DRIVING_LICENSE_VALIDATION_ERROR") || "Driving License must be 15 characters (e.g. MH1420110012345)";
+    } else if (upperCode.includes("PASSPORT")) {
+      if (!/^[A-Z]{1}\d{7}$/.test(trimmed.toUpperCase())) return t("WS_PASSPORT_VALIDATION_ERROR") || "Passport must be 8 characters (e.g. A1234567)";
+    } else {
+      if (trimmed.length < 3) return t("WS_DOC_NO_MIN_LENGTH") || "Document number must be at least 3 characters";
+    }
+    return null;
+  };
   const handleSelectDocument = value => setSelectedDocument(value);
   function selectfile(e) {
     setFile(e.target.files[0]);
@@ -22066,18 +22146,24 @@ function SelectDocument$2(_ref2) {
         const filteredDocumentsByDocumentType = prev === null || prev === void 0 ? void 0 : prev.filter(item => (item === null || item === void 0 ? void 0 : item.documentType) !== (selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.code));
         if ((uploadedFile === null || uploadedFile === void 0 ? void 0 : uploadedFile.length) === 0 || uploadedFile === null) return filteredDocumentsByDocumentType;
         const filteredDocumentsByFileStoreId = filteredDocumentsByDocumentType === null || filteredDocumentsByDocumentType === void 0 ? void 0 : filteredDocumentsByDocumentType.filter(item => (item === null || item === void 0 ? void 0 : item.fileStoreId) !== uploadedFile);
+        const err = validateDocumentNumber(documentNumber, selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.code, true, !!uploadedFile);
+        setDocNumberError(err);
+        if (err) {
+          return filteredDocumentsByFileStoreId;
+        }
         return [...filteredDocumentsByFileStoreId, {
           documentType: selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.code,
           fileStoreId: uploadedFile,
           id: selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.id,
           i18nKey: selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.code,
-          documentUid: selectedDocument !== null && selectedDocument !== void 0 && selectedDocument.documentUid ? selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.documentUid : uploadedFile,
+          documentUid: documentNumber ? documentNumber : selectedDocument !== null && selectedDocument !== void 0 && selectedDocument.documentUid ? selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.documentUid : uploadedFile,
+          documentNumber: documentNumber ? documentNumber : selectedDocument !== null && selectedDocument !== void 0 && selectedDocument.documentNumber ? selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.documentNumber : "",
           fileName: (file === null || file === void 0 ? void 0 : file.name) || "",
           status: "ACTIVE"
         }];
       });
     }
-  }, [uploadedFile, selectedDocument]);
+  }, [uploadedFile, selectedDocument, documentNumber]);
   useEffect(() => {
     (function () {
       try {
@@ -22125,27 +22211,109 @@ function SelectDocument$2(_ref2) {
   }, [file]);
   return /*#__PURE__*/React.createElement("div", {
     style: {
-      marginBottom: "24px"
+      gridColumn: "span 2",
+      display: "grid",
+      gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+      gap: "20px",
+      width: "100%",
+      marginBottom: "20px"
     }
-  }, /*#__PURE__*/React.createElement(CardLabel, null, t(doc === null || doc === void 0 ? void 0 : doc.i18nKey) + "*"), /*#__PURE__*/React.createElement(Dropdown, {
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, {
+    className: "card-label-smaller",
+    style: {
+      marginBottom: "8px"
+    }
+  }, t(doc === null || doc === void 0 ? void 0 : doc.i18nKey) + "*"), /*#__PURE__*/React.createElement(Dropdown, {
     t: t,
     isMandatory: false,
     option: doc === null || doc === void 0 ? void 0 : doc.dropdownData,
     selected: selectedDocument,
     optionKey: "i18nKey",
     select: handleSelectDocument
-  }), /*#__PURE__*/React.createElement(UploadFile, {
+  })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, {
+    className: "card-label-smaller",
+    style: {
+      marginBottom: "8px"
+    }
+  }, t(doc === null || doc === void 0 ? void 0 : doc.i18nKey) + " Document Number"), /*#__PURE__*/React.createElement(TextInput, {
+    type: "text",
+    value: documentNumber,
+    onChange: e => {
+      var _selectedDocument$cod;
+      let val = e.target.value;
+      const upperCode = (selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod = selectedDocument.code) === null || _selectedDocument$cod === void 0 ? void 0 : _selectedDocument$cod.toUpperCase()) || "";
+      const maxLen = upperCode.includes("AADHAAR") || upperCode.includes("AADHAR") ? 12 : upperCode.includes("PAN") ? 10 : upperCode.includes("VOTER") || upperCode.includes("VOTERID") ? 10 : upperCode.includes("DRIVING") || upperCode.includes("DRVLC") ? 15 : upperCode.includes("PASSPORT") ? 8 : 64;
+      if (val.length > maxLen) {
+        val = val.substring(0, maxLen);
+      }
+      setDocumentNumber(val);
+      setDocNumberError(null);
+    },
+    onBlur: () => {
+      setDocNumberError(validateDocumentNumber(documentNumber, selectedDocument === null || selectedDocument === void 0 ? void 0 : selectedDocument.code, true, !!uploadedFile));
+    },
+    placeholder: t("WS_DOCUMENT_NO_PLACEHOLDER") || "Enter Document Number",
+    style: docNumberError ? {
+      border: "1px solid #d32f2f"
+    } : {},
+    maxLength: selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod2 = selectedDocument.code) !== null && _selectedDocument$cod2 !== void 0 && _selectedDocument$cod2.toUpperCase().includes("AADHAAR") || selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod3 = selectedDocument.code) !== null && _selectedDocument$cod3 !== void 0 && _selectedDocument$cod3.toUpperCase().includes("AADHAR") ? 12 : selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod4 = selectedDocument.code) !== null && _selectedDocument$cod4 !== void 0 && _selectedDocument$cod4.toUpperCase().includes("PAN") ? 10 : selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod5 = selectedDocument.code) !== null && _selectedDocument$cod5 !== void 0 && _selectedDocument$cod5.toUpperCase().includes("VOTER") || selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod6 = selectedDocument.code) !== null && _selectedDocument$cod6 !== void 0 && _selectedDocument$cod6.toUpperCase().includes("VOTERID") ? 10 : selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod7 = selectedDocument.code) !== null && _selectedDocument$cod7 !== void 0 && _selectedDocument$cod7.toUpperCase().includes("DRIVING") || selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod8 = selectedDocument.code) !== null && _selectedDocument$cod8 !== void 0 && _selectedDocument$cod8.toUpperCase().includes("DRVLC") ? 15 : selectedDocument !== null && selectedDocument !== void 0 && (_selectedDocument$cod9 = selectedDocument.code) !== null && _selectedDocument$cod9 !== void 0 && _selectedDocument$cod9.toUpperCase().includes("PASSPORT") ? 8 : 64
+  }), docNumberError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "12px",
+      color: "#d32f2f",
+      marginTop: "4px"
+    }
+  }, docNumberError), ((selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod0 = selectedDocument.code) === null || _selectedDocument$cod0 === void 0 ? void 0 : _selectedDocument$cod0.toUpperCase().includes("AADHAAR")) || (selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod1 = selectedDocument.code) === null || _selectedDocument$cod1 === void 0 ? void 0 : _selectedDocument$cod1.toUpperCase().includes("AADHAR"))) && !docNumberError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "11px",
+      color: "#000000",
+      marginTop: "4px"
+    }
+  }, t("WS_AADHAAR_VALIDATION_ERROR") || "Format: 12-digit numeric (e.g. 123456789012)"), (selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod10 = selectedDocument.code) === null || _selectedDocument$cod10 === void 0 ? void 0 : _selectedDocument$cod10.toUpperCase().includes("PAN")) && !docNumberError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "11px",
+      color: "#000000",
+      marginTop: "4px"
+    }
+  }, t("WS_PAN_VALIDATION_ERROR") || "Format: ABCDE1234F"), ((selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod11 = selectedDocument.code) === null || _selectedDocument$cod11 === void 0 ? void 0 : _selectedDocument$cod11.toUpperCase().includes("VOTER")) || (selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod12 = selectedDocument.code) === null || _selectedDocument$cod12 === void 0 ? void 0 : _selectedDocument$cod12.toUpperCase().includes("VOTERID"))) && !docNumberError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "11px",
+      color: "#000000",
+      marginTop: "4px"
+    }
+  }, t("WS_VOTERID_VALIDATION_ERROR") || "Format: ABC1234567"), ((selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod13 = selectedDocument.code) === null || _selectedDocument$cod13 === void 0 ? void 0 : _selectedDocument$cod13.toUpperCase().includes("DRIVING")) || (selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod14 = selectedDocument.code) === null || _selectedDocument$cod14 === void 0 ? void 0 : _selectedDocument$cod14.toUpperCase().includes("DRVLC"))) && !docNumberError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "11px",
+      color: "#000000",
+      marginTop: "4px"
+    }
+  }, t("WS_DRIVING_LICENSE_VALIDATION_ERROR") || "Format: MH1420110012345"), (selectedDocument === null || selectedDocument === void 0 ? void 0 : (_selectedDocument$cod15 = selectedDocument.code) === null || _selectedDocument$cod15 === void 0 ? void 0 : _selectedDocument$cod15.toUpperCase().includes("PASSPORT")) && !docNumberError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "11px",
+      color: "#000000",
+      marginTop: "4px"
+    }
+  }, t("WS_PASSPORT_VALIDATION_ERROR") || "Format: A1234567")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, {
+    className: "card-label-smaller",
+    style: {
+      marginBottom: "8px"
+    }
+  }, "Upload " + t(doc === null || doc === void 0 ? void 0 : doc.i18nKey) + " Document*"), /*#__PURE__*/React.createElement(UploadFile, {
     id: "noc-doc-" + key,
     extraStyleName: "propertyCreate",
     accept: "image/*, .pdf, .png, .jpeg, .jpg",
     onUpload: selectfile,
     onDelete: () => {
+      var _doc$dropdownData2;
       setUploadedFile(null);
+      setFile(null);
+      setDocumentNumber("");
+      setSelectedDocument((doc === null || doc === void 0 ? void 0 : (_doc$dropdownData2 = doc.dropdownData) === null || _doc$dropdownData2 === void 0 ? void 0 : _doc$dropdownData2.length) === 1 ? doc === null || doc === void 0 ? void 0 : doc.dropdownData[0] : {});
       setCheckRequiredFields(true);
     },
     message: uploadedFile ? "1 " + t("CS_ACTION_FILEUPLOADED") : t("ES_NO_FILE_SELECTED_LABEL"),
     error: error
-  }));
+  })));
 }
 
 const BannerPicker = props => {
@@ -31052,7 +31220,11 @@ function WSDocument(_ref) {
       style: {
         marginTop: "8px"
       }
-    }, t(Code === null || Code === void 0 ? void 0 : Code.split('.').slice(0, 3).join('_'))) : null);
+    }, t(Code === null || Code === void 0 ? void 0 : Code.split('.').slice(0, 3).join('_'))) : null, document !== null && document !== void 0 && document.documentNumber ? /*#__PURE__*/React.createElement("p", {
+      style: {
+        marginTop: "8px"
+      }
+    }, document === null || document === void 0 ? void 0 : document.documentNumber) : "N/A");
   }))));
 }
 
@@ -35785,19 +35957,7 @@ const CheckPage$1 = () => {
     style: {
       width: "100%"
     }
-  }, /*#__PURE__*/React.createElement(Header, {
-    styles: {
-      fontSize: "32px"
-    }
-  }, t("WS_COMMON_SUMMARY")), /*#__PURE__*/React.createElement(Card, {
-    style: {
-      paddingRight: "16px"
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      display: "inline"
-    }
-  }, /*#__PURE__*/React.createElement(CardHeader, {
+  }, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement(CardHeader, {
     styles: {
       fontSize: "28px"
     }
@@ -35815,7 +35975,7 @@ const CheckPage$1 = () => {
       display: "inline"
     },
     onClick: () => routeTo(routeLink + "/application-form")
-  })), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
+  }), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
     className: "border-none",
     label: t("WS_DISCONNECTION_CONSUMER_NUMBER"),
     text: value.connectionNo
@@ -35835,15 +35995,7 @@ const CheckPage$1 = () => {
     className: "border-none",
     label: t("WS_DISCONNECTION_REASON"),
     text: t(value.WSDisconnectionForm.reason.value.i18nKey)
-  }))), /*#__PURE__*/React.createElement(Card, {
-    style: {
-      paddingRight: "16px"
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      display: "inline"
-    }
-  }, /*#__PURE__*/React.createElement(CardHeader, {
+  })), /*#__PURE__*/React.createElement(CardHeader, {
     styles: {
       fontSize: "28px"
     }
@@ -35861,11 +36013,15 @@ const CheckPage$1 = () => {
       display: "inline"
     },
     onClick: () => routeTo(routeLink + "/documents-upload")
-  })), documents && (documents === null || documents === void 0 ? void 0 : documents.map((doc, index) => {
+  }), documents && (documents === null || documents === void 0 ? void 0 : documents.map((doc, index) => {
     var _doc$documentType;
     return /*#__PURE__*/React.createElement("div", {
       key: "doc-" + index
-    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardSectionHeader, null, t(doc === null || doc === void 0 ? void 0 : (_doc$documentType = doc.documentType) === null || _doc$documentType === void 0 ? void 0 : _doc$documentType.split('.').slice(0, 2).join('_'))), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(WSDocument, {
+    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardSectionHeader, null, t(doc === null || doc === void 0 ? void 0 : (_doc$documentType = doc.documentType) === null || _doc$documentType === void 0 ? void 0 : _doc$documentType.split('.').slice(0, 2).join('_'))), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
+      className: "border-none",
+      label: t("WS_DOCUMENT_NUMBER"),
+      text: (doc === null || doc === void 0 ? void 0 : doc.documentNumber) || (doc === null || doc === void 0 ? void 0 : doc.documentUid) || t("NA")
+    }), /*#__PURE__*/React.createElement(WSDocument, {
       value: {
         documents: value.WSDisconnectionForm
       },
@@ -35881,10 +36037,17 @@ const CheckPage$1 = () => {
         marginBottom: "20px"
       }
     }) : null)));
-  })), /*#__PURE__*/React.createElement(SubmitBar, {
+  })), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      justifyContent: "flex-end",
+      width: "100%",
+      gridColumn: "1 / -1"
+    }
+  }, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("CS_COMMON_SUBMIT"),
     onSubmit: () => onSubmit(value === null || value === void 0 ? void 0 : value.WSDisconnectionForm)
-  })))));
+  }))))));
 };
 
 const CheckPage$2 = () => {
@@ -45294,7 +45457,7 @@ function PropertyDocuments(_ref) {
     var _pdfFiles$value$fileS;
     const fileUrl = (_pdfFiles$value$fileS = pdfFiles[value.fileStoreId]) === null || _pdfFiles$value$fileS === void 0 ? void 0 : _pdfFiles$value$fileS.split(",")[0];
     const docSubType = getDocSubType(value === null || value === void 0 ? void 0 : value.documentType);
-    const docUid = (value === null || value === void 0 ? void 0 : value.documentUid) || "";
+    const docUid = (value === null || value === void 0 ? void 0 : value.documentNumber) || (value === null || value === void 0 ? void 0 : value.documentUid) || "";
     const isPhoto = value === null || value === void 0 ? void 0 : value.isPhoto;
     let typeLabel = "";
     let numLabel = "";
@@ -46490,6 +46653,7 @@ const RenewPopup = _ref => {
 };
 
 const DueVerification = _ref => {
+  var _window, _window$Digit, _window$Digit$ULBServ, _window2, _window2$Digit, _window2$Digit$Hooks, _window2$Digit$Hooks$;
   let applicationData = _ref.applicationData;
   const _useTranslation = useTranslation(),
     t = _useTranslation.t;
@@ -46558,23 +46722,67 @@ const DueVerification = _ref => {
       setTableData(applicationData.dueVerification);
     }
   }, [applicationData]);
-  const handleAdd = () => {
-    if (kno) {
-      const mockData = {
-        kno: kno,
-        fullName: "John Doe",
-        fullAddress: "123 Main St, New Delhi, Delhi 110001",
-        dueAmount: "1500",
-        totalAmount: "1500",
-        remarks: remarks
-      };
-      const newTableData = [...tableData, mockData];
-      setTableData(newTableData);
-      if (applicationData) {
-        applicationData.dueVerification = newTableData;
-      }
-      setKno("");
-      setRemarks("");
+  const tenantId = ((_window = window) === null || _window === void 0 ? void 0 : (_window$Digit = _window.Digit) === null || _window$Digit === void 0 ? void 0 : (_window$Digit$ULBServ = _window$Digit.ULBService) === null || _window$Digit$ULBServ === void 0 ? void 0 : _window$Digit$ULBServ.getCurrentTenantId()) || "dl.djb";
+  const _window$Digit$Hooks$w = (_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$Digit = _window2.Digit) === null || _window2$Digit === void 0 ? void 0 : (_window2$Digit$Hooks = _window2$Digit.Hooks) === null || _window2$Digit$Hooks === void 0 ? void 0 : (_window2$Digit$Hooks$ = _window2$Digit$Hooks.ws) === null || _window2$Digit$Hooks$ === void 0 ? void 0 : _window2$Digit$Hooks$.useDueVerification(tenantId),
+    checkDueVerification = _window$Digit$Hooks$w.mutateAsync;
+  const _useState4 = useState(null),
+    showToast = _useState4[0],
+    setShowToast = _useState4[1];
+  const handleAdd = function () {
+    try {
+      return Promise.resolve(function () {
+        if (kno) {
+          return _catch(function () {
+            return Promise.resolve(checkDueVerification({
+              DueVerification: {
+                kno: kno
+              }
+            })).then(function (response) {
+              var _response$response, _response$response$da, _response$response2, _response$response2$d, _response$response2$d2;
+              if (response !== null && response !== void 0 && (_response$response = response.response) !== null && _response$response !== void 0 && (_response$response$da = _response$response.data) !== null && _response$response$da !== void 0 && _response$response$da.Errors && (response === null || response === void 0 ? void 0 : (_response$response2 = response.response) === null || _response$response2 === void 0 ? void 0 : (_response$response2$d = _response$response2.data) === null || _response$response2$d === void 0 ? void 0 : (_response$response2$d2 = _response$response2$d.Errors) === null || _response$response2$d2 === void 0 ? void 0 : _response$response2$d2.length) > 0) {
+                setShowToast({
+                  isError: true,
+                  message: response.response.data.Errors[0].message || t("CS_SOMETHING_WENT_WRONG")
+                });
+                return;
+              }
+              const dueVerifications = Array.isArray(response) ? response : (response === null || response === void 0 ? void 0 : response.DueVerifications) || (response === null || response === void 0 ? void 0 : response.dueVerifications) || (response === null || response === void 0 ? void 0 : response.dueVerification) || [];
+              if (dueVerifications && dueVerifications.length > 0) {
+                const newEntries = dueVerifications.map(dueVerificationData => ({
+                  kno: dueVerificationData.kno || kno,
+                  fullName: dueVerificationData.fullName || "NA",
+                  fullAddress: dueVerificationData.fullAddress || "NA",
+                  dueAmount: dueVerificationData.dueAmount || "0",
+                  totalAmount: dueVerificationData.totalAmount || "0",
+                  remarks: dueVerificationData.remarks || remarks
+                }));
+                const newTableData = [...tableData, ...newEntries];
+                setTableData(newTableData);
+                if (applicationData) {
+                  applicationData.dueVerification = newTableData;
+                }
+                setKno("");
+                setRemarks("");
+              } else {
+                var _response$Errors, _response$Errors$;
+                setShowToast({
+                  isError: true,
+                  message: (response === null || response === void 0 ? void 0 : (_response$Errors = response.Errors) === null || _response$Errors === void 0 ? void 0 : (_response$Errors$ = _response$Errors[0]) === null || _response$Errors$ === void 0 ? void 0 : _response$Errors$.message) || t("CS_NO_DATA_FOUND") || "No data found for this K No."
+                });
+              }
+            });
+          }, function (error) {
+            var _error$response, _error$response$data, _error$response$data$, _error$response$data$2;
+            console.error("Error fetching due verification data:", error);
+            setShowToast({
+              isError: true,
+              message: (error === null || error === void 0 ? void 0 : (_error$response = error.response) === null || _error$response === void 0 ? void 0 : (_error$response$data = _error$response.data) === null || _error$response$data === void 0 ? void 0 : (_error$response$data$ = _error$response$data.Errors) === null || _error$response$data$ === void 0 ? void 0 : (_error$response$data$2 = _error$response$data$[0]) === null || _error$response$data$2 === void 0 ? void 0 : _error$response$data$2.message) || (error === null || error === void 0 ? void 0 : error.message) || t("CS_SOMETHING_WENT_WRONG") || "Something went wrong."
+            });
+          });
+        }
+      }());
+    } catch (e) {
+      return Promise.reject(e);
     }
   };
   return /*#__PURE__*/React.createElement("div", {
@@ -46610,7 +46818,7 @@ const DueVerification = _ref => {
       color: "red"
     }
   }, "*")), /*#__PURE__*/React.createElement(TextInput, {
-    type: "number",
+    type: "text",
     value: kno,
     onChange: e => setKno(e.target.value),
     style: {
@@ -46647,7 +46855,12 @@ const DueVerification = _ref => {
     isPaginationRequired: true,
     data: tableData,
     columns: columns
-  })));
+  })), showToast && /*#__PURE__*/React.createElement(Toast, {
+    error: showToast.isError,
+    label: showToast.message,
+    onClose: () => setShowToast(null),
+    isDleteBtn: true
+  }));
 };
 
 const InspectionInformation = _ref => {
@@ -50698,9 +50911,11 @@ const Step1_SearchConnection = _ref => {
       return Promise.reject(e);
     }
   };
+  const isMobileView = window.innerWidth < 768;
   return /*#__PURE__*/React.createElement(Card, {
     style: {
-      marginBottom: "20px"
+      marginBottom: "20px",
+      padding: isMobileView ? "12px" : undefined
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
@@ -50712,19 +50927,23 @@ const Step1_SearchConnection = _ref => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
-      fontSize: "24px"
+      fontSize: isMobileView ? "20px" : "24px"
     }
   }, "\uD83D\uDD0D"), /*#__PURE__*/React.createElement("h2", {
     style: {
-      fontSize: "18px",
+      fontSize: isMobileView ? "16px" : "18px",
       fontWeight: "700",
       margin: 0
     }
-  }, "1. Connection Authentication")), /*#__PURE__*/React.createElement(CardText, null, "Please enter your K Number to proceed with the mutation application. An OTP will be sent to the registered mobile number."), /*#__PURE__*/React.createElement("div", {
+  }, "1. Connection Authentication")), /*#__PURE__*/React.createElement(CardText, {
+    style: {
+      fontSize: isMobileView ? "13px" : undefined
+    }
+  }, "Please enter your K Number to proceed with the mutation application. An OTP will be sent to the registered mobile number."), /*#__PURE__*/React.createElement("div", {
     style: {
       marginBottom: "24px",
       marginTop: "16px",
-      padding: "16px",
+      padding: isMobileView ? "12px" : "16px",
       backgroundColor: "#f9f9f9",
       borderRadius: "8px",
       borderLeft: "4px solid #00497e"
@@ -50736,26 +50955,26 @@ const Step1_SearchConnection = _ref => {
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       fontWeight: "bold",
-      marginBottom: "8px"
+      marginBottom: "8px",
+      fontSize: isMobileView ? "14px" : undefined
     }
   }, "K Number / Connection ID *"), /*#__PURE__*/React.createElement(TextInput, {
     value: kNumber,
     onChange: e => setKNumber(e.target.value),
     placeholder: "Enter K Number",
     style: {
-      width: "100%",
-      maxWidth: "400px"
+      width: "100%"
     }
   })), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
-      justifyContent: "flex-end"
+      justifyContent: isMobileView ? "center" : "flex-end"
     }
   }, /*#__PURE__*/React.createElement("button", {
     onClick: handleSendOtp,
     disabled: isLoading,
     style: {
-      padding: "10px 20px",
+      padding: isMobileView ? "12px 16px" : "10px 20px",
       backgroundColor: "#00497e",
       color: "white",
       border: "none",
@@ -50763,8 +50982,9 @@ const Step1_SearchConnection = _ref => {
       cursor: "pointer",
       fontWeight: "bold",
       opacity: isLoading ? 0.7 : 1,
-      width: "100%",
-      maxWidth: "200px"
+      width: isMobileView ? "100%" : "auto",
+      maxWidth: isMobileView ? "100%" : "200px",
+      fontSize: isMobileView ? "14px" : undefined
     }
   }, isLoading ? "Sending OTP..." : "Send OTP →"))), showToast && /*#__PURE__*/React.createElement(Toast, {
     error: showToast.key === "error",
@@ -50860,6 +51080,7 @@ const Step1_ExistingConnection = _ref => {
       return Promise.reject(e);
     }
   };
+  const isMobileView = window.innerWidth < 768;
   const infoItemStyle = {
     display: "flex",
     flexDirection: "column",
@@ -50867,11 +51088,12 @@ const Step1_ExistingConnection = _ref => {
   };
   return /*#__PURE__*/React.createElement(Card, {
     style: {
-      marginBottom: "20px"
+      marginBottom: "20px",
+      padding: isMobileView ? "12px" : undefined
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "12px 16px",
+      padding: isMobileView ? "10px 12px" : "12px 16px",
       backgroundColor: "#fff3cd",
       color: "#856404",
       borderRadius: "8px",
@@ -50883,17 +51105,18 @@ const Step1_ExistingConnection = _ref => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
-      fontSize: "18px",
+      fontSize: isMobileView ? "16px" : "18px",
       flexShrink: 0
     }
   }, "\u2139\uFE0F"), /*#__PURE__*/React.createElement("span", {
     style: {
       fontWeight: "500",
-      fontSize: "14px"
+      fontSize: isMobileView ? "12px" : "14px",
+      lineHeight: "1.4"
     }
   }, "Name Change / Mutation is limited to changing the name of the consumer/account holder on the existing water connection. It does not constitute or imply transfer of property ownership.")), missingFields.length > 0 && /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "12px 16px",
+      padding: isMobileView ? "10px 12px" : "12px 16px",
       backgroundColor: "#fdecea",
       color: "#611a15",
       borderRadius: "8px",
@@ -50911,7 +51134,7 @@ const Step1_ExistingConnection = _ref => {
   }, "\u26A0\uFE0F"), /*#__PURE__*/React.createElement("span", {
     style: {
       fontWeight: "500",
-      fontSize: "14px"
+      fontSize: isMobileView ? "12px" : "14px"
     }
   }, "Note: Some connection details are missing (", missingFields.join(", "), "). You may need to update them during the mutation process.")), /*#__PURE__*/React.createElement("div", {
     style: {
@@ -50923,17 +51146,17 @@ const Step1_ExistingConnection = _ref => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
-      fontSize: "22px"
+      fontSize: isMobileView ? "20px" : "22px"
     }
   }, "\uD83C\uDFE2"), /*#__PURE__*/React.createElement("h2", {
     style: {
-      fontSize: "18px",
+      fontSize: isMobileView ? "16px" : "18px",
       fontWeight: "700",
       margin: 0
     }
   }, "2. Existing Consumer Details")), /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "16px",
+      padding: isMobileView ? "12px" : "16px",
       backgroundColor: "#f9f9f9",
       borderRadius: "8px",
       borderLeft: "4px solid #00497e"
@@ -50941,95 +51164,103 @@ const Step1_ExistingConnection = _ref => {
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
-      gap: "16px"
+      gridTemplateColumns: isMobileView ? "1fr 1fr" : "repeat(auto-fill, minmax(150px, 1fr))",
+      gap: isMobileView ? "12px" : "16px"
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: infoItemStyle
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#555",
-      fontSize: "13px",
+      fontSize: isMobileView ? "11px" : "13px",
       marginBottom: "4px"
     }
   }, "Connection Number"), /*#__PURE__*/React.createElement("div", {
     style: {
       fontWeight: "bold",
-      wordBreak: "break-all"
+      wordBreak: "break-all",
+      fontSize: isMobileView ? "13px" : undefined
     }
   }, connectionNo)), /*#__PURE__*/React.createElement("div", {
     style: infoItemStyle
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#555",
-      fontSize: "13px",
+      fontSize: isMobileView ? "11px" : "13px",
       marginBottom: "4px"
     }
   }, "Current Owner Name"), /*#__PURE__*/React.createElement("div", {
     style: {
       fontWeight: "bold",
-      wordBreak: "break-word"
+      wordBreak: "break-word",
+      fontSize: isMobileView ? "13px" : undefined
     }
   }, registeredName)), /*#__PURE__*/React.createElement("div", {
-    style: infoItemStyle
+    style: _extends({}, infoItemStyle, {
+      gridColumn: isMobileView ? "1 / -1" : undefined
+    })
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#555",
-      fontSize: "13px",
+      fontSize: isMobileView ? "11px" : "13px",
       marginBottom: "4px"
     }
   }, "Property Address"), /*#__PURE__*/React.createElement("div", {
     style: {
       fontWeight: "bold",
-      wordBreak: "break-word"
+      wordBreak: "break-word",
+      fontSize: isMobileView ? "13px" : undefined
     }
   }, formattedAddress)), /*#__PURE__*/React.createElement("div", {
     style: infoItemStyle
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#555",
-      fontSize: "13px",
+      fontSize: isMobileView ? "11px" : "13px",
       marginBottom: "4px"
     }
   }, "Connection Status"), /*#__PURE__*/React.createElement("div", {
     style: {
       fontWeight: "bold",
-      color: (connectionStatus === null || connectionStatus === void 0 ? void 0 : connectionStatus.toLowerCase()) === "active" ? "#28a745" : "#dc3545"
+      color: (connectionStatus === null || connectionStatus === void 0 ? void 0 : connectionStatus.toLowerCase()) === "active" ? "#28a745" : "#dc3545",
+      fontSize: isMobileView ? "13px" : undefined
     }
   }, connectionStatus)), /*#__PURE__*/React.createElement("div", {
     style: infoItemStyle
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#555",
-      fontSize: "13px",
+      fontSize: isMobileView ? "11px" : "13px",
       marginBottom: "4px"
     }
   }, "Meter Number"), /*#__PURE__*/React.createElement("div", {
     style: {
       fontWeight: "bold",
-      wordBreak: "break-all"
+      wordBreak: "break-all",
+      fontSize: isMobileView ? "13px" : undefined
     }
   }, meterId)), /*#__PURE__*/React.createElement("div", {
     style: infoItemStyle
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#555",
-      fontSize: "13px",
+      fontSize: isMobileView ? "11px" : "13px",
       marginBottom: "4px"
     }
   }, "Mobile Number"), /*#__PURE__*/React.createElement("div", {
     style: {
-      fontWeight: "bold"
+      fontWeight: "bold",
+      fontSize: isMobileView ? "13px" : undefined
     }
   }, registeredPhone)))), /*#__PURE__*/React.createElement("div", {
     style: {
-      marginTop: "24px",
+      marginTop: isMobileView ? "16px" : "24px",
       borderTop: "1px solid #e0e0e0",
       paddingTop: "16px"
     }
   }, /*#__PURE__*/React.createElement("h3", {
     style: {
-      fontSize: "16px",
+      fontSize: isMobileView ? "14px" : "16px",
       fontWeight: "bold",
       marginBottom: "16px"
     }
@@ -51038,29 +51269,31 @@ const Step1_ExistingConnection = _ref => {
       display: "flex",
       flexDirection: "column",
       gap: "8px",
-      maxWidth: "400px",
       marginBottom: "16px"
     }
   }, /*#__PURE__*/React.createElement("label", {
     style: {
       fontWeight: "500",
-      fontSize: "14px"
+      fontSize: isMobileView ? "13px" : "14px"
     }
   }, "Enter OTP sent to +91 ", getMaskedPhone(mobileNumber), " *"), /*#__PURE__*/React.createElement(TextInput, {
     value: otp,
     onChange: e => setOtp(e.target.value.replace(/\D/g, '').slice(0, 6)),
     placeholder: "Enter 6-digit OTP",
-    maxLength: 6
+    maxLength: 6,
+    style: {
+      width: "100%"
+    }
   })), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
-      justifyContent: "flex-end"
+      justifyContent: isMobileView ? "center" : "flex-end"
     }
   }, /*#__PURE__*/React.createElement("button", {
     onClick: handleVerifyOtp,
     disabled: isLoading || otp.length < 6,
     style: {
-      padding: "10px 20px",
+      padding: isMobileView ? "12px 16px" : "10px 20px",
       backgroundColor: "#00497e",
       color: "white",
       border: "none",
@@ -51068,8 +51301,9 @@ const Step1_ExistingConnection = _ref => {
       cursor: isLoading || otp.length < 6 ? "not-allowed" : "pointer",
       fontWeight: "bold",
       opacity: isLoading || otp.length < 6 ? 0.5 : 1,
-      width: "100%",
-      maxWidth: "200px"
+      width: isMobileView ? "100%" : "auto",
+      maxWidth: isMobileView ? "100%" : "200px",
+      fontSize: isMobileView ? "14px" : undefined
     }
   }, isLoading ? "Verifying..." : "Verify & Proceed →"))), showToast && /*#__PURE__*/React.createElement(Toast, {
     error: (showToast === null || showToast === void 0 ? void 0 : showToast.key) === "error",
@@ -51138,6 +51372,7 @@ const Step2_NewConsumerDetails = _ref => {
     code: "OTHER",
     i18nKey: "Other"
   }];
+  const isMobileView = window.innerWidth < 768;
   const errorStyle = {
     width: "100%",
     marginLeft: "0px",
@@ -51186,7 +51421,8 @@ const Step2_NewConsumerDetails = _ref => {
   }, "*");
   return /*#__PURE__*/React.createElement(Card, {
     style: {
-      marginBottom: "20px"
+      marginBottom: "20px",
+      padding: isMobileView ? "12px" : undefined
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
@@ -51198,17 +51434,17 @@ const Step2_NewConsumerDetails = _ref => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
-      fontSize: "22px"
+      fontSize: isMobileView ? "20px" : "22px"
     }
   }, "\uD83D\uDC64"), /*#__PURE__*/React.createElement("h2", {
     style: {
-      fontSize: "18px",
+      fontSize: isMobileView ? "16px" : "18px",
       fontWeight: "700",
       margin: 0
     }
   }, "2. New Consumer Details.")), Object.keys(errors).length > 0 && /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "12px 16px",
+      padding: isMobileView ? "10px 12px" : "12px 16px",
       backgroundColor: "#fdecea",
       color: "#611a15",
       borderRadius: "8px",
@@ -51226,7 +51462,7 @@ const Step2_NewConsumerDetails = _ref => {
   }, "\u26A0\uFE0F"), /*#__PURE__*/React.createElement("span", {
     style: {
       fontWeight: "500",
-      fontSize: "14px"
+      fontSize: isMobileView ? "12px" : "14px"
     }
   }, "Please fill in all required fields marked with ", /*#__PURE__*/React.createElement("span", {
     style: {
@@ -51238,8 +51474,8 @@ const Step2_NewConsumerDetails = _ref => {
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(240px, 1fr))",
-      gap: "20px",
+      gridTemplateColumns: isMobileView ? "1fr" : "repeat(auto-fill, minmax(240px, 1fr))",
+      gap: isMobileView ? "16px" : "20px",
       padding: "8px 0 16px"
     }
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, {
@@ -51435,13 +51671,13 @@ const Step2_NewConsumerDetails = _ref => {
   }, errors === null || errors === void 0 ? void 0 : (_errors$relationshipW = errors.relationshipWithExistingConsumer) === null || _errors$relationshipW === void 0 ? void 0 : _errors$relationshipW.message))), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
+      flexDirection: isMobileView ? "column" : "row",
       justifyContent: "space-between",
-      alignItems: "center",
+      alignItems: isMobileView ? "stretch" : "center",
       marginTop: "24px",
-      flexWrap: "wrap",
       gap: "12px"
     }
-  }, /*#__PURE__*/React.createElement("button", {
+  }, !isMobileView && /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onBack,
     style: {
@@ -51455,14 +51691,15 @@ const Step2_NewConsumerDetails = _ref => {
   }, "\u2190 Back"), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
-      alignItems: "center",
-      gap: "12px",
-      flexWrap: "wrap"
+      flexDirection: isMobileView ? "column" : "row",
+      alignItems: isMobileView ? "stretch" : "center",
+      gap: "12px"
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
       fontSize: "12px",
-      color: "#999"
+      color: "#999",
+      textAlign: isMobileView ? "center" : undefined
     }
   }, "Fields marked with ", /*#__PURE__*/React.createElement("span", {
     style: {
@@ -51471,15 +51708,30 @@ const Step2_NewConsumerDetails = _ref => {
   }, "*"), " are mandatory"), /*#__PURE__*/React.createElement("button", {
     type: "submit",
     style: {
-      padding: "10px 20px",
+      padding: isMobileView ? "14px 20px" : "10px 20px",
       backgroundColor: "#00497e",
       color: "white",
       border: "none",
       borderRadius: "4px",
       cursor: "pointer",
-      fontWeight: "bold"
+      fontWeight: "bold",
+      width: isMobileView ? "100%" : "auto",
+      fontSize: isMobileView ? "14px" : undefined
+    }
+  }, "Save & Proceed to Documents \u2192")), isMobileView && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onBack,
+    style: {
+      padding: "12px 20px",
+      backgroundColor: "#e0e0e0",
+      border: "none",
+      borderRadius: "4px",
+      cursor: "pointer",
+      fontWeight: "bold",
+      width: "100%",
+      fontSize: "14px"
     }
-  }, "Save & Proceed to Documents \u2192")))), showToast && /*#__PURE__*/React.createElement(Toast, {
+  }, "\u2190 Back"))), showToast && /*#__PURE__*/React.createElement(Toast, {
     error: showToast.key === "error",
     warning: showToast.key === "warning",
     label: t(showToast.message),
@@ -51763,6 +52015,7 @@ const Step3_UploadDocuments = _ref => {
     marginTop: "8px",
     transition: "all 0.2s ease"
   });
+  const isMobileView = window.innerWidth < 768;
   const errorTextStyle = {
     fontSize: "12px",
     color: "#d32f2f",
@@ -51783,7 +52036,8 @@ const Step3_UploadDocuments = _ref => {
   const errorCount = Object.keys(fieldErrors).length;
   return /*#__PURE__*/React.createElement(Card, {
     style: {
-      marginBottom: "20px"
+      marginBottom: "20px",
+      padding: isMobileView ? "12px" : undefined
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
@@ -51793,23 +52047,24 @@ const Step3_UploadDocuments = _ref => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
-      fontSize: "24px",
+      fontSize: isMobileView ? "20px" : "24px",
       marginRight: "8px"
     }
   }, "\uD83D\uDCC4"), /*#__PURE__*/React.createElement("h2", {
     style: {
-      fontSize: "20px",
+      fontSize: isMobileView ? "16px" : "20px",
       fontWeight: "700",
       margin: 0
     }
   }, "3. Upload Verification Documents")), /*#__PURE__*/React.createElement("p", {
     style: {
       color: "#666",
-      marginBottom: "20px"
+      marginBottom: "20px",
+      fontSize: isMobileView ? "12px" : undefined
     }
   }, "Please upload legible scanned copies or photos (PDF, PNG, JPEG - Max 5MB)."), hasAttemptedSubmit && errorCount > 0 && /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "12px 16px",
+      padding: isMobileView ? "10px 12px" : "12px 16px",
       backgroundColor: "#fdecea",
       color: "#611a15",
       borderRadius: "8px",
@@ -51827,13 +52082,13 @@ const Step3_UploadDocuments = _ref => {
   }, "\u26A0\uFE0F"), /*#__PURE__*/React.createElement("span", {
     style: {
       fontWeight: "500",
-      fontSize: "14px"
+      fontSize: isMobileView ? "12px" : "14px"
     }
   }, errorCount, " required item", errorCount > 1 ? "s" : "", " still need", errorCount === 1 ? "s" : "", " your attention before proceeding.")), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(280px, 1fr))",
-      gap: "24px"
+      gridTemplateColumns: isMobileView ? "1fr" : "repeat(auto-fill, minmax(280px, 1fr))",
+      gap: isMobileView ? "20px" : "24px"
     }
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, {
     style: {
@@ -52008,13 +52263,13 @@ const Step3_UploadDocuments = _ref => {
   }, "\uD83D\uDCC4"), " View ", mutationFileName)))), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
+      flexDirection: isMobileView ? "column" : "row",
       justifyContent: "space-between",
-      alignItems: "center",
-      marginTop: "32px",
-      flexWrap: "wrap",
+      alignItems: isMobileView ? "stretch" : "center",
+      marginTop: isMobileView ? "24px" : "32px",
       gap: "12px"
     }
-  }, /*#__PURE__*/React.createElement("button", {
+  }, !isMobileView && /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onBack,
     style: {
@@ -52028,29 +52283,45 @@ const Step3_UploadDocuments = _ref => {
   }, "\u2190 Back"), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
-      alignItems: "center",
-      gap: "12px",
-      flexWrap: "wrap"
+      flexDirection: isMobileView ? "column" : "row",
+      alignItems: isMobileView ? "stretch" : "center",
+      gap: "12px"
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
       fontSize: "12px",
-      color: "#999"
+      color: "#999",
+      textAlign: isMobileView ? "center" : undefined
     }
   }, "All documents are mandatory"), /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onProceed,
     disabled: isUploading,
     style: {
-      padding: "10px 20px",
+      padding: isMobileView ? "14px 20px" : "10px 20px",
       backgroundColor: isUploading ? "#ccc" : "#00497e",
       color: "white",
       border: "none",
       borderRadius: "4px",
       cursor: isUploading ? "not-allowed" : "pointer",
-      fontWeight: "bold"
+      fontWeight: "bold",
+      width: isMobileView ? "100%" : "auto",
+      fontSize: isMobileView ? "14px" : undefined
+    }
+  }, isUploading ? "Uploading..." : "Proceed to Preview →")), isMobileView && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onBack,
+    style: {
+      padding: "12px 20px",
+      backgroundColor: "#e0e0e0",
+      border: "none",
+      borderRadius: "4px",
+      cursor: "pointer",
+      fontWeight: "bold",
+      width: "100%",
+      fontSize: "14px"
     }
-  }, isUploading ? "Uploading..." : "Proceed to Application Preview →"))), showToast && /*#__PURE__*/React.createElement(Toast, {
+  }, "\u2190 Back")), showToast && /*#__PURE__*/React.createElement(Toast, {
     error: showToast.key === "error",
     warning: showToast.key === "warning",
     success: showToast.key === "success",
@@ -52181,24 +52452,25 @@ const Step4_Preview = _ref => {
     };
     calculateStaticFee();
   }, [formData]);
+  const isMobileView = window.innerWidth < 768;
   const sectionStyle = {
     border: "1px solid #e0e0e0",
     borderRadius: "8px",
-    padding: "16px",
+    padding: isMobileView ? "12px" : "16px",
     marginBottom: "16px"
   };
   const labelStyle = {
     color: "#666",
-    fontSize: "13px",
+    fontSize: isMobileView ? "11px" : "13px",
     marginBottom: "4px"
   };
   const valueStyle = {
     fontWeight: "bold",
-    fontSize: "15px",
+    fontSize: isMobileView ? "13px" : "15px",
     wordBreak: "break-word"
   };
   const uploadDocStatusStyle = {
-    fontSize: "14px",
+    fontSize: isMobileView ? "12px" : "14px",
     fontWeight: "bold"
   };
   const infoItem = (label, value) => /*#__PURE__*/React.createElement("div", {
@@ -52212,7 +52484,8 @@ const Step4_Preview = _ref => {
   }, value));
   return /*#__PURE__*/React.createElement(Card, {
     style: {
-      marginBottom: "20px"
+      marginBottom: "20px",
+      padding: isMobileView ? "12px" : undefined
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
@@ -52224,11 +52497,11 @@ const Step4_Preview = _ref => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     style: {
-      fontSize: "22px"
+      fontSize: isMobileView ? "20px" : "22px"
     }
   }, "\uD83D\uDCCB"), /*#__PURE__*/React.createElement("h2", {
     style: {
-      fontSize: "18px",
+      fontSize: isMobileView ? "15px" : "18px",
       fontWeight: "700",
       margin: 0
     }
@@ -52238,7 +52511,7 @@ const Step4_Preview = _ref => {
     })
   }, /*#__PURE__*/React.createElement("h3", {
     style: {
-      fontSize: "15px",
+      fontSize: isMobileView ? "13px" : "15px",
       fontWeight: "bold",
       color: "#00497e",
       marginBottom: "12px"
@@ -52246,8 +52519,8 @@ const Step4_Preview = _ref => {
   }, "Property & Connection Summary"), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
-      gap: "16px"
+      gridTemplateColumns: isMobileView ? "1fr 1fr" : "repeat(auto-fill, minmax(150px, 1fr))",
+      gap: isMobileView ? "12px" : "16px"
     }
   }, infoItem("Connection No", connectionNo), infoItem("Meter Number", meterId), infoItem("Property ID", propertyId))), /*#__PURE__*/React.createElement("div", {
     style: _extends({}, sectionStyle, {
@@ -52255,16 +52528,16 @@ const Step4_Preview = _ref => {
     })
   }, /*#__PURE__*/React.createElement("h3", {
     style: {
-      fontSize: "15px",
+      fontSize: isMobileView ? "13px" : "15px",
       fontWeight: "bold",
       color: "#f29c1f",
       marginBottom: "12px"
     }
-  }, "\uD83D\uDD12 Existing / Previous Owner Details (Masked Information)"), /*#__PURE__*/React.createElement("div", {
+  }, "\uD83D\uDD12 Existing / Previous Owner Details (Masked)"), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
-      gap: "16px",
+      gridTemplateColumns: isMobileView ? "1fr" : "repeat(auto-fill, minmax(150px, 1fr))",
+      gap: isMobileView ? "12px" : "16px",
       marginBottom: "12px"
     }
   }, infoItem("Registered Name:", oldName), infoItem("Registered Phone:", oldPhone)), infoItem("Registered Address:", oldAddress)), /*#__PURE__*/React.createElement("div", {
@@ -52273,7 +52546,7 @@ const Step4_Preview = _ref => {
     })
   }, /*#__PURE__*/React.createElement("h3", {
     style: {
-      fontSize: "15px",
+      fontSize: isMobileView ? "13px" : "15px",
       fontWeight: "bold",
       color: "#00497e",
       marginBottom: "12px"
@@ -52281,8 +52554,8 @@ const Step4_Preview = _ref => {
   }, "\uD83D\uDC64 Transferee (New Owner) Summary"), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
-      gap: "16px"
+      gridTemplateColumns: isMobileView ? "1fr 1fr" : "repeat(auto-fill, minmax(150px, 1fr))",
+      gap: isMobileView ? "12px" : "16px"
     }
   }, infoItem("New Owner Name", proposedNewConsumerName), infoItem("Mobile Number", newOwnerMobileNumber), infoItem("Relation Type", getRelationshipName(relationshipWithExistingConsumer)), infoItem("Transfer Reason", getReasonName(reasonForNameChange)))), /*#__PURE__*/React.createElement("div", {
     style: _extends({}, sectionStyle, {
@@ -52290,7 +52563,7 @@ const Step4_Preview = _ref => {
     })
   }, /*#__PURE__*/React.createElement("h3", {
     style: {
-      fontSize: "15px",
+      fontSize: isMobileView ? "13px" : "15px",
       fontWeight: "bold",
       color: "#17a2b8",
       marginBottom: "12px"
@@ -52298,8 +52571,8 @@ const Step4_Preview = _ref => {
   }, "Uploaded Documents"), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
-      gap: "16px"
+      gridTemplateColumns: isMobileView ? "1fr" : "repeat(auto-fill, minmax(150px, 1fr))",
+      gap: isMobileView ? "12px" : "16px"
     }
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
     style: labelStyle
@@ -52321,7 +52594,7 @@ const Step4_Preview = _ref => {
       border: "none",
       textDecoration: "underline",
       cursor: "pointer",
-      fontSize: "14px",
+      fontSize: isMobileView ? "12px" : "14px",
       fontWeight: "bold",
       padding: 0
     }
@@ -52349,7 +52622,7 @@ const Step4_Preview = _ref => {
       border: "none",
       textDecoration: "underline",
       cursor: "pointer",
-      fontSize: "14px",
+      fontSize: isMobileView ? "12px" : "14px",
       fontWeight: "bold",
       padding: 0
     }
@@ -52361,7 +52634,7 @@ const Step4_Preview = _ref => {
     })
   }, /*#__PURE__*/React.createElement("h3", {
     style: {
-      fontSize: "15px",
+      fontSize: isMobileView ? "13px" : "15px",
       fontWeight: "bold",
       color: "#28a745",
       marginBottom: "12px"
@@ -52376,7 +52649,7 @@ const Step4_Preview = _ref => {
       display: "flex",
       justifyContent: "space-between",
       marginBottom: "8px",
-      maxWidth: "400px"
+      maxWidth: isMobileView ? "100%" : "400px"
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: labelStyle
@@ -52386,13 +52659,13 @@ const Step4_Preview = _ref => {
     style: {
       borderTop: "1px solid #c3e6cb",
       margin: "12px 0",
-      maxWidth: "400px"
+      maxWidth: isMobileView ? "100%" : "400px"
     }
   })), /*#__PURE__*/React.createElement("div", {
     style: {
       display: "flex",
       justifyContent: "space-between",
-      maxWidth: "400px",
+      maxWidth: isMobileView ? "100%" : "400px",
       flexWrap: "wrap",
       gap: "8px"
     }
@@ -52401,7 +52674,7 @@ const Step4_Preview = _ref => {
   }, "Total Amount Payable:"), /*#__PURE__*/React.createElement("div", {
     style: _extends({}, valueStyle, {
       color: "#28a745",
-      fontSize: "20px"
+      fontSize: isMobileView ? "18px" : "20px"
     })
   }, "\u20B9 ", fee, ".00")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
     style: labelStyle
@@ -52411,14 +52684,14 @@ const Step4_Preview = _ref => {
       backgroundColor: "#d1ecf1",
       color: "#0c5460",
       borderRadius: "16px",
-      fontSize: "12px",
+      fontSize: isMobileView ? "10px" : "12px",
       fontWeight: "bold",
       display: "inline-block",
       marginTop: "4px"
     }
   }, "PAYABLE POST VERIFICATION")))), /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "16px",
+      padding: isMobileView ? "12px" : "16px",
       backgroundColor: "#fffbeb",
       border: "1px solid #ffeeba",
       borderRadius: "8px",
@@ -52427,8 +52700,47 @@ const Step4_Preview = _ref => {
   }, /*#__PURE__*/React.createElement(CheckBox, {
     label: "I want to go ahead with submitting this application. I confirm that the details and information provided by me are true and correct to the best of my knowledge.",
     onChange: e => setAgreed(e.target.checked),
-    checked: agreed
-  })), /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement("button", {
+    checked: agreed,
+    style: isMobileView ? {
+      fontSize: "12px"
+    } : undefined
+  })), isMobileView ? /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "12px",
+      marginBottom: "16px"
+    }
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onSubmit,
+    disabled: !agreed || isLoading,
+    style: {
+      padding: "14px 20px",
+      backgroundColor: !agreed || isLoading ? "#ccc" : "#00497e",
+      color: "white",
+      border: "none",
+      borderRadius: "4px",
+      cursor: !agreed || isLoading ? "not-allowed" : "pointer",
+      fontWeight: "bold",
+      fontSize: "15px",
+      width: "100%",
+      opacity: !agreed || isLoading ? 0.6 : 1
+    }
+  }, isLoading ? "Submitting..." : "Submit Mutation Application"), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onBack,
+    style: {
+      padding: "12px 20px",
+      backgroundColor: "#e0e0e0",
+      border: "none",
+      borderRadius: "4px",
+      cursor: "pointer",
+      fontWeight: "bold",
+      width: "100%",
+      fontSize: "14px"
+    }
+  }, "\u2190 Edit Information")) : /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onBack,
     style: {
@@ -52460,9 +52772,10 @@ const Step5_Submission = _ref => {
   const goHome = () => {
     history.push("/digit-ui/employee");
   };
+  const isMobileView = window.innerWidth < 768;
   return /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "16px 0"
+      padding: isMobileView ? "8px 0" : "16px 0"
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
@@ -52470,18 +52783,18 @@ const Step5_Submission = _ref => {
       border: "1px solid #d4edda",
       borderTop: "4px solid #28a745",
       borderRadius: "8px",
-      padding: "20px",
+      padding: isMobileView ? "16px" : "20px",
       display: "flex",
+      flexDirection: isMobileView ? "column" : "row",
       justifyContent: "space-between",
-      alignItems: "flex-start",
-      flexWrap: "wrap",
+      alignItems: isMobileView ? "stretch" : "flex-start",
       gap: "12px",
       marginBottom: "20px"
     }
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h2", {
     style: {
       color: "#28a745",
-      fontSize: "18px",
+      fontSize: isMobileView ? "15px" : "18px",
       fontWeight: "bold",
       margin: "0 0 4px",
       display: "flex",
@@ -52489,24 +52802,28 @@ const Step5_Submission = _ref => {
       flexWrap: "wrap",
       gap: "6px"
     }
-  }, /*#__PURE__*/React.createElement("span", null, "\u2705"), " Your application has been submitted successfully to the respective Zonal Officer !"), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement("span", null, "\u2705"), " Your application has been submitted successfully to the respective Zonal Officer!"), /*#__PURE__*/React.createElement("div", {
     style: {
       color: "#666",
       marginTop: "4px",
-      fontSize: "14px",
+      fontSize: isMobileView ? "13px" : "14px",
       wordBreak: "break-all"
     }
   }, "Your SRN Reference No. is: ", /*#__PURE__*/React.createElement("strong", {
     style: {
       color: "#00497e"
     }
-  }, applicationNumber))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+  }, applicationNumber))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      alignSelf: isMobileView ? "flex-start" : undefined
+    }
+  }, /*#__PURE__*/React.createElement("span", {
     style: {
       padding: "6px 12px",
       backgroundColor: "#fff3cd",
       color: "#856404",
       borderRadius: "16px",
-      fontSize: "12px",
+      fontSize: isMobileView ? "11px" : "12px",
       fontWeight: "bold",
       whiteSpace: "nowrap"
     }
@@ -52518,7 +52835,7 @@ const Step5_Submission = _ref => {
   }, /*#__PURE__*/React.createElement("button", {
     onClick: goHome,
     style: {
-      padding: "12px 28px",
+      padding: isMobileView ? "14px 28px" : "12px 28px",
       backgroundColor: "#00497e",
       color: "white",
       border: "none",
@@ -52526,7 +52843,7 @@ const Step5_Submission = _ref => {
       cursor: "pointer",
       fontWeight: "bold",
       fontSize: "15px",
-      width: "100%",
+      width: isMobileView ? "100%" : "auto",
       maxWidth: "280px"
     }
   }, "Go to Home")), showToast && /*#__PURE__*/React.createElement(Toast, {
@@ -52538,7 +52855,7 @@ const Step5_Submission = _ref => {
 };
 
 const MutationApplication = () => {
-  var _Digit$SessionStorage, _user$info, _state, _user$info2, _user$info2$userName, _user$info3, _user$info4, _details$applicationD, _applicationDetails$a, _applicationDetails$a2, _applicationDetails$a4, _applicationDetails$a7, _applicationDetails$a8;
+  var _Digit$SessionStorage, _user$info, _state, _user$info2, _user$info2$userName, _user$info3, _user$info4, _details$applicationD, _applicationDetails$a, _applicationDetails$a2, _applicationDetails$a4, _applicationDetails$a8, _applicationDetails$a9;
   const _useTranslation = useTranslation(),
     t = _useTranslation.t;
   let _useLocation = useLocation(),
@@ -52790,7 +53107,7 @@ const MutationApplication = () => {
     try {
       setIsSubmitting(true);
       return Promise.resolve(_catch(function () {
-        var _finalData$cpt;
+        var _finalData$cpt, _applicationDetails$a5, _applicationDetails$W, _applicationDetails$W2, _applicationDetails$S, _applicationDetails$S2, _details$applicationD2;
         let finalData = _extends({}, sessionFormData);
         if (!(finalData !== null && finalData !== void 0 && (_finalData$cpt = finalData.cpt) !== null && _finalData$cpt !== void 0 && _finalData$cpt.details)) {
           var _propertyDetails$Prop3;
@@ -52821,7 +53138,9 @@ const MutationApplication = () => {
           })];
         }
         const sessionDetails = sessionStorage.getItem("WS_EDIT_APPLICATION_DETAILS") ? JSON.parse(sessionStorage.getItem("WS_EDIT_APPLICATION_DETAILS")) : {};
+        const existingDocs = (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a5 = applicationDetails.applicationData) === null || _applicationDetails$a5 === void 0 ? void 0 : _applicationDetails$a5.documents) || (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$W = applicationDetails.WaterConnection) === null || _applicationDetails$W === void 0 ? void 0 : (_applicationDetails$W2 = _applicationDetails$W[0]) === null || _applicationDetails$W2 === void 0 ? void 0 : _applicationDetails$W2.documents) || (applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$S = applicationDetails.SewerageConnections) === null || _applicationDetails$S === void 0 ? void 0 : (_applicationDetails$S2 = _applicationDetails$S[0]) === null || _applicationDetails$S2 === void 0 ? void 0 : _applicationDetails$S2.documents) || (applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.documents) || (details === null || details === void 0 ? void 0 : (_details$applicationD2 = details.applicationData) === null || _details$applicationD2 === void 0 ? void 0 : _details$applicationD2.documents) || (details === null || details === void 0 ? void 0 : details.documents) || [];
         return Promise.resolve(convertModifyApplicationDetails(finalData, sessionDetails, "INITIATE")).then(function (convertAppData) {
+          var _convertAppData$docum;
           if (!convertAppData.dateEffectiveFrom) {
             convertAppData.dateEffectiveFrom = Date.now() + 86400000;
           }
@@ -52862,16 +53181,22 @@ const MutationApplication = () => {
               convertAppData.additionalDetails.identityProofDocumentId = mutDetails.identityProofDocumentId || "";
             }
           }
+          if ((convertAppData === null || convertAppData === void 0 ? void 0 : (_convertAppData$docum = convertAppData.documents) === null || _convertAppData$docum === void 0 ? void 0 : _convertAppData$docum.length) > 0 && existingDocs.length > 0) {
+            convertAppData.documents = mapExistingDocIdsToPayload(convertAppData.documents, existingDocs);
+          }
           convertAppData.applicationType = resolvedServiceType === "WATER" ? "MUTATION_WATER_CONNECTION" : "MUTATION_SEWERAGE_CONNECTION";
           if (isEditFlow) {
-            var _applicationDetails$a5, _applicationDetails$a6, _Digit, _Digit$Customizations, _Digit$Customizations2;
+            var _applicationDetails$a6, _applicationDetails$a7, _updatePayload, _updatePayload$docume, _Digit, _Digit$Customizations, _Digit$Customizations2;
             let updatePayload = _extends({}, convertAppData, {
-              id: applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a5 = applicationDetails.applicationData) === null || _applicationDetails$a5 === void 0 ? void 0 : _applicationDetails$a5.id,
+              id: applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a6 = applicationDetails.applicationData) === null || _applicationDetails$a6 === void 0 ? void 0 : _applicationDetails$a6.id,
               applicationNo: editApplicationNumber,
-              processInstance: _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a6 = applicationDetails.applicationData) === null || _applicationDetails$a6 === void 0 ? void 0 : _applicationDetails$a6.processInstance, convertAppData === null || convertAppData === void 0 ? void 0 : convertAppData.processInstance, {
+              processInstance: _extends({}, applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a7 = applicationDetails.applicationData) === null || _applicationDetails$a7 === void 0 ? void 0 : _applicationDetails$a7.processInstance, convertAppData === null || convertAppData === void 0 ? void 0 : convertAppData.processInstance, {
                 action: "RESUBMIT_APPLICATION"
               })
             });
+            if (((_updatePayload = updatePayload) === null || _updatePayload === void 0 ? void 0 : (_updatePayload$docume = _updatePayload.documents) === null || _updatePayload$docume === void 0 ? void 0 : _updatePayload$docume.length) > 0 && existingDocs.length > 0) {
+              updatePayload.documents = mapExistingDocIdsToPayload(updatePayload.documents, existingDocs);
+            }
             if ((_Digit = Digit) !== null && _Digit !== void 0 && (_Digit$Customizations = _Digit.Customizations) !== null && _Digit$Customizations !== void 0 && (_Digit$Customizations2 = _Digit$Customizations.WS) !== null && _Digit$Customizations2 !== void 0 && _Digit$Customizations2.customiseUpdatePayloadOfWS) {
               updatePayload = Digit.Customizations.WS.customiseUpdatePayloadOfWS((applicationDetails === null || applicationDetails === void 0 ? void 0 : applicationDetails.applicationData) || {}, updatePayload, resolvedServiceType);
             }
@@ -52961,7 +53286,7 @@ const MutationApplication = () => {
                   message: data.Errors[0].message || "Failed to submit application"
                 });
               } else {
-                var _data$WaterConnection, _data$SewerageConnect, _Digit2, _Digit2$Customization, _Digit2$Customization2;
+                var _data$WaterConnection, _data$SewerageConnect, _updatePayload2, _updatePayload2$docum, _Digit2, _Digit2$Customization, _Digit2$Customization2;
                 const updateMutation = resolvedServiceType === "WATER" ? waterUpdateMutation : sewerageUpdateMutation;
                 const createdConnection = resolvedServiceType === "WATER" ? data === null || data === void 0 ? void 0 : (_data$WaterConnection = data.WaterConnection) === null || _data$WaterConnection === void 0 ? void 0 : _data$WaterConnection[0] : data === null || data === void 0 ? void 0 : (_data$SewerageConnect = data.SewerageConnections) === null || _data$SewerageConnect === void 0 ? void 0 : _data$SewerageConnect[0];
                 let updatePayload = _extends({}, createdConnection, {
@@ -52970,6 +53295,10 @@ const MutationApplication = () => {
                     action: "APPLY_MUTATION"
                   })
                 });
+                const combinedExistingDocs = [...existingDocs, ...((createdConnection === null || createdConnection === void 0 ? void 0 : createdConnection.documents) || [])];
+                if (((_updatePayload2 = updatePayload) === null || _updatePayload2 === void 0 ? void 0 : (_updatePayload2$docum = _updatePayload2.documents) === null || _updatePayload2$docum === void 0 ? void 0 : _updatePayload2$docum.length) > 0 && combinedExistingDocs.length > 0) {
+                  updatePayload.documents = mapExistingDocIdsToPayload(updatePayload.documents, combinedExistingDocs);
+                }
                 if ((_Digit2 = Digit) !== null && _Digit2 !== void 0 && (_Digit2$Customization = _Digit2.Customizations) !== null && _Digit2$Customization !== void 0 && (_Digit2$Customization2 = _Digit2$Customization.WS) !== null && _Digit2$Customization2 !== void 0 && _Digit2$Customization2.customiseUpdatePayloadOfWS) {
                   updatePayload = Digit.Customizations.WS.customiseUpdatePayloadOfWS(createdConnection, updatePayload, resolvedServiceType);
                 }
@@ -53091,7 +53420,7 @@ const MutationApplication = () => {
     }
   }, currentStep === 1 && /*#__PURE__*/React.createElement(Step1_SearchConnection, {
     t: t,
-    defaultKNumber: isEditFlow ? applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a7 = applicationDetails.applicationData) === null || _applicationDetails$a7 === void 0 ? void 0 : _applicationDetails$a7.connectionNo : "",
+    defaultKNumber: isEditFlow ? applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a8 = applicationDetails.applicationData) === null || _applicationDetails$a8 === void 0 ? void 0 : _applicationDetails$a8.connectionNo : "",
     onNext: _ref => {
       let kNumber = _ref.kNumber,
         mobileNumber = _ref.mobileNumber,
@@ -53105,7 +53434,7 @@ const MutationApplication = () => {
   }), currentStep === 2 && /*#__PURE__*/React.createElement(Fragment$2, null, /*#__PURE__*/React.createElement(Step1_ExistingConnection, {
     t: t,
     applicationDetails: applicationDetails,
-    propertyId: applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a8 = applicationDetails.applicationData) === null || _applicationDetails$a8 === void 0 ? void 0 : _applicationDetails$a8.propertyId,
+    propertyId: applicationDetails === null || applicationDetails === void 0 ? void 0 : (_applicationDetails$a9 = applicationDetails.applicationData) === null || _applicationDetails$a9 === void 0 ? void 0 : _applicationDetails$a9.propertyId,
     mobileNumber: authMobileNumber,
     onVerify: () => {
       setCompletedSteps(prev => new Set([...prev, 2]));