From ff2e00694814f0a5ac893af7cf353d6064a02a44 Mon Sep 17 00:00:00 2001 From: nabeelmd-eGov Date: Fri, 20 Sep 2024 10:53:54 +0530 Subject: [PATCH] Added CustomErrorComponent, RoleBasedEmployeeHome, css enhancement (#1407) * Added CustomErrorComponent, RoleBasedEmployeeHome, css enhancement * added new localisation module * upgrade ui component version --------- Co-authored-by: NabeelAyubee --- .../micro-ui-internals/example/package.json | 2 +- .../example/public/index.html | 2 +- micro-ui/web/micro-ui-internals/package.json | 2 +- .../micro-ui-internals/packages/css/README.md | 1 + .../packages/css/package.json | 2 +- .../css/src/pages/employee/sandbox.scss | 27 ++++- .../packages/libraries/src/hooks/index.js | 3 +- .../packages/libraries/src/hooks/store.js | 12 ++ .../packages/libraries/src/services/index.js | 4 +- .../src/services/molecules/Store/service.js | 106 +++++++++++++----- .../packages/modules/core/package.json | 2 +- .../packages/modules/core/src/App.js | 4 + .../src/components/CustomErrorComponent.js | 49 ++++++++ .../src/components/RoleBasedEmployeeHome.js | 38 +++++-- .../packages/modules/sandbox/package.json | 2 +- .../sandbox/src/configs/UICustomizations.js | 15 ++- .../applicationMgmt/ModuleMasterTable.js | 2 +- .../employee/applicationMgmt/SetupMaster.js | 4 +- .../config/moduleMasterConfig.js | 1 + .../packages/modules/utilities/package.json | 2 +- .../packages/modules/workbench/package.json | 2 +- micro-ui/web/public/index.html | 4 +- 22 files changed, 232 insertions(+), 54 deletions(-) create mode 100644 micro-ui/web/micro-ui-internals/packages/modules/core/src/components/CustomErrorComponent.js diff --git a/micro-ui/web/micro-ui-internals/example/package.json b/micro-ui/web/micro-ui-internals/example/package.json index 00cd69f136b..e35814362bf 100644 --- a/micro-ui/web/micro-ui-internals/example/package.json +++ b/micro-ui/web/micro-ui-internals/example/package.json @@ -19,7 +19,7 @@ "@egovernments/digit-ui-module-utilities": "1.0.1-beta.39", "@egovernments/digit-ui-module-open-payment":"0.0.1", "@egovernments/digit-ui-module-engagement": "1.5.20", - "@egovernments/digit-ui-components": "0.0.2-beta.31", + "@egovernments/digit-ui-components": "0.0.2-beta.41", "@egovernments/digit-ui-react-components": "1.8.2-beta.13", "@egovernments/digit-ui-module-sandbox": "0.0.1", "http-proxy-middleware": "^1.0.5", diff --git a/micro-ui/web/micro-ui-internals/example/public/index.html b/micro-ui/web/micro-ui-internals/example/public/index.html index 4222c39b8aa..7c120907b52 100644 --- a/micro-ui/web/micro-ui-internals/example/public/index.html +++ b/micro-ui/web/micro-ui-internals/example/public/index.html @@ -14,7 +14,7 @@ - + diff --git a/micro-ui/web/micro-ui-internals/package.json b/micro-ui/web/micro-ui-internals/package.json index b46933a7627..ec0fe6c0f3f 100644 --- a/micro-ui/web/micro-ui-internals/package.json +++ b/micro-ui/web/micro-ui-internals/package.json @@ -72,7 +72,7 @@ "dependencies": { "lodash": "4.17.21", "microbundle-crl": "0.13.11", - "@egovernments/digit-ui-components": "0.0.2-beta.31", + "@egovernments/digit-ui-components": "0.0.2-beta.41", "@egovernments/digit-ui-react-components": "1.8.2-beta.13", "react": "17.0.2", "react-dom": "17.0.2", diff --git a/micro-ui/web/micro-ui-internals/packages/css/README.md b/micro-ui/web/micro-ui-internals/packages/css/README.md index 1546d2750ec..853a46bddb5 100644 --- a/micro-ui/web/micro-ui-internals/packages/css/README.md +++ b/micro-ui/web/micro-ui-internals/packages/css/README.md @@ -41,6 +41,7 @@ frontend/micro-ui/web/public/index.html ``` ## Changelog +1.8.2-beta.24: added css for custom error component 1.8.2-beta.23: fixed css in pgr citizen complaint detail page ### Summary for Version [1.8.2-beta.1] - 2024-06-05 diff --git a/micro-ui/web/micro-ui-internals/packages/css/package.json b/micro-ui/web/micro-ui-internals/packages/css/package.json index c9017597f3e..f067161eb8f 100644 --- a/micro-ui/web/micro-ui-internals/packages/css/package.json +++ b/micro-ui/web/micro-ui-internals/packages/css/package.json @@ -1,6 +1,6 @@ { "name": "@egovernments/digit-ui-css", - "version": "1.8.2-beta.23", + "version": "1.8.2-beta.24", "license": "MIT", "main": "dist/index.css", "author": "Jagankumar ", diff --git a/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss b/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss index 9f16887b8aa..5b0c0722c49 100644 --- a/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss +++ b/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss @@ -343,12 +343,37 @@ } } .digit-popup-wrapper.setupMasterPopUp.alert { - .digit-popup-alert-content{ + .digit-popup-alert-content { .digit-popup-alert-heading { color: #00703c; } } } + +.digit-popup-wrapper.setupMasterPopUp.error.alert { + .digit-popup-alert-content { + .digit-popup-alert-heading { + color: #b91800; + } + } +} +.digit-employee-card.customError { + width: 35rem; +} +.customErrorButton { + margin: auto; +} +.digit-employee-card.digit-landing-page-card { + display: flex; + flex-direction: column; +} +.digit-card-header.center { + text-align: center; +} +digit-card-text.center { + text-align: center; +} + .pgr-citizen-wrapper{ .applications-list-container{ .card{ diff --git a/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js b/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js index 9be2ca6ca29..c08bcce4b36 100644 --- a/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js +++ b/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js @@ -4,7 +4,7 @@ import useUpdateEvent from "./events/useUpdateEvent"; import { useBulkPdfDetails, useDemandSearch, useFetchBillsForBuissnessService, useFetchCitizenBillsForBuissnessService, useFetchPayment, useGetPaymentRulesForBusinessServices, usePaymentSearch, usePaymentUpdate, useRecieptSearch } from "./payment"; -import { useInitStore } from "./store"; +import { useInitStore, useInitTenantConfig } from "./store"; import useAccessControl from "./useAccessControl"; import { useApplicationsForBusinessServiceSearch } from "./useApplicationForBillSearch"; import useClickOutside from "./useClickOutside"; @@ -167,6 +167,7 @@ const Hooks = { useGetPaymentRulesForBusinessServices, useWorkflowDetails, useInitStore, + useInitTenantConfig, useClickOutside, useUserSearch, useApplicationsForBusinessServiceSearch, diff --git a/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js b/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js index f9550c4d1df..a9d6dac33ed 100644 --- a/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js +++ b/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js @@ -17,3 +17,15 @@ export const useInitStore = (stateCode, enabledModules,modulePrefix = "rainmaker ); return { isLoading, error, isError, data }; }; + +export const useInitTenantConfig = (stateCode, enabledModules) => { + const { isLoading, error, isError, data } = useQuery( + ["initTenantConfig", stateCode, enabledModules], + () => StoreService.getTenantConfig(stateCode, enabledModules), + { + staleTime: Infinity, + enabled: Digit.Utils.getMultiRootTenant() + } + ); + return { isLoading, error, isError, data }; +}; diff --git a/micro-ui/web/micro-ui-internals/packages/libraries/src/services/index.js b/micro-ui/web/micro-ui-internals/packages/libraries/src/services/index.js index d74d967a9de..1908c8d71cd 100644 --- a/micro-ui/web/micro-ui-internals/packages/libraries/src/services/index.js +++ b/micro-ui/web/micro-ui-internals/packages/libraries/src/services/index.js @@ -1,3 +1,3 @@ -import { useStore, useInitStore } from "../hooks/store"; +import { useStore, useInitStore, useInitTenantConfig } from "../hooks/store"; -export { useStore, useInitStore }; +export { useStore, useInitStore, useInitTenantConfig }; diff --git a/micro-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js b/micro-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js index 2e8434a8048..f5babe6498a 100644 --- a/micro-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js +++ b/micro-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js @@ -55,6 +55,39 @@ export const StoreService = { }); return await Promise.all(allBoundries); }, + getTenantConfig: async (stateCode, enabledModules) => { + const tenantConfigs = await TenantConfigSearch.tenant(stateCode); + const tenantConfigSearch = tenantConfigs?.tenantConfigs?.length > 0 ? tenantConfigs?.tenantConfigs : null; + if (!tenantConfigSearch) { + localStorage.clear(); + sessionStorage.clear(); + window.location.href = `/${window?.globalPath}/user/invalid-url`; + return; + // throw new Error("Invalid URL") + // return; + } + const { MdmsRes } = await MdmsService.init(stateCode); + const stateInfo = MdmsRes["common-masters"]?.StateInfo?.[0] || {}; + const uiHomePage = MdmsRes["common-masters"]?.uiHomePage?.[0] || {}; + return { + languages: stateInfo.hasLocalisation ? stateInfo.languages : [{ label: "ENGLISH", value: Digit.Utils.getDefaultLanguage() }], + stateInfo: { + code: tenantConfigSearch?.[0]?.code, + name: tenantConfigSearch?.[0]?.name, + logoUrl: tenantConfigSearch?.[0]?.documents?.find((item) => item.type === "logoUrl")?.url, + statelogo: tenantConfigSearch?.[0]?.documents?.find((item) => item.type === "statelogo")?.url, + logoUrlWhite: tenantConfigSearch?.[0]?.documents?.find((item) => item.type === "logoUrlWhite")?.url, + bannerUrl: tenantConfigSearch?.[0]?.documents?.find((item) => item.type === "bannerUrl")?.url, + }, + localizationModules: stateInfo.localizationModules, + modules: + MdmsRes?.tenant?.citymodule + ?.filter((module) => module?.active) + ?.filter((module) => enabledModules?.includes(module?.code)) + ?.sort((x, y) => x?.order - y?.order) || [], + uiHomePage: uiHomePage, + }; + }, digitInitData: async (stateCode, enabledModules, modulePrefix) => { const { MdmsRes } = await MdmsService.init(stateCode); const stateInfo = MdmsRes["common-masters"]?.StateInfo?.[0] || {}; @@ -62,6 +95,9 @@ export const StoreService = { const tenantConfigFetch = Digit.Utils.getMultiRootTenant(); const localities = {}; const revenue_localities = {}; + if (tenantConfigFetch) { + const tenantConfig = await StoreService.getTenantConfig(stateCode, enabledModules); // Await the async call + } const fetchTenantConfig = async () => { const tenantConfigs = await TenantConfigSearch.tenant(stateCode); const tenantConfigSearch = tenantConfigs?.tenantConfigs ? tenantConfigs?.tenantConfigs : null; @@ -78,24 +114,34 @@ export const StoreService = { bannerUrl: tenantConfigFetch ? tenantConfigSearch?.[0]?.documents?.find((item) => item.type === "bannerUrl")?.url : stateInfo.bannerUrl, }, localizationModules: stateInfo.localizationModules, - modules: MdmsRes?.tenant?.citymodule?.filter((module) => module?.active)?.filter((module) => enabledModules?.includes(module?.code))?.sort((x,y)=>x?.order-y?.order)|| [], - uiHomePage: uiHomePage + modules: + MdmsRes?.tenant?.citymodule + ?.filter((module) => module?.active) + ?.filter((module) => enabledModules?.includes(module?.code)) + ?.sort((x, y) => x?.order - y?.order) || [], + uiHomePage: uiHomePage, }; }; - const initData = tenantConfigFetch ? await fetchTenantConfig() : { - languages: stateInfo.hasLocalisation ? stateInfo.languages : [{ label: "ENGLISH", value: Digit.Utils.getDefaultLanguage() }], - stateInfo: { - code: stateInfo.code, - name: stateInfo.name, - logoUrl: stateInfo.logoUrl, - statelogo: stateInfo.statelogo, - logoUrlWhite: stateInfo.logoUrlWhite, - bannerUrl: stateInfo.bannerUrl, - }, - localizationModules: stateInfo.localizationModules, - modules: MdmsRes?.tenant?.citymodule?.filter((module) => module?.active)?.filter((module) => enabledModules?.includes(module?.code))?.sort((x,y)=>x?.order-y?.order)|| [], - uiHomePage: uiHomePage - }; + const initData = tenantConfigFetch + ? await fetchTenantConfig() + : { + languages: stateInfo.hasLocalisation ? stateInfo.languages : [{ label: "ENGLISH", value: Digit.Utils.getDefaultLanguage() }], + stateInfo: { + code: stateInfo.code, + name: stateInfo.name, + logoUrl: stateInfo.logoUrl, + statelogo: stateInfo.statelogo, + logoUrlWhite: stateInfo.logoUrlWhite, + bannerUrl: stateInfo.bannerUrl, + }, + localizationModules: stateInfo.localizationModules, + modules: + MdmsRes?.tenant?.citymodule + ?.filter((module) => module?.active) + ?.filter((module) => enabledModules?.includes(module?.code)) + ?.sort((x, y) => x?.order - y?.order) || [], + uiHomePage: uiHomePage, + }; initData.selectedLanguage = Digit.SessionStorage.get("locale") || initData.languages[0].value; ApiCacheService.saveSetting(MdmsRes["DIGIT-UI"]?.ApiCachingSettings); @@ -104,17 +150,15 @@ export const StoreService = { .map((module) => module.tenants) .flat() .reduce((unique, ele) => (unique.find((item) => item.code === ele.code) ? unique : [...unique, ele]), []); - initData.tenants = MdmsRes?.tenant?.tenants - .map((tenant) => ({ i18nKey: `TENANT_TENANTS_${tenant.code.replace(".", "_").toUpperCase()}`, ...tenant })); - // .filter((item) => !!moduleTenants.find((mt) => mt.code === item.code)) - // .map((tenant) => ({ i18nKey: `TENANT_TENANTS_${tenant.code.replace(".", "_").toUpperCase()}`, ...tenant })); + initData.tenants = MdmsRes?.tenant?.tenants.map((tenant) => ({ + i18nKey: `TENANT_TENANTS_${tenant.code.replace(".", "_").toUpperCase()}`, + ...tenant, + })); + // .filter((item) => !!moduleTenants.find((mt) => mt.code === item.code)) + // .map((tenant) => ({ i18nKey: `TENANT_TENANTS_${tenant.code.replace(".", "_").toUpperCase()}`, ...tenant })); await LocalizationService.getLocale({ - modules: [ - `${modulePrefix}-common`, - `digit-ui`, - `${modulePrefix}-${stateCode.toLowerCase()}` - ], + modules: [`${modulePrefix}-common`, `digit-ui`, `digit-tenants`, `${modulePrefix}-${stateCode.toLowerCase()}`], locale: initData.selectedLanguage, tenantId: stateCode, }); @@ -128,9 +172,17 @@ export const StoreService = { }, defaultData: async (stateCode, moduleCode, language, modulePrefix) => { let moduleCodes = []; - if(typeof moduleCode !== "string") moduleCode.forEach(code => { moduleCodes.push(modulePrefix ? `${modulePrefix}-${code.toLowerCase()}` : `${code.toLowerCase()}`) }); + if (typeof moduleCode !== "string") + moduleCode.forEach((code) => { + moduleCodes.push(modulePrefix ? `${modulePrefix}-${code.toLowerCase()}` : `${code.toLowerCase()}`); + }); const LocalePromise = LocalizationService.getLocale({ - modules: typeof moduleCode == "string" ? modulePrefix ? [`${modulePrefix}-${moduleCode.toLowerCase()}`] : [`${moduleCode.toLowerCase()}`] : moduleCodes, + modules: + typeof moduleCode == "string" + ? modulePrefix + ? [`${modulePrefix}-${moduleCode.toLowerCase()}`] + : [`${moduleCode.toLowerCase()}`] + : moduleCodes, locale: language, tenantId: stateCode, }); diff --git a/micro-ui/web/micro-ui-internals/packages/modules/core/package.json b/micro-ui/web/micro-ui-internals/packages/modules/core/package.json index 8951d95c4c4..08edd2eb5e4 100644 --- a/micro-ui/web/micro-ui-internals/packages/modules/core/package.json +++ b/micro-ui/web/micro-ui-internals/packages/modules/core/package.json @@ -14,7 +14,7 @@ "prepublish": "yarn build" }, "dependencies": { - "@egovernments/digit-ui-components": "0.0.2-beta.31", + "@egovernments/digit-ui-components": "0.0.2-beta.41", "@egovernments/digit-ui-react-components": "1.8.2-beta.13", "react": "17.0.2", "react-dom": "17.0.2", diff --git a/micro-ui/web/micro-ui-internals/packages/modules/core/src/App.js b/micro-ui/web/micro-ui-internals/packages/modules/core/src/App.js index c90398a454e..b155f7d9080 100644 --- a/micro-ui/web/micro-ui-internals/packages/modules/core/src/App.js +++ b/micro-ui/web/micro-ui-internals/packages/modules/core/src/App.js @@ -5,6 +5,7 @@ import EmployeeApp from "./pages/employee"; import SignUp from "./pages/employee/SignUp"; import Otp from "./pages/employee/Otp"; import ViewUrl from "./pages/employee/ViewUrl"; +import CustomErrorComponent from "./components/CustomErrorComponent"; export const DigitApp = ({ stateCode, modules, appTenants, logoUrl, initData, defaultLanding = "citizen" }) => { const history = useHistory(); @@ -98,6 +99,9 @@ export const DigitAppWrapper = ({ stateCode, modules, appTenants, logoUrl, initD } > + + + diff --git a/micro-ui/web/micro-ui-internals/packages/modules/core/src/components/CustomErrorComponent.js b/micro-ui/web/micro-ui-internals/packages/modules/core/src/components/CustomErrorComponent.js new file mode 100644 index 00000000000..b1eb124ddd7 --- /dev/null +++ b/micro-ui/web/micro-ui-internals/packages/modules/core/src/components/CustomErrorComponent.js @@ -0,0 +1,49 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; +import { useLocation, useHistory } from "react-router-dom"; +import Background from "./Background"; +import { Button, Card, CardHeader, CardText } from "@egovernments/digit-ui-components"; +import Header from "./Header"; + +const CustomErrorComponent = (props) => { + const { state = {} } = useLocation(); + // const module = state?.module; + const { t } = useTranslation(); + const stateInfo = props.stateInfo; + + const history = useHistory(); + const ModuleBasedErrorConfig = { + sandbox: { + imgUrl: `https://s3.ap-south-1.amazonaws.com/egov-qa-assets/error-image.png`, + infoHeader: "WRONG_TENANT_SIGN_UP", + infoMessage: "WRONG_TENANT_SIGN_UP_MESSAGE", + buttonInfo: "WRONG_TENANT_SIGN_UP_BUTTON", + action: () => { + history.push(`/${window.globalPath}/`); + }, + }, + }; + const config = ModuleBasedErrorConfig["sandbox"]; + + return ( + + +
+ {t(config.infoHeader)} + {t(config.infoMessage)} +