Sanitation worker skills update + sidebar overlap fixes (core version…

… upgrade) (#458) * patch initial commit * Showing removable breadcrumbs in InboxSearchComposer * configs change * Synced Session for mobile and desktop screens and added logic to clear session * Added session clear logic * Updated api calling logic from state instead of config * Mobile responsiveness for TQM Inbox/search screens * Updated css version * Tqm pagination fix + FSM inbox backward compatibility changes (#445) * pagination fixes * Update UICustomizations.js * backward compatible changes for fsm inbox * Validation coming on 2nd search fix * Update UploadFileComposer.js * Pagination coming in decimal * Adhoc fixes * Updated css version * Create Adhoc Test session integration * Session Integration for Update Test * Update CreateAddTestResult.js * Changes column to last updated time * Label changes * Update ConfigUlbAdmin.js * workflow statuses to be shown as crumbs fixes * Update TestStandard.js * core version update * SM-3717: add css for core ui fixes * SM-3717: add css for core ui fixes * SM-3717: css upgrade * css update * SM-3717: fixing multiselect * SM-3826 SW Skills issue fix/DPG-2150: Sidebar issue fix * SM-3826 SW Skills issue fix/DPG-2150: Sidebar issue fix * SM-3826 SW Skills issue fix/DPG-2150: Sidebar issue fix * SM-3717 --------- Co-authored-by: Nipun Arora <aroranipun1@gmail.com> Co-authored-by: nabeelmd-eGov <nabeel.md@egovernments.com>
egovernments · Feb 1, 2024 · 3f12f8e · 3f12f8e
1 parent e3a13dc
commit 3f12f8e
Show file tree

Hide file tree

Showing 13 changed files with 55 additions and 24 deletions.
diff --git a/frontend/micro-ui/web/micro-ui-internals/example/package.json b/frontend/micro-ui/web/micro-ui-internals/example/package.json
@@ -16,7 +16,7 @@
     "@egovernments/digit-ui-module-pgr": "1.5.0",
     "@egovernments/digit-ui-module-hrms": "1.5.20",
     "@egovernments/digit-ui-module-engagement": "1.5.20",
-    "@egovernments/digit-ui-module-core": "1.8.1-beta.2",
+    "@egovernments/digit-ui-module-core": "1.8.1-beta.3",
     "@egovernments/digit-ui-react-components": "1.6.0-fsm.1.4.0",
     "@egovernments/digit-ui-module-fsm": "1.6.1",
     "@egovernments/digit-ui-module-tqm": "1.0.1",

diff --git a/frontend/micro-ui/web/micro-ui-internals/example/public/index.html b/frontend/micro-ui/web/micro-ui-internals/example/public/index.html
@@ -11,7 +11,7 @@
   <meta name="theme-color" content="#00bcd1" />
   <title>Sanitation</title>
   <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css@1.8.0-beta.14/dist/index.css" />
-  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-fsm-css@0.1.26/dist/index.css" />
+  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-fsm-css@0.1.27/dist/index.css" />
 
   <!-- <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css/dist/index.css"/> -->
   <script src="https://egov-dev-assets.s3.ap-south-1.amazonaws.com/globalConfigsFSMpg.js"></script>

diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/fsm-css/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/fsm-css/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@egovernments/digit-ui-fsm-css",
-  "version": "0.1.26",
+  "version": "0.1.27",
   "license": "MIT",
   "main": "dist/index.css",
   "engines": {

diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/fsm-css/src/pages/employee/index.scss b/frontend/micro-ui/web/micro-ui-internals/packages/fsm-css/src/pages/employee/index.scss
@@ -555,17 +555,14 @@
 }
 
 .drawer-list {
+  margin-bottom: 2rem;
   .sidebar-list {
     .submenu-container {
       .sidebar-link {
         padding: unset !important;
       }
     }
   }
-  .sidebar-list:last-child {
-    position: fixed;
-    bottom: 0;
-  }
 }
 .sections-parent.inbox {
   .details-container {
@@ -667,3 +664,19 @@ video::-webkit-media-controls-play-button {
   width: 11.2rem;
   height: 2.5rem;
 }
+
+#jk-dropdown-unique {
+  .disabled {
+    pointer-events: none;
+    background-color: #eee;
+    .custom-checkbox {
+      background-color: transparent;
+      border-color: #505050;
+    }
+  }
+}
+
+.sidebar-list-footer {
+  position: fixed;
+  bottom: 0;
+}
diff --git a/...cro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Worker/EditWorker.js b/...cro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Worker/EditWorker.js
@@ -68,9 +68,6 @@ const EditWorker = ({ parentUrl, heading }) => {
     setEmployer(tempEmp);
   }, [mdmsOptions, ismdms]);
 
-  useEffect(() => {
-    setConfig(WorkerConfig({ t, disabled: true, skillsOption, employer }));
-  }, [skillsOption, employer]);
 
   const { isLoading: isLoading, isError: vendorCreateError, data: updateResponse, error: updateError, mutate } = Digit.Hooks.fsm.useWorkerUpdate(tenantId);
 
@@ -87,6 +84,11 @@ const EditWorker = ({ parentUrl, heading }) => {
     },
   });
 
+  useEffect(() => {
+    const workerDetails = workerData?.Individual?.[0];
+    setConfig(WorkerConfig({ t, disabled: true, skillsOption, defaultSkill: workerDetails?.skills?.filter((i) => i.isDeleted === false), employer }));
+  }, [skillsOption, employer, workerData]);
+
   const { data: vendorData, isLoading: isVendorLoading, isSuccess: isVendorSuccess, error: vendorError, refetch: refetchVendor } = Digit.Hooks.fsm.useDsoSearch(
     tenantId,
     { sortBy: "name", sortOrder: "ASC", status: "ACTIVE", individualIds: workerData?.Individual?.[0]?.id },

diff --git a/...ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/WorkerConfig.js b/...ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/WorkerConfig.js
@@ -1,8 +1,8 @@
 import React from "react";
-import { DatePicker, Dropdown } from "@egovernments/digit-ui-react-components";
+import { DatePicker, InfoIcon } from "@egovernments/digit-ui-react-components";
 import { convertEpochToDate } from "../../../utils";
 
-const WorkerConfig = ({ t, disabled = false, skillsOption = [], employer = [] }) => {
+const WorkerConfig = ({ t, disabled = false, skillsOption = [], defaultSkill = [], employer = [] }) => {
   return [
     {
       head: "ES_FSM_REGISTRY_PERSONAL_DETAILS",
@@ -149,16 +149,25 @@ const WorkerConfig = ({ t, disabled = false, skillsOption = [], employer = [] })
           isMandatory: true,
           key: "skills",
           type: "dropdown",
-          disable: disabled,
+          optionsDisable: disabled,
           label: "FSM_REGISTRY_WORKER_SKILLS",
+          labelChildren: (
+            <div className="tooltip" style={{ paddingLeft: "10px", marginBottom: "-3px" }}>
+              <InfoIcon />
+              <span className="tooltiptext" style={{ width: "150px", left: "230%", fontSize: "14px" }}>
+                {t("ES_FSM_SW_SKILLS_INFO_TIP")}
+              </span>
+            </div>
+          ),
           populators: {
-            disable: disabled,
+            optionsDisable: disabled,
             allowMultiSelect: true,
             name: "skills",
             optionsKey: "i18nKey",
             error: "ES_TQM_REQUIRED",
             required: true,
             options: skillsOption,
+            defaultOptions: defaultSkill,
             //   mdmsv2: {
             //     schemaCode: "PQM.Plant",
             //   }

diff --git a/...icro-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiSelectDropdown.js b/...icro-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiSelectDropdown.js
@@ -80,16 +80,17 @@ const MultiSelectDropdown = ({ options, optionsKey, selected = [], onSelect, def
   }
 
   const MenuItem = ({ option, index }) => (
-    <div key={index} style={isOBPSMultiple ? (index%2 !== 0 ?{background : "#EEEEEE"}:{}):{}}>
+    <div key={index} className={`${option.isDisabled ? "disabled" : ""}`}style={isOBPSMultiple ? (index%2 !== 0 ?{background : "#EEEEEE"}:{}):{}}>
       <input
         type="checkbox"
         value={option[optionsKey]}
         checked={alreadyQueuedSelectedState.find((selectedOption) => selectedOption[optionsKey] === option[optionsKey]) ? true : false}
         onChange={(e) => isPropsNeeded?onSelectToAddToQueue(e, option,props):isOBPSMultiple?onSelectToAddToQueue(e, option,BlockNumber):onSelectToAddToQueue(e, option)}
         style={{minWidth: "24px", width: "100%"}}
+        disabled={option.isDisabled || false}
       />
       <div className="custom-checkbox">
-        <CheckSvg style={{innerWidth: "24px", width: "24px"}}/>
+        <CheckSvg style={{innerWidth: "24px", width: "24px"}} fill={option.isDisabled ? "#505050" : "#F47738"} />
       </div>
       <p className="label" style={index === optionIndex ? {
                     opacity: 1,

diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/atoms/NavBar.js b/frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/atoms/NavBar.js
@@ -188,9 +188,9 @@ const NavBar = ({ open, toggleSidebar, profileItem, menuItems, onClose, Footer,
                 <MenuItem item={item} />
               </div>
             ))}
-            <div className={`sidebar-list`}>
-              <div className="side-bar-footer">{Footer}</div>
-            </div>
+          </div>
+          <div className={`sidebar-list-footer`}>
+            <div className="side-bar-footer">{Footer}</div>
           </div>
         </div>
       </div>

diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/atoms/svgindex.js b/frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/atoms/svgindex.js
@@ -276,8 +276,8 @@ const SearchIconSvg = ({ className, onClick, styles, disable }) => (
   </svg>
 );
 
-const CheckSvg = ({ className, style = {} }) => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#F47738" className={className} style={style}>
+const CheckSvg = ({ className, style = {}, fill = "#F47738" }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill={fill} className={className} style={style}>
     <path d="M0 0h24v24H0z" fill="none" />
     <path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" />
   </svg>

diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/hoc/FormComposerV2.js b/frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/hoc/FormComposerV2.js
@@ -649,6 +649,7 @@ export const FormComposerV2 = (props) => {
                     {t(field.label)}
                     {field?.appendColon ? " : " : null}
                     {field.isMandatory ? " * " : null}
+                    {field?.labelChildren ? field?.labelChildren : null}
                   </CardLabel>
                 )}
                 <div style={field.withoutLabel ? { width: "100%", ...props?.fieldStyle } : { ...props?.fieldStyle }} className="field">

diff --git a/...micro-ui/web/micro-ui-internals/packages/react-components/src/molecules/CustomDropdown.js b/...micro-ui/web/micro-ui-internals/packages/react-components/src/molecules/CustomDropdown.js
@@ -1,5 +1,5 @@
 import _ from "lodash";
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { Loader } from "../atoms/Loader";
 import RadioButtons from "../atoms/RadioButtons";
 import Dropdown from "../atoms/Dropdown";
@@ -93,6 +93,10 @@ const CustomDropdown = ({ t, config, inputRef, label, onChange, value, errorStyl
   //   return selectedValue
   // }
 
+  if(config?.optionsDisable && config?.options && config?.defaultOptions){
+    config?.options?.forEach(obj1 => obj1.isDisabled = config?.defaultOptions.some(obj2 => obj2.type === obj1.code));
+  }
+
   return (
     <React.Fragment key={config.name}>
       {/* <LabelFieldPair>
@@ -130,6 +134,7 @@ const CustomDropdown = ({ t, config, inputRef, label, onChange, value, errorStyl
             defaultUnit={t(config?.selectedText) || t("COMMON_SELECTED")}
             config={config}
             disable={disable}
+            optionsDisable={config?.optionsDisable}
           />
         </div> : type === "radio" ? (
         <RadioButtons

diff --git a/frontend/micro-ui/web/package.json b/frontend/micro-ui/web/package.json
@@ -21,7 +21,7 @@
     "@egovernments/digit-ui-module-dss": "1.8.0-beta.1",
     "@egovernments/digit-ui-module-hrms": "1.5.20",
     "@egovernments/digit-ui-module-engagement": "1.5.20",
-    "@egovernments/digit-ui-module-core": "1.8.1-beta.2",
+    "@egovernments/digit-ui-module-core": "1.8.1-beta.3",
     "@egovernments/digit-ui-react-components": "1.6.0-fsm.1.4.0",
     "@egovernments/digit-ui-module-fsm": "1.6.1",
     "@egovernments/digit-ui-module-tqm": "1.0.1",

diff --git a/frontend/micro-ui/web/public/index.html b/frontend/micro-ui/web/public/index.html
@@ -8,7 +8,7 @@
     href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;500;700&family=Roboto:wght@400;500;700&display=swap"
     rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css@1.8.0-beta.14/dist/index.css" />
-  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-fsm-css@0.1.26/dist/index.css" />
+  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-fsm-css@0.1.27/dist/index.css" />
   <!-- <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css/dist/index.css"/> -->
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="theme-color" content="#00bcd1" />