@djb25/digit-ui-module-ekyc 1.0.27 → 1.0.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djb25/digit-ui-module-ekyc",
-  "version": "1.0.27",
+  "version": "1.0.29",
   "description": "Digit UI Module for Ekyc",
   "main": "dist/index.js",
   "module": "dist/index.modern.js",

package/src/components/AssignEkyc.js

@@ -77,7 +77,7 @@ const AssignEkyc = () => {
 
   const SearchFormFields = useCallback(
     ({ registerRef, searchFormState, controlSearchForm }) => (
-      <SearchFormFieldsComponents {...{ registerRef, searchFormState, controlSearchForm }} className="search" />
+      <SearchFormFieldsComponents {...{ registerRef, searchFormState, controlSearchForm }} searchType="mobile" className="search" />
     ),
     []
   );

package/src/components/AssignEkycModal.js

@@ -1,7 +1,9 @@
 import React, { useMemo, useState, useEffect } from "react";
 import { Modal, Close, Table, Toast } from "@djb25/digit-ui-react-components";
+import { useTranslation } from "react-i18next";
 
 const AssignEkycModal = ({ surveyor, closeModal, refetchDashboard }) => {
+  const { t } = useTranslation();
   const [selectedKnos, setSelectedKnos] = useState([]);
   const [isBulkSelection, setIsBulkSelection] = useState(false);
   const [currentPage, setCurrentPage] = useState(0);
@@ -14,6 +16,7 @@ const AssignEkycModal = ({ surveyor, closeModal, refetchDashboard }) => {
   const [filters, setFilters] = useState({
     kno: "", // search value
     pincode: "",
+    zoneCode: "",
     zoneName: "",
     ward: "",
     assembly: "",
@@ -23,6 +26,95 @@ const AssignEkycModal = ({ surveyor, closeModal, refetchDashboard }) => {
 
   const [debouncedFilters, setDebouncedFilters] = useState(filters);
 
+  const { data: zroLocationsData, isLoading: isZroLoading } = Digit.Hooks.ws.useWSConfigMDMS.ZROLocation("dl.djb");
+  const mappedZROLocation = useMemo(() => {
+    return (zroLocationsData || []).map((item) => ({
+      code: item.code,
+      name: item.name,
+    }));
+  }, [zroLocationsData]);
+
+  const { data: egovLocationData } = Digit.Hooks.useCommonMDMS("dl.djb", "egov-location", ["TenantBoundary"]);
+
+  const boundaryData = useMemo(() => {
+    const tenantBoundary = egovLocationData?.["egov-location"]?.TenantBoundary || [];
+    const revenueData = tenantBoundary.find((item) => item?.hierarchyType?.code === "REVENUE");
+    const boundary = revenueData?.boundary || [];
+    return Array.isArray(boundary) ? boundary : [boundary];
+  }, [egovLocationData]);
+
+  const { assemblyOptions, wardOptions } = useMemo(() => {
+    const assemblies = new Map();
+    const wards = new Map();
+
+    const boundaries = Array.isArray(boundaryData) ? boundaryData : boundaryData ? [boundaryData] : [];
+
+    const traverse = (node) => {
+      if (!node) return;
+      if (node.label === "Ward" || node.label === "WARD" || node.label === "Block" || node.label === "BLOCK") {
+        const code = node.code || node.localname || node.name;
+        const name = node.name || node.localname || code;
+        if (code) wards.set(code, { code, name: name });
+      }
+      if (node.label === "Assembly Constituency" || node.label === "ASSEMBLY_CONSTITUENCY") {
+        const code = node.code || node.localname || node.name;
+        const name = node.name || node.localname || code;
+        if (code) assemblies.set(code, { code, name: name });
+      }
+      if (node.children && node.children.length > 0) {
+        node.children.forEach(traverse);
+      }
+    };
+
+    boundaries.forEach(traverse);
+
+    return {
+      assemblyOptions: Array.from(assemblies.values()).sort((a, b) => a.name.localeCompare(b.name)),
+      wardOptions: Array.from(wards.values()).sort((a, b) => a.name.localeCompare(b.name)),
+    };
+  }, [boundaryData]);
+
+  const structuredLocalityData = useMemo(() => {
+    let localities = [];
+    const boundaries = Array.isArray(boundaryData) ? boundaryData : boundaryData ? [boundaryData] : [];
+
+    const extractLocalities = (node) => {
+      if (!node) return;
+
+      if (node.label === "Locality" || node.label === "LOCALITY") {
+        localities.push({
+          ...node,
+          name: node.localname || node.name || node.code,
+        });
+      }
+      if (node.children && node.children.length > 0) {
+        node.children.forEach((child) => extractLocalities(child));
+      }
+    };
+
+    boundaries.forEach((rootNode) => extractLocalities(rootNode));
+
+    return localities;
+  }, [boundaryData]);
+
+  const fetchedPincodes = useMemo(() => {
+    const pinSet = new Set();
+
+    structuredLocalityData.forEach((loc) => {
+      if (loc.pincode) {
+        const pins = Array.isArray(loc.pincode) ? loc.pincode : [loc.pincode];
+        pins.forEach((p) => {
+          if (p) {
+            const sanitizedPin = p.toString().split(".")[0];
+            pinSet.add(sanitizedPin);
+          }
+        });
+      }
+    });
+
+    return Array.from(pinSet).sort();
+  }, [structuredLocalityData]);
+
   useEffect(() => {
     const timer = setTimeout(() => {
       setDebouncedFilters(filters);
@@ -33,13 +125,18 @@ const AssignEkycModal = ({ surveyor, closeModal, refetchDashboard }) => {
 
   useEffect(() => {
     setCurrentPage(0);
-  }, [debouncedFilters]);
+  }, [debouncedFilters, filters.kno]);
 
   const { data: applicationData, isFetching: isLoading } = Digit.Hooks.ekyc.useEkycApplicationList(
     {
+      /*
       ...(debouncedFilters.kno && {
         kno: debouncedFilters.kno,
       }),
+      */
+      ...(filters.kno && {
+        kno: filters.kno,
+      }),
 
       ...(debouncedFilters.ekycStatus && {
         ekycStatus: debouncedFilters.ekycStatus,
@@ -237,44 +334,65 @@ const AssignEkycModal = ({ surveyor, closeModal, refetchDashboard }) => {
         <div className="filters-grid">
           <input className="form-control" placeholder="KNO" value={filters.kno} onChange={(e) => handleFilterChange("kno", e.target.value)} />
 
-          <input
+          <select
             className="form-control"
-            placeholder="Pincode"
             value={filters.pincode}
             onChange={(e) => handleFilterChange("pincode", e.target.value)}
-          />
-
-          <input
+          >
+            <option value="">Select Pincode</option>
+            {fetchedPincodes.map((pin) => (
+              <option key={pin} value={pin}>
+                {pin}
+              </option>
+            ))}
+          </select>
+
+          <select
             className="form-control"
-            placeholder="Zone"
             value={filters.zoneName}
-            onChange={(e) => handleFilterChange("zoneName", e.target.value)}
-          />
-
-          {/* <SelectEkycZones
-            t={t}
-            isMultiSelect={false}
-            config={{
-              key: "zoneCode",
-            }}
-            formData={{
-              zoneIds: filters.zoneCode ? [{ code: filters.zoneCode, name: filters.zoneName }] : [],
-            }}
-            onSelect={(key, value) => {
-              console.log(value);
-              handleFilterChange("zoneName", value);
+            onChange={(e) => {
+              const val = e.target.value;
+              setFilters((prev) => ({
+                ...prev,
+                zoneCode: val,
+                zoneName: val,
+              }));
             }}
-            placeHolder="Zones"
-          /> */}
-
-          {/* <input className="form-control" placeholder="Ward" value={filters.ward} onChange={(e) => handleFilterChange("ward", e.target.value)} />
-
-          <input
+            disabled={isZroLoading}
+          >
+            <option value="">{isZroLoading ? "Loading ZRO Locations..." : "Select ZRO Location"}</option>
+            {mappedZROLocation.map((loc) => (
+              <option key={loc.code} value={loc.name}>
+                {loc.name}
+              </option>
+            ))}http://localhost:3000/digit-ui/employee/ekyc/assign
+          </select>
+
+          <select
+            className="form-control"
+            value={filters.ward}
+            onChange={(e) => handleFilterChange("ward", e.target.value)}
+          >
+            <option value="">Select Ward</option>
+            {wardOptions.map((ward) => (
+              <option key={ward.code} value={ward.name}>
+                {ward.name}
+              </option>
+            ))}
+          </select>
+
+          <select
             className="form-control"
-            placeholder="Assembly"
             value={filters.assembly}
             onChange={(e) => handleFilterChange("assembly", e.target.value)}
-          />
+          >
+            <option value="">Select Assembly</option>
+            {assemblyOptions.map((assembly) => (
+              <option key={assembly.code} value={assembly.name}>
+                {assembly.name}
+              </option>
+            ))}
+          </select>
 
           <input className="form-control" placeholder="MR Key" value={filters.mrkey} onChange={(e) => handleFilterChange("mrkey", e.target.value)} />
 
@@ -283,7 +401,7 @@ const AssignEkycModal = ({ surveyor, closeModal, refetchDashboard }) => {
             <option value="PENDING">Pending</option>
             <option value="APPROVED">Approved</option>
             <option value="REJECTED">Rejected</option>
-          </select> */}
+          </select>
         </div>
 
         {/* Table */}

package/src/components/DesktopInbox.js

@@ -80,7 +80,7 @@ const DesktopInbox = ({ tableConfig, filterComponent, ...props }) => {
         Header: t("EKYC_EKYC_STATUS"),
         accessor: "ekycStatus",
         Cell: ({ row }) => {
-          const ekycStatus = row.original?.ekycStatus || row.original?.ekycstatus || "NA";
+          const ekycStatus = (row.original?.ekycStatus || row.original?.ekycstatus || "NA").toUpperCase();
           return <span className={`ekyc-status-tag ${ekycStatus}`}>{t(`${ekycStatus}`)}</span>
         }
       },

package/src/components/Review.js

@@ -177,8 +177,8 @@ const Review = () => {
   const [toastData, setToastData] = useState({ error: false, label: "" });
 
   const options = [
-    { action: t("Approve") },
-    { action: t("Reject") }
+    { action: t("APPROVE") },
+    { action: t("REJECT") }
   ];
 
   const flowState = location.state || {};

package/src/components/SearchFormFieldsComponent.js

@@ -3,17 +3,46 @@ import { Controller } from "react-hook-form";
 import { CardLabelError, TextInput, CustomTooltip, Label } from "@djb25/digit-ui-react-components";
 import { useTranslation } from "react-i18next";
 
-const SearchFormFieldsComponents = ({ searchFormState, controlSearchForm }) => {
+const SearchFormFieldsComponents = ({ searchFormState, controlSearchForm, searchType }) => {
   const { t } = useTranslation();
   const { errors } = searchFormState;
 
+  if (searchType === "mobile") {
+    return (
+      <React.Fragment>
+        {/* MOBILE NUMBER */}
+        <span className="mobile-input">
+          <Label className="flex-roww flex-gap-2">
+            {t("ES_COMMON_MOBILE_NUM") || "Mobile Number"}
+            <CustomTooltip message={t("EKYC_MOBILE_NUMBER_MESSAGE")} />
+          </Label>
+
+          <Controller
+            name="mobileNumber"
+            control={controlSearchForm}
+            defaultValue=""
+            rules={{
+              pattern: {
+                value: /^[6-9]\d{9}$/,
+                message: t("ERR_INVALID_MOBILE_NUMBER"),
+              },
+            }}
+            render={({ onChange, value }) => <TextInput value={value || ""} onChange={(e) => onChange(e.target.value)} />}
+          />
+
+          {errors?.mobileNumber && <CardLabelError>{errors.mobileNumber.message}</CardLabelError>}
+        </span>
+      </React.Fragment>
+    );
+  }
+
   return (
     <React.Fragment>
-      {/* MOBILE NUMBER */}
+      {/* K NUMBER (KNO) */}
       <span className="mobile-input">
         <Label className="flex-roww flex-gap-2">
           {t("EKYC_K.NUMBER") || "K Number"}
-          <CustomTooltip message={t("EKYC_MOBILE_NUMBER_MESSAGE")} />
+          <CustomTooltip message={t("EKYC_K.NUMBER_MESSAGE")} />
         </Label>
 
         <Controller
@@ -31,23 +60,6 @@ const SearchFormFieldsComponents = ({ searchFormState, controlSearchForm }) => {
 
         {errors?.kNumber && <CardLabelError>{errors.kNumber.message}</CardLabelError>}
       </span>
-
-      {/* K NAME */}
-      {/* <span className="mobile-input">
-        <Label className="flex-roww flex-gap-2">
-          {t("EKYC_K_NAME") || "K Name"}
-          <CustomTooltip message={t("EKYC_K_NAME_MESSAGE")} />
-        </Label>
-
-        <Controller
-          name="kName"
-          control={controlSearchForm}
-          defaultValue=""
-          render={({ onChange, value }) => <TextInput value={value || ""} onChange={(e) => onChange(e.target.value)} />}
-        />
-
-        {errors?.kName && <CardLabelError>{errors.kName.message}</CardLabelError>}
-      </span> */}
     </React.Fragment>
   );
 };

package/src/components/SurveyorDetailsCard.js

@@ -278,9 +278,10 @@ const SurveyorDetailsDashboard = () => {
 
             <div className="designation">{surveyor?.description || t("FIELD_SURVEYOR")}</div>
 
-            <div className="employee-id">
+            {/* <div className="employee-id">
               {t("EMPLOYEE_ID")}: {employeeId}
-            </div>
+            </div> */}
+            
           </div>
         </div>
 
@@ -373,7 +374,7 @@ const SurveyorDetailsDashboard = () => {
       {/* Charts */}
       <div className="charts-wrapper">
         {/* Weekly Chart */}
-        <div className="chart-card">
+        {/* <div className="chart-card">
           <h3 className="chart-title">{t("WEEKLY_SURVEY_PROGRESS")}</h3>
 
           <ResponsiveContainer width="100%" height={300}>
@@ -389,10 +390,10 @@ const SurveyorDetailsDashboard = () => {
               <Bar dataKey="completed" fill="#0B2559" radius={[6, 6, 0, 0]} />
             </BarChart>
           </ResponsiveContainer>
-        </div>
+        </div> */}
 
         {/* Pie Chart */}
-        <div className="chart-card">
+        {/* <div className="chart-card">
           <h3 className="chart-title">{t("CASE_DISTRIBUTION")}</h3>
 
           <ResponsiveContainer width="100%" height={300}>
@@ -408,7 +409,7 @@ const SurveyorDetailsDashboard = () => {
               <Legend />
             </PieChart>
           </ResponsiveContainer>
-        </div>
+        </div> */}
       </div>
 
       {/* Details */}
@@ -440,8 +441,8 @@ const SurveyorDetailsDashboard = () => {
           </div>
 
           <div className="detail-item">
-            <span className="label">{t("VENDOR_ID")}:</span>
-            <span className="value">{surveyor?.vendorId || "N/A"}</span>
+            <span className="label">{t("VENDOR_NAME") || "Vendor Name"}:</span>
+            <span className="value">{vendorName}</span>
           </div>
         </div>
       </div>
@@ -498,7 +499,7 @@ const SurveyorDetailsDashboard = () => {
               />
             )}
           </ActionBar>
-          
+
         )
       }
 

package/src/config/MeterDetailsConfig.js

@@ -110,7 +110,7 @@ const MeterDetailsConfig = (t, formData = {}, uploadPhoto, meterPhoto, meterPhot
 
     if (meterStatus === "Metered") {
       fields.push({
-        label: t("Meter Photo *"),
+        label: t("Meter Photo"),
         isMandatory: true,
         type: "custom",
         key: "meterPhoto",
@@ -201,7 +201,7 @@ const MeterDetailsConfig = (t, formData = {}, uploadPhoto, meterPhoto, meterPhot
   // 🔹 Bill-received fields
   if (lastBillReceived === "Yes") {
     fields.push({
-      label: t("When was the last bill received *"),
+      label: t("When was the last bill received"),
       isMandatory: true,
       type: "custom",
       key: "billMonthYear",

package/src/hook/useInboxTableConfig.js

@@ -43,11 +43,7 @@ const useInboxTableConfig = ({
       Cell: ({ row }) => {
         const kno = row.original?.kno || row.original?.applicationNumber || "NA";
         return (
-          <span
-            className="ekyc-application-link"
-            style={{ color: "#add8f7", cursor: "pointer", fontWeight: "bold" }}
-            onClick={() => handleReview(kno)}
-          >
+          <span className="ekyc-application-link" onClick={() => handleReview(kno)}>
             {kno}
           </span>
         );
@@ -70,7 +66,7 @@ const useInboxTableConfig = ({
       Header: t("EKYC_EKYC_STATUS"),
       accessor: "ekycStatus",
       Cell: ({ row }) => {
-        const ekycStatus = row.original?.ekycStatus || row.original?.ekycstatus || "NA";
+        const ekycStatus = (row.original?.ekycStatus || row.original?.ekycstatus || "NA").toUpperCase();
         return <span className={`ekyc-status-tag ${ekycStatus}`}>{t(`${ekycStatus}`)}</span>;
       },
     },
@@ -93,14 +89,6 @@ const useInboxTableConfig = ({
   ];
 
   return {
-    getCellProps: (cellInfo) => {
-      return {
-        style: {
-          padding: "8px",
-          fontSize: "12px",
-        },
-      };
-    },
     disableSort: false,
     autoSort: false,
     manualPagination: true,

package/src/pages/citizen/Home.js

@@ -15,7 +15,7 @@ const Home = () => {
     links: [],
   };
   const citizenInfo = Digit.SessionStorage.get("User")?.info?.roles;
-  const roles = citizenInfo.map((ele) => ele.code);
+  const roles = Array.isArray(citizenInfo) ? citizenInfo.map((ele) => ele.code) : [];
 
   if (roles.includes("EKYC_SURVEYOR")) {
     propsForModuleCard.links.push({

package/src/pages/citizen/Inbox.js

@@ -88,7 +88,7 @@ const Inbox = ({ parentRoute }) => {
           applicationNumber: item.propertyInfo?.kno || "",
           citizenName: item.connectionDetails?.consumerName || "",
           status: item.connectionDetails?.statusflag || "",
-          ekycStatus: item.connectionDetails?.ekycStatus || item.connectionDetails?.ekycstatus || item.ekycStatus || item.ekycstatus || "NA",
+          ekycStatus: (item.connectionDetails?.ekycStatus || item.connectionDetails?.ekycstatus || item.ekycStatus || item.ekycstatus || "NA").toUpperCase(),
           sla: 0,
         };
       }
@@ -102,7 +102,7 @@ const Inbox = ({ parentRoute }) => {
         applicationNumber: item.kno || item.applicationNumber || "",
         citizenName: item.consumerName || item.citizenName || "",
         status: item.status || "",
-        ekycStatus: item.ekycStatus || item.ekycstatus || "NA",
+        ekycStatus: (item.ekycStatus || item.ekycstatus || "NA").toUpperCase(),
         sla: item.sla ?? 0,
       };
     });
@@ -111,13 +111,13 @@ const Inbox = ({ parentRoute }) => {
   const totalRecords = dashboardData?.dashboardInfo?.totalRecords || dashboardData?.totalCount || 0;
 
   const checkPathName = location.pathname.includes("ekyc/inbox");
-  const PropsForInboxLinks = {
-    headerText: "EKYC_MODULE",
-  };
+  // const PropsForInboxLinks = {
+  //   headerText: "EKYC_MODULE",
+  // };
 
   const SearchFormFields = useCallback(
     ({ registerRef, searchFormState, controlSearchForm }) => (
-      <SearchFormFieldsComponents {...{ registerRef, searchFormState, controlSearchForm }} className="search" />
+      <SearchFormFieldsComponents {...{ registerRef, searchFormState, controlSearchForm }} searchType="kno" className="search" />
     ),
     []
   );
@@ -157,18 +157,18 @@ const Inbox = ({ parentRoute }) => {
     className: "search-form-wns-inbox",
   };
 
-  const FilterFormFields = useCallback(
-    ({ registerRef, controlFilterForm, setFilterFormValue, getFilterFormValue }) => <React.Fragment></React.Fragment>,
-    []
-  );
-
-  const propsForFilterForm = {
-    FilterFormFields,
-    onFilterFormSubmit: () => { },
-    filterFormDefaultValues: "",
-    resetFilterFormDefaultValues: "",
-    onFilterFormReset: () => { },
-  };
+  // const FilterFormFields = useCallback(
+  //   ({ registerRef, controlFilterForm, setFilterFormValue, getFilterFormValue }) => <React.Fragment></React.Fragment>,
+  //   []
+  // );
+
+  // const propsForFilterForm = {
+  //   FilterFormFields,
+  //   onFilterFormSubmit: () => { },
+  //   filterFormDefaultValues: "",
+  //   resetFilterFormDefaultValues: "",
+  //   onFilterFormReset: () => { },
+  // };
 
   function formReducer(state, payload) {
     const storageKey = payload.checkPathName ? "EKYC.INBOX" : "EKYC.SW.INBOX";

package/src/pages/employee/Inbox.js

@@ -87,7 +87,7 @@ const Inbox = ({ parentRoute, businessService = "EKYC", initialStates = {}, filt
           applicationNumber: item.propertyInfo?.kno || "",
           citizenName: item.connectionDetails?.consumerName || "",
           status: item.connectionDetails?.statusflag || "",
-          ekycStatus: item.connectionDetails?.ekycStatus || item.connectionDetails?.ekycstatus || item.ekycStatus || item.ekycstatus || "NA",
+          ekycStatus: (item.connectionDetails?.ekycStatus || item.connectionDetails?.ekycstatus || item.ekycStatus || item.ekycstatus || "NA").toUpperCase(),
           sla: 0,
         };
       }
@@ -102,7 +102,7 @@ const Inbox = ({ parentRoute, businessService = "EKYC", initialStates = {}, filt
         applicationNumber: item.kno || item.applicationNumber || "",
         citizenName: fullName || item.consumerName || item.citizenName || "",
         status: item.status || "",
-        ekycStatus: item.ekycStatus || item.ekycstatus || "NA",
+        ekycStatus: (item.ekycStatus || item.ekycstatus || "NA").toUpperCase(),
         sla: item.sla ?? 0,
       };
     });
@@ -117,7 +117,7 @@ const Inbox = ({ parentRoute, businessService = "EKYC", initialStates = {}, filt
 
   const SearchFormFields = useCallback(
     ({ registerRef, searchFormState, controlSearchForm }) => (
-      <SearchFormFieldsComponents {...{ registerRef, searchFormState, controlSearchForm }} className="search" />
+      <SearchFormFieldsComponents {...{ registerRef, searchFormState, controlSearchForm }} searchType="kno" className="search" />
     ),
     []
   );

package/src/utils/reportDownloader.js

@@ -27,13 +27,26 @@ export const downloadSurveyorPDF = async ({
     const email = "contact@delhijalboard.nic.in";
     const phoneNumber = "+91-11-23538416";
 
+    const currentDate = new Date();
+    const formattedDate = currentDate.toLocaleDateString("en-IN", {
+        day: "2-digit",
+        month: "2-digit",
+        year: "numeric"
+    });
+    const formattedTime = currentDate.toLocaleTimeString("en-IN", {
+        hour: "2-digit",
+        minute: "2-digit",
+        second: "2-digit",
+        hour12: false
+    });
+    const downloadDateTime = `${formattedDate} ${formattedTime}`;
+
     const details = [
         {
             title: t("SURVEYOR_DETAILS"),
             asSectionHeader: true,
             values: [
                 { title: t("SURVEYOR_NAME"), value: surveyorName },
-                { title: t("EMPLOYEE_ID"), value: employeeId },
                 { title: t("MOBILE_NUMBER"), value: mobileNumber },
                 { title: t("VENDOR_NAME"), value: vendorName },
                 { title: t("SUPERVISOR_NAME"), value: supervisorName }
@@ -68,6 +81,8 @@ export const downloadSurveyorPDF = async ({
             applicationNumber: employeeId,
             rows,
             t,
+            hideApplicationNumber: true,
+            downloadTime: downloadDateTime,
         });
     } else {
         console.error("Digit.Utils.pdf.generateSurveyorReport is not available");