diff --git a/react/modules/sample/package.json b/react/modules/sample/package.json
index 6a8e80ac027..9fff2399845 100644
--- a/react/modules/sample/package.json
+++ b/react/modules/sample/package.json
@@ -18,7 +18,7 @@
"react-router-dom": "5.3.0"
},
"dependencies": {
- "@egovernments/digit-ui-react-components": "1.5.24",
+ "@egovernments/digit-ui-react-components": "1.8.1-beta.4",
"@egovernments/digit-ui-components-core": "0.0.1",
"react": "17.0.2",
"react-date-range": "^1.4.0",
diff --git a/react/modules/sample/src/components/SampleCard.js b/react/modules/sample/src/components/SampleCard.js
index 26df5ac0c92..0bfc9c73d91 100644
--- a/react/modules/sample/src/components/SampleCard.js
+++ b/react/modules/sample/src/components/SampleCard.js
@@ -1,4 +1,5 @@
-import {EmployeeModuleCard, ProjectIcon} from "@egovernments/digit-ui-react-components";
+import {EmployeeModuleCard} from "@egovernments/digit-ui-react-components";
+import {ProjectIcon} from "@egovernments/digit-ui-components-core";
import React from "react";
import { useTranslation } from "react-i18next";
diff --git a/react/modules/sample/src/pages/employee/index.js b/react/modules/sample/src/pages/employee/index.js
index afa75468b8b..6f15a51c94e 100644
--- a/react/modules/sample/src/pages/employee/index.js
+++ b/react/modules/sample/src/pages/employee/index.js
@@ -1,5 +1,4 @@
-import { AppContainer,PrivateRoute } from "@egovernments/digit-ui-components-core";
-import {BreadCrumb} from "@egovernments/digit-ui-react-components";
+import { AppContainer,PrivateRoute,BreadCrumb } from "@egovernments/digit-ui-components-core";
import React from "react";
import { useTranslation } from "react-i18next";
import { Route, Switch } from "react-router-dom";
diff --git a/react/modules/templates/ApplicationDetails/Modal/AttendanceActionModal.js b/react/modules/templates/ApplicationDetails/Modal/AttendanceActionModal.js
index a2c50215207..648e493e71d 100644
--- a/react/modules/templates/ApplicationDetails/Modal/AttendanceActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/AttendanceActionModal.js
@@ -1,6 +1,7 @@
import React, { useState, useEffect } from "react";
import _ from "lodash";
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import { configAttendanceApproveModal, configAttendanceRejectModal, configAttendanceCheckModal } from "../config";
diff --git a/react/modules/templates/ApplicationDetails/Modal/BPAActionModal.js b/react/modules/templates/ApplicationDetails/Modal/BPAActionModal.js
index 269bbefa1dd..f8e0a2f1650 100644
--- a/react/modules/templates/ApplicationDetails/Modal/BPAActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/BPAActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { useQueryClient } from "react-query";
import { configBPAApproverApplication } from "../config";
diff --git a/react/modules/templates/ApplicationDetails/Modal/BPAREGActionModal.js b/react/modules/templates/ApplicationDetails/Modal/BPAREGActionModal.js
index dc0bfe07776..1aff89866cc 100644
--- a/react/modules/templates/ApplicationDetails/Modal/BPAREGActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/BPAREGActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { configBPAREGApproverApplication } from "../config";
import * as predefinedConfig from "../config";
diff --git a/react/modules/templates/ApplicationDetails/Modal/ExpenditureActionModal.js b/react/modules/templates/ApplicationDetails/Modal/ExpenditureActionModal.js
index 95393b5ae05..55d87618803 100644
--- a/react/modules/templates/ApplicationDetails/Modal/ExpenditureActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/ExpenditureActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer, WorkflowModal } from "@egovernments/digit-ui-react-components";
+import { FormComposer, WorkflowModal } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect, Fragment } from "react";
import { configViewBillApproveModal, configViewBillRejectModal, configViewBillCheckModal } from "../config";
import _ from "lodash";
diff --git a/react/modules/templates/ApplicationDetails/Modal/FSMActionModal.js b/react/modules/templates/ApplicationDetails/Modal/FSMActionModal.js
index af0e0e8e701..990793939b3 100644
--- a/react/modules/templates/ApplicationDetails/Modal/FSMActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/FSMActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer, Toast } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { useQueryClient } from "react-query";
diff --git a/react/modules/templates/ApplicationDetails/Modal/NOCActionModal.js b/react/modules/templates/ApplicationDetails/Modal/NOCActionModal.js
index 09266ca1b7b..732312fc0d6 100644
--- a/react/modules/templates/ApplicationDetails/Modal/NOCActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/NOCActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { useQueryClient } from "react-query";
import { useHistory } from "react-router-dom";
diff --git a/react/modules/templates/ApplicationDetails/Modal/PTActionModal.js b/react/modules/templates/ApplicationDetails/Modal/PTActionModal.js
index 37b3d996177..7139ed95265 100644
--- a/react/modules/templates/ApplicationDetails/Modal/PTActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/PTActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import {FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { configPTApproverApplication, configPTAssessProperty } from "../config";
diff --git a/react/modules/templates/ApplicationDetails/Modal/TLActionModal.js b/react/modules/templates/ApplicationDetails/Modal/TLActionModal.js
index f11658a987a..fe021a3ee54 100644
--- a/react/modules/templates/ApplicationDetails/Modal/TLActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/TLActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { configTLApproverApplication } from "../config";
diff --git a/react/modules/templates/ApplicationDetails/Modal/WNSActionModal.js b/react/modules/templates/ApplicationDetails/Modal/WNSActionModal.js
index eb64a09804b..f67edd5dced 100644
--- a/react/modules/templates/ApplicationDetails/Modal/WNSActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/WNSActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { configWSApproverApplication, configWSDisConnectApplication } from "../config";
import * as predefinedConfig from "../config";
diff --git a/react/modules/templates/ApplicationDetails/Modal/WorksActionModal.js b/react/modules/templates/ApplicationDetails/Modal/WorksActionModal.js
index dd19cf33a1e..7ed288d056d 100644
--- a/react/modules/templates/ApplicationDetails/Modal/WorksActionModal.js
+++ b/react/modules/templates/ApplicationDetails/Modal/WorksActionModal.js
@@ -1,4 +1,5 @@
-import { Loader, Modal, FormComposer } from "@egovernments/digit-ui-react-components";
+import { FormComposer } from "@egovernments/digit-ui-react-components";
+import { Loader, Modal } from "@egovernments/digit-ui-components-core";
import React, { useState, useEffect } from "react";
import { configApproveModal, configRejectModal, configCheckModal } from "../config";
diff --git a/react/modules/templates/ApplicationDetails/components/ApplicationDetailsActionBar.js b/react/modules/templates/ApplicationDetails/components/ApplicationDetailsActionBar.js
index 7ad3a0f95ce..9a61b969220 100644
--- a/react/modules/templates/ApplicationDetails/components/ApplicationDetailsActionBar.js
+++ b/react/modules/templates/ApplicationDetails/components/ApplicationDetailsActionBar.js
@@ -1,6 +1,7 @@
import React, {useEffect, useRef} from "react";
import { useTranslation } from "react-i18next";
-import { SubmitBar, ActionBar, Menu } from "@egovernments/digit-ui-react-components";
+import { Menu } from "@egovernments/digit-ui-react-components";
+import { SubmitBar, ActionBar } from "@egovernments/digit-ui-components-core";
function ApplicationDetailsActionBar({ workflowDetails, displayMenu, onActionSelect, setDisplayMenu, businessService, forcedActionPrefix,ActionBarStyle={},MenuStyle={}, saveAttendanceState }) {
const { t } = useTranslation();
diff --git a/react/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js b/react/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js
index 889fb530907..4dceb3c726b 100644
--- a/react/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js
+++ b/react/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js
@@ -1,17 +1,16 @@
import {
BreakLine,
- Card,
CardSectionHeader,
CardSubHeader,
CheckPoint,
CollapseAndExpandGroups,
ConnectingCheckPoints,
ViewImages,
- Loader,
Row,
StatusTable,
Table,
} from "@egovernments/digit-ui-react-components";
+import { Card, Loader } from "@egovernments/digit-ui-components-core";
import { values } from "lodash";
import React, { Fragment, useCallback, useReducer, useState } from "react";
import { useTranslation } from "react-i18next";
@@ -37,8 +36,6 @@ import InfoDetails from "./InfoDetails";
import ViewBreakup from "./ViewBreakup";
import SubWorkTableDetails from "./SubWorkTableDetails";
-
-
function ApplicationDetailsContent({
applicationDetails,
workflowDetails,
@@ -54,11 +51,10 @@ function ApplicationDetailsContent({
noBoxShadow = false,
sectionHeadStyle = false,
modify,
- setSaveAttendanceState
+ setSaveAttendanceState,
}) {
const { t } = useTranslation();
const [localSearchParams, setLocalSearchParams] = useState(() => ({}));
-
const handleDateRangeChange = useCallback((data) => {
setLocalSearchParams(() => ({ ...data }));
@@ -81,20 +77,33 @@ function ApplicationDetailsContent({
return `${day}/${month}/${year}`;
};
const getTimelineCaptions = (checkpoint) => {
- if (checkpoint.state === "OPEN" || (checkpoint.status === "INITIATED" && !window.location.href.includes("/obps/"))) {
+ if (
+ checkpoint.state === "OPEN" ||
+ (checkpoint.status === "INITIATED" &&
+ !window.location.href.includes("/obps/"))
+ ) {
const caption = {
date: convertEpochToDateDMY(applicationData?.auditDetails?.createdTime),
source: applicationData?.channel || "",
};
return
;
- } else if (window.location.href.includes("/obps/") || window.location.href.includes("/noc/") || window.location.href.includes("/ws/")) {
+ } else if (
+ window.location.href.includes("/obps/") ||
+ window.location.href.includes("/noc/") ||
+ window.location.href.includes("/ws/")
+ ) {
//From BE side assigneeMobileNumber is masked/unmasked with connectionHoldersMobileNumber and not assigneeMobileNumber
- const privacy = { uuid: checkpoint?.assignes?.[0]?.uuid, fieldName: ["connectionHoldersMobileNumber"], model: "WaterConnectionOwner" };
+ const privacy = {
+ uuid: checkpoint?.assignes?.[0]?.uuid,
+ fieldName: ["connectionHoldersMobileNumber"],
+ model: "WaterConnectionOwner",
+ };
const caption = {
date: checkpoint?.auditDetails?.lastModified,
name: checkpoint?.assignes?.[0]?.name,
mobileNumber:
- applicationData?.processInstance?.assignes?.[0]?.uuid === checkpoint?.assignes?.[0]?.uuid &&
+ applicationData?.processInstance?.assignes?.[0]?.uuid ===
+ checkpoint?.assignes?.[0]?.uuid &&
applicationData?.processInstance?.assignes?.[0]?.mobileNumber
? applicationData?.processInstance?.assignes?.[0]?.mobileNumber
: checkpoint?.assignes?.[0]?.mobileNumber,
@@ -102,12 +111,18 @@ function ApplicationDetailsContent({
wfComment: checkpoint.wfComment,
thumbnailsToShow: checkpoint?.thumbnailsToShow,
};
- return
;
+ return (
+
+ );
} else {
const caption = {
- date: `${Digit.DateUtils?.ConvertTimestampToDate(checkpoint.auditDetails.lastModifiedEpoch)} ${Digit.DateUtils?.ConvertEpochToTimeInHours(
+ date: `${Digit.DateUtils?.ConvertTimestampToDate(
checkpoint.auditDetails.lastModifiedEpoch
- )} ${Digit.DateUtils?.getDayfromTimeStamp(checkpoint.auditDetails.lastModifiedEpoch)}`,
+ )} ${Digit.DateUtils?.ConvertEpochToTimeInHours(
+ checkpoint.auditDetails.lastModifiedEpoch
+ )} ${Digit.DateUtils?.getDayfromTimeStamp(
+ checkpoint.auditDetails.lastModifiedEpoch
+ )}`,
// name: checkpoint?.assigner?.name,
name: checkpoint?.assignes?.[0]?.name,
// mobileNumber: checkpoint?.assigner?.mobileNumber,
@@ -128,56 +143,69 @@ function ApplicationDetailsContent({
};
const checkLocation =
- window.location.href.includes("employee/tl") || window.location.href.includes("employee/obps") || window.location.href.includes("employee/noc");
+ window.location.href.includes("employee/tl") ||
+ window.location.href.includes("employee/obps") ||
+ window.location.href.includes("employee/noc");
const isNocLocation = window.location.href.includes("employee/noc");
const isBPALocation = window.location.href.includes("employee/obps");
- let isWS = window.location.href.includes("employee/ws") || window.location.href.includes("employee/works")|| window.location.href.includes("employee/project") || window.location.href.includes("employee/estimate") ;
-
-
+ let isWS =
+ window.location.href.includes("employee/ws") ||
+ window.location.href.includes("employee/works") ||
+ window.location.href.includes("employee/project") ||
+ window.location.href.includes("employee/estimate");
- const getRowStyles = (tab="") => {
-
- if (window.location.href.includes("employee/obps") || window.location.href.includes("employee/noc")) {
- return { justifyContent: "space-between", fontSize: "16px", lineHeight: "19px", color: "#0B0C0C" };
+ const getRowStyles = (tab = "") => {
+ if (
+ window.location.href.includes("employee/obps") ||
+ window.location.href.includes("employee/noc")
+ ) {
+ return {
+ justifyContent: "space-between",
+ fontSize: "16px",
+ lineHeight: "19px",
+ color: "#0B0C0C",
+ };
} else if (checkLocation) {
- return { justifyContent: "space-between", fontSize: "16px", lineHeight: "19px", color: "#0B0C0C" };
- }
- else if ( tab==="fieldSurvey") {
- return {
- justifyContent: "space-between", flexDirection:"column"
- }
- }
- else {
+ return {
+ justifyContent: "space-between",
+ fontSize: "16px",
+ lineHeight: "19px",
+ color: "#0B0C0C",
+ };
+ } else if (tab === "fieldSurvey") {
+ return {
+ justifyContent: "space-between",
+ flexDirection: "column",
+ };
+ } else {
return {};
}
-
};
- const getTextStyles = (tab="") => {
- if ( tab==="fieldSurvey" ) {
+ const getTextStyles = (tab = "") => {
+ if (tab === "fieldSurvey") {
return {
- marginTop:"1rem",
- marginBottom:"1rem"
- }
- }
- else {
+ marginTop: "1rem",
+ marginBottom: "1rem",
+ };
+ } else {
return {};
}
-
};
const getLabelStyles = (tab = "") => {
- if ( tab === "fieldSurvey") {
+ if (tab === "fieldSurvey") {
return {
- width:"100%"
- }
- }
- else {
+ width: "100%",
+ };
+ } else {
return {};
}
-
};
const getTableStyles = () => {
- if (window.location.href.includes("employee/obps") || window.location.href.includes("employee/noc")) {
+ if (
+ window.location.href.includes("employee/obps") ||
+ window.location.href.includes("employee/noc")
+ ) {
return { position: "relative", marginTop: "19px" };
} else if (checkLocation) {
return { position: "relative", marginTop: "19px" };
@@ -204,14 +232,32 @@ function ApplicationDetailsContent({
const getTextValue = (value) => {
if (value?.skip) return value.value;
- else if (value?.isUnit) return value?.value ? `${getTranslatedValues(value?.value, value?.isNotTranslated)} ${t(value?.isUnit)}` : t("N/A");
- else if (value?.value === "Approved") return
{ `${getTranslatedValues(value?.value, value?.isNotTranslated)}`}
- else if (value?.value === "Rejected") return
{t(value?.value)}
- else return value?.value ? getTranslatedValues(value?.value, value?.isNotTranslated) : t("N/A");
+ else if (value?.isUnit)
+ return value?.value
+ ? `${getTranslatedValues(value?.value, value?.isNotTranslated)} ${t(
+ value?.isUnit
+ )}`
+ : t("N/A");
+ else if (value?.value === "Approved")
+ return (
+
{`${getTranslatedValues(
+ value?.value,
+ value?.isNotTranslated
+ )}`}
+ );
+ else if (value?.value === "Rejected")
+ return
{t(value?.value)} ;
+ else
+ return value?.value
+ ? getTranslatedValues(value?.value, value?.isNotTranslated)
+ : t("N/A");
};
const getClickInfoDetails = () => {
- if (window.location.href.includes("disconnection") || window.location.href.includes("application")) {
+ if (
+ window.location.href.includes("disconnection") ||
+ window.location.href.includes("application")
+ ) {
return "WS_DISCONNECTION_CLICK_ON_INFO_LABEL";
} else {
return "WS_CLICK_ON_INFO_LABEL";
@@ -219,7 +265,10 @@ function ApplicationDetailsContent({
};
const getClickInfoDetails1 = () => {
- if (window.location.href.includes("disconnection") || window.location.href.includes("application")) {
+ if (
+ window.location.href.includes("disconnection") ||
+ window.location.href.includes("application")
+ ) {
return "WS_DISCONNECTION_CLICK_ON_INFO1_LABEL";
} else {
return "";
@@ -227,47 +276,68 @@ function ApplicationDetailsContent({
};
const getCardStyles = () => {
- let styles = { position: "relative" }
+ let styles = { position: "relative" };
if (noBoxShadow) styles = { ...styles, boxShadow: "none" };
return styles;
};
return (
-
-
- {isInfoLabel ? (
-
- ) : null}
- {applicationDetails?.applicationDetails?.map((detail, index) => (
-
-
-
- {index === 0 && !detail?.asSectionHeader ? (
-
{t(detail?.title)}
- ) : (
-
-
- {isNocLocation ? `${t(detail?.title)}` : t(detail?.title)}
- {detail?.Component ? : null}
-
-
- )}
- {/* TODO, Later will move to classes */}
- {/* Here Render the table for adjustment amount details detail.isTable is true for that table*/}
- {/* {detail?.isTable && (
+
+
+ {isInfoLabel ? (
+
+ ) : null}
+ {applicationDetails?.applicationDetails?.map((detail, index) => (
+
+
+
+ {index === 0 && !detail?.asSectionHeader ? (
+
+ {t(detail?.title)}
+
+ ) : (
+
+
+ {isNocLocation ? `${t(detail?.title)}` : t(detail?.title)}
+ {detail?.Component ? : null}
+
+
+ )}
+ {/* TODO, Later will move to classes */}
+ {/* Here Render the table for adjustment amount details detail.isTable is true for that table*/}
+ {/* {detail?.isTable && (
{detail?.headers.map((header) => (
@@ -289,90 +359,135 @@ function ApplicationDetailsContent({
})}
)} */}
- {detail?.isTable &&
}
+ {detail?.isTable &&
}
-
- {detail?.title &&
- !detail?.title.includes("NOC") &&
- detail?.values?.map((value, index) => {
- if (value.map === true && value.value !== "N/A") {
- return
} />;
- }
- if (value?.isLink == true) {
- return (
-
-
-
- {t(value?.title)}
-
-
-
- ) : isNocLocation || isBPALocation ? (
- `${t(value.title)}`
- ) : (
- t(value.title)
- )
- }
- text={
-
-
-
- {value?.value}
-
-
-
- }
- last={index === detail?.values?.length - 1}
- caption={value.caption}
- className="border-none"
- rowContainerStyle={getRowStyles()}
- />
- );
- }
- return (
- { }} />: getTextValue(value)}
- last={index === detail?.values?.length - 1}
- caption={value.caption}
- className="border-none"
- /* privacy object set to the Row Component */
- privacy={value?.privacy}
- // TODO, Later will move to classes
- rowContainerStyle={getRowStyles(detail?.tab)}
- textStyle={getTextStyles(detail?.tab)}
- labelStyle={getLabelStyles(detail?.tab)}
- />
- );
- })}
-
-
-
-
- {detail?.additionalDetails?.table
- ? detail?.additionalDetails?.table?.weekTable?.tableHeader && (
- <>
-
- {t(detail?.additionalDetails?.table?.weekTable?.tableHeader)}
-
- >
- )
- : null}
-
- {detail?.additionalDetails?.inspectionReport && (
-
- )}
- {applicationDetails?.applicationData?.additionalDetails?.fieldinspection_pending?.length > 0 && detail?.additionalDetails?.fiReport && (
-
- )}
- {/* {detail?.additionalDetails?.FIdocuments && detail?.additionalDetails?.values?.map((doc,index) => (
+
+ {detail?.title &&
+ !detail?.title.includes("NOC") &&
+ detail?.values?.map((value, index) => {
+ if (value.map === true && value.value !== "N/A") {
+ return (
+
+ }
+ />
+ );
+ }
+ if (value?.isLink == true) {
+ return (
+
+
+
+ {t(value?.title)}
+
+
+
+ ) : isNocLocation || isBPALocation ? (
+ `${t(value.title)}`
+ ) : (
+ t(value.title)
+ )
+ }
+ text={
+
+ }
+ last={index === detail?.values?.length - 1}
+ caption={value.caption}
+ className="border-none"
+ rowContainerStyle={getRowStyles()}
+ />
+ );
+ }
+ return (
+