Skip to content

Commit

Permalink
UI Development Partner Admin Tabular view of uploaded certificates
Browse files Browse the repository at this point in the history
Signed-off-by: Anil_Kumar_Majji <[email protected]>
  • Loading branch information
Anil-kumar-Majji committed Dec 10, 2024
1 parent 012aa72 commit ef315e7
Show file tree
Hide file tree
Showing 5 changed files with 91 additions and 31 deletions.
16 changes: 10 additions & 6 deletions pmp-revamp-ui/public/i18n/ara.json
Original file line number Diff line number Diff line change
Expand Up @@ -412,10 +412,10 @@
"sbiVersion": "إصدار SBI",
"searchVersion": "البحث عن إصدار SBI",
"linkedDevices": "الأجهزة المرتبطة",
"status":"حالة",
"status": "حالة",
"action": "الإجراء",
"partnerId": "معرف الشريك",
"orgName":"منظمة",
"orgName": "منظمة",
"partnerType": "نوع الشريك",
"device": "جهاز",
"sbiCreatedDate": "تاريخ إنشاء SBI",
Expand Down Expand Up @@ -502,7 +502,7 @@
"ftmChipProviderServices": "خدمات مزودي شريحة FTM",
"addFtmBtn": "إضافة شريحة FTM",
"partnerId": "معرف الشريك",
"orgName":"منظمة",
"orgName": "منظمة",
"listOfFtm": "قائمة تفاصيل شريحة FTM",
"make": "يصنع",
"model": "نموذج",
Expand Down Expand Up @@ -561,7 +561,8 @@
"description": "عند النقر فوق تأكيد، سيتم إلغاء تنشيط تفاصيل شريحة FTM الخاصة بك."
},
"rootTrustCertificate": {
"organisation": "منظمة",
"certificateTrustStore": "مخزن الشهادات",
"certificateId": "معرف الشهادة",
"partnerDomain": "مجال الشريك",
"issuedTo": "صدر ل",
"issuedBy": "صادرة عن",
Expand All @@ -585,10 +586,13 @@
"dropdownPlaceholder": "حدد مجال الشريك",
"successMsg": "تم تحميل شهادة جذر الثقة لـ {{partnerDomain}} بنجاح"
},
"viewRootOfTrustCertificate": {
"viewRootOfTrustCertificate": "عرض شهادة جذر الثقة",
"listOfRootTrustCertificates": {
"rootOfTrustCertificates": "شهادات الثقة الجذرية",
"caCertificates": "شهادات كاليفورنيا"
},
"listOfIntermediateRootTrustCertificates": {
"intermediateRootTrustCertificates": "شهادات ثقة الجذر المتوسطة"
},
"partnerList": {
"partnerTitle": "الشركاء",
"listOfPartnerTitle": "قائمة الشركاء",
Expand Down
10 changes: 7 additions & 3 deletions pmp-revamp-ui/public/i18n/eng.json
Original file line number Diff line number Diff line change
Expand Up @@ -556,7 +556,8 @@
"description": "On clicking Confirm, your FTM Chip details will be deactivated."
},
"rootTrustCertificate": {
"organisation": "Organisation",
"certificateTrustStore": "Certificate Trust Store",
"certificateId": "Certificate Id",
"partnerDomain": "Partner Domain",
"issuedTo": "Issued To",
"issuedBy": "Issued By",
Expand All @@ -581,10 +582,13 @@
"dropdownPlaceholder": "Select partner domain",
"successMsg": "Root of Trust Certificate for {{partnerDomain}} is uploaded successfully"
},
"viewRootOfTrustCertificate": {
"viewRootOfTrustCertificate": "View Root of Trust Certificate",
"listOfRootTrustCertificates": {
"rootOfTrustCertificates": "Root Trust Certificates",
"caCertificates": "Ca Certificates"
},
"listOfIntermediateRootTrustCertificates": {
"intermediateRootTrustCertificates": "Intermediate Root Trust Certificates"
},
"partnerList": {
"partnerTitle": "Partners",
"listOfPartnerTitle": "List of Partners",
Expand Down
10 changes: 7 additions & 3 deletions pmp-revamp-ui/public/i18n/fra.json
Original file line number Diff line number Diff line change
Expand Up @@ -561,7 +561,8 @@
"description": "En cliquant sur Confirmer, les détails de votre puce FTM seront désactivés."
},
"rootTrustCertificate": {
"organisation": "Organisation",
"certificateTrustStore": "Magasin de certificats de confiance",
"certificateId": "Identifiant du certificat",
"partnerDomain": "Domaine partenaire",
"issuedTo": "Délivré à",
"issuedBy": "Délivré par",
Expand All @@ -585,10 +586,13 @@
"dropdownPlaceholder": "Sélectionnez un domaine partenaire",
"successMsg": "Le certificat racine de confiance pour {{partnerDomain}} a été téléchargé avec succès"
},
"viewRootOfTrustCertificate": {
"viewRootOfTrustCertificate": "Afficher le certificat racine de confiance",
"listOfRootTrustCertificates": {
"rootOfTrustCertificates": "Certificats de confiance racine",
"caCertificates": "Certificats CA"
},
"listOfIntermediateRootTrustCertificates": {
"intermediateRootTrustCertificates": "Certificats de confiance racine intermédiaires"
},
"partnerList":{
"partnerTitle": "Partenaires",
"listOfPartnerTitle": "Liste des partenaires",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { useNavigate } from 'react-router-dom';
import { useTranslation } from "react-i18next";
import { getUserProfile } from "../../../services/UserProfileService";
import { isLangRTL, onPressEnterKey } from "../../../utils/AppUtils";
import { formatDate, getStatusCode, handleMouseClickForDropdown, toggleSortAscOrder, toggleSortDescOrder, bgOfStatus,} from "../../../utils/AppUtils";
import { formatDate, getStatusCode, handleMouseClickForDropdown, toggleSortAscOrder, toggleSortDescOrder, bgOfStatus, } from "../../../utils/AppUtils";
import LoadingIcon from "../../common/LoadingIcon";
import ErrorMessage from "../../common/ErrorMessage";
import Title from "../../common/Title";
Expand All @@ -12,6 +12,7 @@ import FilterButtons from "../../common/FilterButtons";
import RootTrustCertificatesFilter from "./RootTrustCertificatesFilter";
import SortingIcon from "../../common/SortingIcon";
import Pagination from "../../common/Pagination";
import RootTrustCertificateServicesTab from "./RootTrustCertificateServicesTab";

function RootTrustCertificateList() {
const { t } = useTranslation();
Expand Down Expand Up @@ -174,19 +175,23 @@ function RootTrustCertificateList() {
return (
<div
className={`mt-2 w-[100%] ${isLoginLanguageRTL ? "mr-28 ml-5" : "ml-28 mr-5"} overflow-x-scroll font-inter`}>
{!dataLoaded && <LoadingIcon></LoadingIcon>}
{!dataLoaded &&
<LoadingIcon />
}
{dataLoaded && (
<>
{errorMsg && (
<ErrorMessage
errorCode={errorCode}
errorMessage={errorMsg}
clickOnCancel={cancelErrorMsg}
/>
<ErrorMessage errorCode={errorCode} errorMessage={errorMsg} clickOnCancel={cancelErrorMsg} />
)}
<div className="flex-col mt-7">
<div className="flex justify-between mb-3">
<Title title="viewRootOfTrustCertificate.viewRootOfTrustCertificate" backLink="/partnermanagement" styleSet={style} />
<div className="flex justify-between mb-5 flex-col">
<Title title="rootTrustCertificate.certificateTrustStore" backLink="/partnermanagement" styleSet={style} />
<RootTrustCertificateServicesTab
activeRootOfTustCertificates={true}
rootOfTustCertificatesPath={'/partnermanagement/admin/certificates/root-trust-certificate'}
activeIntermediateRootOfTrustCertificates={false}
intermediateRootOfTrustCertificatesPath={''}
/>
{certificateData.length > 0 && (
<button
id="root_certificate_upload_btn"
Expand All @@ -204,7 +209,7 @@ function RootTrustCertificateList() {
<div className="flex justify-between py-2 pt-4 text-sm font-semibold text-[#6F6E6E]">
<div className="flex w-full justify-between">
<h6 className="ml-5 mr-3">
{t("rootTrustCertificate.organisation")}
{t("rootTrustCertificate.certificateId")}
</h6>
<h6>{t("rootTrustCertificate.partnerDomain")}</h6>
<h6>{t("rootTrustCertificate.issuedTo")}</h6>
Expand Down Expand Up @@ -288,9 +293,9 @@ function RootTrustCertificateList() {
id={"root_certificate_list_item" + (index + 1)}
key={index}
className={`border-t border-[#E5EBFA] cursor-pointer text-[0.8rem] text-[#191919] font-semibold break-words ${certificate.status.toLowerCase() ===
"deactivated"
? "text-[#969696]"
: "text-[#191919]"
"deactivated"
? "text-[#969696]"
: "text-[#191919]"
}`}
>
<td
Expand Down Expand Up @@ -410,8 +415,8 @@ function RootTrustCertificateList() {
{viewCertificateId === index && (
<div
className={`absolute w-[7%] z-50 bg-white text-xs font-semibold rounded-lg shadow-md border min-w-fit ${isLoginLanguageRTL
? "left-9 text-right"
: "right-9 text-left"
? "left-9 text-right"
: "right-9 text-left"
}`}
>
<p
Expand All @@ -420,8 +425,8 @@ function RootTrustCertificateList() {
showCertificateDetails(certificate)
}
className={`py-1.5 px-4 cursor-pointer text-[#3E3E3E] hover:bg-gray-100 ${isLoginLanguageRTL
? "pl-10"
: "pr-10"
? "pl-10"
: "pr-10"
}`}
tabIndex="0"
onKeyPress={(e) =>
Expand All @@ -441,8 +446,8 @@ function RootTrustCertificateList() {
showDeactivateCertificate(certificate)
}
className={`py-1.5 px-4 ${isLoginLanguageRTL
? "pl-10"
: "pr-10"
? "pl-10"
: "pr-10"
} ${certificate.status === "approved"
? "text-crimson-red cursor-pointer"
: "text-[#A5A5A5] cursor-auto"
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
import React from 'react';
import { useNavigate } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { getUserProfile } from '../../../services/UserProfileService';
import { isLangRTL, onPressEnterKey } from '../../../utils/AppUtils';

function RootTrustCertificateServicesTab({ activeRootOfTustCertificates, rootOfTustCertificatesPath, activeIntermediateRootOfTrustCertificates, intermediateRootOfTrustCertificatesPath }) {

const { t } = useTranslation();
const isLoginLanguageRTL = isLangRTL(getUserProfile().langCode);
const navigate = useNavigate();

const changeToRootOfTustCertificates = () => {
navigate(rootOfTustCertificatesPath)
};

const changeToIntermediateRootOfTrustCertificates = () => {
navigate(intermediateRootOfTrustCertificatesPath)
};

return (
<div className='flex text-xs bg-[#FCFCFC] font-bold space-x-16 items-start rounded-lg px-[1.5%] pt-[2%] mt-3'>
<div className={`flex-col justify-center`}>
<h6 id='root_of_trust_certificates_tab' onClick={changeToRootOfTustCertificates}
className={`${activeRootOfTustCertificates ? "text-[#1447b2]" : "text-[#031640]"} mb-[12%] cursor-pointer text-sm`}
tabIndex="0" onKeyPress={(e) => onPressEnterKey(e, changeToRootOfTustCertificates)}>
{t('listOfRootTrustCertificates.rootOfTrustCertificates')}
</h6>
<div className={`h-1 w-[9rem] ${activeRootOfTustCertificates ? "bg-tory-blue" : "bg-transparent"} rounded-t-md`}></div>
</div>
<div className={`flex-col justify-center`}>
<h6 id='intermediate_root_of_trust_certificates_tab' onClick={changeToIntermediateRootOfTrustCertificates}
className={`${activeIntermediateRootOfTrustCertificates ? "text-[#1447b2]" : "text-[#031640]"} mb-[7%] cursor-pointer text-sm`}
tabIndex="0" onKeyPress={(e) => onPressEnterKey(e, changeToIntermediateRootOfTrustCertificates)}>
{t('listOfIntermediateRootTrustCertificates.intermediateRootTrustCertificates')}
</h6>
<div className={`h-1 w-[15rem] ${activeIntermediateRootOfTrustCertificates ? "bg-tory-blue" : "bg-transparent"} rounded-t-md`}></div>
</div>
</div>
)
}

export default RootTrustCertificateServicesTab;

0 comments on commit ef315e7

Please sign in to comment.