@djb25/digit-ui-module-ekyc 1.0.6 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,8 @@
1
- import React, { useMemo, useState, useCallback, useRef, useEffect, Fragment } from 'react';
2
- import { Link, useHistory, useRouteMatch, useLocation, Switch } from 'react-router-dom';
3
- import { PersonIcon as PersonIcon$1, EmployeeModuleCard, Card, HomeIcon, Table, Header, TextInput, SubmitBar, Loader, DetailsCard, FilterForm, FilterFormField, Dropdown, CardHeader, StatusTable, Row, CardLabel, Modal, RadioButtons, Toast, LocationIcon, PropertyHouse, InfoBannerIcon, ActionBar, LabelFieldPair, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute } from '@djb25/digit-ui-react-components';
1
+ import React, { useRef, useEffect, useState, useMemo, useCallback, Fragment } from 'react';
4
2
  import { useTranslation } from 'react-i18next';
3
+ import { Link, useHistory, useRouteMatch, useLocation, Switch } from 'react-router-dom';
4
+ import { PersonIcon as PersonIcon$1, EmployeeModuleCard, Modal, Loader, Card, HomeIcon, Table, TextInput, Header, SubmitBar, DetailsCard, FilterForm, FilterFormField, Dropdown, RadioButtons, Toast, LocationIcon, CardLabel, PropertyHouse, UploadFile, ActionBar, CardHeader, LabelFieldPair, InfoBannerIcon, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, CitizenHomeCard, DocumentIcon as DocumentIcon$1 } from '@djb25/digit-ui-react-components';
5
+ import { Chart, registerables } from 'chart.js';
5
6
 
6
7
  const EKYCCard = () => {
7
8
  const {
@@ -26,33 +27,165 @@ const EKYCCard = () => {
26
27
  return /*#__PURE__*/React.createElement(EmployeeModuleCard, propsForModuleCard);
27
28
  };
28
29
 
30
+ Chart.register(...registerables);
29
31
  const StatusCards = ({
30
32
  countData
31
33
  }) => {
32
34
  const {
33
35
  t
34
36
  } = useTranslation();
37
+ const chartRef1 = useRef(null);
38
+ const chartInstance1 = useRef(null);
39
+ const total = (countData === null || countData === void 0 ? void 0 : countData.total) || 0;
40
+ const pending = (countData === null || countData === void 0 ? void 0 : countData.pending) || 0;
41
+ const active = (countData === null || countData === void 0 ? void 0 : countData.completed) || 0;
42
+ const completed = 0;
43
+ const actualCompleted = (countData === null || countData === void 0 ? void 0 : countData.completed) || 0;
44
+ const approved = actualCompleted;
45
+ const efficiency = total > 0 ? Math.round(actualCompleted / total * 100) : 0;
46
+ const healthPct = total > 0 ? Math.round(approved / total * 100) : 0;
47
+ const formatNumber = num => new Intl.NumberFormat("en-IN").format(num || 0);
48
+ useEffect(() => {
49
+ if (chartRef1.current) {
50
+ if (chartInstance1.current) chartInstance1.current.destroy();
51
+ const ctx1 = chartRef1.current.getContext("2d");
52
+ chartInstance1.current = new Chart(ctx1, {
53
+ type: "doughnut",
54
+ data: {
55
+ labels: [t("EKYC_ACTIVE"), t("EKYC_PENDING"), t("EKYC_COMPLETED")],
56
+ datasets: [{
57
+ data: [active, pending, completed],
58
+ backgroundColor: ["#0c2a52", "#77B6EA", "#c8ddf5"],
59
+ borderColor: ["#ffffff", "#ffffff", "#ffffff"],
60
+ borderWidth: 2,
61
+ hoverOffset: 4
62
+ }]
63
+ },
64
+ options: {
65
+ cutout: "75%",
66
+ plugins: {
67
+ legend: {
68
+ display: false
69
+ }
70
+ },
71
+ maintainAspectRatio: false,
72
+ responsive: true
73
+ }
74
+ });
75
+ }
76
+ return () => {
77
+ if (chartInstance1.current) chartInstance1.current.destroy();
78
+ };
79
+ }, [pending, completed, active, t]);
80
+ const legendItems = [{
81
+ color: "#0c2a52",
82
+ label: t("EKYC_ACTIVE"),
83
+ value: active
84
+ }, {
85
+ color: "#77B6EA",
86
+ label: t("EKYC_PENDING"),
87
+ value: pending
88
+ }, {
89
+ color: "#c8ddf5",
90
+ label: t("EKYC_COMPLETED"),
91
+ value: completed
92
+ }];
35
93
  return /*#__PURE__*/React.createElement("div", {
36
- className: "ekyc-status-container"
37
- }, /*#__PURE__*/React.createElement("div", {
38
- className: "ekyc-status-card"
39
- }, /*#__PURE__*/React.createElement("div", {
40
- className: "count"
41
- }, (countData === null || countData === void 0 ? void 0 : countData.total) || 0), /*#__PURE__*/React.createElement("div", {
42
- className: "label"
43
- }, t("EKYC_TOTAL"))), /*#__PURE__*/React.createElement("div", {
44
- className: "ekyc-status-card"
45
- }, /*#__PURE__*/React.createElement("div", {
46
- className: "count pending"
47
- }, (countData === null || countData === void 0 ? void 0 : countData.pending) || 0), /*#__PURE__*/React.createElement("div", {
48
- className: "label"
49
- }, t("EKYC_PENDING"))), /*#__PURE__*/React.createElement("div", {
50
- className: "ekyc-status-card"
51
- }, /*#__PURE__*/React.createElement("div", {
52
- className: "count completed"
53
- }, (countData === null || countData === void 0 ? void 0 : countData.completed) || 0), /*#__PURE__*/React.createElement("div", {
54
- className: "label"
55
- }, t("EKYC_COMPLETED"))));
94
+ className: "ekyc-employee-container"
95
+ }, /*#__PURE__*/React.createElement("div", {
96
+ className: "status-cards-wrapper"
97
+ }, /*#__PURE__*/React.createElement("div", {
98
+ className: "status-cards-header"
99
+ }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
100
+ className: "eyebrow"
101
+ }, /*#__PURE__*/React.createElement("span", {
102
+ className: "eyebrow-dot"
103
+ }), t("EKYC_INSTITUTIONAL_OVERVIEW") || "Institutional Performance Overview"), /*#__PURE__*/React.createElement("h1", {
104
+ className: "status-cards-h1"
105
+ }, t("EKYC_DASHBOARD_TITLE") || "eKYC Verification Dashboard"), /*#__PURE__*/React.createElement("p", {
106
+ className: "status-cards-subtitle"
107
+ }, t("EKYC_DASHBOARD_SUBTITLE") || "Real-time monitoring of consumer verification workflows across all administrative zones.")), /*#__PURE__*/React.createElement("div", {
108
+ className: "total-applications-card"
109
+ }, /*#__PURE__*/React.createElement("div", {
110
+ className: "total-label"
111
+ }, t("EKYC_TOTAL_APPLICATIONS") || "Total Applications Processed"), /*#__PURE__*/React.createElement("div", {
112
+ className: "total-number"
113
+ }, formatNumber(total)), /*#__PURE__*/React.createElement("div", {
114
+ className: "total-badge"
115
+ }, "\u2197 +12.4% ", t("EKYC_FROM_LAST_QUARTER") || "from last quarter"))), /*#__PURE__*/React.createElement("div", {
116
+ className: "status-panels-grid"
117
+ }, /*#__PURE__*/React.createElement("div", {
118
+ className: "status-panel"
119
+ }, /*#__PURE__*/React.createElement("div", {
120
+ className: "panel-title"
121
+ }, t("EKYC_STATUS_BREAKDOWN") || "Status Breakdown"), /*#__PURE__*/React.createElement("div", {
122
+ className: "panel-subtitle"
123
+ }, t("EKYC_VERIFICATION_LIFECYCLE") || "Verification lifecycle distribution"), /*#__PURE__*/React.createElement("div", {
124
+ className: "breakdown-body"
125
+ }, /*#__PURE__*/React.createElement("div", {
126
+ className: "status-legend"
127
+ }, legendItems.map(item => /*#__PURE__*/React.createElement("div", {
128
+ key: item.label,
129
+ className: "legend-row"
130
+ }, /*#__PURE__*/React.createElement("span", {
131
+ className: "legend-label"
132
+ }, /*#__PURE__*/React.createElement("span", {
133
+ className: "indicator-dot",
134
+ style: {
135
+ background: item.color
136
+ }
137
+ }), item.label), /*#__PURE__*/React.createElement("span", {
138
+ className: "legend-value"
139
+ }, formatNumber(item.value))))), /*#__PURE__*/React.createElement("div", {
140
+ className: "chart-wrapper"
141
+ }, /*#__PURE__*/React.createElement("canvas", {
142
+ ref: chartRef1,
143
+ style: {
144
+ width: "100%",
145
+ height: "100%"
146
+ }
147
+ }), /*#__PURE__*/React.createElement("div", {
148
+ className: "chart-center"
149
+ }, /*#__PURE__*/React.createElement("div", {
150
+ className: "chart-percentage"
151
+ }, efficiency, "%"), /*#__PURE__*/React.createElement("div", {
152
+ className: "chart-label"
153
+ }, t("EKYC_COMPLETE") || "Complete"))))), /*#__PURE__*/React.createElement("div", {
154
+ className: "status-panel"
155
+ }, /*#__PURE__*/React.createElement("div", {
156
+ className: "panel-title"
157
+ }, t("EKYC_SUBMISSION_HEALTH") || "Submission Health", /*#__PURE__*/React.createElement("span", {
158
+ className: "optimal-badge"
159
+ }, t("EKYC_OPTIMAL") || "Optimal")), /*#__PURE__*/React.createElement("div", {
160
+ className: "panel-subtitle"
161
+ }, t("EKYC_PLATFORM_EFFICIENCY") || "Platform operational efficiency"), /*#__PURE__*/React.createElement("div", {
162
+ className: "health-metrics-row"
163
+ }, /*#__PURE__*/React.createElement("div", {
164
+ className: "health-percentage"
165
+ }, healthPct, "%"), /*#__PURE__*/React.createElement("div", {
166
+ className: "health-trend"
167
+ }, "\u2197 +2.1%")), /*#__PURE__*/React.createElement("div", {
168
+ className: "status-progress-bar"
169
+ }, /*#__PURE__*/React.createElement("div", {
170
+ className: "progress-fill",
171
+ style: {
172
+ width: `${healthPct}%`
173
+ }
174
+ })), /*#__PURE__*/React.createElement("div", {
175
+ className: "mini-metrics-grid"
176
+ }, /*#__PURE__*/React.createElement("div", {
177
+ className: "metric-box"
178
+ }, /*#__PURE__*/React.createElement("div", {
179
+ className: "metric-label"
180
+ }, t("EKYC_AVG_LATENCY") || "Avg Latency"), /*#__PURE__*/React.createElement("div", {
181
+ className: "metric-value"
182
+ }, "1.2s")), /*#__PURE__*/React.createElement("div", {
183
+ className: "metric-box"
184
+ }, /*#__PURE__*/React.createElement("div", {
185
+ className: "metric-label"
186
+ }, t("EKYC_ERROR_RATE") || "Error Rate"), /*#__PURE__*/React.createElement("div", {
187
+ className: "metric-value"
188
+ }, "0.04%")))))));
56
189
  };
57
190
 
58
191
  const DesktopInbox = ({
@@ -60,6 +193,7 @@ const DesktopInbox = ({
60
193
  filterComponent,
61
194
  ...props
62
195
  }) => {
196
+ var _Digit$Hooks$ekyc;
63
197
  const {
64
198
  data,
65
199
  isLoading,
@@ -80,23 +214,143 @@ const DesktopInbox = ({
80
214
  const {
81
215
  t
82
216
  } = useTranslation();
217
+ const tenantId = Digit.ULBService.getCurrentTenantId();
83
218
  const [FilterComponent, setComp] = React.useState(() => {
84
219
  var _Digit$ComponentRegis;
85
220
  return (_Digit$ComponentRegis = Digit.ComponentRegistryService) === null || _Digit$ComponentRegis === void 0 ? void 0 : _Digit$ComponentRegis.getComponent(filterComponent);
86
221
  });
222
+ const [showReviewModal, setShowReviewModal] = useState(false);
223
+ const [reviewHtml, setReviewHtml] = useState("");
224
+ const [selectedKno, setSelectedKno] = useState("");
225
+ const generateReviewHtml = info => {
226
+ if (!info) return "<h3>No data found</h3>";
227
+ return `
228
+ <!DOCTYPE html>
229
+ <html>
230
+ <head>
231
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
232
+ <style>
233
+ body { font-family: 'Inter', sans-serif; padding: 30px; color: #101828; line-height: 1.5; background: #fff; }
234
+ .header { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 2px solid #185FA5; padding-bottom: 20px; margin-bottom: 30px; }
235
+ .title { margin: 0; color: #185FA5; font-size: 24px; font-weight: 700; }
236
+ .subtitle { margin: 5px 0 0; color: #667085; font-size: 14px; }
237
+ .section { margin-bottom: 30px; border: 1px solid #EAECF0; border-radius: 12px; overflow: hidden; }
238
+ .section-header { background: #F9FAFB; padding: 12px 20px; border-bottom: 1px solid #EAECF0; font-weight: 700; font-size: 14px; color: #344054; text-transform: uppercase; letter-spacing: 0.05em; }
239
+ .grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
240
+ .item { padding: 16px 20px; border-bottom: 1px solid #F2F4F7; }
241
+ .item:nth-last-child(-n+2) { border-bottom: none; }
242
+ .label { font-size: 11px; color: #667085; text-transform: uppercase; font-weight: 600; letter-spacing: 0.02em; margin-bottom: 4px; }
243
+ .value { font-size: 14px; font-weight: 500; color: #1D2939; }
244
+ .badge { display: inline-block; padding: 4px 12px; border-radius: 16px; font-size: 12px; font-weight: 600; }
245
+ .badge-success { background: #ECFDF3; color: #027A48; }
246
+ .badge-warning { background: #FFFAEB; color: #B54708; }
247
+ .print-btn { background: #185FA5; color: #fff; padding: 10px 20px; border: none; border-radius: 8px; cursor: pointer; font-weight: 600; font-size: 14px; display: block; margin: 20px auto; }
248
+ @media print { .print-btn { display: none; } body { padding: 0; } }
249
+ </style>
250
+ </head>
251
+ <body>
252
+ <div class="header">
253
+ <div>
254
+ <h1 class="title">Delhi Jal Board</h1>
255
+ <p class="subtitle">EKYC Application Review Summary</p>
256
+ </div>
257
+ <div style="text-align: right">
258
+ <span class="badge ${info.statusFlag === 'ACTIVE' ? 'badge-success' : 'badge-warning'}">${info.statusFlag || 'N/A'}</span>
259
+ <p class="subtitle" style="margin-top: 8px">Generated on: ${new Date().toLocaleDateString()}</p>
260
+ </div>
261
+ </div>
262
+
263
+ <div class="section">
264
+ <div class="section-header">Basic Details</div>
265
+ <div class="grid">
266
+ <div class="item"><div class="label">KNO Number</div><div class="value">${info.kno || 'N/A'}</div></div>
267
+ <div class="item"><div class="label">Consumer Name</div><div class="value">${info.consumerName || 'N/A'}</div></div>
268
+ <div class="item"><div class="label">Mobile Number</div><div class="value">${info.mobileNo || 'N/A'}</div></div>
269
+ <div class="item"><div class="label">Email Address</div><div class="value">${info.email || 'N/A'}</div></div>
270
+ <div class="item"><div class="label">Connection Type</div><div class="value">${info.typeOfConnection || 'N/A'}</div></div>
271
+ <div class="item"><div class="label">Category</div><div class="value">${info.connectionCategory || 'N/A'}</div></div>
272
+ </div>
273
+ </div>
274
+
275
+ <div class="section">
276
+ <div class="section-header">Location & Property Information</div>
277
+ <div class="grid">
278
+ <div class="item"><div class="label">Address</div><div class="value">${info.addressRaw || 'N/A'}</div></div>
279
+ <div class="item"><div class="label">Locality</div><div class="value">${info.locality || 'N/A'}</div></div>
280
+ <div class="item"><div class="label">City - Pincode</div><div class="value">${info.city || 'N/A'} - ${info.pincode || 'N/A'}</div></div>
281
+ <div class="item"><div class="label">PID Number</div><div class="value">${info.pidNumber || 'N/A'}</div></div>
282
+ <div class="item"><div class="label">No. of Floors</div><div class="value">${info.noOfFloor || 'N/A'}</div></div>
283
+ <div class="item"><div class="label">Verification Status</div><div class="value"><span class="badge ${info.verificationStatus === 'SUCCESSFUL' ? 'badge-success' : 'badge-warning'}">${info.verificationStatus || 'PENDING'}</span></div></div>
284
+ </div>
285
+ </div>
286
+
287
+ <div class="section">
288
+ <div class="section-header">Meter Information</div>
289
+ <div class="grid">
290
+ <div class="item"><div class="label">Meter Number</div><div class="value">${info.meterNumber || 'N/A'}</div></div>
291
+ <div class="item"><div class="label">Meter Make</div><div class="value">${info.meterMake || 'N/A'}</div></div>
292
+ <div class="item"><div class="label">Meter Location</div><div class="value">${info.meterLocationAddress || 'N/A'}</div></div>
293
+ <div class="item"><div class="label">Working Status</div><div class="value">${info.workingStatus ? 'Working' : 'Not Working'}</div></div>
294
+ </div>
295
+ </div>
296
+
297
+ <button class="print-btn" onclick="window.print()">Print This Review</button>
298
+ </body>
299
+ </html>
300
+ `;
301
+ };
302
+ const useReviewHook = ((_Digit$Hooks$ekyc = Digit.Hooks.ekyc) === null || _Digit$Hooks$ekyc === void 0 ? void 0 : _Digit$Hooks$ekyc.useEkycApplicationReview) || ((p, config) => {
303
+ return Digit.Hooks.useMutation(data => Digit.EkycService.application_review(data, p), config);
304
+ });
305
+ const {
306
+ mutate: getReview,
307
+ isLoading: isReviewLoading
308
+ } = useReviewHook({
309
+ tenantId
310
+ }, {
311
+ onSuccess: res => {
312
+ if (res !== null && res !== void 0 && res.applicationReviewInfo) {
313
+ const html = generateReviewHtml(res.applicationReviewInfo);
314
+ setReviewHtml(html);
315
+ setShowReviewModal(true);
316
+ } else {
317
+ const url = (res === null || res === void 0 ? void 0 : res.acknowledgementURL) || (res === null || res === void 0 ? void 0 : res.reviewUrl) || (res === null || res === void 0 ? void 0 : res.url);
318
+ if (url) {
319
+ setReviewHtml("");
320
+ setReviewUrl(url);
321
+ setShowReviewModal(true);
322
+ } else {
323
+ alert(t("EKYC_REVIEW_INFO_NOT_FOUND"));
324
+ }
325
+ }
326
+ },
327
+ onError: err => {
328
+ alert((err === null || err === void 0 ? void 0 : err.message) || t("ERR_FAILED_TO_FETCH_REVIEW"));
329
+ }
330
+ });
331
+ const handleReview = kno => {
332
+ setSelectedKno(kno);
333
+ getReview({
334
+ kno
335
+ });
336
+ };
87
337
  const columns = useMemo(() => [{
88
338
  Header: t("EKYC_APPLICATION_NO"),
89
339
  accessor: "applicationNumber",
90
340
  Cell: ({
91
341
  row
92
342
  }) => {
93
- var _row$original;
94
- const applicationNumber = ((_row$original = row.original) === null || _row$original === void 0 ? void 0 : _row$original.applicationNumber) || "NA";
95
- return /*#__PURE__*/React.createElement(Link, {
96
- to: `${parentRoute}/application-details/${applicationNumber}`
97
- }, /*#__PURE__*/React.createElement("span", {
98
- className: "ekyc-application-link"
99
- }, applicationNumber));
343
+ var _row$original, _row$original2;
344
+ const kno = ((_row$original = row.original) === null || _row$original === void 0 ? void 0 : _row$original.kno) || ((_row$original2 = row.original) === null || _row$original2 === void 0 ? void 0 : _row$original2.applicationNumber) || "NA";
345
+ return /*#__PURE__*/React.createElement("span", {
346
+ className: "ekyc-application-link",
347
+ style: {
348
+ color: "#add8f7",
349
+ cursor: "pointer",
350
+ fontWeight: "bold"
351
+ },
352
+ onClick: () => handleReview(kno)
353
+ }, kno);
100
354
  }
101
355
  }, {
102
356
  Header: t("EKYC_CITIZEN_NAME"),
@@ -104,8 +358,8 @@ const DesktopInbox = ({
104
358
  Cell: ({
105
359
  row
106
360
  }) => {
107
- var _row$original2;
108
- return /*#__PURE__*/React.createElement("span", null, ((_row$original2 = row.original) === null || _row$original2 === void 0 ? void 0 : _row$original2.citizenName) || "NA");
361
+ var _row$original3;
362
+ return /*#__PURE__*/React.createElement("span", null, ((_row$original3 = row.original) === null || _row$original3 === void 0 ? void 0 : _row$original3.citizenName) || "NA");
109
363
  }
110
364
  }, {
111
365
  Header: t("EKYC_STATUS"),
@@ -113,8 +367,8 @@ const DesktopInbox = ({
113
367
  Cell: ({
114
368
  row
115
369
  }) => {
116
- var _row$original3;
117
- const status = ((_row$original3 = row.original) === null || _row$original3 === void 0 ? void 0 : _row$original3.status) || "DEFAULT";
370
+ var _row$original4;
371
+ const status = ((_row$original4 = row.original) === null || _row$original4 === void 0 ? void 0 : _row$original4.status) || "DEFAULT";
118
372
  return /*#__PURE__*/React.createElement("span", {
119
373
  className: `ekyc-status-tag ${status}`
120
374
  }, t(`${status}`));
@@ -124,11 +378,38 @@ const DesktopInbox = ({
124
378
  return (data === null || data === void 0 ? void 0 : data.items) || [];
125
379
  }, [data]);
126
380
  return /*#__PURE__*/React.createElement("div", {
127
- className: "inbox-container",
381
+ className: "inbox-container"
382
+ }, showReviewModal && /*#__PURE__*/React.createElement(Modal, {
383
+ headerBarMain: t("EKYC_APPLICATION_REVIEW") + (selectedKno ? ` - ${selectedKno}` : ""),
384
+ headerBarEnd: /*#__PURE__*/React.createElement("div", {
385
+ style: {
386
+ cursor: "pointer",
387
+ padding: "5px 10px",
388
+ background: "#F2F4F7",
389
+ borderRadius: "4px"
390
+ },
391
+ onClick: () => setShowReviewModal(false)
392
+ }, t("CLOSE")),
393
+ hideSubmit: true,
394
+ popupStyles: {
395
+ width: "90%",
396
+ height: "90%",
397
+ maxWidth: "1000px"
398
+ },
399
+ popupModuleMianStyles: {
400
+ height: "calc(100% - 60px)",
401
+ padding: 0
402
+ }
403
+ }, /*#__PURE__*/React.createElement("iframe", {
404
+ srcDoc: reviewHtml,
405
+ src: !reviewHtml ? reviewUrl : undefined,
406
+ title: "Application Review",
128
407
  style: {
129
- paddingBottom: "16px"
408
+ width: "100%",
409
+ height: "100%",
410
+ border: "none"
130
411
  }
131
- }, /*#__PURE__*/React.createElement("div", {
412
+ })), (isLoading || isReviewLoading) && /*#__PURE__*/React.createElement(Loader, null), /*#__PURE__*/React.createElement("div", {
132
413
  className: "filters-container"
133
414
  }, /*#__PURE__*/React.createElement(Card, {
134
415
  className: "sidebar-title-card",
@@ -213,6 +494,7 @@ const SearchConsumer = ({
213
494
  children,
214
495
  ...props
215
496
  }) => {
497
+ var _props$countData, _props$countData2, _props$countData3;
216
498
  const {
217
499
  t
218
500
  } = useTranslation();
@@ -238,156 +520,117 @@ const SearchConsumer = ({
238
520
  onSearch(cleared);
239
521
  };
240
522
  return /*#__PURE__*/React.createElement("div", {
241
- className: "inbox-container"
523
+ className: "ekyc-employee-container"
242
524
  }, /*#__PURE__*/React.createElement("div", {
243
- className: "filters-container"
244
- }, /*#__PURE__*/React.createElement(Card, {
245
- className: "sidebar-title-card",
246
- style: {
247
- display: "flex",
248
- alignItems: "center",
249
- padding: "16px",
250
- marginBottom: "16px",
251
- borderRadius: "4px"
252
- }
525
+ className: "search-consumer-wrapper"
253
526
  }, /*#__PURE__*/React.createElement("div", {
254
- className: "icon-container",
255
- style: {
256
- color: "#3A8DCC",
257
- marginRight: "12px"
258
- }
259
- }, /*#__PURE__*/React.createElement(HomeIcon, {
260
- style: {
261
- width: "24px",
262
- height: "24px"
263
- }
264
- })), /*#__PURE__*/React.createElement("div", {
265
- style: {
266
- fontWeight: "700",
267
- fontSize: "18px",
268
- color: "#0B0C0C"
269
- }
270
- }, t("ACTION_CREATE_EKYC"))), /*#__PURE__*/React.createElement("div", null, FilterComponent && /*#__PURE__*/React.createElement(FilterComponent, {
271
- defaultSearchParams: props.defaultSearchParams,
272
- onFilterChange: props.onSearch,
273
- searchParams: searchParams,
274
- type: "desktop",
275
- moduleCode: "EKYC"
276
- }))), /*#__PURE__*/React.createElement("div", {
277
- style: {
278
- flex: 1,
279
- marginLeft: "16px"
280
- }
527
+ className: "header-wrapper"
281
528
  }, /*#__PURE__*/React.createElement(Card, {
282
- className: "ekyc-search-card",
283
- style: {
284
- padding: "24px",
285
- marginBottom: "24px",
286
- borderRadius: "12px",
287
- boxShadow: "0 4px 12px rgba(0,0,0,0.05)"
288
- }
289
- }, /*#__PURE__*/React.createElement(Header, {
290
- style: {
291
- fontSize: "24px",
292
- marginBottom: "20px",
293
- fontWeight: "700",
294
- color: "#0B0C0C"
295
- }
296
- }, t("EKYC_SEARCH_CONSUMER_HEADER")), /*#__PURE__*/React.createElement("form", {
297
- onSubmit: onSubmit
529
+ className: "sidebar-title-card"
298
530
  }, /*#__PURE__*/React.createElement("div", {
299
- style: {
300
- display: "flex",
301
- gap: "24px",
302
- alignItems: "flex-end",
303
- flexWrap: "wrap"
304
- }
531
+ className: "icon-container"
532
+ }, /*#__PURE__*/React.createElement(HomeIcon, null)), /*#__PURE__*/React.createElement("div", {
533
+ className: "title-text"
534
+ }, t("EKYC_SEARCH_CONSUMER_HEADER")))), /*#__PURE__*/React.createElement("div", {
535
+ className: "main-content-wrapper"
305
536
  }, /*#__PURE__*/React.createElement("div", {
306
- style: {
307
- flex: "1",
308
- minWidth: "250px"
309
- }
537
+ className: "search-stats-row"
310
538
  }, /*#__PURE__*/React.createElement("div", {
311
- className: "filter-label",
312
- style: {
313
- fontWeight: "600",
314
- marginBottom: "8px",
315
- fontSize: "14px",
316
- color: "#505A5F"
317
- }
318
- }, t("EKYC_K_NUMBER")), /*#__PURE__*/React.createElement("div", {
319
- style: {
320
- position: "relative"
321
- }
322
- }, /*#__PURE__*/React.createElement(TextInput, {
539
+ className: "identity-lookup-card"
540
+ }, /*#__PURE__*/React.createElement("div", {
541
+ className: "lookup-card-title"
542
+ }, /*#__PURE__*/React.createElement("div", {
543
+ className: "lookup-icon-bg"
544
+ }, /*#__PURE__*/React.createElement("svg", {
545
+ width: "18",
546
+ height: "18",
547
+ viewBox: "0 0 24 24",
548
+ fill: "none",
549
+ stroke: "#3A7BD5",
550
+ strokeWidth: "2",
551
+ strokeLinecap: "round",
552
+ strokeLinejoin: "round"
553
+ }, /*#__PURE__*/React.createElement("circle", {
554
+ cx: "11",
555
+ cy: "11",
556
+ r: "8"
557
+ }), /*#__PURE__*/React.createElement("line", {
558
+ x1: "21",
559
+ y1: "21",
560
+ x2: "16.65",
561
+ y2: "16.65"
562
+ }))), /*#__PURE__*/React.createElement("span", {
563
+ className: "lookup-title-text"
564
+ }, t("EKYC_IDENTITY_LOOKUP") || "Identity Lookup")), /*#__PURE__*/React.createElement("form", {
565
+ onSubmit: onSubmit
566
+ }, /*#__PURE__*/React.createElement("div", {
567
+ className: "inputs-row"
568
+ }, /*#__PURE__*/React.createElement("div", {
569
+ className: "input-group"
570
+ }, /*#__PURE__*/React.createElement("label", null, t("EKYC_K_NUMBER") || "K Number", /*#__PURE__*/React.createElement("span", {
571
+ className: "info-badge"
572
+ }, "i")), /*#__PURE__*/React.createElement(TextInput, {
323
573
  value: _searchParams === null || _searchParams === void 0 ? void 0 : _searchParams.kNumber,
324
574
  onChange: e => onChange("kNumber", e.target.value),
325
- placeholder: t("EKYC_K_NUMBER_PLACEHOLDER"),
326
- style: {
327
- borderRadius: "8px",
328
- paddingLeft: "12px",
329
- height: "44px"
330
- }
331
- }))), /*#__PURE__*/React.createElement("div", {
332
- style: {
333
- flex: "1",
334
- minWidth: "250px"
335
- }
336
- }, /*#__PURE__*/React.createElement("div", {
337
- className: "filter-label",
338
- style: {
339
- fontWeight: "600",
340
- marginBottom: "8px",
341
- fontSize: "14px",
342
- color: "#505A5F"
343
- }
344
- }, t("EKYC_K_NAME")), /*#__PURE__*/React.createElement("div", {
345
- style: {
346
- position: "relative"
347
- }
348
- }, /*#__PURE__*/React.createElement(TextInput, {
575
+ placeholder: t("EKYC_K_NUMBER_PLACEHOLDER") || "e.g. 8234910234"
576
+ })), /*#__PURE__*/React.createElement("div", {
577
+ className: "input-group"
578
+ }, /*#__PURE__*/React.createElement("label", null, t("EKYC_K_NAME") || "K Name", /*#__PURE__*/React.createElement("svg", {
579
+ width: "14",
580
+ height: "14",
581
+ viewBox: "0 0 24 24",
582
+ fill: "none",
583
+ stroke: "#3A7BD5",
584
+ strokeWidth: "2",
585
+ strokeLinecap: "round",
586
+ strokeLinejoin: "round"
587
+ }, /*#__PURE__*/React.createElement("path", {
588
+ d: "M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"
589
+ }), /*#__PURE__*/React.createElement("circle", {
590
+ cx: "12",
591
+ cy: "7",
592
+ r: "4"
593
+ }))), /*#__PURE__*/React.createElement(TextInput, {
349
594
  value: _searchParams === null || _searchParams === void 0 ? void 0 : _searchParams.kName,
350
595
  onChange: e => onChange("kName", e.target.value),
351
- placeholder: t("EKYC_K_NAME_PLACEHOLDER"),
352
- style: {
353
- borderRadius: "8px",
354
- paddingLeft: "12px",
355
- height: "44px"
356
- }
357
- })))), /*#__PURE__*/React.createElement("div", {
358
- style: {
359
- display: "flex",
360
- justifyContent: "flex-end",
361
- marginTop: "20px"
362
- }
363
- }, /*#__PURE__*/React.createElement("div", {
364
- style: {
365
- display: "flex",
366
- gap: "12px",
367
- alignItems: "center"
368
- }
596
+ placeholder: t("EKYC_K_NAME_PLACEHOLDER") || "Consumer name search"
597
+ }))), /*#__PURE__*/React.createElement("div", {
598
+ className: "actions-row"
369
599
  }, /*#__PURE__*/React.createElement("button", {
370
600
  type: "button",
371
601
  onClick: onClear,
372
- style: {
373
- background: "none",
374
- border: "none",
375
- color: "#0076f3ff",
376
- fontWeight: "600",
377
- cursor: "pointer",
378
- fontSize: "14px",
379
- padding: "10px"
380
- }
381
- }, t("ES_COMMON_CLEAR")), /*#__PURE__*/React.createElement(SubmitBar, {
382
- label: t("ES_COMMON_SEARCH"),
383
- onSubmit: onSubmit,
384
- style: {
385
- margin: 0,
386
- borderRadius: "8px",
387
- height: "44px",
388
- padding: "0 32px"
389
- }
390
- }))))), children));
602
+ className: "clear-btn"
603
+ }, t("ES_COMMON_CLEAR") || "Clear"), /*#__PURE__*/React.createElement("button", {
604
+ type: "submit",
605
+ className: "search-btn"
606
+ }, t("ES_COMMON_SEARCH") || "Execute Search")))), /*#__PURE__*/React.createElement("div", {
607
+ className: "stats-column"
608
+ }, /*#__PURE__*/React.createElement("div", {
609
+ className: "audits-card"
610
+ }, /*#__PURE__*/React.createElement("div", {
611
+ className: "audits-label"
612
+ }, t("EKYC_TODAYS_AUDITS") || "Today's Audits"), /*#__PURE__*/React.createElement("div", {
613
+ className: "audits-count"
614
+ }, ((_props$countData = props.countData) === null || _props$countData === void 0 ? void 0 : _props$countData.todaysAudits) || 24), /*#__PURE__*/React.createElement("div", {
615
+ className: "audits-change"
616
+ }, /*#__PURE__*/React.createElement("span", null, "\u2197"), ((_props$countData2 = props.countData) === null || _props$countData2 === void 0 ? void 0 : _props$countData2.auditChange) || "12% increase from yesterday"), /*#__PURE__*/React.createElement("div", {
617
+ className: "audits-watermark"
618
+ }, "M")), /*#__PURE__*/React.createElement("div", {
619
+ className: "queue-card"
620
+ }, /*#__PURE__*/React.createElement("div", {
621
+ className: "queue-label"
622
+ }, t("EKYC_QUEUE_STATUS") || "Queue Status"), /*#__PURE__*/React.createElement("div", {
623
+ className: "queue-content"
624
+ }, /*#__PURE__*/React.createElement("div", {
625
+ className: "queue-status-text"
626
+ }, ((_props$countData3 = props.countData) === null || _props$countData3 === void 0 ? void 0 : _props$countData3.pendingCount) || 3, " Pending"), /*#__PURE__*/React.createElement("div", {
627
+ className: "avatar-group"
628
+ }, [0, 1].map(i => /*#__PURE__*/React.createElement("div", {
629
+ key: i,
630
+ className: "avatar-item"
631
+ }, String.fromCharCode(65 + i))), /*#__PURE__*/React.createElement("div", {
632
+ className: "avatar-more"
633
+ }, "+1")))))), children)));
391
634
  };
392
635
 
393
636
  const MobileInbox = ({
@@ -516,7 +759,7 @@ const Inbox = ({
516
759
  filterComponent,
517
760
  isInbox
518
761
  }) => {
519
- var _searchParams$status, _dashboardData$dashbo2;
762
+ var _dashboardData$dashbo2;
520
763
  const tenantId = Digit.ULBService.getCurrentTenantId();
521
764
  const {
522
765
  t
@@ -541,27 +784,31 @@ const Inbox = ({
541
784
  } = Digit.Hooks.ekyc.useEkycSurveyorDashboard({}, {
542
785
  tenantId,
543
786
  offset: pageOffset,
544
- limit: pageSize,
545
- status: ((_searchParams$status = searchParams.status) === null || _searchParams$status === void 0 ? void 0 : _searchParams$status.value) || ""
787
+ limit: pageSize
546
788
  }, {
547
789
  enabled: !!tenantId
548
790
  });
549
791
  const filteredData = useMemo(() => {
550
- var _dashboardData$dashbo;
551
- const items = (dashboardData === null || dashboardData === void 0 ? void 0 : (_dashboardData$dashbo = dashboardData.dashboardInfo) === null || _dashboardData$dashbo === void 0 ? void 0 : _dashboardData$dashbo.consumerList) || [];
792
+ var _dashboardData$dashbo, _searchParams$status;
793
+ let items = (dashboardData === null || dashboardData === void 0 ? void 0 : (_dashboardData$dashbo = dashboardData.dashboardInfo) === null || _dashboardData$dashbo === void 0 ? void 0 : _dashboardData$dashbo.consumerList) || [];
794
+ const selectedStatus = (_searchParams$status = searchParams.status) === null || _searchParams$status === void 0 ? void 0 : _searchParams$status.value;
795
+ if (selectedStatus && selectedStatus !== "") {
796
+ items = items.filter(item => item.status === selectedStatus);
797
+ }
552
798
  return items.map(item => ({
553
799
  ...item,
554
800
  applicationNumber: item.kno || item.applicationNumber,
555
801
  citizenName: item.consumerName || item.citizenName
556
802
  }));
557
- }, [dashboardData]);
803
+ }, [dashboardData, searchParams.status]);
558
804
  const countData = useMemo(() => {
559
805
  const info = (dashboardData === null || dashboardData === void 0 ? void 0 : dashboardData.dashboardInfo) || {};
560
806
  return {
561
807
  total: info.total || 0,
562
808
  completed: info.completed || 0,
563
809
  pending: info.pending || 0,
564
- rejected: info.rejected || 0
810
+ rejected: info.rejected || 0,
811
+ active: info.active || 0
565
812
  };
566
813
  }, [dashboardData]);
567
814
  const totalRecords = (dashboardData === null || dashboardData === void 0 ? void 0 : (_dashboardData$dashbo2 = dashboardData.dashboardInfo) === null || _dashboardData$dashbo2 === void 0 ? void 0 : _dashboardData$dashbo2.totalRecords) || (dashboardData === null || dashboardData === void 0 ? void 0 : dashboardData.totalCount) || 0;
@@ -662,9 +909,7 @@ const ConnectionDetailsView = ({
662
909
  code: "OTHER",
663
910
  name: "EKYC_OTHER"
664
911
  }];
665
- const handleStartVerification = () => {
666
- setShowModal(true);
667
- };
912
+ const handleStartVerification = () => setShowModal(true);
668
913
  const onModalConfirm = () => {
669
914
  const parentPath = path.includes("/create-kyc") ? path.replace("/create-kyc", "") : path.replace("/k-details", "");
670
915
  history.push(`${parentPath}/aadhaar-verification`, {
@@ -674,62 +919,183 @@ const ConnectionDetailsView = ({
674
919
  });
675
920
  setShowModal(false);
676
921
  };
677
- if (isLoading) {
678
- return /*#__PURE__*/React.createElement(Loader, null);
679
- }
680
- if (!connectionDetails) {
681
- return null;
682
- }
683
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Card, {
684
- className: "ekyc-create-card",
685
- style: {
686
- padding: "24px"
687
- }
688
- }, /*#__PURE__*/React.createElement(CardHeader, null, t("EKYC_K_NUMBER_DETAILS")), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
689
- label: t("EKYC_K_NUMBER"),
690
- text: kNumber || t("CS_NA")
691
- }), /*#__PURE__*/React.createElement(Row, {
692
- label: t("EKYC_K_NAME"),
693
- text: kName || t("CS_NA")
694
- })), /*#__PURE__*/React.createElement(CardHeader, {
695
- style: {
696
- marginTop: "24px"
697
- }
698
- }, t("EKYC_CONNECTION_DETAILS")), connectionDetails !== null && connectionDetails !== void 0 && connectionDetails.connectionDetails ? /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
699
- label: t("EKYC_CONSUMER_NAME"),
700
- text: connectionDetails.connectionDetails.consumerName || t("CS_NA")
701
- }), /*#__PURE__*/React.createElement(Row, {
702
- label: t("EKYC_ADDRESS"),
703
- text: connectionDetails.connectionDetails.address || t("CS_NA")
704
- }), /*#__PURE__*/React.createElement(Row, {
705
- label: t("EKYC_CONNECTION_TYPE"),
706
- text: connectionDetails.connectionDetails.connectionType || t("CS_NA")
707
- }), /*#__PURE__*/React.createElement(Row, {
708
- label: t("EKYC_METER_NO"),
709
- text: connectionDetails.connectionDetails.meterNumber || t("CS_NA")
710
- }), /*#__PURE__*/React.createElement(Row, {
711
- label: t("EKYC_PHONE_NO"),
712
- text: connectionDetails.connectionDetails.phoneNumber || t("CS_NA")
713
- }), /*#__PURE__*/React.createElement(Row, {
714
- label: t("EKYC_EMAIL"),
715
- text: connectionDetails.connectionDetails.email || t("CS_NA")
716
- }), /*#__PURE__*/React.createElement(Row, {
717
- label: t("EKYC_STATUS"),
718
- text: connectionDetails.connectionDetails.statusflag || t("CS_NA")
719
- })) : /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_NO_CONNECTION_DETAILS_FOUND")), /*#__PURE__*/React.createElement("div", {
720
- style: {
721
- display: "flex",
722
- justifyContent: "flex-end",
723
- marginTop: "16px"
724
- }
725
- }, /*#__PURE__*/React.createElement(SubmitBar, {
726
- label: t("EKYC_START_VERIFICATION"),
727
- onSubmit: handleStartVerification,
728
- style: {
729
- borderRadius: "12px",
730
- margin: 0
731
- }
732
- }))), showModal && /*#__PURE__*/React.createElement(Modal, {
922
+ if (isLoading) return /*#__PURE__*/React.createElement(Loader, null);
923
+ if (!connectionDetails) return null;
924
+ const details = (connectionDetails === null || connectionDetails === void 0 ? void 0 : connectionDetails.connectionDetails) || {};
925
+ const statusFlag = details.statusflag || "";
926
+ const isActive = (statusFlag === null || statusFlag === void 0 ? void 0 : statusFlag.toLowerCase()) === "active" || statusFlag === "A";
927
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
928
+ className: "ekyc-employee-container"
929
+ }, /*#__PURE__*/React.createElement("div", {
930
+ className: "connection-details-card"
931
+ }, /*#__PURE__*/React.createElement("div", {
932
+ className: "details-card-header"
933
+ }, /*#__PURE__*/React.createElement("div", {
934
+ className: "header-title-wrapper"
935
+ }, /*#__PURE__*/React.createElement("div", {
936
+ className: "header-icon-bg"
937
+ }, /*#__PURE__*/React.createElement("svg", {
938
+ width: "16",
939
+ height: "16",
940
+ viewBox: "0 0 24 24",
941
+ fill: "none",
942
+ stroke: "#3A7BD5",
943
+ strokeWidth: "2",
944
+ strokeLinecap: "round",
945
+ strokeLinejoin: "round"
946
+ }, /*#__PURE__*/React.createElement("path", {
947
+ d: "M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"
948
+ }), /*#__PURE__*/React.createElement("circle", {
949
+ cx: "12",
950
+ cy: "7",
951
+ r: "4"
952
+ }))), /*#__PURE__*/React.createElement("span", {
953
+ className: "header-title-text"
954
+ }, t("EKYC_K_NUMBER_DETAILS") || "Consumer Identity Details")), /*#__PURE__*/React.createElement("span", {
955
+ className: `status-badge ${isActive ? "active" : "inactive"}`
956
+ }, isActive ? t("EKYC_ACTIVE_CONNECTION") || "Active Connection" : statusFlag || t("CS_NA"))), /*#__PURE__*/React.createElement("div", {
957
+ className: "details-card-body"
958
+ }, /*#__PURE__*/React.createElement("div", {
959
+ className: "body-content-row"
960
+ }, /*#__PURE__*/React.createElement("div", {
961
+ className: "detail-section"
962
+ }, /*#__PURE__*/React.createElement("div", {
963
+ className: "section-title"
964
+ }, t("EKYC_VERIFICATION_PARAMETERS") || "Verification Parameters"), /*#__PURE__*/React.createElement("div", {
965
+ className: "data-grid"
966
+ }, /*#__PURE__*/React.createElement("div", {
967
+ className: "data-item"
968
+ }, /*#__PURE__*/React.createElement("div", {
969
+ className: "data-label"
970
+ }, t("EKYC_CONSUMER_NAME") || "Consumer Name"), /*#__PURE__*/React.createElement("div", {
971
+ className: "data-value"
972
+ }, details.consumerName || kName || t("CS_NA"))), /*#__PURE__*/React.createElement("div", {
973
+ className: "data-item"
974
+ }, /*#__PURE__*/React.createElement("div", {
975
+ className: "data-label"
976
+ }, t("EKYC_K_NUMBER") || "K Number"), /*#__PURE__*/React.createElement("div", {
977
+ className: "data-value blue"
978
+ }, kNumber || t("CS_NA"))), /*#__PURE__*/React.createElement("div", {
979
+ className: "data-item"
980
+ }, /*#__PURE__*/React.createElement("div", {
981
+ className: "data-label"
982
+ }, t("EKYC_METER_NO") || "Meter Serial No."), /*#__PURE__*/React.createElement("div", {
983
+ className: "data-value"
984
+ }, details.meterNumber || t("CS_NA"))), /*#__PURE__*/React.createElement("div", {
985
+ className: "data-item"
986
+ }, /*#__PURE__*/React.createElement("div", {
987
+ className: "data-label"
988
+ }, t("EKYC_CONNECTION_TYPE") || "Connection Type"), /*#__PURE__*/React.createElement("div", {
989
+ className: "data-value"
990
+ }, details.connectionType || t("CS_NA"))))), /*#__PURE__*/React.createElement("div", {
991
+ className: "vertical-divider"
992
+ }), /*#__PURE__*/React.createElement("div", {
993
+ className: "detail-section"
994
+ }, /*#__PURE__*/React.createElement("div", {
995
+ className: "section-title"
996
+ }, t("EKYC_ADDRESS_AND_CONTACT") || "Address & Contact"), /*#__PURE__*/React.createElement("div", {
997
+ className: "address-block"
998
+ }, /*#__PURE__*/React.createElement("div", {
999
+ className: "icon-wrapper-small"
1000
+ }, /*#__PURE__*/React.createElement("svg", {
1001
+ width: "16",
1002
+ height: "16",
1003
+ viewBox: "0 0 24 24",
1004
+ fill: "none",
1005
+ stroke: "#6B7B8E",
1006
+ strokeWidth: "2",
1007
+ strokeLinecap: "round",
1008
+ strokeLinejoin: "round"
1009
+ }, /*#__PURE__*/React.createElement("path", {
1010
+ d: "M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0 1 18 0z"
1011
+ }), /*#__PURE__*/React.createElement("circle", {
1012
+ cx: "12",
1013
+ cy: "10",
1014
+ r: "3"
1015
+ }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
1016
+ className: "data-label"
1017
+ }, t("EKYC_ADDRESS") || "Service Address"), /*#__PURE__*/React.createElement("div", {
1018
+ className: "address-text"
1019
+ }, details.address || t("CS_NA")))), /*#__PURE__*/React.createElement("div", {
1020
+ className: "contact-row"
1021
+ }, /*#__PURE__*/React.createElement("div", {
1022
+ className: "contact-item"
1023
+ }, /*#__PURE__*/React.createElement("div", {
1024
+ className: "icon-wrapper-small"
1025
+ }, /*#__PURE__*/React.createElement("svg", {
1026
+ width: "16",
1027
+ height: "16",
1028
+ viewBox: "0 0 24 24",
1029
+ fill: "none",
1030
+ stroke: "#6B7B8E",
1031
+ strokeWidth: "2",
1032
+ strokeLinecap: "round",
1033
+ strokeLinejoin: "round"
1034
+ }, /*#__PURE__*/React.createElement("rect", {
1035
+ x: "5",
1036
+ y: "2",
1037
+ width: "14",
1038
+ height: "20",
1039
+ rx: "2",
1040
+ ry: "2"
1041
+ }), /*#__PURE__*/React.createElement("line", {
1042
+ x1: "12",
1043
+ y1: "18",
1044
+ x2: "12.01",
1045
+ y2: "18"
1046
+ }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
1047
+ className: "data-label"
1048
+ }, t("EKYC_PHONE_NO") || "Contact"), /*#__PURE__*/React.createElement("div", {
1049
+ className: "address-text"
1050
+ }, details.phoneNumber || t("CS_NA")))), /*#__PURE__*/React.createElement("div", {
1051
+ className: "contact-item"
1052
+ }, /*#__PURE__*/React.createElement("div", {
1053
+ className: "icon-wrapper-small"
1054
+ }, /*#__PURE__*/React.createElement("svg", {
1055
+ width: "16",
1056
+ height: "16",
1057
+ viewBox: "0 0 24 24",
1058
+ fill: "none",
1059
+ stroke: "#6B7B8E",
1060
+ strokeWidth: "2",
1061
+ strokeLinecap: "round",
1062
+ strokeLinejoin: "round"
1063
+ }, /*#__PURE__*/React.createElement("circle", {
1064
+ cx: "12",
1065
+ cy: "12",
1066
+ r: "4"
1067
+ }), /*#__PURE__*/React.createElement("path", {
1068
+ d: "M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.92 7.94"
1069
+ }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
1070
+ className: "data-label"
1071
+ }, t("EKYC_EMAIL") || "Email Address"), /*#__PURE__*/React.createElement("div", {
1072
+ className: "address-text"
1073
+ }, details.email || t("CS_NA")))))))), /*#__PURE__*/React.createElement("div", {
1074
+ className: "details-card-footer"
1075
+ }, /*#__PURE__*/React.createElement("div", {
1076
+ className: "footer-meta-text"
1077
+ }, connectionDetails !== null && connectionDetails !== void 0 && connectionDetails.lastVerified ? `${t("EKYC_LAST_VERIFIED") || "Last verified:"} ${connectionDetails.lastVerified}` : ""), /*#__PURE__*/React.createElement("div", {
1078
+ className: "action-btns-container"
1079
+ }, /*#__PURE__*/React.createElement("button", {
1080
+ onClick: handleStartVerification,
1081
+ className: "primary-action-btn"
1082
+ }, t("EKYC_START_VERIFICATION") || "Start Verification", /*#__PURE__*/React.createElement("svg", {
1083
+ width: "16",
1084
+ height: "16",
1085
+ viewBox: "0 0 24 24",
1086
+ fill: "none",
1087
+ stroke: "currentColor",
1088
+ strokeWidth: "2.5",
1089
+ strokeLinecap: "round",
1090
+ strokeLinejoin: "round"
1091
+ }, /*#__PURE__*/React.createElement("line", {
1092
+ x1: "5",
1093
+ y1: "12",
1094
+ x2: "19",
1095
+ y2: "12"
1096
+ }), /*#__PURE__*/React.createElement("polyline", {
1097
+ points: "12 5 19 12 12 19"
1098
+ }))))))), showModal && /*#__PURE__*/React.createElement(Modal, {
733
1099
  headerBarMain: t("EKYC_SELECT_VERIFICATION_TYPE"),
734
1100
  headerBarEnd: /*#__PURE__*/React.createElement("span", {
735
1101
  onClick: () => setShowModal(false),
@@ -825,8 +1191,15 @@ const Create = () => {
825
1191
  }
826
1192
  setSearchParams(params);
827
1193
  setSearchPerformed(true);
1194
+ const currentKno = sessionStorage.getItem("EKYC_K_NUMBER");
1195
+ if (currentKno !== params.kNumber) {
1196
+ Object.keys(sessionStorage).forEach(key => {
1197
+ if (key.startsWith("EKYC_")) sessionStorage.removeItem(key);
1198
+ });
1199
+ }
828
1200
  sessionStorage.setItem("EKYC_CREATE_SEARCH_PARAMS", JSON.stringify(params));
829
1201
  sessionStorage.setItem("EKYC_CREATE_SEARCH_PERFORMED", "true");
1202
+ sessionStorage.setItem("EKYC_K_NUMBER", params.kNumber);
830
1203
  };
831
1204
  const closeToast = () => {
832
1205
  setShowToast(null);
@@ -856,6 +1229,16 @@ const Create = () => {
856
1229
  }));
857
1230
  };
858
1231
 
1232
+ const getSavedData = (key, fallback) => {
1233
+ const saved = sessionStorage.getItem(key);
1234
+ try {
1235
+ return saved ? JSON.parse(saved) : fallback;
1236
+ } catch (e) {
1237
+ console.warn(`Error parsing sessionStorage key "${key}":`, e);
1238
+ return fallback;
1239
+ }
1240
+ };
1241
+
859
1242
  const CameraIcon = ({
860
1243
  size: _size3 = 28
861
1244
  }) => /*#__PURE__*/React.createElement("svg", {
@@ -889,25 +1272,6 @@ const PincodeIcon = ({
889
1272
  d: "M13 13V11H15V13H13ZM13 9V7H15V9H13ZM17 13V11H19V13H17ZM17 9V7H19V9H17ZM11 13V11H9V13H11ZM11 9V7H9V9H11ZM7 13V11H5V13H7ZM7 9V7H5V9H7ZM21 3H3C1.9 3 1 3.9 1 5V19C1 20.1 1.9 21 3 21H21C22.1 21 23 20.1 23 19V5C23 3.9 22.1 3 21 3ZM21 19H3V5H21V19Z",
890
1273
  fill: "currentColor"
891
1274
  }));
892
- const TrashIcon = ({
893
- size: _size6 = 16
894
- }) => /*#__PURE__*/React.createElement("svg", {
895
- width: _size6,
896
- height: _size6,
897
- viewBox: "0 0 24 24",
898
- fill: "none",
899
- stroke: "#D92D20",
900
- strokeWidth: "2",
901
- strokeLinecap: "round"
902
- }, /*#__PURE__*/React.createElement("polyline", {
903
- points: "3 6 5 6 21 6"
904
- }), /*#__PURE__*/React.createElement("path", {
905
- d: "M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"
906
- }), /*#__PURE__*/React.createElement("path", {
907
- d: "M10 11v6M14 11v6"
908
- }), /*#__PURE__*/React.createElement("path", {
909
- d: "M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"
910
- }));
911
1275
  const CheckIcon = ({
912
1276
  size: _size7 = 11,
913
1277
  color: _color = "#fff"
@@ -1001,23 +1365,91 @@ const AddressDetails = ({
1001
1365
  code: "SELF",
1002
1366
  name: "EKYC_SELF"
1003
1367
  },
1004
- connectionDetails: null
1368
+ connectionDetails: null,
1369
+ initialData: {}
1005
1370
  };
1371
+ const initialData = flowState.initialData || {};
1006
1372
  const addrDetails = ((_flowState$connection = flowState.connectionDetails) === null || _flowState$connection === void 0 ? void 0 : _flowState$connection.addressDetails) || {};
1007
- const [addressType, setAddressType] = useState({
1373
+ const [addressType, setAddressType] = useState(() => getSavedData("EKYC_ADDRESS_TYPE", {
1008
1374
  code: "AADHAAR",
1009
1375
  name: "EKYC_AADHAAR_ADDRESS"
1010
- });
1011
- const [correctAddress, setCorrectAddress] = useState({
1376
+ }));
1377
+ const [correctAddress, setCorrectAddress] = useState(() => getSavedData("EKYC_ADDRESS_CORRECT", {
1012
1378
  code: "NO",
1013
1379
  name: "CORE_COMMON_NO"
1014
- });
1015
- const [fullAddress, setFullAddress] = useState(addrDetails.fullAddress || "");
1016
- const [flatNo, setFlatNo] = useState(addrDetails.flatHouseNumber || "");
1017
- const [building, setBuilding] = useState(addrDetails.buildingTower || "");
1018
- const [landmark, setLandmark] = useState(addrDetails.landmark || "");
1019
- const [pincode, setPincode] = useState(addrDetails.pinCode || "");
1020
- const [doorPhoto, setDoorPhoto] = useState(null);
1380
+ }));
1381
+ const [fullAddress, setFullAddress] = useState(() => sessionStorage.getItem("EKYC_FULL_ADDRESS") || initialData.fullAddress || "");
1382
+ const [flatNo, setFlatNo] = useState(() => sessionStorage.getItem("EKYC_FLAT_NO") || initialData.flatNo || "");
1383
+ const [building, setBuilding] = useState(() => sessionStorage.getItem("EKYC_BUILDING") || initialData.building || "");
1384
+ const [landmark, setLandmark] = useState(() => sessionStorage.getItem("EKYC_LANDMARK") || initialData.landmark || "");
1385
+ const [pincode, setPincode] = useState(() => sessionStorage.getItem("EKYC_PINCODE") || initialData.pincode || "");
1386
+ const [doorPhoto, setDoorPhoto] = useState(() => sessionStorage.getItem("EKYC_DOOR_PHOTO") || null);
1387
+ const [doorPhotoFileStoreId, setDoorPhotoFileStoreId] = useState(() => sessionStorage.getItem("EKYC_DOOR_PHOTO_FILESTORE_ID") || null);
1388
+ const [filephoto, setFilephoto] = useState(null);
1389
+ const [error, setError] = useState(null);
1390
+ const [toast, setToast] = useState(null);
1391
+ useEffect(() => {
1392
+ sessionStorage.setItem("EKYC_ADDRESS_TYPE", JSON.stringify(addressType));
1393
+ sessionStorage.setItem("EKYC_ADDRESS_CORRECT", JSON.stringify(correctAddress));
1394
+ sessionStorage.setItem("EKYC_FULL_ADDRESS", fullAddress);
1395
+ sessionStorage.setItem("EKYC_FLAT_NO", flatNo);
1396
+ sessionStorage.setItem("EKYC_BUILDING", building);
1397
+ sessionStorage.setItem("EKYC_LANDMARK", landmark);
1398
+ sessionStorage.setItem("EKYC_PINCODE", pincode);
1399
+ if (doorPhoto) sessionStorage.setItem("EKYC_DOOR_PHOTO", doorPhoto);
1400
+ if (doorPhotoFileStoreId) sessionStorage.setItem("EKYC_DOOR_PHOTO_FILESTORE_ID", doorPhotoFileStoreId);
1401
+ sessionStorage.setItem("EKYC_CURRENT_STEP", "ADDRESS");
1402
+ }, [addressType, correctAddress, fullAddress, flatNo, building, landmark, pincode, doorPhoto, doorPhotoFileStoreId]);
1403
+ const uploadFile = async (file, tenantId) => {
1404
+ var _res$data, _res$data$files, _res$data$files$;
1405
+ if (!file) return null;
1406
+ const res = await Digit.UploadServices.Filestorage("EKYC", file, tenantId);
1407
+ return (res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$files = _res$data.files) === null || _res$data$files === void 0 ? void 0 : (_res$data$files$ = _res$data$files[0]) === null || _res$data$files$ === void 0 ? void 0 : _res$data$files$.fileStoreId) || null;
1408
+ };
1409
+ useEffect(() => {
1410
+ (async () => {
1411
+ setError(null);
1412
+ if (filephoto) {
1413
+ if (filephoto.size >= 2000000) {
1414
+ setError(t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED"));
1415
+ setToast({
1416
+ type: "error",
1417
+ message: t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED")
1418
+ });
1419
+ } else {
1420
+ try {
1421
+ setToast({
1422
+ type: "info",
1423
+ message: t("EKYC_UPLOADING")
1424
+ });
1425
+ const fsId = await uploadFile(filephoto, tenantId);
1426
+ if (fsId) {
1427
+ setDoorPhotoFileStoreId(fsId);
1428
+ const reader = new FileReader();
1429
+ reader.onloadend = () => setDoorPhoto(reader.result);
1430
+ reader.readAsDataURL(filephoto);
1431
+ setToast({
1432
+ type: "success",
1433
+ message: t("EKYC_UPLOAD_SUCCESS")
1434
+ });
1435
+ } else {
1436
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
1437
+ setToast({
1438
+ type: "error",
1439
+ message: t("EKYC_FILE_UPLOAD_ERROR")
1440
+ });
1441
+ }
1442
+ } catch (err) {
1443
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
1444
+ setToast({
1445
+ type: "error",
1446
+ message: t("EKYC_FILE_UPLOAD_ERROR")
1447
+ });
1448
+ }
1449
+ }
1450
+ }
1451
+ })();
1452
+ }, [filephoto]);
1021
1453
  const [isLocationFetching, setIsLocationFetching] = useState(false);
1022
1454
  const fileInputRef = useRef(null);
1023
1455
  const tenantId = Digit.ULBService.getCurrentTenantId();
@@ -1068,12 +1500,16 @@ const AddressDetails = ({
1068
1500
  return blocks;
1069
1501
  };
1070
1502
  const assemblies = getAssemblies(Array.isArray(rootBoundary) ? rootBoundary : rootBoundary ? [rootBoundary] : []);
1071
- const [assembly, setAssembly] = useState(addrDetails.assembly ? {
1072
- name: addrDetails.assembly
1073
- } : null);
1074
- const [ward, setWard] = useState(addrDetails.ward ? {
1075
- name: addrDetails.ward
1076
- } : null);
1503
+ const [assembly, setAssembly] = useState(() => getSavedData("EKYC_ASSEMBLY_DATA", initialData.assembly ? {
1504
+ name: initialData.assembly
1505
+ } : null));
1506
+ const [ward, setWard] = useState(() => getSavedData("EKYC_WARD_DATA", initialData.ward ? {
1507
+ name: initialData.ward
1508
+ } : null));
1509
+ useEffect(() => {
1510
+ sessionStorage.setItem("EKYC_ASSEMBLY_DATA", JSON.stringify(assembly));
1511
+ sessionStorage.setItem("EKYC_WARD_DATA", JSON.stringify(ward));
1512
+ }, [assembly, ward]);
1077
1513
  useEffect(() => {
1078
1514
  if (mdmsRes && addrDetails.assembly && !(assembly !== null && assembly !== void 0 && assembly.code)) {
1079
1515
  const foundAssembly = assemblies.find(a => a.name === addrDetails.assembly || a.code === addrDetails.assembly);
@@ -1109,6 +1545,7 @@ const AddressDetails = ({
1109
1545
  landmark,
1110
1546
  pincode,
1111
1547
  doorPhoto,
1548
+ doorPhotoFileStoreId,
1112
1549
  assembly: assembly === null || assembly === void 0 ? void 0 : assembly.name,
1113
1550
  ward: ward === null || ward === void 0 ? void 0 : ward.name
1114
1551
  };
@@ -1118,26 +1555,26 @@ const AddressDetails = ({
1118
1555
  const {
1119
1556
  kNumber,
1120
1557
  selectedOption,
1121
- connectionDetails
1558
+ connectionDetails,
1559
+ initialData
1122
1560
  } = flowState;
1123
1561
  history.push("/digit-ui/employee/ekyc/property-info", {
1124
1562
  kNumber,
1125
1563
  selectedOption,
1126
1564
  connectionDetails,
1127
- addressDetails: payload
1565
+ addressDetails: payload,
1566
+ initialData
1128
1567
  });
1129
1568
  }
1130
1569
  };
1131
- const handleCapture = e => {
1132
- const file = e.target.files[0];
1133
- if (!file) return;
1134
- const reader = new FileReader();
1135
- reader.onloadend = () => setDoorPhoto(reader.result);
1136
- reader.readAsDataURL(file);
1137
- };
1570
+ function selectphoto(e) {
1571
+ setDoorPhotoFileStoreId(null);
1572
+ setFilephoto(e.target.files[0]);
1573
+ }
1138
1574
  const removePhoto = () => {
1139
1575
  setDoorPhoto(null);
1140
- if (fileInputRef.current) fileInputRef.current.value = "";
1576
+ setDoorPhotoFileStoreId(null);
1577
+ setFilephoto(null);
1141
1578
  };
1142
1579
  const handleUseCurrentLocation = () => {
1143
1580
  if (!("geolocation" in navigator)) {
@@ -1519,137 +1956,42 @@ const AddressDetails = ({
1519
1956
  icon: /*#__PURE__*/React.createElement(CameraIcon, {
1520
1957
  size: 16
1521
1958
  }),
1522
- label: t("EKYC_DOOR_PHOTO_HEADER")
1959
+ label: t("EKYC_CAPTURE_DOOR_IMAGE")
1523
1960
  }), /*#__PURE__*/React.createElement("div", {
1524
1961
  style: {
1525
1962
  fontSize: "12px",
1526
1963
  color: "#667085",
1527
1964
  marginBottom: "12px"
1528
1965
  }
1529
- }, t("EKYC_REQUIRED_FOR_VERIFICATION")), /*#__PURE__*/React.createElement("div", {
1530
- style: {
1531
- backgroundColor: "#FFFAEB",
1532
- border: "0.5px solid #FEDF89",
1966
+ }, t("EKYC_REQUIRED_FOR_VERIFICATION")), /*#__PURE__*/React.createElement(UploadFile, {
1967
+ id: "ekyc-door-photo",
1968
+ extraStyleName: "propertyCreate",
1969
+ accept: ".jpg,.png,.jpeg",
1970
+ onUpload: selectphoto,
1971
+ onDelete: removePhoto,
1972
+ message: doorPhotoFileStoreId ? `1 ${t(`EKYC_ACTION_FILEUPLOADED`)}` : t(`EKYC_ACTION_NO_FILEUPLOADED`),
1973
+ error: error
1974
+ }), doorPhoto && /*#__PURE__*/React.createElement("div", {
1975
+ style: {
1976
+ marginTop: "10px",
1533
1977
  borderRadius: "8px",
1534
- padding: "12px 14px",
1535
- display: "flex",
1536
- alignItems: "flex-start",
1537
- gap: "10px",
1538
- marginBottom: "16px"
1539
- }
1540
- }, /*#__PURE__*/React.createElement("div", {
1541
- style: {
1542
- flexShrink: 0,
1543
- marginTop: "1px"
1544
- }
1545
- }, /*#__PURE__*/React.createElement(InfoBannerIcon, {
1546
- fill: "#B54708"
1547
- })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
1548
- style: {
1549
- fontWeight: "600",
1550
- color: "#B54708",
1551
- fontSize: "13px",
1552
- marginBottom: "2px"
1553
- }
1554
- }, t("EKYC_IMPORTANT")), /*#__PURE__*/React.createElement("div", {
1555
- style: {
1556
- fontSize: "12px",
1557
- color: "#92400E"
1558
- }
1559
- }, t("EKYC_CAPTURE_LIVE_CAMERA")))), /*#__PURE__*/React.createElement("input", {
1560
- type: "file",
1561
- ref: fileInputRef,
1562
- onChange: handleCapture,
1563
- accept: "image/*",
1564
- style: {
1565
- display: "none"
1566
- }
1567
- }), /*#__PURE__*/React.createElement("div", {
1568
- onClick: !doorPhoto ? () => fileInputRef.current.click() : undefined,
1569
- onMouseOver: e => {
1570
- if (!doorPhoto) e.currentTarget.style.borderColor = "#185FA5";
1571
- },
1572
- onMouseOut: e => {
1573
- if (!doorPhoto) e.currentTarget.style.borderColor = "#D0D5DD";
1574
- },
1575
- style: {
1576
- border: "1.5px dashed #D0D5DD",
1577
- borderRadius: "10px",
1578
- minHeight: "160px",
1579
- display: "flex",
1580
- flexDirection: "column",
1581
- alignItems: "center",
1582
- justifyContent: "center",
1583
- backgroundColor: "#F9FAFB",
1584
- cursor: doorPhoto ? "default" : "pointer",
1585
1978
  overflow: "hidden",
1586
- transition: "border-color 0.15s",
1587
- position: "relative",
1588
- padding: doorPhoto ? "0" : "32px 24px"
1589
- }
1590
- }, !doorPhoto ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
1591
- style: {
1592
- width: "52px",
1593
- height: "52px",
1594
- borderRadius: "50%",
1595
- background: "#E6F1FB",
1596
- display: "flex",
1597
- alignItems: "center",
1598
- justifyContent: "center",
1599
- marginBottom: "12px"
1600
- }
1601
- }, /*#__PURE__*/React.createElement(CameraIcon, {
1602
- size: 26
1603
- })), /*#__PURE__*/React.createElement("div", {
1604
- style: {
1605
- fontWeight: "600",
1606
- fontSize: "14px",
1607
- color: "#101828",
1608
- marginBottom: "4px"
1609
- }
1610
- }, t("EKYC_TAP_TO_CAPTURE") || "Tap to capture"), /*#__PURE__*/React.createElement("div", {
1611
- style: {
1612
- fontSize: "12px",
1613
- color: "#667085"
1979
+ border: "1px solid #EAECF0"
1614
1980
  }
1615
- }, t("EKYC_CAPTURE_DOOR_IMAGE"))) : /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("img", {
1981
+ }, /*#__PURE__*/React.createElement("img", {
1616
1982
  src: doorPhoto,
1617
- alt: "Door",
1983
+ alt: "Door Preview",
1618
1984
  style: {
1619
1985
  width: "100%",
1620
- maxHeight: "280px",
1621
- objectFit: "cover",
1622
- display: "block"
1623
- }
1624
- }), /*#__PURE__*/React.createElement("button", {
1625
- onClick: e => {
1626
- e.stopPropagation();
1627
- removePhoto();
1628
- },
1629
- style: {
1630
- position: "absolute",
1631
- top: "10px",
1632
- right: "10px",
1633
- background: "#fff",
1634
- border: "0.5px solid #EAECF0",
1635
- borderRadius: "7px",
1636
- padding: "6px 10px",
1637
- display: "flex",
1638
- alignItems: "center",
1639
- gap: "5px",
1640
- cursor: "pointer",
1641
- fontSize: "12px",
1642
- color: "#D92D20",
1643
- fontWeight: "500"
1986
+ maxHeight: "250px",
1987
+ objectFit: "cover"
1644
1988
  }
1645
- }, /*#__PURE__*/React.createElement(TrashIcon, {
1646
- size: 13
1647
- }), " ", t("EKYC_REMOVE")))), _isSection ? /*#__PURE__*/React.createElement("div", {
1989
+ })), _isSection ? /*#__PURE__*/React.createElement("div", {
1648
1990
  style: {
1649
1991
  marginTop: "24px"
1650
1992
  }
1651
1993
  }, /*#__PURE__*/React.createElement(SubmitBar, {
1652
- label: t("EKYC_COMPLETE_VERIFICATION_AND_PROCEED"),
1994
+ label: t("ES_COMMON_SAVE_CONTINUE"),
1653
1995
  onSubmit: handleCompleteVerification
1654
1996
  })) : /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement(SubmitBar, {
1655
1997
  label: t("EKYC_COMPLETE_VERIFICATION"),
@@ -1680,7 +2022,13 @@ const AddressDetails = ({
1680
2022
  rx: "2"
1681
2023
  }), /*#__PURE__*/React.createElement("path", {
1682
2024
  d: "M7 11V7a5 5 0 0 1 10 0v4"
1683
- })), t("EKYC_SECURE_DATA_NOTICE")));
2025
+ })), t("EKYC_SECURE_DATA_NOTICE")), toast && /*#__PURE__*/React.createElement(Toast, {
2026
+ label: toast.message,
2027
+ error: toast.type === "error",
2028
+ info: toast.type === "info",
2029
+ success: toast.type === "success",
2030
+ onClose: () => setToast(null)
2031
+ }));
1684
2032
  if (_isSection) {
1685
2033
  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("hr", {
1686
2034
  style: {
@@ -1741,6 +2089,10 @@ const AddressDetails = ({
1741
2089
  label: t("EKYC_STEP_PROPERTY") || "Property",
1742
2090
  done: false,
1743
2091
  active: false
2092
+ }, {
2093
+ label: t("EKYC_STEP_METER") || "Meter",
2094
+ done: false,
2095
+ active: false
1744
2096
  }, {
1745
2097
  label: t("EKYC_STEP_REVIEW") || "Review",
1746
2098
  done: false,
@@ -1752,9 +2104,9 @@ const AddressDetails = ({
1752
2104
  gap: "10px",
1753
2105
  alignItems: "flex-start",
1754
2106
  position: "relative",
1755
- paddingBottom: i < 3 ? "18px" : 0
2107
+ paddingBottom: i < 4 ? "18px" : 0
1756
2108
  }
1757
- }, i < 3 && /*#__PURE__*/React.createElement("div", {
2109
+ }, i < 4 && /*#__PURE__*/React.createElement("div", {
1758
2110
  style: {
1759
2111
  position: "absolute",
1760
2112
  left: "10px",
@@ -2044,7 +2396,6 @@ const RadioToggleRow = ({
2044
2396
  }
2045
2397
  }));
2046
2398
  const AadhaarVerification = () => {
2047
- var _connectionDetails$ad;
2048
2399
  const {
2049
2400
  t
2050
2401
  } = useTranslation();
@@ -2070,26 +2421,63 @@ const AadhaarVerification = () => {
2070
2421
  }
2071
2422
  }
2072
2423
  };
2073
- const details = (connectionDetails === null || connectionDetails === void 0 ? void 0 : connectionDetails.connectionDetails) || (connectionDetails === null || connectionDetails === void 0 ? void 0 : connectionDetails.connectionDetailsInfo) || {};
2074
- const [aadhaarLastFour, setAadhaarLastFour] = useState("");
2075
- const [isAadhaarVerified, setIsAadhaarVerified] = useState(false);
2424
+ const initialDetails = (connectionDetails === null || connectionDetails === void 0 ? void 0 : connectionDetails.connectionDetails) || (connectionDetails === null || connectionDetails === void 0 ? void 0 : connectionDetails.connectionDetailsInfo) || {};
2425
+ const [initialData] = useState(() => {
2426
+ var _connectionDetails$ad, _connectionDetails$pr, _connectionDetails$co, _connectionDetails$co2, _connectionDetails$pr2, _connectionDetails$pr3, _connectionDetails$ad2, _connectionDetails$ad3, _connectionDetails$ad4, _connectionDetails$ad5, _connectionDetails$ad6, _connectionDetails$ad7, _connectionDetails$ad8;
2427
+ return getSavedData("EKYC_INITIAL_DATA", {
2428
+ userName: initialDetails.consumerName || "",
2429
+ mobileNumber: initialDetails.phoneNumber || "",
2430
+ whatsappNumber: initialDetails.phoneNumber || "",
2431
+ email: initialDetails.email || "",
2432
+ noOfPersons: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad = connectionDetails.addressDetails) === null || _connectionDetails$ad === void 0 ? void 0 : _connectionDetails$ad.noOfPerson) || "",
2433
+ pidNumber: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$pr = connectionDetails.propertyDetails) === null || _connectionDetails$pr === void 0 ? void 0 : _connectionDetails$pr.pidNumber) || "",
2434
+ typeOfConnection: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$co = connectionDetails.connectionDetails) === null || _connectionDetails$co === void 0 ? void 0 : _connectionDetails$co.connectionType) || "",
2435
+ connectionCategory: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$co2 = connectionDetails.connectionDetails) === null || _connectionDetails$co2 === void 0 ? void 0 : _connectionDetails$co2.connectionCategory) || "",
2436
+ userType: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$pr2 = connectionDetails.propertyDetails) === null || _connectionDetails$pr2 === void 0 ? void 0 : _connectionDetails$pr2.userType) || "",
2437
+ noOfFloor: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$pr3 = connectionDetails.propertyDetails) === null || _connectionDetails$pr3 === void 0 ? void 0 : _connectionDetails$pr3.noOfFloor) || null,
2438
+ fullAddress: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad2 = connectionDetails.addressDetails) === null || _connectionDetails$ad2 === void 0 ? void 0 : _connectionDetails$ad2.fullAddress) || "",
2439
+ flatNo: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad3 = connectionDetails.addressDetails) === null || _connectionDetails$ad3 === void 0 ? void 0 : _connectionDetails$ad3.flatHouseNumber) || "",
2440
+ building: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad4 = connectionDetails.addressDetails) === null || _connectionDetails$ad4 === void 0 ? void 0 : _connectionDetails$ad4.buildingTower) || "",
2441
+ landmark: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad5 = connectionDetails.addressDetails) === null || _connectionDetails$ad5 === void 0 ? void 0 : _connectionDetails$ad5.landmark) || "",
2442
+ pincode: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad6 = connectionDetails.addressDetails) === null || _connectionDetails$ad6 === void 0 ? void 0 : _connectionDetails$ad6.pinCode) || "",
2443
+ assembly: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad7 = connectionDetails.addressDetails) === null || _connectionDetails$ad7 === void 0 ? void 0 : _connectionDetails$ad7.assembly) || "",
2444
+ ward: (connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad8 = connectionDetails.addressDetails) === null || _connectionDetails$ad8 === void 0 ? void 0 : _connectionDetails$ad8.ward) || ""
2445
+ });
2446
+ });
2447
+ useEffect(() => {
2448
+ sessionStorage.setItem("EKYC_INITIAL_DATA", JSON.stringify(initialData));
2449
+ }, [initialData]);
2450
+ const [aadhaarLastFour, setAadhaarLastFour] = useState(() => sessionStorage.getItem("EKYC_AADHAAR_LAST_FOUR") || "");
2451
+ const [isAadhaarVerified, setIsAadhaarVerified] = useState(() => sessionStorage.getItem("EKYC_AADHAAR_VERIFIED") === "true");
2076
2452
  const [isVerifying, setIsVerifying] = useState(false);
2077
2453
  const [showOtpField, setShowOtpField] = useState(false);
2078
2454
  const [otp, setOtp] = useState("");
2079
2455
  const [otpError, setOtpError] = useState(false);
2080
- const [nameCorrect, setNameCorrect] = useState({
2456
+ const [nameCorrect, setNameCorrect] = useState(() => getSavedData("EKYC_NAME_CORRECT", {
2081
2457
  code: "NO",
2082
2458
  name: "CORE_COMMON_NO"
2083
- });
2084
- const [userName, setUserName] = useState(details.consumerName || "");
2085
- const [mobileChange, setMobileChange] = useState({
2459
+ }));
2460
+ const [userName, setUserName] = useState(() => sessionStorage.getItem("EKYC_USER_NAME") || initialData.userName);
2461
+ const [mobileChange, setMobileChange] = useState(() => getSavedData("EKYC_MOBILE_CHANGE", {
2086
2462
  code: "NO",
2087
2463
  name: "CORE_COMMON_NO"
2088
- });
2089
- const [mobileNumber, setMobileNumber] = useState(details.phoneNumber || "");
2090
- const [whatsappNumber, setWhatsappNumber] = useState(details.phoneNumber || "");
2091
- const [email, setEmail] = useState(details.email || "");
2092
- const [noOfPersons, setNoOfPersons] = useState((connectionDetails === null || connectionDetails === void 0 ? void 0 : (_connectionDetails$ad = connectionDetails.addressDetails) === null || _connectionDetails$ad === void 0 ? void 0 : _connectionDetails$ad.noOfPerson) || "");
2464
+ }));
2465
+ const [mobileNumber, setMobileNumber] = useState(() => sessionStorage.getItem("EKYC_MOBILE_NUMBER") || initialData.mobileNumber);
2466
+ const [whatsappNumber, setWhatsappNumber] = useState(() => sessionStorage.getItem("EKYC_WHATSAPP_NUMBER") || initialData.whatsappNumber);
2467
+ const [email, setEmail] = useState(() => sessionStorage.getItem("EKYC_EMAIL") || initialData.email);
2468
+ const [noOfPersons, setNoOfPersons] = useState(() => sessionStorage.getItem("EKYC_NO_OF_PERSONS") || initialData.noOfPersons);
2469
+ useEffect(() => {
2470
+ sessionStorage.setItem("EKYC_AADHAAR_LAST_FOUR", aadhaarLastFour);
2471
+ sessionStorage.setItem("EKYC_AADHAAR_VERIFIED", isAadhaarVerified);
2472
+ sessionStorage.setItem("EKYC_NAME_CORRECT", JSON.stringify(nameCorrect));
2473
+ sessionStorage.setItem("EKYC_USER_NAME", userName);
2474
+ sessionStorage.setItem("EKYC_MOBILE_CHANGE", JSON.stringify(mobileChange));
2475
+ sessionStorage.setItem("EKYC_MOBILE_NUMBER", mobileNumber);
2476
+ sessionStorage.setItem("EKYC_WHATSAPP_NUMBER", whatsappNumber);
2477
+ sessionStorage.setItem("EKYC_EMAIL", email);
2478
+ sessionStorage.setItem("EKYC_NO_OF_PERSONS", noOfPersons);
2479
+ sessionStorage.setItem("EKYC_CURRENT_STEP", "AADHAAR");
2480
+ }, [aadhaarLastFour, isAadhaarVerified, nameCorrect, userName, mobileChange, mobileNumber, whatsappNumber, email, noOfPersons]);
2093
2481
  const [showAddressSection, setShowAddressSection] = useState(false);
2094
2482
  const [addressData, setAddressData] = useState(null);
2095
2483
  const yesNoOptions = [{
@@ -2149,7 +2537,8 @@ const AadhaarVerification = () => {
2149
2537
  email,
2150
2538
  noOfPersons
2151
2539
  },
2152
- addressDetails
2540
+ addressDetails,
2541
+ initialData: initialData
2153
2542
  });
2154
2543
  };
2155
2544
  const styles = {
@@ -2264,6 +2653,10 @@ const AadhaarVerification = () => {
2264
2653
  label: t("EKYC_STEP_PROPERTY") || "Property",
2265
2654
  done: false,
2266
2655
  active: false
2656
+ }, {
2657
+ label: t("EKYC_STEP_METER") || "Meter",
2658
+ done: false,
2659
+ active: false
2267
2660
  }, {
2268
2661
  label: t("EKYC_STEP_REVIEW") || "Review",
2269
2662
  done: false,
@@ -2276,7 +2669,7 @@ const AadhaarVerification = () => {
2276
2669
  }, step.done ? /*#__PURE__*/React.createElement(CheckIcon$1, {
2277
2670
  size: 11,
2278
2671
  color: "#fff"
2279
- }) : i + 1), i < 3 && /*#__PURE__*/React.createElement("div", {
2672
+ }) : i + 1), i < 4 && /*#__PURE__*/React.createElement("div", {
2280
2673
  className: "ekyc-step-line"
2281
2674
  }), /*#__PURE__*/React.createElement("div", {
2282
2675
  className: `ekyc-step-label${step.done ? " done" : step.active ? " active" : ""}`
@@ -2342,7 +2735,7 @@ const AadhaarVerification = () => {
2342
2735
  style: {
2343
2736
  marginTop: "16px"
2344
2737
  }
2345
- }, t("EKYC_ENTER_OTP") || "Enter OTP"), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement("div", {
2738
+ }, t("EKYC_ENTER_OTP")), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement("div", {
2346
2739
  className: "field"
2347
2740
  }, /*#__PURE__*/React.createElement(IconInput$1, {
2348
2741
  icon: /*#__PURE__*/React.createElement(LockIcon, {
@@ -2411,7 +2804,7 @@ const AadhaarVerification = () => {
2411
2804
  style: styles.infoLabel
2412
2805
  }, t("EKYC_NAME") || "Name"), /*#__PURE__*/React.createElement("div", {
2413
2806
  style: styles.infoValue
2414
- }, details.consumerName)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
2807
+ }, initialDetails.consumerName)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
2415
2808
  style: styles.infoLabel
2416
2809
  }, t("EKYC_AADHAAR") || "Aadhaar"), /*#__PURE__*/React.createElement("div", {
2417
2810
  style: styles.infoValue
@@ -2426,7 +2819,7 @@ const AadhaarVerification = () => {
2426
2819
  ...styles.infoValue,
2427
2820
  fontSize: "13px"
2428
2821
  }
2429
- }, details.address)))), /*#__PURE__*/React.createElement("hr", {
2822
+ }, initialDetails.address)))), /*#__PURE__*/React.createElement("hr", {
2430
2823
  style: {
2431
2824
  margin: "24px 0",
2432
2825
  border: 0,
@@ -2482,7 +2875,9 @@ const AadhaarVerification = () => {
2482
2875
  style: styles.twoCol
2483
2876
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
2484
2877
  className: "ekyc-field-label"
2485
- }, t("EKYC_WHATSAPP_NUMBER") || "WhatsApp Number"), /*#__PURE__*/React.createElement(IconInput$1, {
2878
+ }, t("EKYC_WHATSAPP_NUMBER") || "WhatsApp Number", /*#__PURE__*/React.createElement("span", {
2879
+ style: styles.optionalTag
2880
+ }, t("EKYC_OPTIONAL") || "Optional")), /*#__PURE__*/React.createElement(IconInput$1, {
2486
2881
  icon: /*#__PURE__*/React.createElement(WhatsappIcon, {
2487
2882
  size: 15
2488
2883
  }),
@@ -2600,35 +2995,6 @@ const DocumentIcon = ({
2600
2995
  }, /*#__PURE__*/React.createElement("path", {
2601
2996
  d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 7V3.5L18.5 9H13z"
2602
2997
  }));
2603
- const CameraIcon$1 = ({
2604
- size: _size5 = 24
2605
- }) => /*#__PURE__*/React.createElement("svg", {
2606
- width: _size5,
2607
- height: _size5,
2608
- viewBox: "0 0 24 24",
2609
- fill: "currentColor"
2610
- }, /*#__PURE__*/React.createElement("path", {
2611
- d: "M9 2L7.17 4H4C2.9 4 2 4.9 2 6v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L13 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z"
2612
- }));
2613
- const TrashIcon$1 = ({
2614
- size: _size6 = 14
2615
- }) => /*#__PURE__*/React.createElement("svg", {
2616
- width: _size6,
2617
- height: _size6,
2618
- viewBox: "0 0 24 24",
2619
- fill: "none",
2620
- stroke: "#D92D20",
2621
- strokeWidth: "2",
2622
- strokeLinecap: "round"
2623
- }, /*#__PURE__*/React.createElement("polyline", {
2624
- points: "3 6 5 6 21 6"
2625
- }), /*#__PURE__*/React.createElement("path", {
2626
- d: "M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"
2627
- }), /*#__PURE__*/React.createElement("path", {
2628
- d: "M10 11v6M14 11v6"
2629
- }), /*#__PURE__*/React.createElement("path", {
2630
- d: "M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"
2631
- }));
2632
2998
  const PidIcon = ({
2633
2999
  size: _size7 = 16
2634
3000
  }) => /*#__PURE__*/React.createElement("svg", {
@@ -2711,11 +3077,13 @@ const PropertyInfo = () => {
2711
3077
  const history = useHistory();
2712
3078
  const location = useLocation();
2713
3079
  const flowState = location.state || {
2714
- kNumber: "EKYC-1234567890"
3080
+ kNumber: sessionStorage.getItem("EKYC_K_NUMBER") || "EKYC-1234567890",
3081
+ initialData: getSavedData("EKYC_INITIAL_DATA", {})
2715
3082
  };
2716
3083
  const {
2717
3084
  kNumber
2718
3085
  } = flowState;
3086
+ const initialData = flowState.initialData || getSavedData("EKYC_INITIAL_DATA", {});
2719
3087
  const tenantId = Digit.ULBService.getCurrentTenantId();
2720
3088
  const {
2721
3089
  data: dataV0
@@ -2729,18 +3097,141 @@ const PropertyInfo = () => {
2729
3097
  const {
2730
3098
  data: dataV2
2731
3099
  } = Digit.Hooks.ekyc.useGetFloorCount(tenantId);
2732
- const [ownerType, setOwnerType] = useState("OWNER");
2733
- const [pidNumber, setPidNumber] = useState("");
2734
- const [connectionCategory, setConnectionCategory] = useState(null);
2735
- const [connectionType, setConnectionType] = useState(null);
2736
- const [userType, setUserType] = useState(null);
2737
- const [noOfFloors, setNoOfFloors] = useState(null);
2738
- const [propertyDocument, setPropertyDocument] = useState(null);
2739
- const [buildingPhoto, setBuildingPhoto] = useState(null);
3100
+ const [ownerType, setOwnerType] = useState(() => sessionStorage.getItem("EKYC_OWNER_TYPE") || initialData.ownerType || "OWNER");
3101
+ const [pidNumber, setPidNumber] = useState(() => sessionStorage.getItem("EKYC_PID_NUMBER") || initialData.pidNumber || "");
3102
+ const [connectionCategory, setConnectionCategory] = useState(() => getSavedData("EKYC_TYPE_OF_CONNECTION_DATA", initialData.typeOfConnection ? {
3103
+ label: t(initialData.typeOfConnection),
3104
+ value: initialData.typeOfConnection
3105
+ } : null));
3106
+ const [connectionType, setConnectionType] = useState(() => getSavedData("EKYC_CONNECTION_CATEGORY_DATA", initialData.connectionCategory ? {
3107
+ label: t(initialData.connectionCategory),
3108
+ value: initialData.connectionCategory
3109
+ } : null));
3110
+ const [userType, setUserType] = useState(() => getSavedData("EKYC_USER_TYPE_DATA", initialData.userType ? {
3111
+ label: t(initialData.userType),
3112
+ value: initialData.userType
3113
+ } : null));
3114
+ const [noOfFloors, setNoOfFloors] = useState(() => getSavedData("EKYC_NO_OF_FLOORS_DATA", initialData.noOfFloor ? {
3115
+ label: t(initialData.noOfFloor),
3116
+ value: initialData.noOfFloor
3117
+ } : null));
3118
+ const [propertyDocument, setPropertyDocument] = useState(() => sessionStorage.getItem("EKYC_PROPERTY_DOC") || null);
3119
+ const [propertyDocumentFileStoreId, setPropertyDocumentFileStoreId] = useState(() => sessionStorage.getItem("EKYC_PROPERTY_DOC_FILESTORE_ID") || null);
3120
+ const [buildingPhoto, setBuildingPhoto] = useState(() => sessionStorage.getItem("EKYC_BUILDING_PHOTO") || null);
3121
+ const [buildingPhotoFileStoreId, setBuildingPhotoFileStoreId] = useState(() => sessionStorage.getItem("EKYC_BUILDING_PHOTO_FILESTORE_ID") || null);
3122
+ const [filepdf, setFilepdf] = useState(null);
3123
+ const [filephoto, setFilephoto] = useState(null);
3124
+ const [error, setError] = useState(null);
3125
+ const [toast, setToast] = useState(null);
3126
+ useEffect(() => {
3127
+ sessionStorage.setItem("EKYC_OWNER_TYPE", ownerType);
3128
+ sessionStorage.setItem("EKYC_PID_NUMBER", pidNumber);
3129
+ sessionStorage.setItem("EKYC_TYPE_OF_CONNECTION_DATA", JSON.stringify(connectionCategory));
3130
+ sessionStorage.setItem("EKYC_CONNECTION_CATEGORY_DATA", JSON.stringify(connectionType));
3131
+ sessionStorage.setItem("EKYC_USER_TYPE_DATA", JSON.stringify(userType));
3132
+ sessionStorage.setItem("EKYC_NO_OF_FLOORS_DATA", JSON.stringify(noOfFloors));
3133
+ if (propertyDocument) sessionStorage.setItem("EKYC_PROPERTY_DOC", propertyDocument);
3134
+ if (propertyDocumentFileStoreId) sessionStorage.setItem("EKYC_PROPERTY_DOC_FILESTORE_ID", propertyDocumentFileStoreId);
3135
+ if (buildingPhoto) sessionStorage.setItem("EKYC_BUILDING_PHOTO", buildingPhoto);
3136
+ if (buildingPhotoFileStoreId) sessionStorage.setItem("EKYC_BUILDING_PHOTO_FILESTORE_ID", buildingPhotoFileStoreId);
3137
+ sessionStorage.setItem("EKYC_CURRENT_STEP", "PROPERTY");
3138
+ }, [ownerType, pidNumber, connectionCategory, connectionType, userType, noOfFloors, propertyDocument, propertyDocumentFileStoreId, buildingPhoto, buildingPhotoFileStoreId]);
3139
+ const uploadFile = async (file, tenantId) => {
3140
+ var _res$data, _res$data$files, _res$data$files$;
3141
+ if (!file) return null;
3142
+ const res = await Digit.UploadServices.Filestorage("EKYC", file, tenantId);
3143
+ return (res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$files = _res$data.files) === null || _res$data$files === void 0 ? void 0 : (_res$data$files$ = _res$data$files[0]) === null || _res$data$files$ === void 0 ? void 0 : _res$data$files$.fileStoreId) || null;
3144
+ };
3145
+ useEffect(() => {
3146
+ (async () => {
3147
+ setError(null);
3148
+ if (filepdf) {
3149
+ if (filepdf.size >= 5000000) {
3150
+ setError(t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED"));
3151
+ setToast({
3152
+ type: "error",
3153
+ message: t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED")
3154
+ });
3155
+ } else {
3156
+ try {
3157
+ setToast({
3158
+ type: "info",
3159
+ message: t("EKYC_UPLOADING")
3160
+ });
3161
+ const fileStoreId = await uploadFile(filepdf, tenantId);
3162
+ if (fileStoreId) {
3163
+ setPropertyDocumentFileStoreId(fileStoreId);
3164
+ setPropertyDocument(filepdf.name);
3165
+ setToast({
3166
+ type: "success",
3167
+ message: t("EKYC_UPLOAD_SUCCESS")
3168
+ });
3169
+ } else {
3170
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
3171
+ setToast({
3172
+ type: "error",
3173
+ message: t("EKYC_FILE_UPLOAD_ERROR")
3174
+ });
3175
+ }
3176
+ } catch (err) {
3177
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
3178
+ setToast({
3179
+ type: "error",
3180
+ message: t("EKYC_FILE_UPLOAD_ERROR")
3181
+ });
3182
+ }
3183
+ }
3184
+ }
3185
+ })();
3186
+ }, [filepdf]);
3187
+ useEffect(() => {
3188
+ (async () => {
3189
+ setError(null);
3190
+ if (filephoto) {
3191
+ if (filephoto.size >= 2000000) {
3192
+ setError(t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED"));
3193
+ setToast({
3194
+ type: "error",
3195
+ message: t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED")
3196
+ });
3197
+ } else {
3198
+ try {
3199
+ setToast({
3200
+ type: "info",
3201
+ message: t("EKYC_UPLOADING")
3202
+ });
3203
+ const fileStoreId = await uploadFile(filephoto, tenantId);
3204
+ if (fileStoreId) {
3205
+ setBuildingPhotoFileStoreId(fileStoreId);
3206
+ const reader = new FileReader();
3207
+ reader.onloadend = () => setBuildingPhoto(reader.result);
3208
+ reader.readAsDataURL(filephoto);
3209
+ setToast({
3210
+ type: "success",
3211
+ message: t("EKYC_UPLOAD_SUCCESS")
3212
+ });
3213
+ } else {
3214
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
3215
+ setToast({
3216
+ type: "error",
3217
+ message: t("EKYC_FILE_UPLOAD_ERROR")
3218
+ });
3219
+ }
3220
+ } catch (err) {
3221
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
3222
+ setToast({
3223
+ type: "error",
3224
+ message: t("EKYC_FILE_UPLOAD_ERROR")
3225
+ });
3226
+ }
3227
+ }
3228
+ }
3229
+ })();
3230
+ }, [filephoto]);
2740
3231
  const fileRef = useRef(null);
2741
3232
  const cameraRef = useRef(null);
2742
3233
  const handleSaveAndContinue = () => {
2743
- history.push("/digit-ui/employee/ekyc/review", {
3234
+ history.push("/digit-ui/employee/ekyc/meter-details", {
2744
3235
  ...flowState,
2745
3236
  propertyDetails: {
2746
3237
  ownerType,
@@ -2750,22 +3241,21 @@ const PropertyInfo = () => {
2750
3241
  userType,
2751
3242
  noOfFloors,
2752
3243
  propertyDocument,
2753
- buildingPhoto
2754
- }
3244
+ propertyDocumentFileStoreId,
3245
+ buildingPhoto,
3246
+ buildingPhotoFileStoreId
3247
+ },
3248
+ initialData
2755
3249
  });
2756
3250
  };
2757
- const handleFileUpload = e => {
2758
- const file = e.target.files[0];
2759
- if (!file) return;
2760
- setPropertyDocument(file);
2761
- };
2762
- const handlePhotoCapture = e => {
2763
- const file = e.target.files[0];
2764
- if (!file) return;
2765
- const reader = new FileReader();
2766
- reader.onloadend = () => setBuildingPhoto(reader.result);
2767
- reader.readAsDataURL(file);
2768
- };
3251
+ function selectpdf(e) {
3252
+ setPropertyDocumentFileStoreId(null);
3253
+ setFilepdf(e.target.files[0]);
3254
+ }
3255
+ function selectphoto(e) {
3256
+ setBuildingPhotoFileStoreId(null);
3257
+ setFilephoto(e.target.files[0]);
3258
+ }
2769
3259
  const connectionCategoryOptions = (dataV0 === null || dataV0 === void 0 ? void 0 : (_dataV0$wsServicesC = dataV0["ws-services-calculation"]) === null || _dataV0$wsServicesC === void 0 ? void 0 : (_dataV0$wsServicesC$p = _dataV0$wsServicesC.propertyTypeV2) === null || _dataV0$wsServicesC$p === void 0 ? void 0 : _dataV0$wsServicesC$p.map(item => ({
2770
3260
  label: t(item.code),
2771
3261
  value: item.code
@@ -2782,7 +3272,7 @@ const PropertyInfo = () => {
2782
3272
  label: t(item.code),
2783
3273
  value: item.code
2784
3274
  }))) || [];
2785
- return /*#__PURE__*/React.createElement("div", {
3275
+ return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
2786
3276
  className: "inbox-container"
2787
3277
  }, /*#__PURE__*/React.createElement("style", null, `
2788
3278
  @keyframes fadeSlideIn {
@@ -2835,6 +3325,10 @@ const PropertyInfo = () => {
2835
3325
  label: t("EKYC_STEP_PROPERTY") || "Property",
2836
3326
  done: false,
2837
3327
  active: true
3328
+ }, {
3329
+ label: t("EKYC_STEP_METER") || "Meter",
3330
+ done: false,
3331
+ active: false
2838
3332
  }, {
2839
3333
  label: t("EKYC_STEP_REVIEW") || "Review",
2840
3334
  done: false,
@@ -2846,9 +3340,9 @@ const PropertyInfo = () => {
2846
3340
  gap: "10px",
2847
3341
  alignItems: "flex-start",
2848
3342
  position: "relative",
2849
- paddingBottom: i < 3 ? "18px" : 0
3343
+ paddingBottom: i < 4 ? "18px" : 0
2850
3344
  }
2851
- }, i < 3 && /*#__PURE__*/React.createElement("div", {
3345
+ }, i < 4 && /*#__PURE__*/React.createElement("div", {
2852
3346
  style: {
2853
3347
  position: "absolute",
2854
3348
  left: "10px",
@@ -3004,39 +3498,7 @@ const PropertyInfo = () => {
3004
3498
  gap: "14px",
3005
3499
  marginBottom: "14px"
3006
3500
  }
3007
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3008
- style: {
3009
- fontSize: "11px",
3010
- fontWeight: "600",
3011
- color: "#667085",
3012
- textTransform: "uppercase",
3013
- letterSpacing: "0.04em",
3014
- marginBottom: "6px"
3015
- }
3016
- }, t("EKYC_TYPE_OF_CONNECTION") || "Type of connection"), /*#__PURE__*/React.createElement(Dropdown, {
3017
- selected: connectionCategory,
3018
- select: setConnectionCategory,
3019
- option: connectionCategoryOptions,
3020
- optionKey: "label",
3021
- t: t,
3022
- placeholder: t("EKYC_SELECT") || "Select"
3023
- })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3024
- style: {
3025
- fontSize: "11px",
3026
- fontWeight: "600",
3027
- color: "#667085",
3028
- textTransform: "uppercase",
3029
- letterSpacing: "0.04em",
3030
- marginBottom: "6px"
3031
- }
3032
- }, t("EKYC_CONNECTION_CATEGORY") || "Connection category"), /*#__PURE__*/React.createElement(Dropdown, {
3033
- selected: connectionType,
3034
- select: setConnectionType,
3035
- option: connectionTypeOptions,
3036
- optionKey: "label",
3037
- t: t,
3038
- placeholder: t("EKYC_SELECT") || "Select"
3039
- }))), /*#__PURE__*/React.createElement("div", {
3501
+ }), /*#__PURE__*/React.createElement("div", {
3040
3502
  style: {
3041
3503
  display: "grid",
3042
3504
  gridTemplateColumns: "1fr 1fr",
@@ -3102,205 +3564,709 @@ const PropertyInfo = () => {
3102
3564
  letterSpacing: "0.04em",
3103
3565
  marginBottom: "8px"
3104
3566
  }
3105
- }, t("EKYC_UPLOAD_PROPERTY_DOC") || "Upload property document"), /*#__PURE__*/React.createElement("input", {
3106
- type: "file",
3107
- ref: fileRef,
3567
+ }, t("EKYC_UPLOAD_PROPERTY_DOC") || "Upload property document"), /*#__PURE__*/React.createElement(UploadFile, {
3568
+ id: "ekyc-property-doc",
3569
+ extraStyleName: "propertyCreate",
3108
3570
  accept: ".pdf",
3109
- style: {
3110
- display: "none"
3111
- },
3112
- onChange: handleFileUpload
3113
- }), /*#__PURE__*/React.createElement("div", {
3114
- onClick: () => pidNumber && fileRef.current.click(),
3115
- onMouseOver: e => {
3116
- if (pidNumber) e.currentTarget.style.borderColor = "#185FA5";
3571
+ onUpload: selectpdf,
3572
+ onDelete: () => {
3573
+ setPropertyDocumentFileStoreId(null);
3574
+ setPropertyDocument(null);
3575
+ setFilepdf(null);
3117
3576
  },
3118
- onMouseOut: e => {
3119
- if (pidNumber) e.currentTarget.style.borderColor = "#B5D4F4";
3577
+ message: propertyDocumentFileStoreId ? `1 ${t(`EKYC_ACTION_FILEUPLOADED`)}` : t(`EKYC_ACTION_NO_FILEUPLOADED`),
3578
+ error: error,
3579
+ disabled: !pidNumber
3580
+ }), !pidNumber && /*#__PURE__*/React.createElement("div", {
3581
+ style: {
3582
+ fontSize: "11px",
3583
+ color: "#D92D20",
3584
+ marginTop: "4px"
3585
+ }
3586
+ }, t("EKYC_ENTER_PID_FIRST_CTA") || "Enter PID to upload")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3587
+ style: {
3588
+ fontSize: "11px",
3589
+ fontWeight: "600",
3590
+ color: "#667085",
3591
+ textTransform: "uppercase",
3592
+ letterSpacing: "0.04em",
3593
+ marginBottom: "8px"
3594
+ }
3595
+ }, t("EKYC_CAPTURE_BUILDING_IMAGE") || "Capture building image"), /*#__PURE__*/React.createElement(UploadFile, {
3596
+ id: "ekyc-building-photo",
3597
+ extraStyleName: "propertyCreate",
3598
+ accept: ".jpg,.png,.jpeg",
3599
+ onUpload: selectphoto,
3600
+ onDelete: () => {
3601
+ setBuildingPhotoFileStoreId(null);
3602
+ setBuildingPhoto(null);
3603
+ setFilephoto(null);
3120
3604
  },
3605
+ message: buildingPhotoFileStoreId ? `1 ${t(`EKYC_ACTION_FILEUPLOADED`)}` : t(`EKYC_ACTION_NO_FILEUPLOADED`),
3606
+ error: error
3607
+ }), buildingPhoto && /*#__PURE__*/React.createElement("div", {
3121
3608
  style: {
3122
- border: pidNumber ? "1.5px dashed #B5D4F4" : "1.5px dashed #D0D5DD",
3123
- borderRadius: "10px",
3124
- padding: "28px 20px",
3125
- textAlign: "center",
3126
- cursor: pidNumber ? "pointer" : "not-allowed",
3127
- backgroundColor: pidNumber ? "#E6F1FB" : "#F9FAFB",
3128
- minHeight: "160px",
3609
+ marginTop: "10px",
3610
+ borderRadius: "8px",
3611
+ overflow: "hidden",
3612
+ border: "1px solid #EAECF0"
3613
+ }
3614
+ }, /*#__PURE__*/React.createElement("img", {
3615
+ src: buildingPhoto,
3616
+ alt: "Building Preview",
3617
+ style: {
3618
+ width: "100%",
3619
+ maxHeight: "150px",
3620
+ objectFit: "cover"
3621
+ }
3622
+ })))), /*#__PURE__*/React.createElement("div", {
3623
+ style: {
3624
+ backgroundColor: "#E6F1FB",
3625
+ border: "0.5px solid #B5D4F4",
3626
+ borderRadius: "8px",
3627
+ padding: "12px 14px",
3129
3628
  display: "flex",
3130
- flexDirection: "column",
3131
- alignItems: "center",
3132
- justifyContent: "center",
3629
+ alignItems: "flex-start",
3133
3630
  gap: "10px",
3134
- transition: "all 0.15s",
3135
- opacity: pidNumber ? 1 : 0.6
3631
+ marginBottom: "4px"
3136
3632
  }
3137
3633
  }, /*#__PURE__*/React.createElement("div", {
3138
3634
  style: {
3139
- background: pidNumber ? "#fff" : "#EAECF0",
3140
- padding: "10px",
3141
- borderRadius: "10px",
3142
- display: "flex",
3143
- filter: pidNumber ? "none" : "grayscale(100%)"
3635
+ flexShrink: 0,
3636
+ marginTop: "1px"
3144
3637
  }
3145
- }, /*#__PURE__*/React.createElement("svg", {
3146
- width: "32",
3147
- height: "32",
3148
- viewBox: "0 0 24 24",
3149
- fill: pidNumber ? "#185FA5" : "#98A2B3"
3150
- }, /*#__PURE__*/React.createElement("path", {
3151
- d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 7V3.5L18.5 9H13z"
3152
- }), /*#__PURE__*/React.createElement("path", {
3153
- d: "M12 18v-4M12 14l-2 2M12 14l2 2",
3154
- stroke: "#fff",
3155
- strokeWidth: "1.5",
3156
- strokeLinecap: "round"
3157
- }))), propertyDocument ? /*#__PURE__*/React.createElement("div", {
3638
+ }, /*#__PURE__*/React.createElement(InfoBannerIcon, {
3639
+ fill: "#185FA5"
3640
+ })), /*#__PURE__*/React.createElement("div", {
3158
3641
  style: {
3159
3642
  fontSize: "13px",
3160
- fontWeight: "600",
3161
- color: "#0F6E56"
3643
+ color: "#185FA5",
3644
+ lineHeight: "1.5"
3645
+ }
3646
+ }, t("EKYC_TENANT_INFO_NOTICE") || "This section is enabled only if the user is not the owner. Tenant details will be required if tenant is selected."))), /*#__PURE__*/React.createElement("div", {
3647
+ style: {
3648
+ marginTop: "24px"
3649
+ }
3650
+ }, /*#__PURE__*/React.createElement(SubmitBar, {
3651
+ label: t("EKYC_SAVE_AND_CONTINUE") || "Save & Continue",
3652
+ onSubmit: handleSaveAndContinue
3653
+ })), /*#__PURE__*/React.createElement("div", {
3654
+ style: {
3655
+ display: "flex",
3656
+ alignItems: "center",
3657
+ justifyContent: "center",
3658
+ gap: "5px",
3659
+ marginTop: "16px",
3660
+ fontSize: "11px",
3661
+ color: "#98A2B3"
3662
+ }
3663
+ }, /*#__PURE__*/React.createElement("svg", {
3664
+ width: "11",
3665
+ height: "11",
3666
+ viewBox: "0 0 24 24",
3667
+ fill: "none",
3668
+ stroke: "currentColor",
3669
+ strokeWidth: "2",
3670
+ strokeLinecap: "round"
3671
+ }, /*#__PURE__*/React.createElement("rect", {
3672
+ x: "3",
3673
+ y: "11",
3674
+ width: "18",
3675
+ height: "11",
3676
+ rx: "2"
3677
+ }), /*#__PURE__*/React.createElement("path", {
3678
+ d: "M7 11V7a5 5 0 0 1 10 0v4"
3679
+ })), t("EKYC_SECURE_DATA_NOTICE") || "Your data is encrypted and secure")))), toast && /*#__PURE__*/React.createElement(Toast, {
3680
+ label: toast.message,
3681
+ error: toast.type === "error",
3682
+ info: toast.type === "info",
3683
+ success: toast.type === "success",
3684
+ onClose: () => setToast(null)
3685
+ }));
3686
+ };
3687
+
3688
+ const CheckIcon$3 = ({
3689
+ size: _size = 11,
3690
+ color: _color = "#fff"
3691
+ }) => /*#__PURE__*/React.createElement("svg", {
3692
+ width: _size,
3693
+ height: _size,
3694
+ viewBox: "0 0 24 24",
3695
+ fill: "none",
3696
+ stroke: _color,
3697
+ strokeWidth: "3",
3698
+ strokeLinecap: "round"
3699
+ }, /*#__PURE__*/React.createElement("polyline", {
3700
+ points: "20 6 9 17 4 12"
3701
+ }));
3702
+ const MeterIcon = ({
3703
+ size: _size2 = 16
3704
+ }) => /*#__PURE__*/React.createElement("svg", {
3705
+ width: _size2,
3706
+ height: _size2,
3707
+ viewBox: "0 0 24 24",
3708
+ fill: "currentColor"
3709
+ }, /*#__PURE__*/React.createElement("path", {
3710
+ d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z"
3711
+ }));
3712
+ const ConnectionIcon = ({
3713
+ size: _size3 = 16
3714
+ }) => /*#__PURE__*/React.createElement("svg", {
3715
+ width: _size3,
3716
+ height: _size3,
3717
+ viewBox: "0 0 24 24",
3718
+ fill: "currentColor"
3719
+ }, /*#__PURE__*/React.createElement("path", {
3720
+ d: "M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"
3721
+ }));
3722
+ const SectionHead$3 = ({
3723
+ icon,
3724
+ label
3725
+ }) => /*#__PURE__*/React.createElement("div", {
3726
+ style: {
3727
+ display: "flex",
3728
+ alignItems: "center",
3729
+ gap: "8px",
3730
+ marginBottom: "16px",
3731
+ marginTop: "4px"
3732
+ }
3733
+ }, /*#__PURE__*/React.createElement("div", {
3734
+ style: {
3735
+ opacity: 0.5,
3736
+ display: "flex"
3737
+ }
3738
+ }, icon), /*#__PURE__*/React.createElement("span", {
3739
+ style: {
3740
+ fontSize: "15px",
3741
+ fontWeight: "600",
3742
+ color: "#0B0C0C",
3743
+ whiteSpace: "nowrap"
3744
+ }
3745
+ }, label), /*#__PURE__*/React.createElement("div", {
3746
+ style: {
3747
+ flex: 1,
3748
+ height: "1px",
3749
+ background: "#EAECF0"
3750
+ }
3751
+ }));
3752
+ const MeterDetails = () => {
3753
+ var _dataV0$wsServicesC, _dataV0$wsServicesC$p, _dataConn$wsServices, _dataConn$wsServices$;
3754
+ const {
3755
+ t
3756
+ } = useTranslation();
3757
+ const history = useHistory();
3758
+ const location = useLocation();
3759
+ const flowState = location.state || {
3760
+ kNumber: sessionStorage.getItem("EKYC_K_NUMBER") || "EKYC-1234567890",
3761
+ initialData: getSavedData("EKYC_INITIAL_DATA", {})
3762
+ };
3763
+ const {
3764
+ kNumber
3765
+ } = flowState;
3766
+ const initialData = flowState.initialData || getSavedData("EKYC_INITIAL_DATA", {});
3767
+ const tenantId = Digit.ULBService.getCurrentTenantId();
3768
+ const {
3769
+ data: dataV0
3770
+ } = Digit.Hooks.ekyc.useGetPropertyType(tenantId);
3771
+ const {
3772
+ data: dataConn
3773
+ } = Digit.Hooks.ekyc.useGetConnectionTypeV2(tenantId);
3774
+ const [meterStatus, setMeterStatus] = useState(() => getSavedData("EKYC_METER_STATUS_DATA", initialData.meterStatus ? {
3775
+ label: t(`EKYC_METER_${initialData.meterStatus}`),
3776
+ value: initialData.meterStatus
3777
+ } : null));
3778
+ const [meterPhoto, setMeterStatusPhoto] = useState(() => sessionStorage.getItem("EKYC_METER_PHOTO") || null);
3779
+ const [meterPhotoFileStoreId, setMeterStatusPhotoFileStoreId] = useState(() => sessionStorage.getItem("EKYC_METER_PHOTO_FILESTORE_ID") || null);
3780
+ const [workingStatus, setWorkingStatus] = useState(() => getSavedData("EKYC_METER_WORKING_STATUS_DATA", initialData.workingStatus ? {
3781
+ label: t(`EKYC_METER_${initialData.workingStatus}`),
3782
+ value: initialData.workingStatus
3783
+ } : null));
3784
+ const [meterLocation, setMeterLocation] = useState(() => sessionStorage.getItem("EKYC_METER_LOCATION") || initialData.meterLocation || "");
3785
+ const [lastBillRaised, setLastBillRaised] = useState(() => getSavedData("EKYC_LAST_BILL_RAISED_DATA", initialData.lastBillRaised ? {
3786
+ label: t(`EKYC_${initialData.lastBillRaised}`),
3787
+ value: initialData.lastBillRaised
3788
+ } : null));
3789
+ const [noBillReason, setNoBillReason] = useState(() => sessionStorage.getItem("EKYC_REASON_FOR_NO_BILL") || initialData.noBillReason || "");
3790
+ const [sewerConnection, setSewerConnection] = useState(() => getSavedData("EKYC_SEWER_CONNECTION_DATA", initialData.sewerConnection ? {
3791
+ label: t(`EKYC_${initialData.sewerConnection}`),
3792
+ value: initialData.sewerConnection
3793
+ } : null));
3794
+ const [connectionCategory, setConnectionCategory] = useState(() => getSavedData("EKYC_TYPE_OF_CONNECTION_DATA", initialData.typeOfConnection ? {
3795
+ label: t(initialData.typeOfConnection),
3796
+ value: initialData.typeOfConnection
3797
+ } : null));
3798
+ const [connectionType, setConnectionType] = useState(() => getSavedData("EKYC_CONNECTION_CATEGORY_DATA", initialData.connectionCategory ? {
3799
+ label: t(initialData.connectionCategory),
3800
+ value: initialData.connectionCategory
3801
+ } : null));
3802
+ const [filephoto, setFilephoto] = useState(null);
3803
+ const [error, setError] = useState(null);
3804
+ const [toast, setToast] = useState(null);
3805
+ useEffect(() => {
3806
+ sessionStorage.setItem("EKYC_METER_STATUS_DATA", JSON.stringify(meterStatus));
3807
+ sessionStorage.setItem("EKYC_METER_WORKING_STATUS_DATA", JSON.stringify(workingStatus));
3808
+ sessionStorage.setItem("EKYC_METER_LOCATION", meterLocation);
3809
+ sessionStorage.setItem("EKYC_LAST_BILL_RAISED_DATA", JSON.stringify(lastBillRaised));
3810
+ sessionStorage.setItem("EKYC_REASON_FOR_NO_BILL", noBillReason);
3811
+ sessionStorage.setItem("EKYC_SEWER_CONNECTION_DATA", JSON.stringify(sewerConnection));
3812
+ sessionStorage.setItem("EKYC_TYPE_OF_CONNECTION_DATA", JSON.stringify(connectionCategory));
3813
+ sessionStorage.setItem("EKYC_CONNECTION_CATEGORY_DATA", JSON.stringify(connectionType));
3814
+ if (meterPhoto) sessionStorage.setItem("EKYC_METER_PHOTO", meterPhoto);
3815
+ if (meterPhotoFileStoreId) sessionStorage.setItem("EKYC_METER_PHOTO_FILESTORE_ID", meterPhotoFileStoreId);
3816
+ sessionStorage.setItem("EKYC_CURRENT_STEP", "METER");
3817
+ }, [meterStatus, workingStatus, meterLocation, lastBillRaised, noBillReason, sewerConnection, connectionCategory, connectionType, meterPhoto, meterPhotoFileStoreId]);
3818
+ const uploadFile = async (file, tenantId) => {
3819
+ var _res$data, _res$data$files, _res$data$files$;
3820
+ if (!file) return null;
3821
+ const res = await Digit.UploadServices.Filestorage("EKYC", file, tenantId);
3822
+ return (res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$files = _res$data.files) === null || _res$data$files === void 0 ? void 0 : (_res$data$files$ = _res$data$files[0]) === null || _res$data$files$ === void 0 ? void 0 : _res$data$files$.fileStoreId) || null;
3823
+ };
3824
+ useEffect(() => {
3825
+ (async () => {
3826
+ setError(null);
3827
+ if (filephoto) {
3828
+ if (filephoto.size >= 2000000) {
3829
+ setError(t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED"));
3830
+ setToast({
3831
+ type: "error",
3832
+ message: t("EKYC_MAXIMUM_UPLOAD_SIZE_EXCEEDED")
3833
+ });
3834
+ } else {
3835
+ try {
3836
+ setToast({
3837
+ type: "info",
3838
+ message: t("EKYC_UPLOADING")
3839
+ });
3840
+ const fileStoreId = await uploadFile(filephoto, tenantId);
3841
+ if (fileStoreId) {
3842
+ setMeterStatusPhotoFileStoreId(fileStoreId);
3843
+ const reader = new FileReader();
3844
+ reader.onloadend = () => setMeterStatusPhoto(reader.result);
3845
+ reader.readAsDataURL(filephoto);
3846
+ setToast({
3847
+ type: "success",
3848
+ message: t("EKYC_UPLOAD_SUCCESS")
3849
+ });
3850
+ } else {
3851
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
3852
+ setToast({
3853
+ type: "error",
3854
+ message: t("EKYC_FILE_UPLOAD_ERROR")
3855
+ });
3856
+ }
3857
+ } catch (err) {
3858
+ setError(t("EKYC_FILE_UPLOAD_ERROR"));
3859
+ setToast({
3860
+ type: "error",
3861
+ message: t("EKYC_FILE_UPLOAD_ERROR")
3862
+ });
3863
+ }
3864
+ }
3865
+ }
3866
+ })();
3867
+ }, [filephoto]);
3868
+ const handleSaveAndContinue = () => {
3869
+ history.push("/digit-ui/employee/ekyc/review", {
3870
+ ...location.state,
3871
+ meterDetails: {
3872
+ meterStatus,
3873
+ meterPhoto,
3874
+ meterPhotoFileStoreId,
3875
+ workingStatus,
3876
+ meterLocation,
3877
+ lastBillRaised,
3878
+ noBillReason,
3879
+ sewerConnection,
3880
+ connectionType,
3881
+ connectionCategory
3882
+ }
3883
+ });
3884
+ };
3885
+ function selectphoto(e) {
3886
+ setMeterStatusPhotoFileStoreId(null);
3887
+ setFilephoto(e.target.files[0]);
3888
+ }
3889
+ const meterStatusOptions = [{
3890
+ label: t("EKYC_METERED"),
3891
+ value: "Metered"
3892
+ }, {
3893
+ label: t("EKYC_UNMETERED"),
3894
+ value: "Unmetered"
3895
+ }];
3896
+ const workingStatusOptions = [{
3897
+ label: t("EKYC_WORKING"),
3898
+ value: "Working"
3899
+ }, {
3900
+ label: t("EKYC_NOT_WORKING"),
3901
+ value: "Not Working"
3902
+ }];
3903
+ const yesNoOptions = [{
3904
+ label: t("CORE_COMMON_YES"),
3905
+ value: "Yes"
3906
+ }, {
3907
+ label: t("CORE_COMMON_NO"),
3908
+ value: "No"
3909
+ }];
3910
+ const connectionCategoryOptions = (dataV0 === null || dataV0 === void 0 ? void 0 : (_dataV0$wsServicesC = dataV0["ws-services-calculation"]) === null || _dataV0$wsServicesC === void 0 ? void 0 : (_dataV0$wsServicesC$p = _dataV0$wsServicesC.propertyTypeV2) === null || _dataV0$wsServicesC$p === void 0 ? void 0 : _dataV0$wsServicesC$p.map(item => ({
3911
+ label: t(item.code),
3912
+ value: item.code
3913
+ }))) || [];
3914
+ const connectionTypeOptions = (dataConn === null || dataConn === void 0 ? void 0 : (_dataConn$wsServices = dataConn["ws-services-calculation"]) === null || _dataConn$wsServices === void 0 ? void 0 : (_dataConn$wsServices$ = _dataConn$wsServices.connectionTypeV2) === null || _dataConn$wsServices$ === void 0 ? void 0 : _dataConn$wsServices$.map(item => ({
3915
+ label: t(item.code),
3916
+ value: item.code
3917
+ }))) || [];
3918
+ return /*#__PURE__*/React.createElement("div", {
3919
+ className: "inbox-container"
3920
+ }, /*#__PURE__*/React.createElement("style", null, `
3921
+ @keyframes fadeSlideIn {
3922
+ from { opacity: 0; transform: translateY(8px); }
3923
+ to { opacity: 1; transform: translateY(0); }
3924
+ }
3925
+ `), /*#__PURE__*/React.createElement("div", {
3926
+ className: "filters-container"
3927
+ }, /*#__PURE__*/React.createElement(Card, {
3928
+ style: {
3929
+ display: "flex",
3930
+ alignItems: "center",
3931
+ padding: "12px 16px",
3932
+ marginBottom: "12px",
3933
+ borderRadius: "8px"
3934
+ }
3935
+ }, /*#__PURE__*/React.createElement("div", {
3936
+ style: {
3937
+ color: "#185FA5",
3938
+ marginRight: "10px",
3939
+ display: "flex"
3940
+ }
3941
+ }, /*#__PURE__*/React.createElement(HomeIcon, {
3942
+ style: {
3943
+ width: "20px",
3944
+ height: "20px"
3945
+ }
3946
+ })), /*#__PURE__*/React.createElement("div", {
3947
+ style: {
3948
+ fontWeight: "600",
3949
+ fontSize: "15px",
3950
+ color: "#0B0C0C"
3951
+ }
3952
+ }, t("EKYC_PROCESS") || "eKYC Process")), /*#__PURE__*/React.createElement("div", {
3953
+ style: {
3954
+ background: "#fff",
3955
+ padding: "16px 14px",
3956
+ borderRadius: "8px",
3957
+ border: "1px solid #EAECF0"
3958
+ }
3959
+ }, [{
3960
+ label: t("EKYC_STEP_AADHAAR") || "Aadhaar",
3961
+ done: true,
3962
+ active: false
3963
+ }, {
3964
+ label: t("EKYC_STEP_ADDRESS") || "Address",
3965
+ done: true,
3966
+ active: false
3967
+ }, {
3968
+ label: t("EKYC_STEP_PROPERTY") || "Property",
3969
+ done: true,
3970
+ active: false
3971
+ }, {
3972
+ label: t("EKYC_STEP_METER") || "Meter",
3973
+ done: false,
3974
+ active: true
3975
+ }, {
3976
+ label: t("EKYC_STEP_REVIEW") || "Review",
3977
+ done: false,
3978
+ active: false
3979
+ }].map((step, i) => /*#__PURE__*/React.createElement("div", {
3980
+ key: i,
3981
+ style: {
3982
+ display: "flex",
3983
+ gap: "10px",
3984
+ alignItems: "flex-start",
3985
+ position: "relative",
3986
+ paddingBottom: i < 4 ? "18px" : 0
3987
+ }
3988
+ }, i < 4 && /*#__PURE__*/React.createElement("div", {
3989
+ style: {
3990
+ position: "absolute",
3991
+ left: "10px",
3992
+ top: "22px",
3993
+ width: "1px",
3994
+ height: "calc(100% - 10px)",
3995
+ background: "#EAECF0"
3996
+ }
3997
+ }), /*#__PURE__*/React.createElement("div", {
3998
+ style: {
3999
+ width: "20px",
4000
+ height: "20px",
4001
+ borderRadius: "50%",
4002
+ flexShrink: 0,
4003
+ marginTop: "1px",
4004
+ border: step.done ? "none" : step.active ? "1.5px solid #185FA5" : "1.5px solid #D0D5DD",
4005
+ background: step.done ? "#0F6E56" : step.active ? "#E6F1FB" : "#fff",
4006
+ display: "flex",
4007
+ alignItems: "center",
4008
+ justifyContent: "center",
4009
+ fontSize: "10px",
4010
+ fontWeight: "500",
4011
+ color: step.done ? "#fff" : step.active ? "#185FA5" : "#98A2B3"
4012
+ }
4013
+ }, step.done ? /*#__PURE__*/React.createElement(CheckIcon$3, {
4014
+ size: 11,
4015
+ color: "#fff"
4016
+ }) : i + 1), /*#__PURE__*/React.createElement("div", {
4017
+ style: {
4018
+ fontSize: "12px",
4019
+ paddingTop: "2px",
4020
+ color: step.done ? "#0F6E56" : step.active ? "#0B0C0C" : "#667085",
4021
+ fontWeight: step.done || step.active ? "600" : "400"
4022
+ }
4023
+ }, step.label))))), /*#__PURE__*/React.createElement("div", {
4024
+ style: {
4025
+ flex: 1,
4026
+ marginLeft: "16px"
4027
+ }
4028
+ }, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement("div", {
4029
+ style: {
4030
+ display: "flex",
4031
+ justifyContent: "space-between",
4032
+ alignItems: "center",
4033
+ marginBottom: "20px"
4034
+ }
4035
+ }, /*#__PURE__*/React.createElement(CardHeader, {
4036
+ style: {
4037
+ margin: 0,
4038
+ fontSize: "18px"
4039
+ }
4040
+ }, t("EKYC_METER_DETAILS_HEADER") || "Meter Details"), /*#__PURE__*/React.createElement("div", {
4041
+ style: {
4042
+ background: "#F9FAFB",
4043
+ border: "0.5px solid #EAECF0",
4044
+ borderRadius: "20px",
4045
+ padding: "4px 14px",
4046
+ fontSize: "12px",
4047
+ color: "#667085"
4048
+ }
4049
+ }, t("EKYC_K_NUMBER") || "K Number", ":", " ", /*#__PURE__*/React.createElement("span", {
4050
+ style: {
4051
+ color: "#0B0C0C",
4052
+ fontWeight: "600"
4053
+ }
4054
+ }, kNumber))), /*#__PURE__*/React.createElement("div", {
4055
+ style: {
4056
+ animation: "fadeSlideIn 0.3s ease"
4057
+ }
4058
+ }, /*#__PURE__*/React.createElement(SectionHead$3, {
4059
+ icon: /*#__PURE__*/React.createElement(MeterIcon, {
4060
+ size: 16
4061
+ }),
4062
+ label: t("EKYC_METER_DETAILS") || "Meter details"
4063
+ }), /*#__PURE__*/React.createElement("div", {
4064
+ style: {
4065
+ display: "grid",
4066
+ gridTemplateColumns: "1fr 1fr",
4067
+ gap: "14px",
4068
+ marginBottom: "20px"
4069
+ }
4070
+ }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
4071
+ style: {
4072
+ fontSize: "11px",
4073
+ fontWeight: "600",
4074
+ color: "#667085",
4075
+ textTransform: "uppercase",
4076
+ letterSpacing: "0.04em",
4077
+ marginBottom: "6px"
4078
+ }
4079
+ }, t("EKYC_METER_STATUS") || "Meter status"), /*#__PURE__*/React.createElement(Dropdown, {
4080
+ selected: meterStatus,
4081
+ select: setMeterStatus,
4082
+ option: meterStatusOptions,
4083
+ optionKey: "label",
4084
+ t: t,
4085
+ placeholder: t("EKYC_SELECT") || "Select"
4086
+ })), (meterStatus === null || meterStatus === void 0 ? void 0 : meterStatus.value) === "Metered" && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
4087
+ style: {
4088
+ fontSize: "11px",
4089
+ fontWeight: "600",
4090
+ color: "#667085",
4091
+ textTransform: "uppercase",
4092
+ letterSpacing: "0.04em",
4093
+ marginBottom: "6px"
4094
+ }
4095
+ }, t("EKYC_METER_WORKING_STATUS") || "Meter working status"), /*#__PURE__*/React.createElement(Dropdown, {
4096
+ selected: workingStatus,
4097
+ select: setWorkingStatus,
4098
+ option: workingStatusOptions,
4099
+ optionKey: "label",
4100
+ t: t,
4101
+ placeholder: t("EKYC_SELECT") || "Select"
4102
+ }))), (meterStatus === null || meterStatus === void 0 ? void 0 : meterStatus.value) === "Metered" && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
4103
+ style: {
4104
+ marginBottom: "20px"
4105
+ }
4106
+ }, /*#__PURE__*/React.createElement("div", {
4107
+ style: {
4108
+ fontSize: "11px",
4109
+ fontWeight: "600",
4110
+ color: "#667085",
4111
+ textTransform: "uppercase",
4112
+ letterSpacing: "0.04em",
4113
+ marginBottom: "8px"
4114
+ }
4115
+ }, t("EKYC_CAPTURE_METER_IMAGE") || "Capture meter image"), /*#__PURE__*/React.createElement(UploadFile, {
4116
+ id: "ekyc-meter-photo",
4117
+ extraStyleName: "propertyCreate",
4118
+ accept: ".jpg,.png,.jpeg",
4119
+ onUpload: selectphoto,
4120
+ onDelete: () => {
4121
+ setMeterStatusPhotoFileStoreId(null);
4122
+ setMeterStatusPhoto(null);
4123
+ setFilephoto(null);
4124
+ },
4125
+ message: meterPhotoFileStoreId ? `1 ${t(`EKYC_ACTION_FILEUPLOADED`)}` : t(`EKYC_ACTION_NO_FILEUPLOADED`),
4126
+ error: error
4127
+ }), meterPhoto && /*#__PURE__*/React.createElement("div", {
4128
+ style: {
4129
+ marginTop: "10px",
4130
+ borderRadius: "8px",
4131
+ overflow: "hidden",
4132
+ border: "1px solid #EAECF0"
3162
4133
  }
3163
- }, "\u2713 ", propertyDocument.name) : /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
4134
+ }, /*#__PURE__*/React.createElement("img", {
4135
+ src: meterPhoto,
4136
+ alt: "Meter Preview",
3164
4137
  style: {
3165
- fontSize: "13px",
3166
- fontWeight: "600",
3167
- color: pidNumber ? "#185FA5" : "#98A2B3"
4138
+ width: "100%",
4139
+ maxHeight: "150px",
4140
+ objectFit: "cover"
3168
4141
  }
3169
- }, pidNumber ? t("EKYC_UPLOAD_PROPERTY_DOC_CTA") || "Tap to upload" : t("EKYC_ENTER_PID_FIRST_CTA") || "Enter PID to upload"), /*#__PURE__*/React.createElement("div", {
4142
+ }))), /*#__PURE__*/React.createElement("div", {
3170
4143
  style: {
3171
- fontSize: "12px",
3172
- color: pidNumber ? "#378ADD" : "#98A2B3"
4144
+ display: "grid",
4145
+ gridTemplateColumns: "1fr 1fr",
4146
+ gap: "14px",
4147
+ marginBottom: "20px"
3173
4148
  }
3174
- }, pidNumber ? "PDF | Max 5MB" : "Requires PID")))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
4149
+ }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3175
4150
  style: {
3176
4151
  fontSize: "11px",
3177
4152
  fontWeight: "600",
3178
4153
  color: "#667085",
3179
4154
  textTransform: "uppercase",
3180
4155
  letterSpacing: "0.04em",
3181
- marginBottom: "8px"
4156
+ marginBottom: "6px"
3182
4157
  }
3183
- }, t("EKYC_CAPTURE_BUILDING_IMAGE") || "Capture building image"), /*#__PURE__*/React.createElement("input", {
3184
- type: "file",
3185
- ref: cameraRef,
3186
- accept: "image/*",
3187
- capture: "environment",
3188
- style: {
3189
- display: "none"
3190
- },
3191
- onChange: handlePhotoCapture
3192
- }), /*#__PURE__*/React.createElement("div", {
3193
- onClick: !buildingPhoto ? () => cameraRef.current.click() : undefined,
3194
- onMouseOver: e => {
3195
- if (!buildingPhoto) e.currentTarget.style.borderColor = "#185FA5";
3196
- },
3197
- onMouseOut: e => {
3198
- if (!buildingPhoto) e.currentTarget.style.borderColor = "#D0D5DD";
3199
- },
4158
+ }, t("EKYC_METER_LOCATION") || "Meter location"), /*#__PURE__*/React.createElement(TextInput, {
4159
+ value: meterLocation,
4160
+ onChange: e => setMeterLocation(e.target.value),
4161
+ placeholder: t("EKYC_ENTER_METER_LOCATION") || "Enter location"
4162
+ })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3200
4163
  style: {
3201
- border: "1.5px dashed #D0D5DD",
3202
- borderRadius: "10px",
3203
- minHeight: "160px",
3204
- display: "flex",
3205
- flexDirection: "column",
3206
- alignItems: "center",
3207
- justifyContent: "center",
3208
- backgroundColor: "#F9FAFB",
3209
- cursor: buildingPhoto ? "default" : "pointer",
3210
- overflow: "hidden",
3211
- transition: "border-color 0.15s",
3212
- position: "relative",
3213
- padding: buildingPhoto ? "0" : "28px 20px"
4164
+ fontSize: "11px",
4165
+ fontWeight: "600",
4166
+ color: "#667085",
4167
+ textTransform: "uppercase",
4168
+ letterSpacing: "0.04em",
4169
+ marginBottom: "6px"
3214
4170
  }
3215
- }, !buildingPhoto ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
4171
+ }, t("EKYC_LAST_BILL_RAISED") || "Last bill raised"), /*#__PURE__*/React.createElement(Dropdown, {
4172
+ selected: lastBillRaised,
4173
+ select: setLastBillRaised,
4174
+ option: yesNoOptions,
4175
+ optionKey: "label",
4176
+ t: t,
4177
+ placeholder: t("EKYC_SELECT") || "Select"
4178
+ }))), (lastBillRaised === null || lastBillRaised === void 0 ? void 0 : lastBillRaised.value) === "No" && /*#__PURE__*/React.createElement("div", {
3216
4179
  style: {
3217
- background: "#E6F1FB",
3218
- width: "52px",
3219
- height: "52px",
3220
- borderRadius: "50%",
3221
- display: "flex",
3222
- alignItems: "center",
3223
- justifyContent: "center",
3224
- marginBottom: "10px"
4180
+ marginBottom: "20px"
3225
4181
  }
3226
- }, /*#__PURE__*/React.createElement(CameraIcon$1, {
3227
- size: 26
3228
- })), /*#__PURE__*/React.createElement("div", {
4182
+ }, /*#__PURE__*/React.createElement("div", {
3229
4183
  style: {
3230
- fontSize: "13px",
4184
+ fontSize: "11px",
3231
4185
  fontWeight: "600",
3232
- color: "#101828"
4186
+ color: "#667085",
4187
+ textTransform: "uppercase",
4188
+ letterSpacing: "0.04em",
4189
+ marginBottom: "6px"
3233
4190
  }
3234
- }, t("EKYC_TAP_TO_CAPTURE") || "Tap to capture"), /*#__PURE__*/React.createElement("div", {
4191
+ }, t("EKYC_REASON_FOR_NO_BILL") || "Reason for no bill"), /*#__PURE__*/React.createElement(TextInput, {
4192
+ value: noBillReason,
4193
+ onChange: e => setNoBillReason(e.target.value),
4194
+ placeholder: t("EKYC_ENTER_REASON") || "Enter reason"
4195
+ }))), /*#__PURE__*/React.createElement("div", {
3235
4196
  style: {
3236
- fontSize: "12px",
3237
- color: "#667085",
3238
- marginTop: "2px"
4197
+ marginBottom: "20px"
3239
4198
  }
3240
- }, t("EKYC_BUILDING_PHOTO") || "Building photo with GPS"), /*#__PURE__*/React.createElement("div", {
4199
+ }, /*#__PURE__*/React.createElement("div", {
3241
4200
  style: {
3242
4201
  fontSize: "11px",
3243
- color: "#98A2B3",
3244
- marginTop: "2px"
4202
+ fontWeight: "600",
4203
+ color: "#667085",
4204
+ textTransform: "uppercase",
4205
+ letterSpacing: "0.04em",
4206
+ marginBottom: "6px"
3245
4207
  }
3246
- }, "JPG, PNG | Max 2MB")) : /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("img", {
3247
- src: buildingPhoto,
3248
- alt: "Building",
4208
+ }, t("EKYC_SEWER_CONNECTION") || "Sewer connection"), /*#__PURE__*/React.createElement("div", {
3249
4209
  style: {
3250
- width: "100%",
3251
- maxHeight: "200px",
3252
- objectFit: "cover",
3253
- display: "block"
4210
+ width: "calc(50% - 7px)"
3254
4211
  }
3255
- }), /*#__PURE__*/React.createElement("button", {
3256
- onClick: e => {
3257
- e.stopPropagation();
3258
- setBuildingPhoto(null);
3259
- if (cameraRef.current) cameraRef.current.value = "";
3260
- },
4212
+ }, /*#__PURE__*/React.createElement(Dropdown, {
4213
+ selected: sewerConnection,
4214
+ select: setSewerConnection,
4215
+ option: yesNoOptions,
4216
+ optionKey: "label",
4217
+ t: t,
4218
+ placeholder: t("EKYC_SELECT") || "Select"
4219
+ }))), /*#__PURE__*/React.createElement("hr", {
3261
4220
  style: {
3262
- position: "absolute",
3263
- top: "8px",
3264
- right: "8px",
3265
- background: "#fff",
3266
- border: "0.5px solid #EAECF0",
3267
- borderRadius: "7px",
3268
- padding: "5px 10px",
3269
- display: "flex",
3270
- alignItems: "center",
3271
- gap: "5px",
3272
- cursor: "pointer",
3273
- fontSize: "12px",
3274
- color: "#D92D20",
3275
- fontWeight: "500"
4221
+ margin: "24px 0",
4222
+ border: 0,
4223
+ borderTop: "1px solid #EAECF0"
3276
4224
  }
3277
- }, /*#__PURE__*/React.createElement(TrashIcon$1, {
3278
- size: 13
3279
- }), " ", t("EKYC_REMOVE") || "Remove"))))), /*#__PURE__*/React.createElement("div", {
4225
+ }), /*#__PURE__*/React.createElement(SectionHead$3, {
4226
+ icon: /*#__PURE__*/React.createElement(ConnectionIcon, {
4227
+ size: 16
4228
+ }),
4229
+ label: t("EKYC_PROPERTY_CONNECTION_DETAILS") || "Property Connection Details"
4230
+ }), /*#__PURE__*/React.createElement("div", {
3280
4231
  style: {
3281
- backgroundColor: "#E6F1FB",
3282
- border: "0.5px solid #B5D4F4",
3283
- borderRadius: "8px",
3284
- padding: "12px 14px",
3285
- display: "flex",
3286
- alignItems: "flex-start",
3287
- gap: "10px",
3288
- marginBottom: "4px"
4232
+ display: "grid",
4233
+ gridTemplateColumns: "1fr 1fr",
4234
+ gap: "14px",
4235
+ marginBottom: "24px"
3289
4236
  }
3290
- }, /*#__PURE__*/React.createElement("div", {
4237
+ }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3291
4238
  style: {
3292
- flexShrink: 0,
3293
- marginTop: "1px"
4239
+ fontSize: "11px",
4240
+ fontWeight: "600",
4241
+ color: "#667085",
4242
+ textTransform: "uppercase",
4243
+ letterSpacing: "0.04em",
4244
+ marginBottom: "6px"
3294
4245
  }
3295
- }, /*#__PURE__*/React.createElement(InfoBannerIcon, {
3296
- fill: "#185FA5"
3297
- })), /*#__PURE__*/React.createElement("div", {
4246
+ }, t("EKYC_TYPE_OF_CONNECTION") || "Type of connection"), /*#__PURE__*/React.createElement(Dropdown, {
4247
+ selected: connectionCategory,
4248
+ select: setConnectionCategory,
4249
+ option: connectionCategoryOptions,
4250
+ optionKey: "label",
4251
+ t: t,
4252
+ placeholder: t("EKYC_SELECT") || "Select"
4253
+ })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
3298
4254
  style: {
3299
- fontSize: "13px",
3300
- color: "#185FA5",
3301
- lineHeight: "1.5"
4255
+ fontSize: "11px",
4256
+ fontWeight: "600",
4257
+ color: "#667085",
4258
+ textTransform: "uppercase",
4259
+ letterSpacing: "0.04em",
4260
+ marginBottom: "6px"
3302
4261
  }
3303
- }, t("EKYC_TENANT_INFO_NOTICE") || "This section is enabled only if the user is not the owner. Tenant details will be required if tenant is selected."))), /*#__PURE__*/React.createElement("div", {
4262
+ }, t("EKYC_CONNECTION_CATEGORY") || "Connection category"), /*#__PURE__*/React.createElement(Dropdown, {
4263
+ selected: connectionType,
4264
+ select: setConnectionType,
4265
+ option: connectionTypeOptions,
4266
+ optionKey: "label",
4267
+ t: t,
4268
+ placeholder: t("EKYC_SELECT") || "Select"
4269
+ })))), /*#__PURE__*/React.createElement("div", {
3304
4270
  style: {
3305
4271
  marginTop: "24px"
3306
4272
  }
@@ -3333,10 +4299,16 @@ const PropertyInfo = () => {
3333
4299
  rx: "2"
3334
4300
  }), /*#__PURE__*/React.createElement("path", {
3335
4301
  d: "M7 11V7a5 5 0 0 1 10 0v4"
3336
- })), t("EKYC_SECURE_DATA_NOTICE") || "Your data is encrypted and secure"))));
4302
+ })), t("EKYC_SECURE_DATA_NOTICE") || "Your data is encrypted and secure"))), toast && /*#__PURE__*/React.createElement(Toast, {
4303
+ label: toast.message,
4304
+ error: toast.type === "error",
4305
+ info: toast.type === "info",
4306
+ success: toast.type === "success",
4307
+ onClose: () => setToast(null)
4308
+ }));
3337
4309
  };
3338
4310
 
3339
- const CheckIcon$3 = ({
4311
+ const CheckIcon$4 = ({
3340
4312
  size: _size = 11,
3341
4313
  color: _color = "#fff"
3342
4314
  }) => /*#__PURE__*/React.createElement("svg", {
@@ -3395,7 +4367,7 @@ const EditIcon = ({
3395
4367
  }), /*#__PURE__*/React.createElement("path", {
3396
4368
  d: "M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"
3397
4369
  }));
3398
- const SectionHead$3 = ({
4370
+ const SectionHead$4 = ({
3399
4371
  icon,
3400
4372
  label
3401
4373
  }) => /*#__PURE__*/React.createElement("div", {
@@ -3430,7 +4402,8 @@ const ReviewCard = ({
3430
4402
  title,
3431
4403
  onEdit,
3432
4404
  editLabel,
3433
- rows
4405
+ rows,
4406
+ t
3434
4407
  }) => /*#__PURE__*/React.createElement("div", {
3435
4408
  style: {
3436
4409
  border: "0.5px solid #EAECF0",
@@ -3510,24 +4483,88 @@ const ReviewCard = ({
3510
4483
  fontSize: "14px",
3511
4484
  color: "#101828",
3512
4485
  fontWeight: "500",
3513
- wordBreak: "break-word"
4486
+ wordBreak: "break-word",
4487
+ display: "flex",
4488
+ alignItems: "center",
4489
+ gap: "8px"
4490
+ }
4491
+ }, row.value, row.isModified && /*#__PURE__*/React.createElement("span", {
4492
+ style: {
4493
+ fontSize: "10px",
4494
+ background: "#FFF4ED",
4495
+ color: "#B45309",
4496
+ border: "0.5px solid #FDE68A",
4497
+ borderRadius: "4px",
4498
+ padding: "2px 6px",
4499
+ fontWeight: "600",
4500
+ textTransform: "uppercase"
3514
4501
  }
3515
- }, row.value)) : null)));
4502
+ }, t("EKYC_MODIFIED") || "Modified"))) : null)));
3516
4503
  const Review = () => {
3517
- var _propertyDetails$conn3, _propertyDetails$conn4, _propertyDetails$user2, _propertyDetails$noOf2;
4504
+ var _getSavedData, _getSavedData2, _propertyDetails$conn3, _propertyDetails$conn4, _propertyDetails$conn5, _propertyDetails$conn6, _propertyDetails$user2, _propertyDetails$user3, _propertyDetails$noOf2, _propertyDetails$noOf3, _meterDetails$meterSt2, _meterDetails$meterSt3, _meterDetails$working2, _meterDetails$working3, _meterDetails$lastBil2, _meterDetails$lastBil3, _meterDetails$sewerCo2, _meterDetails$sewerCo3, _meterDetails$connect3, _meterDetails$connect4, _meterDetails$connect5, _meterDetails$connect6;
3518
4505
  const {
3519
4506
  t
3520
4507
  } = useTranslation();
3521
4508
  const history = useHistory();
3522
4509
  const location = useLocation();
3523
- const {
3524
- kNumber = "EKYC-1234567890",
3525
- aadhaarDetails = {},
3526
- addressDetails = {},
3527
- propertyDetails = {}
3528
- } = location.state || {};
3529
- const [isSubmitting, setIsSubmitting] = useState(false);
4510
+ const state = location.state || {};
4511
+ const initialData = state.initialData || getSavedData("EKYC_INITIAL_DATA", {});
4512
+ const kNumber = state.kNumber || sessionStorage.getItem("EKYC_K_NUMBER") || "EKYC-1234567890";
4513
+ const aadhaarDetails = state.aadhaarDetails || {
4514
+ userName: sessionStorage.getItem("EKYC_USER_NAME"),
4515
+ mobileNumber: sessionStorage.getItem("EKYC_MOBILE_NUMBER"),
4516
+ whatsappNumber: sessionStorage.getItem("EKYC_WHATSAPP_NUMBER"),
4517
+ email: sessionStorage.getItem("EKYC_EMAIL"),
4518
+ noOfPersons: sessionStorage.getItem("EKYC_NO_OF_PERSONS")
4519
+ };
4520
+ const addressDetails = state.addressDetails || {
4521
+ fullAddress: sessionStorage.getItem("EKYC_FULL_ADDRESS"),
4522
+ flatNo: sessionStorage.getItem("EKYC_FLAT_NO"),
4523
+ building: sessionStorage.getItem("EKYC_BUILDING"),
4524
+ landmark: sessionStorage.getItem("EKYC_LANDMARK"),
4525
+ pincode: sessionStorage.getItem("EKYC_PINCODE"),
4526
+ assembly: (_getSavedData = getSavedData("EKYC_ASSEMBLY_DATA")) === null || _getSavedData === void 0 ? void 0 : _getSavedData.name,
4527
+ ward: (_getSavedData2 = getSavedData("EKYC_WARD_DATA")) === null || _getSavedData2 === void 0 ? void 0 : _getSavedData2.name,
4528
+ doorPhoto: sessionStorage.getItem("EKYC_DOOR_PHOTO"),
4529
+ doorPhotoFileStoreId: sessionStorage.getItem("EKYC_DOOR_PHOTO_FILESTORE_ID")
4530
+ };
4531
+ const propertyDetails = state.propertyDetails || {
4532
+ ownerType: sessionStorage.getItem("EKYC_OWNER_TYPE"),
4533
+ pidNumber: sessionStorage.getItem("EKYC_PID_NUMBER"),
4534
+ userType: getSavedData("EKYC_USER_TYPE_DATA"),
4535
+ noOfFloors: getSavedData("EKYC_NO_OF_FLOORS_DATA"),
4536
+ propertyDocument: sessionStorage.getItem("EKYC_PROPERTY_DOC"),
4537
+ propertyDocumentFileStoreId: sessionStorage.getItem("EKYC_PROPERTY_DOC_FILESTORE_ID"),
4538
+ buildingPhoto: sessionStorage.getItem("EKYC_BUILDING_PHOTO"),
4539
+ buildingPhotoFileStoreId: sessionStorage.getItem("EKYC_BUILDING_PHOTO_FILESTORE_ID")
4540
+ };
4541
+ const meterDetails = state.meterDetails || {
4542
+ meterStatus: getSavedData("EKYC_METER_STATUS_DATA"),
4543
+ workingStatus: getSavedData("EKYC_METER_WORKING_STATUS_DATA"),
4544
+ meterLocation: sessionStorage.getItem("EKYC_METER_LOCATION"),
4545
+ lastBillRaised: getSavedData("EKYC_LAST_BILL_RAISED_DATA"),
4546
+ noBillReason: sessionStorage.getItem("EKYC_REASON_FOR_NO_BILL"),
4547
+ sewerConnection: getSavedData("EKYC_SEWER_CONNECTION_DATA"),
4548
+ connectionCategory: getSavedData("EKYC_TYPE_OF_CONNECTION_DATA"),
4549
+ connectionType: getSavedData("EKYC_CONNECTION_CATEGORY_DATA"),
4550
+ meterPhoto: sessionStorage.getItem("EKYC_METER_PHOTO"),
4551
+ meterPhotoFileStoreId: sessionStorage.getItem("EKYC_METER_PHOTO_FILESTORE_ID")
4552
+ };
4553
+ useEffect(() => {
4554
+ sessionStorage.setItem("EKYC_CURRENT_STEP", "REVIEW");
4555
+ }, []);
4556
+ const isFieldModified = (key, currentVal) => {
4557
+ const initialVal = initialData[key];
4558
+ if (initialVal === undefined) return false;
4559
+ return JSON.stringify(initialVal) !== JSON.stringify(currentVal);
4560
+ };
3530
4561
  const [toast, setToast] = useState(null);
4562
+ const tenantId = Digit.ULBService.getCurrentTenantId() || "dl";
4563
+ const {
4564
+ mutate,
4565
+ isLoading: isMutationLoading
4566
+ } = Digit.Hooks.ekyc.useEkycApplicationUpdate(tenantId);
4567
+ const isSubmitting = isMutationLoading;
3531
4568
  const uploadFile = async (file, tenantId) => {
3532
4569
  var _res$data, _res$data$files, _res$data$files$;
3533
4570
  if (!file) return null;
@@ -3546,27 +4583,30 @@ const Review = () => {
3546
4583
  });
3547
4584
  };
3548
4585
  const handleSubmit = async () => {
3549
- setIsSubmitting(true);
3550
4586
  setToast(null);
3551
4587
  try {
3552
- var _Digit$UserService$ge, _Digit$UserService$ge2, _propertyDetails$user, _propertyDetails$noOf, _propertyDetails$conn, _propertyDetails$conn2;
3553
- const tenantId = Digit.ULBService.getCurrentTenantId() || "dl.djb";
4588
+ var _Digit$UserService$ge, _propertyDetails$user, _propertyDetails$noOf, _propertyDetails$conn, _propertyDetails$conn2, _meterDetails$meterSt, _meterDetails$working, _meterDetails$lastBil, _meterDetails$sewerCo, _meterDetails$connect, _meterDetails$connect2;
3554
4589
  const userInfo = ((_Digit$UserService$ge = Digit.UserService.getUser()) === null || _Digit$UserService$ge === void 0 ? void 0 : _Digit$UserService$ge.info) || {};
3555
- const propertyDocFile = propertyDetails.propertyDocument || null;
3556
- const propertyDocFileStoreId = await uploadFile(propertyDocFile, tenantId);
3557
- let buildingImageFileStoreId = null;
3558
- if (propertyDetails.buildingPhoto) {
4590
+ let propertyDocFileStoreId = propertyDetails.propertyDocumentFileStoreId || null;
4591
+ if (!propertyDocFileStoreId && propertyDetails.propertyDocument instanceof File) {
4592
+ propertyDocFileStoreId = await uploadFile(propertyDetails.propertyDocument, tenantId);
4593
+ }
4594
+ let buildingImageFileStoreId = propertyDetails.buildingPhotoFileStoreId || null;
4595
+ if (!buildingImageFileStoreId && propertyDetails.buildingPhoto) {
3559
4596
  const photoFile = dataUrlToFile(propertyDetails.buildingPhoto, "building_photo.jpg");
3560
4597
  buildingImageFileStoreId = await uploadFile(photoFile, tenantId);
3561
4598
  }
4599
+ let doorPhotoFileStoreId = addressDetails.doorPhotoFileStoreId || null;
4600
+ if (!doorPhotoFileStoreId && addressDetails.doorPhoto) {
4601
+ const doorFile = dataUrlToFile(addressDetails.doorPhoto, "door_photo.jpg");
4602
+ doorPhotoFileStoreId = await uploadFile(doorFile, tenantId);
4603
+ }
4604
+ let meterImageFileStoreId = meterDetails.meterPhotoFileStoreId || null;
4605
+ if (!meterImageFileStoreId && meterDetails.meterPhoto) {
4606
+ const meterFile = dataUrlToFile(meterDetails.meterPhoto, "meter_photo.jpg");
4607
+ meterImageFileStoreId = await uploadFile(meterFile, tenantId);
4608
+ }
3562
4609
  const requestBody = {
3563
- RequestInfo: {
3564
- apiId: "Rainmaker",
3565
- ver: "1.0",
3566
- msgId: `${Date.now()}|${navigator.language || "en_IN"}`,
3567
- tenantId,
3568
- authToken: userInfo.access_token || ((_Digit$UserService$ge2 = Digit.UserService.getUser()) === null || _Digit$UserService$ge2 === void 0 ? void 0 : _Digit$UserService$ge2.access_token) || ""
3569
- },
3570
4610
  updateType: "PROPERTY",
3571
4611
  kno: kNumber,
3572
4612
  pidNumber: propertyDetails.pidNumber || null,
@@ -3576,33 +4616,57 @@ const Review = () => {
3576
4616
  noOfFloor: (_propertyDetails$noOf = propertyDetails.noOfFloors) !== null && _propertyDetails$noOf !== void 0 && _propertyDetails$noOf.value ? parseInt(propertyDetails.noOfFloors.value, 10) : null,
3577
4617
  typeOfConnection: ((_propertyDetails$conn = propertyDetails.connectionCategory) === null || _propertyDetails$conn === void 0 ? void 0 : _propertyDetails$conn.value) || null,
3578
4618
  connectionCategory: ((_propertyDetails$conn2 = propertyDetails.connectionType) === null || _propertyDetails$conn2 === void 0 ? void 0 : _propertyDetails$conn2.value) || null,
3579
- modifiedBy: userInfo.name || userInfo.userName || null
4619
+ modifiedBy: userInfo.name || userInfo.userName || null,
4620
+ mobileNumber: aadhaarDetails.mobileNumber || null,
4621
+ email: aadhaarDetails.email || null,
4622
+ userName: aadhaarDetails.userName || null,
4623
+ noOfPersons: aadhaarDetails.noOfPersons || null,
4624
+ doorPhotoFileStoreId: doorPhotoFileStoreId,
4625
+ fullAddress: addressDetails.fullAddress || null,
4626
+ flatNo: addressDetails.flatNo || null,
4627
+ building: addressDetails.building || null,
4628
+ landmark: addressDetails.landmark || null,
4629
+ pincode: addressDetails.pincode || null,
4630
+ assembly: addressDetails.assembly || null,
4631
+ ward: addressDetails.ward || null,
4632
+ meterStatus: ((_meterDetails$meterSt = meterDetails.meterStatus) === null || _meterDetails$meterSt === void 0 ? void 0 : _meterDetails$meterSt.value) || null,
4633
+ meterWorkingStatus: ((_meterDetails$working = meterDetails.workingStatus) === null || _meterDetails$working === void 0 ? void 0 : _meterDetails$working.value) || null,
4634
+ meterLocation: meterDetails.meterLocation || null,
4635
+ lastBillRaised: ((_meterDetails$lastBil = meterDetails.lastBillRaised) === null || _meterDetails$lastBil === void 0 ? void 0 : _meterDetails$lastBil.value) || null,
4636
+ noBillReason: meterDetails.noBillReason || null,
4637
+ sewerConnection: ((_meterDetails$sewerCo = meterDetails.sewerConnection) === null || _meterDetails$sewerCo === void 0 ? void 0 : _meterDetails$sewerCo.value) || null,
4638
+ typeOfConnection: ((_meterDetails$connect = meterDetails.connectionCategory) === null || _meterDetails$connect === void 0 ? void 0 : _meterDetails$connect.value) || null,
4639
+ connectionCategory: ((_meterDetails$connect2 = meterDetails.connectionType) === null || _meterDetails$connect2 === void 0 ? void 0 : _meterDetails$connect2.value) || null,
4640
+ meterImageFileStoreId: meterImageFileStoreId
3580
4641
  };
3581
- await Digit.CustomService.getResponse({
3582
- url: "/ekyc-service/user/application/_update",
3583
- params: {
3584
- tenantId
4642
+ mutate(requestBody, {
4643
+ onSuccess: res => {
4644
+ setToast({
4645
+ type: "success",
4646
+ message: t("EKYC_SUBMIT_SUCCESS") || "Application submitted successfully!"
4647
+ });
4648
+ Object.keys(sessionStorage).forEach(key => {
4649
+ if (key.startsWith("EKYC_")) sessionStorage.removeItem(key);
4650
+ });
4651
+ setTimeout(() => {
4652
+ history.push("/digit-ui/employee/ekyc/dashboard");
4653
+ }, 1800);
3585
4654
  },
3586
- body: requestBody,
3587
- useCache: false,
3588
- method: "POST"
3589
- });
3590
- setToast({
3591
- type: "success",
3592
- message: t("EKYC_SUBMIT_SUCCESS") || "Application submitted successfully!"
4655
+ onError: err => {
4656
+ var _err$response, _err$response$data, _err$response$data$Er, _err$response$data$Er2;
4657
+ console.error("eKYC Submit Error:", err);
4658
+ setToast({
4659
+ type: "error",
4660
+ message: (err === null || err === void 0 ? void 0 : (_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : (_err$response$data$Er = _err$response$data.Errors) === null || _err$response$data$Er === void 0 ? void 0 : (_err$response$data$Er2 = _err$response$data$Er[0]) === null || _err$response$data$Er2 === void 0 ? void 0 : _err$response$data$Er2.message) || t("EKYC_SUBMIT_ERROR") || "Submission failed. Please try again."
4661
+ });
4662
+ }
3593
4663
  });
3594
- setTimeout(() => {
3595
- history.push("/digit-ui/employee/ekyc/dashboard");
3596
- }, 1800);
3597
4664
  } catch (err) {
3598
- var _err$response, _err$response$data, _err$response$data$Er, _err$response$data$Er2;
3599
- console.error("eKYC Submit Error:", err);
4665
+ console.error("eKYC Frontend Error:", err);
3600
4666
  setToast({
3601
4667
  type: "error",
3602
- message: (err === null || err === void 0 ? void 0 : (_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : (_err$response$data$Er = _err$response$data.Errors) === null || _err$response$data$Er === void 0 ? void 0 : (_err$response$data$Er2 = _err$response$data$Er[0]) === null || _err$response$data$Er2 === void 0 ? void 0 : _err$response$data$Er2.message) || t("EKYC_SUBMIT_ERROR") || "Submission failed. Please try again."
4668
+ message: t("EKYC_SUBMIT_ERROR") || "An error occurred during submission."
3603
4669
  });
3604
- } finally {
3605
- setIsSubmitting(false);
3606
4670
  }
3607
4671
  };
3608
4672
  const handleEditAadhaar = () => {
@@ -3614,6 +4678,9 @@ const Review = () => {
3614
4678
  const handleEditProperty = () => {
3615
4679
  history.push("/digit-ui/employee/ekyc/property-info", location.state);
3616
4680
  };
4681
+ const handleEditMeter = () => {
4682
+ history.push("/digit-ui/employee/ekyc/meter-details", location.state);
4683
+ };
3617
4684
  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
3618
4685
  className: "inbox-container"
3619
4686
  }, /*#__PURE__*/React.createElement("style", null, `
@@ -3667,6 +4734,10 @@ const Review = () => {
3667
4734
  label: t("EKYC_STEP_PROPERTY") || "Property",
3668
4735
  done: true,
3669
4736
  active: false
4737
+ }, {
4738
+ label: t("EKYC_STEP_METER") || "Meter",
4739
+ done: true,
4740
+ active: false
3670
4741
  }, {
3671
4742
  label: t("EKYC_STEP_REVIEW") || "Review",
3672
4743
  done: false,
@@ -3678,9 +4749,9 @@ const Review = () => {
3678
4749
  gap: "10px",
3679
4750
  alignItems: "flex-start",
3680
4751
  position: "relative",
3681
- paddingBottom: i < 3 ? "18px" : 0
4752
+ paddingBottom: i < 4 ? "18px" : 0
3682
4753
  }
3683
- }, i < 3 && /*#__PURE__*/React.createElement("div", {
4754
+ }, i < 4 && /*#__PURE__*/React.createElement("div", {
3684
4755
  style: {
3685
4756
  position: "absolute",
3686
4757
  left: "10px",
@@ -3705,7 +4776,7 @@ const Review = () => {
3705
4776
  fontWeight: "500",
3706
4777
  color: step.done ? "#fff" : step.active ? "#185FA5" : "#98A2B3"
3707
4778
  }
3708
- }, step.done ? /*#__PURE__*/React.createElement(CheckIcon$3, {
4779
+ }, step.done ? /*#__PURE__*/React.createElement(CheckIcon$4, {
3709
4780
  size: 11,
3710
4781
  color: "#fff"
3711
4782
  }) : i + 1), /*#__PURE__*/React.createElement("div", {
@@ -3785,7 +4856,7 @@ const Review = () => {
3785
4856
  style: {
3786
4857
  animation: "fadeSlideIn 0.3s ease"
3787
4858
  }
3788
- }, /*#__PURE__*/React.createElement(SectionHead$3, {
4859
+ }, /*#__PURE__*/React.createElement(SectionHead$4, {
3789
4860
  icon: /*#__PURE__*/React.createElement(PersonIcon, {
3790
4861
  size: 16
3791
4862
  }),
@@ -3797,18 +4868,22 @@ const Review = () => {
3797
4868
  title: t("EKYC_AADHAAR_VERIFICATION_HEADER") || "Aadhaar details",
3798
4869
  onEdit: handleEditAadhaar,
3799
4870
  editLabel: t("CS_COMMON_EDIT") || "Edit",
4871
+ t: t,
3800
4872
  rows: [{
3801
4873
  label: t("EKYC_NAME") || "Name",
3802
- value: aadhaarDetails.userName || "Rajesh Kumar Singh"
4874
+ value: aadhaarDetails.userName || "Rajesh Kumar Singh",
4875
+ isModified: isFieldModified("userName", aadhaarDetails.userName)
3803
4876
  }, {
3804
4877
  label: t("EKYC_AADHAAR") || "Aadhaar no.",
3805
4878
  value: aadhaarDetails.aadhaarLastFour ? `${aadhaarDetails.aadhaarLastFour}` : "XXXX XXXX 1234"
3806
4879
  }, {
3807
4880
  label: t("EKYC_MOBILE_NO") || "Mobile no.",
3808
- value: aadhaarDetails.mobileNumber || "XXXXXXXXXX"
4881
+ value: aadhaarDetails.mobileNumber || "XXXXXXXXXX",
4882
+ isModified: isFieldModified("mobileNumber", aadhaarDetails.mobileNumber)
3809
4883
  }, {
3810
4884
  label: t("EKYC_EMAIL_ADDRESS") || "Email",
3811
- value: aadhaarDetails.email || null
4885
+ value: aadhaarDetails.email || null,
4886
+ isModified: isFieldModified("email", aadhaarDetails.email)
3812
4887
  }]
3813
4888
  }), /*#__PURE__*/React.createElement("hr", {
3814
4889
  style: {
@@ -3816,7 +4891,7 @@ const Review = () => {
3816
4891
  border: 0,
3817
4892
  borderTop: "1px solid #EAECF0"
3818
4893
  }
3819
- }), /*#__PURE__*/React.createElement(SectionHead$3, {
4894
+ }), /*#__PURE__*/React.createElement(SectionHead$4, {
3820
4895
  icon: /*#__PURE__*/React.createElement(LocationIcon2, {
3821
4896
  size: 16
3822
4897
  }),
@@ -3828,27 +4903,35 @@ const Review = () => {
3828
4903
  title: t("EKYC_ADDRESS_DETAILS_HEADER") || "Address details",
3829
4904
  onEdit: handleEditAddress,
3830
4905
  editLabel: t("CS_COMMON_EDIT") || "Edit",
4906
+ t: t,
3831
4907
  rows: [{
3832
4908
  label: t("EKYC_FULL_ADDRESS") || "Full address",
3833
- value: addressDetails.fullAddress || "H.No. 123, Sector 15, Rohini, Delhi – 110085"
4909
+ value: addressDetails.fullAddress || "H.No. 123, Sector 15, Rohini, Delhi – 110085",
4910
+ isModified: isFieldModified("fullAddress", addressDetails.fullAddress)
3834
4911
  }, {
3835
4912
  label: t("EKYC_FLAT_HOUSE_NUMBER") || "Flat / House no.",
3836
- value: addressDetails.flatNo || null
4913
+ value: addressDetails.flatNo || null,
4914
+ isModified: isFieldModified("flatNo", addressDetails.flatNo)
3837
4915
  }, {
3838
4916
  label: t("EKYC_BUILDING_TOWER") || "Building",
3839
- value: addressDetails.building || null
4917
+ value: addressDetails.building || null,
4918
+ isModified: isFieldModified("building", addressDetails.building)
3840
4919
  }, {
3841
4920
  label: t("EKYC_LANDMARK") || "Landmark",
3842
- value: addressDetails.landmark || null
4921
+ value: addressDetails.landmark || null,
4922
+ isModified: isFieldModified("landmark", addressDetails.landmark)
3843
4923
  }, {
3844
4924
  label: t("EKYC_PINCODE") || "Pincode",
3845
- value: addressDetails.pincode || "110085"
4925
+ value: addressDetails.pincode || "110085",
4926
+ isModified: isFieldModified("pincode", addressDetails.pincode)
3846
4927
  }, {
3847
4928
  label: t("EKYC_ASSEMBLY") || "Assembly",
3848
- value: addressDetails.assembly || "AC-12 Chandni Chowk"
4929
+ value: addressDetails.assembly || "AC-12 Chandni Chowk",
4930
+ isModified: isFieldModified("assembly", addressDetails.assembly)
3849
4931
  }, {
3850
4932
  label: t("EKYC_WARD") || "Ward",
3851
- value: addressDetails.ward || "WARD-45 Civil Lines"
4933
+ value: addressDetails.ward || "WARD-45 Civil Lines",
4934
+ isModified: isFieldModified("ward", addressDetails.ward)
3852
4935
  }]
3853
4936
  }), /*#__PURE__*/React.createElement("hr", {
3854
4937
  style: {
@@ -3856,7 +4939,7 @@ const Review = () => {
3856
4939
  border: 0,
3857
4940
  borderTop: "1px solid #EAECF0"
3858
4941
  }
3859
- }), /*#__PURE__*/React.createElement(SectionHead$3, {
4942
+ }), /*#__PURE__*/React.createElement(SectionHead$4, {
3860
4943
  icon: /*#__PURE__*/React.createElement(BuildingIcon$1, {
3861
4944
  size: 16
3862
4945
  }),
@@ -3868,24 +4951,92 @@ const Review = () => {
3868
4951
  title: t("EKYC_PROPERTY_INFO") || "Property details",
3869
4952
  onEdit: handleEditProperty,
3870
4953
  editLabel: t("CS_COMMON_EDIT") || "Edit",
4954
+ t: t,
3871
4955
  rows: [{
3872
4956
  label: t("EKYC_PROPERTY_OWNER") || "Property owner",
3873
4957
  value: propertyDetails.ownerType || "Owner"
3874
4958
  }, {
3875
4959
  label: t("EKYC_PID_NUMBER") || "PID number",
3876
- value: propertyDetails.pidNumber || null
4960
+ value: propertyDetails.pidNumber || null,
4961
+ isModified: isFieldModified("pidNumber", propertyDetails.pidNumber)
3877
4962
  }, {
3878
4963
  label: t("EKYC_TYPE_OF_CONNECTION") || "Type of connection",
3879
- value: ((_propertyDetails$conn3 = propertyDetails.connectionCategory) === null || _propertyDetails$conn3 === void 0 ? void 0 : _propertyDetails$conn3.label) || null
4964
+ value: ((_propertyDetails$conn3 = propertyDetails.connectionCategory) === null || _propertyDetails$conn3 === void 0 ? void 0 : _propertyDetails$conn3.label) || null,
4965
+ isModified: isFieldModified("typeOfConnection", (_propertyDetails$conn4 = propertyDetails.connectionCategory) === null || _propertyDetails$conn4 === void 0 ? void 0 : _propertyDetails$conn4.value)
3880
4966
  }, {
3881
4967
  label: t("EKYC_CONNECTION_CATEGORY") || "Connection category",
3882
- value: ((_propertyDetails$conn4 = propertyDetails.connectionType) === null || _propertyDetails$conn4 === void 0 ? void 0 : _propertyDetails$conn4.label) || null
4968
+ value: ((_propertyDetails$conn5 = propertyDetails.connectionType) === null || _propertyDetails$conn5 === void 0 ? void 0 : _propertyDetails$conn5.label) || null,
4969
+ isModified: isFieldModified("connectionCategory", (_propertyDetails$conn6 = propertyDetails.connectionType) === null || _propertyDetails$conn6 === void 0 ? void 0 : _propertyDetails$conn6.value)
3883
4970
  }, {
3884
4971
  label: t("EKYC_USER_TYPE") || "User type",
3885
- value: ((_propertyDetails$user2 = propertyDetails.userType) === null || _propertyDetails$user2 === void 0 ? void 0 : _propertyDetails$user2.label) || null
4972
+ value: ((_propertyDetails$user2 = propertyDetails.userType) === null || _propertyDetails$user2 === void 0 ? void 0 : _propertyDetails$user2.label) || null,
4973
+ isModified: isFieldModified("userType", (_propertyDetails$user3 = propertyDetails.userType) === null || _propertyDetails$user3 === void 0 ? void 0 : _propertyDetails$user3.value)
3886
4974
  }, {
3887
4975
  label: t("EKYC_NO_OF_FLOORS") || "No. of floors",
3888
- value: ((_propertyDetails$noOf2 = propertyDetails.noOfFloors) === null || _propertyDetails$noOf2 === void 0 ? void 0 : _propertyDetails$noOf2.label) || null
4976
+ value: ((_propertyDetails$noOf2 = propertyDetails.noOfFloors) === null || _propertyDetails$noOf2 === void 0 ? void 0 : _propertyDetails$noOf2.label) || null,
4977
+ isModified: isFieldModified("noOfFloor", (_propertyDetails$noOf3 = propertyDetails.noOfFloors) === null || _propertyDetails$noOf3 === void 0 ? void 0 : _propertyDetails$noOf3.value)
4978
+ }]
4979
+ }), /*#__PURE__*/React.createElement("hr", {
4980
+ style: {
4981
+ margin: "20px 0",
4982
+ border: 0,
4983
+ borderTop: "1px solid #EAECF0"
4984
+ }
4985
+ }), /*#__PURE__*/React.createElement(SectionHead$4, {
4986
+ icon: /*#__PURE__*/React.createElement("svg", {
4987
+ width: "16",
4988
+ height: "16",
4989
+ viewBox: "0 0 24 24",
4990
+ fill: "currentColor"
4991
+ }, /*#__PURE__*/React.createElement("path", {
4992
+ d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z"
4993
+ })),
4994
+ label: t("EKYC_METER_DETAILS_HEADER") || "Meter details"
4995
+ }), /*#__PURE__*/React.createElement(ReviewCard, {
4996
+ icon: /*#__PURE__*/React.createElement("svg", {
4997
+ width: "16",
4998
+ height: "16",
4999
+ viewBox: "0 0 24 24",
5000
+ fill: "currentColor"
5001
+ }, /*#__PURE__*/React.createElement("path", {
5002
+ d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z"
5003
+ })),
5004
+ title: t("EKYC_METER_DETAILS_HEADER") || "Meter details",
5005
+ onEdit: handleEditMeter,
5006
+ editLabel: t("CS_COMMON_EDIT") || "Edit",
5007
+ t: t,
5008
+ rows: [{
5009
+ label: t("EKYC_METER_STATUS") || "Meter status",
5010
+ value: ((_meterDetails$meterSt2 = meterDetails.meterStatus) === null || _meterDetails$meterSt2 === void 0 ? void 0 : _meterDetails$meterSt2.label) || null,
5011
+ isModified: isFieldModified("meterStatus", (_meterDetails$meterSt3 = meterDetails.meterStatus) === null || _meterDetails$meterSt3 === void 0 ? void 0 : _meterDetails$meterSt3.value)
5012
+ }, {
5013
+ label: t("EKYC_METER_WORKING_STATUS") || "Meter working status",
5014
+ value: ((_meterDetails$working2 = meterDetails.workingStatus) === null || _meterDetails$working2 === void 0 ? void 0 : _meterDetails$working2.label) || null,
5015
+ isModified: isFieldModified("meterWorkingStatus", (_meterDetails$working3 = meterDetails.workingStatus) === null || _meterDetails$working3 === void 0 ? void 0 : _meterDetails$working3.value)
5016
+ }, {
5017
+ label: t("EKYC_METER_LOCATION") || "Meter location",
5018
+ value: meterDetails.meterLocation || null,
5019
+ isModified: isFieldModified("meterLocation", meterDetails.meterLocation)
5020
+ }, {
5021
+ label: t("EKYC_LAST_BILL_RAISED") || "Last bill raised",
5022
+ value: ((_meterDetails$lastBil2 = meterDetails.lastBillRaised) === null || _meterDetails$lastBil2 === void 0 ? void 0 : _meterDetails$lastBil2.label) || null,
5023
+ isModified: isFieldModified("lastBillRaised", (_meterDetails$lastBil3 = meterDetails.lastBillRaised) === null || _meterDetails$lastBil3 === void 0 ? void 0 : _meterDetails$lastBil3.value)
5024
+ }, {
5025
+ label: t("EKYC_REASON_FOR_NO_BILL") || "Reason for no bill",
5026
+ value: meterDetails.noBillReason || null,
5027
+ isModified: isFieldModified("noBillReason", meterDetails.noBillReason)
5028
+ }, {
5029
+ label: t("EKYC_SEWER_CONNECTION") || "Sewer connection",
5030
+ value: ((_meterDetails$sewerCo2 = meterDetails.sewerConnection) === null || _meterDetails$sewerCo2 === void 0 ? void 0 : _meterDetails$sewerCo2.label) || null,
5031
+ isModified: isFieldModified("sewerConnection", (_meterDetails$sewerCo3 = meterDetails.sewerConnection) === null || _meterDetails$sewerCo3 === void 0 ? void 0 : _meterDetails$sewerCo3.value)
5032
+ }, {
5033
+ label: t("EKYC_TYPE_OF_CONNECTION") || "Type of connection",
5034
+ value: ((_meterDetails$connect3 = meterDetails.connectionCategory) === null || _meterDetails$connect3 === void 0 ? void 0 : _meterDetails$connect3.label) || null,
5035
+ isModified: isFieldModified("typeOfConnection", (_meterDetails$connect4 = meterDetails.connectionCategory) === null || _meterDetails$connect4 === void 0 ? void 0 : _meterDetails$connect4.value)
5036
+ }, {
5037
+ label: t("EKYC_CONNECTION_CATEGORY") || "Connection category",
5038
+ value: ((_meterDetails$connect5 = meterDetails.connectionType) === null || _meterDetails$connect5 === void 0 ? void 0 : _meterDetails$connect5.label) || null,
5039
+ isModified: isFieldModified("connectionCategory", (_meterDetails$connect6 = meterDetails.connectionType) === null || _meterDetails$connect6 === void 0 ? void 0 : _meterDetails$connect6.value)
3889
5040
  }]
3890
5041
  })), /*#__PURE__*/React.createElement("div", {
3891
5042
  style: {
@@ -3945,6 +5096,7 @@ const EmployeeApp = ({
3945
5096
  if (pathname.includes("/aadhaar-verification")) return "EKYC_AADHAAR_VERIFICATION";
3946
5097
  if (pathname.includes("/address-details")) return "EKYC_ADDRESS_DETAILS";
3947
5098
  if (pathname.includes("/property-info")) return "EKYC_PROPERTY_INFO";
5099
+ if (pathname.includes("/meter-details")) return "EKYC_METER_DETAILS";
3948
5100
  if (pathname.includes("/review")) return "EKYC_REVIEW";
3949
5101
  return "ES_COMMON_INBOX";
3950
5102
  };
@@ -3955,7 +5107,7 @@ const EmployeeApp = ({
3955
5107
  label: t(getBreadcrumbLabel())
3956
5108
  }];
3957
5109
  return /*#__PURE__*/React.createElement(AppContainer, null, /*#__PURE__*/React.createElement("div", {
3958
- className: "ground-container employee-app-container"
5110
+ className: "ground-container employee-app-container employee-app-homepage-container"
3959
5111
  }, /*#__PURE__*/React.createElement(ModuleHeader, {
3960
5112
  leftContent: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ArrowLeft, {
3961
5113
  className: "icon"
@@ -3982,6 +5134,9 @@ const EmployeeApp = ({
3982
5134
  }), /*#__PURE__*/React.createElement(PrivateRoute, {
3983
5135
  path: `${path}/property-info`,
3984
5136
  component: () => /*#__PURE__*/React.createElement(PropertyInfo, null)
5137
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5138
+ path: `${path}/meter-details`,
5139
+ component: () => /*#__PURE__*/React.createElement(MeterDetails, null)
3985
5140
  }), /*#__PURE__*/React.createElement(PrivateRoute, {
3986
5141
  path: `${path}/review`,
3987
5142
  component: () => /*#__PURE__*/React.createElement(Review, null)
@@ -3996,6 +5151,63 @@ const EmployeeApp = ({
3996
5151
  }))));
3997
5152
  };
3998
5153
 
5154
+ const CitizenApp = () => {
5155
+ const {
5156
+ t
5157
+ } = useTranslation();
5158
+ const location = useLocation();
5159
+ const {
5160
+ path
5161
+ } = useRouteMatch();
5162
+ sessionStorage.removeItem("revalidateddone");
5163
+ const getBreadcrumbLabel = () => {
5164
+ const pathname = location.pathname;
5165
+ if (pathname.includes("/create-kyc")) return "EKYC_CREATE_KYC";
5166
+ if (pathname.includes("/aadhaar-verification")) return "EKYC_AADHAAR_VERIFICATION";
5167
+ if (pathname.includes("/address-details")) return "EKYC_ADDRESS_DETAILS";
5168
+ if (pathname.includes("/property-info")) return "EKYC_PROPERTY_INFO";
5169
+ if (pathname.includes("/meter-details")) return "EKYC_METER_DETAILS";
5170
+ if (pathname.includes("/review")) return "EKYC_REVIEW";
5171
+ return "EKYC_HOME";
5172
+ };
5173
+ const breadcrumbs = [{
5174
+ icon: HomeIcon,
5175
+ path: "/digit-ui/citizen"
5176
+ }, {
5177
+ label: t(getBreadcrumbLabel())
5178
+ }];
5179
+ return /*#__PURE__*/React.createElement(AppContainer, null, /*#__PURE__*/React.createElement("div", {
5180
+ className: "ground-container employee-app-container form-container"
5181
+ }, /*#__PURE__*/React.createElement(ModuleHeader, {
5182
+ leftContent: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ArrowLeft, {
5183
+ className: "icon"
5184
+ }), t("CS_COMMON_BACK")),
5185
+ onLeftClick: () => window.history.back(),
5186
+ breadcrumbs: breadcrumbs
5187
+ }), /*#__PURE__*/React.createElement(Switch, null, /*#__PURE__*/React.createElement(PrivateRoute, {
5188
+ path: `${path}/create-kyc`,
5189
+ component: () => /*#__PURE__*/React.createElement(Create, null)
5190
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5191
+ path: `${path}/aadhaar-verification`,
5192
+ component: () => /*#__PURE__*/React.createElement(AadhaarVerification, null)
5193
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5194
+ path: `${path}/address-details`,
5195
+ component: () => /*#__PURE__*/React.createElement(AddressDetails, null)
5196
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5197
+ path: `${path}/property-info`,
5198
+ component: () => /*#__PURE__*/React.createElement(PropertyInfo, null)
5199
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5200
+ path: `${path}/meter-details`,
5201
+ component: () => /*#__PURE__*/React.createElement(MeterDetails, null)
5202
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5203
+ path: `${path}/review`,
5204
+ component: () => /*#__PURE__*/React.createElement(Review, null)
5205
+ }), /*#__PURE__*/React.createElement(PrivateRoute, {
5206
+ path: `${path}/`,
5207
+ component: () => /*#__PURE__*/React.createElement(Create, null)
5208
+ }))));
5209
+ };
5210
+
3999
5211
  const EkycModule = ({
4000
5212
  stateCode,
4001
5213
  userType,
@@ -4026,7 +5238,26 @@ const EkycModule = ({
4026
5238
  userType: userType,
4027
5239
  tenants: tenants
4028
5240
  });
4029
- } else return null;
5241
+ } else return /*#__PURE__*/React.createElement(CitizenApp, null);
5242
+ };
5243
+ const EkycLinks = ({
5244
+ matchPath,
5245
+ userType
5246
+ }) => {
5247
+ const {
5248
+ t
5249
+ } = useTranslation();
5250
+ const links = [{
5251
+ link: `${matchPath}/create-kyc`,
5252
+ i18nKey: t("EKYC_CREATE_KYC")
5253
+ }];
5254
+ return /*#__PURE__*/React.createElement(CitizenHomeCard, {
5255
+ header: t("EKYC_MODULE_NAME"),
5256
+ links: links,
5257
+ Icon: () => /*#__PURE__*/React.createElement(DocumentIcon$1, {
5258
+ className: "fill-path-primary-main"
5259
+ })
5260
+ });
4030
5261
  };
4031
5262
  const componentsToRegister = {
4032
5263
  EKYCModule: EkycModule,
@@ -4034,7 +5265,8 @@ const componentsToRegister = {
4034
5265
  EKYCInbox: Inbox,
4035
5266
  EKYCDesktopInbox: DesktopInbox,
4036
5267
  EKYCMobileInbox: MobileInbox,
4037
- EKYC_INBOX_FILTER: props => /*#__PURE__*/React.createElement(Filter, props)
5268
+ EKYC_INBOX_FILTER: props => /*#__PURE__*/React.createElement(Filter, props),
5269
+ EkycLinks
4038
5270
  };
4039
5271
  const initEkycComponents = () => {
4040
5272
  Object.entries(componentsToRegister).forEach(([key, value]) => {
@@ -4043,5 +5275,5 @@ const initEkycComponents = () => {
4043
5275
  };
4044
5276
 
4045
5277
  export default EkycModule;
4046
- export { EkycModule, initEkycComponents };
5278
+ export { EkycLinks, EkycModule, initEkycComponents };
4047
5279
  //# sourceMappingURL=index.modern.js.map