@djb25/digit-ui-module-ekyc 1.0.24 → 1.0.26

package/src/config/MeterDetailsConfig.js

@@ -0,0 +1,297 @@
+import React from "react";
+import { UploadFile, Dropdown } from "@djb25/digit-ui-react-components";
+
+const MeterDetailsConfig = (t, formData = {}, uploadPhoto, meterPhoto, meterPhotoId, setMeterPhoto, setMeterPhotoId) => {
+  const meterStatus = formData?.meterStatus?.name || formData?.meterStatus;
+  const lastBillReceived = formData?.lastBillReceived?.name || formData?.lastBillReceived;
+  const sewerConnection = formData?.sewerConnection?.name || formData?.sewerConnection;
+
+  const isFrozen = meterStatus === "Can not be identified";
+
+  // Generate Month-Year Options (1998–2026)
+  const monthYearOptions = [];
+  for (let y = 1998; y <= 2026; y++) {
+    for (let m = 1; m <= 12; m++) {
+      monthYearOptions.push({ name: `${m}/${y}` });
+    }
+  }
+
+  const yesNo = [{ name: "Yes" }, { name: "No" }];
+
+  const fields = [
+    {
+      label: t("Connection Category"),
+      isMandatory: true,
+      type: "text",
+      populators: {
+        name: "connectionCategory",
+        validation: { required: true },
+      },
+    },
+    {
+      label: t("SA Type"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "saType",
+      },
+    },
+    {
+      label: t("Status"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "status",
+      },
+    },
+    {
+      label: t("MR Code"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "mrCode",
+      },
+    },
+    {
+      label: t("Area Code"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "areaCode",
+      },
+    },
+    {
+      label: t("MR Key"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "mrKey",
+      },
+    },
+  ];
+
+  // 🔹 Non-frozen fields
+  if (!isFrozen) {
+    fields.push(
+      {
+        label: t("Meter Number"),
+        isMandatory: false,
+        type: "text",
+        populators: {
+          name: "meterNumber",
+        },
+      },
+      {
+        label: t("Meter Maker"),
+        isMandatory: false,
+        type: "text",
+        populators: {
+          name: "meterMaker",
+        },
+      },
+      {
+        label: t("Meter Condition"),
+        isMandatory: false,
+        type: "custom",
+        key: "meterCondition",
+        populators: {
+          name: "meterCondition",
+          component: (props) => (
+            <Dropdown
+              option={[{ name: "Damaged" }, { name: "Not-Damaged" }]}
+              optionKey="name"
+              selected={props.value}
+              select={props.onChange}
+            />
+          ),
+        },
+      }
+    );
+
+    if (meterStatus === "Metered") {
+      fields.push({
+        label: t("Meter Photo *"),
+        isMandatory: true,
+        type: "custom",
+        key: "meterPhoto",
+        populators: {
+          name: "meterPhoto",
+          component: (props) => (
+            <div>
+              <UploadFile
+                onUpload={(e) => uploadPhoto(e, props.onChange)}
+                onDelete={() => {
+                  props.onChange(null);
+                  setMeterPhoto(null);
+                  setMeterPhotoId(null);
+                }}
+                message={meterPhotoId ? t("Uploaded") : t("No file selected")}
+              />
+              {meterPhoto && (
+                <div style={{ marginTop: "10px" }}>
+                  <img
+                    src={meterPhoto}
+                    alt="preview"
+                    style={{ maxWidth: "100%", maxHeight: "200px", objectFit: "contain" }}
+                  />
+                </div>
+              )}
+            </div>
+          ),
+        },
+      });
+    }
+  }
+
+  // 🔹 Standard fields after the conditional section
+  fields.push(
+    {
+      label: t("Meter Status"),
+      isMandatory: true,
+      type: "custom",
+      key: "meterStatus",
+      populators: {
+        name: "meterStatus",
+        component: (props) => (
+          <Dropdown
+            option={[{ name: "Metered" }, { name: "Unmetered" }, { name: "Can not be identified" }]}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    },
+    {
+      label: t("Meter Location"),
+      isMandatory: true,
+      type: "custom",
+      key: "meterLocation",
+      populators: {
+        name: "meterLocation",
+        component: (props) => (
+          <Dropdown
+            option={[{ name: "Inside" }, { name: "Outside" }]}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    },
+    {
+      label: t("Last Bill Received"),
+      isMandatory: true,
+      type: "custom",
+      key: "lastBillReceived",
+      populators: {
+        name: "lastBillReceived",
+        component: (props) => (
+          <Dropdown
+            option={yesNo}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    }
+  );
+
+  // 🔹 Bill-received fields
+  if (lastBillReceived === "Yes") {
+    fields.push({
+      label: t("When was the last bill received *"),
+      isMandatory: true,
+      type: "custom",
+      key: "billMonthYear",
+      populators: {
+        name: "billMonthYear",
+        component: (props) => (
+          <Dropdown
+            option={monthYearOptions}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    });
+  } else if (lastBillReceived === "No") {
+    fields.push({
+      label: t("Reason *"),
+      isMandatory: true,
+      type: "text",
+      populators: {
+        name: "reason",
+        validation: { required: true },
+      },
+    });
+  }
+
+  fields.push(
+    {
+      label: t("Access to Meter"),
+      isMandatory: false,
+      type: "custom",
+      key: "accessToMeter",
+      populators: {
+        name: "accessToMeter",
+        component: (props) => (
+          <Dropdown
+            option={yesNo}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    },
+    {
+      label: t("Sewer Connection"),
+      isMandatory: true,
+      type: "custom",
+      key: "sewerConnection",
+      populators: {
+        name: "sewerConnection",
+        component: (props) => (
+          <Dropdown
+            option={yesNo}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    }
+  );
+
+  if (sewerConnection === "No") {
+    fields.push({
+      label: t("Septic Tank"),
+      isMandatory: true,
+      type: "custom",
+      key: "septicTank",
+      populators: {
+        name: "septicTank",
+        component: (props) => (
+          <Dropdown
+            option={yesNo}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    });
+  }
+
+  return [
+    {
+      head: t("EKYC_METER_DETAILS"),
+      body: fields,
+    },
+  ];
+};
+
+export default MeterDetailsConfig;

package/src/config/PropertyInfoConfig.js

@@ -0,0 +1,145 @@
+import React from "react";
+import { UploadFile, Dropdown } from "@djb25/digit-ui-react-components";
+
+const PropertyInfoConfig = (t, formData = {}, uploadFile, buildingImage, buildingImageId, setBuildingImage, setBuildingImageId) => {
+  const propertyType = formData?.propertyType?.name || formData?.propertyType;
+  const isHotel = propertyType === "Hotel";
+  const isHospitalOrNursing = propertyType === "Hospital" || propertyType === "Nursing Home";
+
+  const fields = [
+    {
+      label: t("PID Number"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "pidNumber",
+      },
+    },
+    {
+      label: t("Property Type"),
+      isMandatory: false,
+      type: "custom",
+      key: "propertyType",
+      populators: {
+        name: "propertyType",
+        component: (props) => (
+          <Dropdown
+            option={[
+              { name: "Residential" },
+              { name: "Commercial" },
+              { name: "Hotel" },
+              { name: "Hospital" },
+              { name: "Nursing Home" },
+            ]}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    },
+    {
+      label: t("Sub Property Category"),
+      isMandatory: false,
+      type: "custom",
+      key: "subPropertyCategory",
+      populators: {
+        name: "subPropertyCategory",
+        component: (props) => (
+          <Dropdown
+            option={[]}
+            optionKey="name"
+            selected={props.value}
+            select={props.onChange}
+          />
+        ),
+      },
+    },
+    {
+      label: t("No. of Floors"),
+      isMandatory: true,
+      type: "number",
+      populators: {
+        name: "noOfFloors",
+        validation: {
+          required: true,
+          min: 1,
+        },
+      },
+    },
+    {
+      label: t("Floor No. of this KNO"),
+      isMandatory: false,
+      type: "text",
+      populators: {
+        name: "floorNo",
+      },
+    },
+    {
+      label: isHospitalOrNursing ? t("No of Beds") : t("No of Beds"),
+      isMandatory: isHospitalOrNursing,
+      type: "number",
+      populators: {
+        name: "noOfBeds",
+        validation: isHospitalOrNursing ? { required: true, min: 1 } : {},
+      },
+    },
+    {
+      label: isHotel ? t("No. of Rooms") : t("No. of Rooms"),
+      isMandatory: isHotel,
+      type: "number",
+      populators: {
+        name: "noOfRooms",
+        validation: isHotel ? { required: true, min: 1 } : {},
+      },
+    },
+    {
+      label: t("Number of Dwelling Units"),
+      isMandatory: false,
+      type: "number",
+      populators: {
+        name: "dwellingUnits",
+      },
+    },
+    {
+      label: t("Building Image"),
+      isMandatory: true,
+      type: "custom",
+      key: "buildingImage",
+      populators: {
+        name: "buildingImage",
+        component: (props) => (
+          <div>
+            <UploadFile
+              onUpload={(e) => uploadFile(e, props.onChange)}
+              onDelete={() => {
+                props.onChange(null);
+                setBuildingImage(null);
+                setBuildingImageId(null);
+              }}
+              message={buildingImageId ? t("Uploaded") : t("No file selected")}
+            />
+            {buildingImage && (
+              <div style={{ marginTop: "10px" }}>
+                <img
+                  src={buildingImage}
+                  alt="preview"
+                  style={{ maxWidth: "100%", maxHeight: "200px", objectFit: "contain" }}
+                />
+              </div>
+            )}
+          </div>
+        ),
+      },
+    },
+  ];
+
+  return [
+    {
+      head: t("EKYC_PROPERTY_DETAILS"),
+      body: fields,
+    },
+  ];
+};
+
+export default PropertyInfoConfig;

package/src/config/config.js

@@ -23,6 +23,7 @@ export const ekycConfig = [
         component: "AddressDetails",
         key: "addressDetails",
         doorImage: true,
+        showMapActualLocation: false,
         texts: {
           header: "EKYC_ADDRESS_DETAILS",
           submitBarLabel: "COMMON_SAVE_NEXT",

package/src/hook/SupervisorInboxTableConfig.js

@@ -1,6 +1,6 @@
-import React from "react";
 import { useHistory } from "react-router-dom";
 import { useTranslation } from "react-i18next";
+import { tableColumnConfig } from "../../../vendor/src/config/tableConfig";
 
 const SupervisorInboxTableConfig = ({
   onPageSizeChange,
@@ -8,7 +8,6 @@ const SupervisorInboxTableConfig = ({
   totalCount,
   table,
   dispatch,
-  checkPathName,
   onSortingByData,
   inboxStyles = {},
   tableStyle = {},
@@ -25,52 +24,6 @@ const SupervisorInboxTableConfig = ({
   const limit = formState?.tableForm?.limit || 10;
   const offset = formState?.tableForm?.offset || 0;
 
-  const tableColumnConfig = [
-    {
-      Header: t("SURVEYOR_ID"),
-      accessor: "id",
-      Cell: ({ row }) => {
-        const id = row.original?.id;
-        return (
-          <span
-            className="ekyc-application-link"
-            style={{ color: "#add8f7", cursor: "pointer", fontWeight: "bold" }}
-            onClick={() => handleReview(id)}
-          >
-            {id || "NA"}
-          </span>
-        );
-      },
-    },
-
-    {
-      Header: t("SURVEYOR_NAME"),
-      accessor: "surveyorName",
-      Cell: ({ row }) => <span>{row.original?.surveyorName || row.original?.name || "NA"}</span>,
-    },
-
-    {
-      Header: t("MOBILE_NUMBER"),
-      accessor: "mobileNo",
-      Cell: ({ row }) => <span>{row.original?.mobileNo || row.original?.owner?.mobileNumber || "NA"}</span>,
-    },
-
-    {
-      Header: t("STATUS"),
-      accessor: "status",
-      Cell: ({ row }) => {
-        const status = row.original?.status || "DEFAULT";
-        return <span className={`ekyc-status-tag ${status}`}>{t(status)}</span>;
-      },
-    },
-
-    {
-      Header: t("SERVICE_TYPE"),
-      accessor: "serviceType",
-      Cell: ({ row }) => <span>{row.original?.serviceType || "NA"}</span>,
-    },
-  ];
-
   return {
     getCellProps: () => ({
       style: {
@@ -94,7 +47,6 @@ const SupervisorInboxTableConfig = ({
           ...formState.tableForm,
           offset: Number(offset) + Number(limit),
         },
-        checkPathName,
       }),
 
     onPrevPage: () =>
@@ -104,7 +56,6 @@ const SupervisorInboxTableConfig = ({
           ...formState.tableForm,
           offset: Number(offset) - Number(limit),
         },
-        checkPathName,
       }),
 
     onLastPage: () =>
@@ -114,21 +65,19 @@ const SupervisorInboxTableConfig = ({
           ...formState.tableForm,
           offset: Math.ceil(totalCount / limit) * limit - Number(limit),
         },
-        checkPathName,
       }),
 
     onFirstPage: () =>
       dispatch({
         action: "mutateTableForm",
         data: { ...formState.tableForm, offset: 0 },
-        checkPathName,
       }),
 
     totalRecords: totalCount,
     onSort: onSortingByData,
 
     data: table,
-    columns: tableColumnConfig,
+    columns: tableColumnConfig(t, handleReview),
 
     inboxStyles: { ...inboxStyles },
     tableStyle: { ...tableStyle },

package/src/hook/useInboxTableConfig.js

@@ -70,7 +70,7 @@ const useInboxTableConfig = ({
       Header: t("EKYC_EKYC_STATUS"),
       accessor: "ekycStatus",
       Cell: ({ row }) => {
-        const ekycStatus = row.original?.ekycstatus || "NA";
+        const ekycStatus = row.original?.ekycStatus || row.original?.ekycstatus || "NA";
         return <span className={`ekyc-status-tag ${ekycStatus}`}>{t(`${ekycStatus}`)}</span>;
       },
     },
@@ -106,17 +106,17 @@ const useInboxTableConfig = ({
     manualPagination: true,
     initSortId: "applicationDate",
     onPageSizeChange: onPageSizeChange,
-    currentPage: Math.floor(offset / limit),
+    currentPage: offset,
     onNextPage: () =>
       dispatch({
         action: "mutateTableForm",
-        data: { ...formState.tableForm, offset: parseInt(formState.tableForm?.offset) + parseInt(formState.tableForm?.limit) },
+        data: { ...formState.tableForm, offset: parseInt(formState.tableForm?.offset) + 10 },
         checkPathName,
       }),
     onPrevPage: () =>
       dispatch({
         action: "mutateTableForm",
-        data: { ...formState.tableForm, offset: parseInt(formState.tableForm?.offset) - parseInt(formState.tableForm?.limit) },
+        data: { ...formState.tableForm, offset: parseInt(formState.tableForm?.offset) - 10 },
         checkPathName,
       }),
     pageSizeLimit: limit,
@@ -127,7 +127,7 @@ const useInboxTableConfig = ({
     onLastPage: () =>
       dispatch({
         action: "mutateTableForm",
-        data: { ...formState.tableForm, offset: Math.ceil(totalCount / 10) * 10 - parseInt(formState.tableForm?.limit) },
+        data: { ...formState.tableForm, offset: Math.max(0, Math.ceil(totalCount / limit) - 10) },
         checkPathName,
       }),
     onFirstPage: () => dispatch({ action: "mutateTableForm", data: { ...formState.tableForm, offset: 0 }, checkPathName }),

package/src/pages/citizen/Inbox.js

@@ -32,7 +32,15 @@ const Inbox = ({ parentRoute }) => {
     };
   }, [tenantId, formState?.tableForm?.offset, formState?.tableForm?.limit, formState?.searchForm]);
 
-  const { isLoading, data: dashboardData = {} } = Digit.Hooks.ekyc.useEkycSurveyorDashboard({}, queryParams, {
+  const filters = useMemo(() => {
+    const searchForm = formState?.searchForm || {};
+    return {
+      ...searchForm,
+      ...(searchForm.kNumber && { kno: searchForm.kNumber }),
+    };
+  }, [formState?.searchForm]);
+
+  const { isLoading, data: dashboardData = {} } = Digit.Hooks.ekyc.useEkycApplicationList(filters, queryParams, {
     enabled: !!tenantId,
     keepPreviousData: true,
   });
@@ -64,7 +72,7 @@ const Inbox = ({ parentRoute }) => {
       return [searchData];
     }
 
-    return dashboardData?.dashboardInfo?.consumerList || [];
+    return dashboardData?.consumerList || [];
   }, [isSearchActive, searchData, dashboardData]);
 
   const filteredData = useMemo(() => {
@@ -80,6 +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",
           sla: 0,
         };
       }
@@ -93,6 +102,7 @@ const Inbox = ({ parentRoute }) => {
         applicationNumber: item.kno || item.applicationNumber || "",
         citizenName: item.consumerName || item.citizenName || "",
         status: item.status || "",
+        ekycStatus: item.ekycStatus || item.ekycstatus || "NA",
         sla: item.sla ?? 0,
       };
     });
@@ -102,7 +112,7 @@ const Inbox = ({ parentRoute }) => {
 
   const checkPathName = location.pathname.includes("ekyc/inbox");
   const PropsForInboxLinks = {
-    headerText: checkPathName ? "MODULE_WATER" : "MODULE_SW",
+    headerText: "EKYC_MODULE",
   };
 
   const SearchFormFields = useCallback(
@@ -126,13 +136,13 @@ const Inbox = ({ parentRoute }) => {
   };
 
   const searchFormDefaultValues = {
-    mobileNumber: "",
+    kNumber: "",
     applicationNumber: "",
     consumerNo: "",
   };
 
   const onSearchFormReset = (setSearchFormValue) => {
-    setSearchFormValue("mobileNumber", null);
+    setSearchFormValue("kNumber", null);
     setSearchFormValue("applicationNumber", null);
     setSearchFormValue("consumerNo", null);
     dispatch({ action: "mutateSearchForm", data: searchFormDefaultValues });
@@ -154,10 +164,10 @@ const Inbox = ({ parentRoute }) => {
 
   const propsForFilterForm = {
     FilterFormFields,
-    onFilterFormSubmit: () => {},
+    onFilterFormSubmit: () => { },
     filterFormDefaultValues: "",
     resetFilterFormDefaultValues: "",
-    onFilterFormReset: () => {},
+    onFilterFormReset: () => { },
   };
 
   function formReducer(state, payload) {
@@ -239,9 +249,9 @@ const Inbox = ({ parentRoute }) => {
       <InboxComposer
         {...{
           isInboxLoading,
-          PropsForInboxLinks,
+          // PropsForInboxLinks,
           ...propsForSearchForm,
-          ...propsForFilterForm,
+          // ...propsForFilterForm,
           // ...propsForMobileSortForm,
           propsForInboxTable,
           // propsForInboxMobileCards,