Audit fixes main (#1926)

* audit fixes * fixed campaign details css issue * Update health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplanning.scss Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * updated core, react-components,ui-components and releated css versions * added icon for download and changed primary to secondary for action button --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
egovernments · Nov 28, 2024 · 226aebc · 226aebc
1 parent 09103ff
commit 226aebc
Show file tree

Hide file tree

Showing 25 changed files with 236 additions and 99 deletions.
diff --git a/health/micro-ui/web/micro-ui-internals/example/package.json b/health/micro-ui/web/micro-ui-internals/example/package.json
@@ -11,10 +11,10 @@
   "devDependencies": {
     "@egovernments/digit-ui-libraries": "1.8.6",
     "@egovernments/digit-ui-module-workbench": "1.0.11",
-    "@egovernments/digit-ui-components": "0.0.2-beta.49",
-    "@egovernments/digit-ui-module-core": "1.8.2-beta.25",
+    "@egovernments/digit-ui-components": "0.0.2-beta.56",
+    "@egovernments/digit-ui-module-core": "1.8.11",
     "@egovernments/digit-ui-module-utilities": "1.0.3",
-    "@egovernments/digit-ui-react-components": "1.8.2-beta.18",
+    "@egovernments/digit-ui-react-components": "1.8.10",
     "@egovernments/digit-ui-module-hcmworkbench": "0.0.50",
     "@egovernments/digit-ui-module-campaign-manager": "0.2.2",
     "@egovernments/digit-ui-module-microplan": "0.0.1",

diff --git a/health/micro-ui/web/micro-ui-internals/example/public/index.html b/health/micro-ui/web/micro-ui-internals/example/public/index.html
@@ -11,8 +11,8 @@
   <meta name="theme-color" content="#00bcd1" />
   <title>DIGIT</title>
   <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css@1.8.3/dist/index.css" />
-  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.41/dist/index.css" />
-  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-health-css@0.1.49/dist/index.css" />
+  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-components-css@0.0.2-beta.42/dist/index.css" />
+  <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-health-css@0.1.50/dist/index.css" />
 
   <!-- added below css for hcm-workbench module inclusion-->
   <!-- <link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css@1.5.41/dist/index.css" /> -->

diff --git a/health/micro-ui/web/micro-ui-internals/example/src/UICustomizations.js b/health/micro-ui/web/micro-ui-internals/example/src/UICustomizations.js
@@ -823,27 +823,39 @@ export const UICustomizations = {
             });
           };
 
+          const onActionSelect = (e) => {
+            if (e.name == "MP_ACTIONS_EDIT_SETUP") {
+              window.location.href = `/${window.contextPath}/employee/microplan/setup-microplan?key=${1}&microplanId=${row.id}&campaignId=${
+                row.campaignDetails.id
+              }`;
+            }
+            if (e.name == "MP_ACTIONS_VIEW_SUMMARY") {
+              window.location.href = `/${window.contextPath}/employee/microplan/setup-microplan?key=${10}&microplanId=${row.id}&campaignId=${
+                row.campaignDetails.id
+              }&setup-completed=true`;
+            }
+          };
+
           return (
             <div>
               {microplanFileId && row?.status == "RESOURCE_ESTIMATIONS_APPROVED" ? (
                 <div>
-                  <ButtonNew style={{width:"100%"}} onClick={handleDownload} label={t("WBH_DOWNLOAD_MICROPLAN")} />
+                  <ButtonNew style={{ width: "20rem" }} onClick={handleDownload} icon="DownloadIcon" label={t("WBH_DOWNLOAD_MICROPLAN")} />
                 </div>
               ) : (
-                <Dropdown
-                  t={t}
-                  option={options}
-                  select={(e) => {
-                    if (e.name ==  "MP_ACTIONS_EDIT_SETUP") {
-                      window.location.href = `/${window.contextPath}/employee/microplan/setup-microplan?key=${1}&microplanId=${row.id}&campaignId=${row.campaignDetails.id}`;
-                    }
-                    if (e.name == "MP_ACTIONS_VIEW_SUMMARY") {
-                      window.location.href = `/${window.contextPath}/employee/microplan/setup-microplan?key=${10}&microplanId=${row.id}&campaignId=${row.campaignDetails.id}&setup-completed=true`;
-                    }
-                  }}
-                  optionKey={"name"}
-                  selected={{ code: "1", name: "MP_ACTIONS_FOR_MICROPLAN_SEARCH" }}
-                />
+                <div className={"action-button-open-microplan"}>
+                  <ButtonNew
+                    type="actionButton"
+                    variation="secondary"
+                    label={t("MP_ACTIONS_FOR_MICROPLAN_SEARCH")}
+                    options={options}
+                    style={{ width: "20rem" }}
+                    optionsKey="name"
+                    showBottom={true}
+                    isSearchable={false}
+                    onOptionSelect={(item) => onActionSelect(item)}
+                  />
+                </div>
               )}
             </div>
           );
@@ -1013,6 +1025,7 @@ export const UICustomizations = {
               variation="primary"
               icon={"ArrowForward"}
               type="button"
+              isSuffix={true}
               style={{width:"290px"}}
               isDisabled={!hasRequiredRole}
               // className="dm-workbench-download-template-btn dm-hover"

diff --git a/health/micro-ui/web/micro-ui-internals/package.json b/health/micro-ui/web/micro-ui-internals/package.json
@@ -49,8 +49,8 @@
     "*.{js,css,md}": "prettier --write"
   },
   "dependencies": {
-    "@egovernments/digit-ui-react-components": "1.8.2-beta.18",
-    "@egovernments/digit-ui-components": "0.0.2-beta.49",
+    "@egovernments/digit-ui-react-components": "1.8.10",
+    "@egovernments/digit-ui-components": "0.0.2-beta.56",
     "ajv": "8.12.0",
     "lodash": "4.17.21",
     "microbundle-crl": "0.13.11",

diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/package.json b/health/micro-ui/web/micro-ui-internals/packages/css/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@egovernments/digit-ui-health-css",
-  "version": "0.1.49",
+  "version": "0.1.50",
   "license": "MIT",
   "main": "dist/index.css",
   "author": "Jagankumar <jagan.kumar@egov.org.in>",

diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplan.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplan.scss
@@ -422,8 +422,83 @@ tbody tr:last-child td:last-child .digit-dropdown-employee-select-wrap .digit-dr
   font-weight: 700;
 }
 
+.microplan-deatils-view-card{
+  .digit-view-card-header{
+    @extend .typography.heading-m;
+    font-family: theme(digitv2.fontFamily.sans);
+    font-style: theme(digitv2.fontStyle.normal);
+    font-weight: theme(digitv2.fontWeight.bold);
+    line-height: theme(digitv2.lineHeight.lineheight1);
+
+    @media (max-aspect-ratio: 9/16) {
+      /* Media query for mobile */
+      font-size: theme(digitv2.fontSize.heading-m.mobile);
+    }
+
+    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
+      /* Media query for tablets */
+      font-size: theme(digitv2.fontSize.heading-m.tablet);
+    }
+
+    @media (min-aspect-ratio: 3/4) {
+      /* Media query for desktop */
+      font-size: theme(digitv2.fontSize.heading-m.desktop);
+    }
+  }
+}
+
+.kpi-card{
+  width: fit-content;
+}
+
+.assumption-label-icon-wrapper{
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+
+  .icon-wrapper{
+    margin-left: 0rem;
+    top: 0rem;
+    display: flex;
+    width: 1.25rem;
+    height: 1.25rem;
+  }
+}
+
+.sub-boundary-summary-card{
+  gap: 1rem;
+  padding: 1rem;
+}
+
+.action-button-open-microplan{
+  .header-dropdown-menu{
+    min-width: 20rem !important;
+    width: 20rem !important;
+  }
+}
+
+.action-bar-wrap{
+  height: 4.5rem;
+  align-items: center;
+}
+
+.tooltip-warpper-village-hierarchy{
+  width: 1.25rem;
+  height: 1.25rem;
+}
+
+.village-tooltip-wrap{
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+}
+
 .accessibility-pop-up{
   .digit-popup-children-wrap{
     overflow: visible !important;
   }
 }
+
+.microplan-employee-module-card{
+  min-height: 16.25rem;
+}
diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplanning.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplanning.scss
@@ -2595,10 +2595,10 @@ $border-color: rgba(214, 213, 212, 1);
 .kpi-container {
   display: flex;
   flex-direction: row;
-  justify-content: space-around; 
+  justify-content: space-around;
+  scrollbar-width: none;
   gap: 1rem; 
   overflow-x: auto; 
-  padding: 8px; 
   width: 100%;
 }
 

diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/formulaConfig.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/formulaConfig.scss
@@ -17,12 +17,8 @@
   }
 
   .formula-label-field > span {
-    width: 25rem;
-    font-size: 1.2rem;
-    margin-right: 2rem;
-    font-weight: bold;
-
-    margin-top: 0.25rem;
+    width: 27rem;
+    @extend .typography.heading-s;
   }
 
   .icon-wrapper{

diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss
@@ -828,14 +828,18 @@ tbody {
     .row {
       padding: 0rem;
       margin: 0rem;
-
+      display: flex;
+      align-items: center;
+      gap: 1.5rem;
       margin-bottom: 1.5rem;
 
       h2 {
         margin: 0rem;
+        width: 20%;
       }
 
       .value {
+        width: 80%;
         p {
           margin: 0rem;
         }

diff --git a/...-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/components/BulkUpload.js b/...-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/components/BulkUpload.js
@@ -155,6 +155,7 @@ const BulkUpload = ({ multiple = true, onSubmit, fileData, onFileDelete, onFileD
             variation="secondary"
             // icon={<DownloadIcon styles={{ height: "1.25rem", width: "1.25rem" }} fill={PRIMARY_COLOR} />}
             type="button"
+            size={"medium"}
             icon={"DownloadIcon"}
             // className="workbench-download-template-btn hover"
             onClick={(e) => {
@@ -165,6 +166,7 @@ const BulkUpload = ({ multiple = true, onSubmit, fileData, onFileDelete, onFileD
           <ButtonNew
             label={t("WBH_DELETE")}
             variation="secondary"
+            size={"medium"}
             // icon={<DeleteIconv2 styles={{ height: "1.25rem", width: "2.5rem" }} fill={PRIMARY_COLOR} />}
             type="button"
             icon={"Delete"}

diff --git a/...icro-ui-internals/packages/modules/campaign-manager/src/components/MultiSelectDropdown.js b/...icro-ui-internals/packages/modules/campaign-manager/src/components/MultiSelectDropdown.js
@@ -816,7 +816,7 @@ const MultiSelectDropdown = ({
       <div className={`digit-multiselectdropodwn-custom-checkbox-selectAll`}>
         <SVG.Check width="20px" height="20px" fill={primaryIconColor} />
       </div>
-      <p className={`digit-label ${addSelectAllCheck ? "selectAll" : ""}`}>{selectAllLabel ? selectAllLabel : "Select All"}</p>
+      <p className={`digit-label ${addSelectAllCheck ? "selectAll" : ""}`}>{selectAllLabel ? selectAllLabel : t("SELECT_ALL")}</p>
     </div>
   );
   const Menu = () => {
@@ -846,7 +846,7 @@ const MultiSelectDropdown = ({
                 <div className="digit-category-name">{t(option[optionsKey])}</div>
                 {addCategorySelectAllCheck && (
                   <div className="digit-category-selectAll" onClick={() => handleCategorySelection(option)}>
-                    <div className="category-selectAll-label">{categorySelectAllLabel ? categorySelectAllLabel : "Select All"}</div>
+                    <div className="category-selectAll-label">{categorySelectAllLabel ? categorySelectAllLabel : t("SELECT_ALL")}</div>
                     <input type="checkbox" checked={selectAllChecked || categorySelected[option.code]} />
                     <div className={`digit-multiselectdropodwn-custom-checkbox-selectAll`}>
                       <SVG.Check width="20px" height="20px" fill={primaryIconColor} />
@@ -973,7 +973,7 @@ const MultiSelectDropdown = ({
           )}
           {alreadyQueuedSelectedState.length > 0 && frozenData.length == 0 && (
             <Button
-              label={t(config?.clearLabel ? config?.clearLabel : "Clear All")}
+              label={t(config?.clearLabel ? config?.clearLabel : t("CLEAR_ALL"))}
               onClick={handleClearAll}
               variation=""
               style={{

diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/package.json b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/package.json
@@ -18,8 +18,8 @@
     "react-router-dom": "5.3.0"
   },
   "dependencies": {
-    "@egovernments/digit-ui-react-components": "1.8.2-beta.18",
-    "@egovernments/digit-ui-components": "0.0.2-beta.49",
+    "@egovernments/digit-ui-react-components": "1.8.10",
+    "@egovernments/digit-ui-components": "0.0.2-beta.56",
     "react": "17.0.2",
     "react-date-range": "^1.4.0",
     "react-dom": "17.0.2",

diff --git a/...o-ui/web/micro-ui-internals/packages/modules/microplan/src/components/CampaignBoundary.js b/...o-ui/web/micro-ui-internals/packages/modules/microplan/src/components/CampaignBoundary.js
@@ -302,7 +302,7 @@ const CampaignBoundary = ({ customProps, setupCompleted }) => {
       <BoundaryKpi data={statusMap} heading={t("CAMPAIGN_BOUNDARY")} />
       {bHierarchy.length > 1 ? (
         <div className="mp-margin-bottom">
-          <SubBoundaryView style={{ background: "#fff", gap: "1.5rem" }} title={bHierarchy?.[1]} arr={parent_group?.[bHierarchy?.[1]]} editHandler={editHandler} isEditable={isEditable} headerStyle={{fontSize:"1.6rem"}} />
+          <SubBoundaryView style={{ background: "#fff" }} title={bHierarchy?.[1]} arr={parent_group?.[bHierarchy?.[1]]} editHandler={editHandler} isEditable={isEditable} headerStyle={{fontSize:"1.6rem"}} />
         </div>
       ) : null}
 
@@ -312,10 +312,8 @@ const CampaignBoundary = ({ customProps, setupCompleted }) => {
             <div key={`header_${ind}`}>
               <Card className="middle-child">
                 <div className="mp-header-container" style={{ marginBottom: "0px" }}>
-                  <Header className="summary-sub-heading">
-                    {t(`MP_${bHierarchy[ind + 2].toUpperCase()}`)}
-                  </Header>
-                  {!(setupCompleted === 'true') &&
+                  <Header className="summary-sub-heading">{t(`MP_${bHierarchy[ind + 2].toUpperCase()}`)}</Header>
+                  {!(setupCompleted === "true") && (
                     <Button
                       label={t("WBH_EDIT")}
                       variation="secondary"
@@ -326,28 +324,38 @@ const CampaignBoundary = ({ customProps, setupCompleted }) => {
                         editHandler();
                       }}
                     />
-                  }
+                  )}
                 </div>
                 {/* <HeaderComp title={bHierarchy[ind + 2]} /> */}
                 {parent_group?.[item]?.map((item1, idx) =>
                   Array.isArray(parents?.[item1]) && boundaryStatus?.[ind + 2] && (idx === 0 || idx === 1) ? (
-                    <SubBoundaryView style={{ gap: "1.5rem", marginBottom: "0px" }} key={`${item1}_${idx}`} title={item1} arr={parents?.[item1]} />
+                    <SubBoundaryView style={{ marginBottom: "0px" }} key={`${item1}_${idx}`} title={item1} arr={parents?.[item1]} />
                   ) : Array.isArray(parents?.[item1]) && !boundaryStatus?.[ind + 2] ? (
-                    <SubBoundaryView style={{ gap: "1.5rem", marginBottom: "0px" }} key={`${item1}_${idx}`} title={item1} arr={parents?.[item1]} />
+                    <SubBoundaryView style={{ marginBottom: "0px" }} key={`${item1}_${idx}`} title={item1} arr={parents?.[item1]} />
                   ) : null
                 ) || null}
                 {boundaryStatus?.[ind + 2] && parent_group[item]?.length > 2 ? (
-                  <div onClick={() => handleViewMore(ind + 2)} className="view-more">
-                    {t("VIEW_MORE")}
-                  </div>
+                  <Button
+                    label={t("VIEW_MORE")}
+                    onClick={() => handleViewMore(ind + 2)}
+                    variation="link"
+                    icon="ArrowDropDown"
+                    size="medium"
+                    isSuffix={true}
+                  />
                 ) : !boundaryStatus?.[ind + 2] ? (
-                  <div onClick={() => handleViewMore(ind + 2)} className="view-more">
-                    {t("VIEW_LESS")}
-                  </div>
+                  <Button
+                    isSuffix={true}
+                    label={t("VIEW_LESS")}
+                    icon="ArrowDropUp"
+                    onClick={() => handleViewMore(ind + 2)}
+                    variation="link"
+                    size="medium"
+                  />
                 ) : null}
               </Card>
             </div>
-          )
+          );
         })}
     </div>
   );