MOSIP-33499: Ui changes in SelectPolicyPopup (#419)

Signed-off-by: SwethaKrish4 <[email protected]>
mosip · Jun 6, 2024 · e20ee9b · e20ee9b
1 parent 65432da
commit e20ee9b
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 10 deletions.
diff --git a/pmp-reactjs-ui/public/i18n/ara.json b/pmp-reactjs-ui/public/i18n/ara.json
@@ -39,7 +39,7 @@
     "partnerCertificatesList": {
         "partnerCertificate": "شهادة الشريك",
         "noPartnerTypesAreMapped": "لم يتم تعيين أي أنواع شركاء لمعرف المستخدم الخاص بك",
-        "uploadPartnerCertificate": "يرجى تحميل شهادة الشريك هنا",
+        "uploadPartnerCertificate": "قم بتحميل شهادة الشريك الموقّع من CA",
         "certificateFormatMsg": "يُسمح فقط بتحميل تنسيقات الشهادات .cer أو .pem",
         "download": "تحميل",
         "originalCertificate": "الشهادة الأصلية",

diff --git a/pmp-reactjs-ui/public/i18n/eng.json b/pmp-reactjs-ui/public/i18n/eng.json
@@ -39,7 +39,7 @@
     "partnerCertificatesList": {
         "partnerCertificate": "Partner Certificate",
         "noPartnerTypesAreMapped": "No partner types are mapped to your user id",
-        "uploadPartnerCertificate": "Please upload partner certificate here",
+        "uploadPartnerCertificate": "Upload CA Signed Partner Certificate",
         "certificateFormatMsg": "Only .cer or .pem certificate formats are allowed for upload",
         "download": "Download",
         "originalCertificate": "Original Certificate",

diff --git a/pmp-reactjs-ui/public/i18n/fra.json b/pmp-reactjs-ui/public/i18n/fra.json
@@ -39,7 +39,7 @@
     "partnerCertificatesList": {
         "partnerCertificate": "Certificat de partenaire",
         "noPartnerTypesAreMapped": "Aucun type de partenaire n'est mappé à votre identifiant utilisateur",
-        "uploadPartnerCertificate": "Veuillez télécharger le certificat de partenaire ici",
+        "uploadPartnerCertificate": "Télécharger le certificat de partenaire signé par une autorité de certification",
         "certificateFormatMsg": "Seuls les formats de certificat .cer ou .pem sont autorisés pour le téléchargement",
         "download": "Télécharger",
         "originalCertificate": "Certificat original",

diff --git a/pmp-reactjs-ui/src/pages/common/LoadingIcon.js b/pmp-reactjs-ui/src/pages/common/LoadingIcon.js
@@ -1,9 +1,9 @@
 import { useTranslation } from 'react-i18next';
 
-function LoadingIcon() {
+function LoadingIcon({ styleSet }) {
     const { t } = useTranslation();
     return (
-        <div className="flex items-center justify-center h-full w-full">
+        <div className={`flex items-center justify-center h-full w-full ${(styleSet && styleSet.loadingDiv) ? styleSet.loadingDiv : ''}`}>
             <div role="status" className="flex items-center">
                 <svg aria-hidden="true" className="w-8 h-8 text-gray-200 animate-spin fill-blue-600" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">
                     <path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor" />

diff --git a/pmp-reactjs-ui/src/pages/common/fields/DropdownWithSearchComponent.js b/pmp-reactjs-ui/src/pages/common/fields/DropdownWithSearchComponent.js
@@ -73,7 +73,7 @@ function DropdownWithSearchComponent({ fieldName, dropdownDataList, onDropDownCh
                                     return (
                                         <div key={index} className="min-h-3">
                                             <button
-                                                className={`block ${dropdownItem.fieldDescription ? 'h-[4.5rem]' : 'h-8'} w-full px-4 py-1 text-left text-base text-dark-blue
+                                                className={`block ${dropdownItem.fieldDescription ? 'min-h-20' : 'min-h-8'} w-full px-4 py-1 text-left text-base text-dark-blue overflow-x-auto no-scrollbar
                                                     ${selectedDropdownEntry === dropdownItem.fieldCode ? 'bg-gray-100' : 'hover:bg-gray-100'}`}
                                                 onClick={() => changeDropdownSelection(dropdownItem.fieldValue)}>
                                                 <span className={`${dropdownItem.fieldDescription ? 'font-semibold' : 'font-normal'}`}>{dropdownItem.fieldCode}</span>

diff --git a/pmp-reactjs-ui/src/pages/dashboard/SelectPolicyPopup.js b/pmp-reactjs-ui/src/pages/dashboard/SelectPolicyPopup.js
@@ -65,14 +65,14 @@ function SelectPolicyPopup() {
         dataList.forEach(item => {
             let alreadyAdded = false;
             dataArr.forEach(item1 => {
-                if (item1.fieldValue === item.id) {
+                if (item1.fieldValue === item.name) {
                     alreadyAdded = true;
                 }
             });
             if (!alreadyAdded) {
                 dataArr.push({
                     fieldCode: item.name,
-                    fieldValue: item.id,
+                    fieldValue: item.name,
                     fieldDescription: item.desc
                 });
             }
@@ -115,14 +115,15 @@ function SelectPolicyPopup() {
         outerDiv: "!ml-0 !mb-0",
         dropdownLabel: "!text-base !my-2 mb-0",
         dropdownButton: "!w-full !h-11 !rounded-md !text-base !text-dark-blue",
-        selectionBox: ""
+        selectionBox: "",
+        loadingDiv: "!py-[50%]"
     }
 
     return (
         <div className="fixed inset-0 w-full flex items-center justify-center bg-black bg-opacity-50 z-50 font-inter">
             <div className={`bg-white w-1/3 mx-auto rounded-xl shadow-lg -mt-3`}>
                 {!dataLoaded && (
-                    <LoadingIcon></LoadingIcon>
+                    <LoadingIcon styleSet={styles}></LoadingIcon>
                 )}
                 {dataLoaded && (
                     <>