MOSIP-34643: Updated the side menu for Device Provider (#702)

Signed-off-by: Anil_Kumar_Majji <[email protected]>
mosip · Aug 19, 2024 · e93636d · e93636d
1 parent f5d8e12
commit e93636d
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 6 deletions.
diff --git a/pmp-reactjs-ui/src/nav/SideNav.js b/pmp-reactjs-ui/src/nav/SideNav.js
@@ -11,7 +11,7 @@ function SideNav({ open, policyRequiredPartnerTypes, partnerType }) {
     const { t } = useTranslation();
     const [enablePoliciesMenu, setEnablePoliciesMenu] = useState(false);
     const [enableAuthenticationServicesMenu, setEnableAuthenticationServicesMenu] = useState(false);
-
+    const [enableDeviceProviderServicesMenu, setEnableDeviceProviderServicesMenu] = useState(false);
     useEffect(() => {
         //console.log(selectedPath);
         if (selectedPath.includes('dashboard')) {
@@ -26,6 +26,8 @@ function SideNav({ open, policyRequiredPartnerTypes, partnerType }) {
             setActiveIcon("policies");
         } else if (selectedPath.includes('authenticationServices')) {
             setActiveIcon("authenticationServices");
+        } else if (selectedPath.includes('deviceProviderServices')) {
+            setActiveIcon('deviceProviderServices');
         } else {
             setActiveIcon("home");
         }
@@ -39,6 +41,9 @@ function SideNav({ open, policyRequiredPartnerTypes, partnerType }) {
         if (partnerType === "AUTH_PARTNER") {
             setEnableAuthenticationServicesMenu(true);
         }
+        if (partnerType === "DEVICE_PROVIDER") {
+            setEnableDeviceProviderServicesMenu(true);
+        }
     }, [policyRequiredPartnerTypes, partnerType]);
 
     function showHome() {
@@ -57,27 +62,36 @@ function SideNav({ open, policyRequiredPartnerTypes, partnerType }) {
         navigate('/partnermanagement/authenticationServices/oidcClientsList');
         setActiveIcon("authenticationServices");
     };
+    const showDeviceProviderServices = () => {
+        navigate('/partnermanagement/deviceProviderServices/sbiList');
+    };
+
     return (
         <div className="flex font-inter bg-white h-screen z-40">
             <div className={`h-full ${open ? "absolute inset-y-14 w-64" : "absolute inset-y-14 w-[4.5rem]"} 
             flex-col duration-500`}>
                 <ul className="pt-3 h-full space-y-5 bg-[#FCFCFC] shadow-[rgba(0,0,0,0.13)_5px_2px_8px_-2px]">
-                    <li className="duration-700 cursor-pointer" onClick={() => showHome()} onKeyPress={(e)=>{e.key==='Enter' && showHome()}}>
-                        <SideNavMenuItem title={t('commons.home')} id='home' isExpanded={open} activeIcon={activeIcon}/>
+                    <li className="duration-700 cursor-pointer" onClick={() => showHome()} onKeyPress={(e) => { e.key === 'Enter' && showHome() }}>
+                        <SideNavMenuItem title={t('commons.home')} id='home' isExpanded={open} activeIcon={activeIcon} />
                     </li>
-                    <li className="duration-700 cursor-pointer" onClick={() => showPartnerCertificatesList()} onKeyPress={(e)=>{e.key==='Enter' && showPartnerCertificatesList()}}>
+                    <li className="duration-700 cursor-pointer" onClick={() => showPartnerCertificatesList()} onKeyPress={(e) => { e.key === 'Enter' && showPartnerCertificatesList() }}>
                         <SideNavMenuItem title={t('dashboard.partnerCertificate')} id='partnerCertificate' isExpanded={open} activeIcon={activeIcon} />
                     </li>
                     {enablePoliciesMenu &&
-                        <li className="duration-700 cursor-pointer" onClick={() => showPolicies()} onKeyPress={(e)=>{e.key==='Enter' && showPolicies()}}>
+                        <li className="duration-700 cursor-pointer" onClick={() => showPolicies()} onKeyPress={(e) => { e.key === 'Enter' && showPolicies() }}>
                             <SideNavMenuItem title={t('dashboard.policies')} id='policies' isExpanded={open} activeIcon={activeIcon} />
                         </li>
                     }
                     {enableAuthenticationServicesMenu &&
-                        <li className="duration-700 cursor-pointer" onClick={() => showAuthenticationServices()} onKeyPress={(e)=>{e.key==='Enter' && showAuthenticationServices()}}>
+                        <li className="duration-700 cursor-pointer" onClick={() => showAuthenticationServices()} onKeyPress={(e) => { e.key === 'Enter' && showAuthenticationServices() }}>
                             <SideNavMenuItem title={t('dashboard.authenticationServices')} id='authenticationServices' isExpanded={open} activeIcon={activeIcon} />
                         </li>
                     }
+                    {enableDeviceProviderServicesMenu &&
+                        <li className="duration-700 cursor-pointer" onClick={() => showDeviceProviderServices()} onKeyPress={(e) => { e.key === 'Enter' && showDeviceProviderServices() }}>
+                            <SideNavMenuItem title={t('dashboard.deviceProviderServices')} id='deviceProviderServices' isExpanded={open} activeIcon={activeIcon} />
+                        </li>
+                    }
                 </ul>
             </div>
         </div>

diff --git a/pmp-reactjs-ui/src/nav/SideNavMenuItem.js b/pmp-reactjs-ui/src/nav/SideNavMenuItem.js