fix(admin-ui): update token script should reject the tampered user-in…

…fo-jwt

admin-ui/app/locales/en/translation.json

@@ -84,7 +84,10 @@
     "config_api_status":"Config API Status",
     "key_cloak":"Keycloak",
     "jans_lock":"Jans Lock",
-    "jans_link":"Jans Link"
+    "jans_link":"Jans Link",
+    "access_denied":"Access Denied",
+    "access_denied_message":"You do not have permission to access this page",
+    "access_contact_admin":"Please contact your administrator for more information"
   },
   "fields": {
     "access_token_signing_alg": "JWS alg for signing",

admin-ui/app/locales/fr/translation.json

@@ -31,7 +31,10 @@
     "config_api_status": "État de l'API de configuration",
     "key_cloak": "Keycloak",
     "jans_lock": "Jans Lock",
-    "jans_link": "Lien Jans"
+    "jans_link": "Lien Jans",
+    "access_denied":"Accès refusé",
+    "access_denied_message":"Vous n'êtes pas autorisé à accéder à cette page",
+    "access_contact_admin":"Veuillez contacter l'administrateur pour obtenir de l'aide"
   },
   "menus": {
     "adminui": "Administratrice",

admin-ui/app/locales/pt/translation.json

@@ -31,7 +31,10 @@
     "config_api_status": "Status da API de configuração",
     "key_cloak": "Keycloak",
     "jans_lock": "Jans Lock",
-    "jans_link": "Link Jans"
+    "jans_link": "Link Jans",
+    "access_denied":"Acesso negado",
+    "access_denied_message":"Entre em contato com o administrador para obter ajuda",
+    "access_contact_admin":"Se você acha que isso é um erro, entre em contato com o administrador"
   },
   "menus": {
     "adminui": "Admin",

admin-ui/app/routes/Apps/Gluu/GluuPermissionModal.js

@@ -0,0 +1,49 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { Button, Modal, ModalBody, ModalFooter, ModalHeader } from "reactstrap";
+
+const GluuPermissionModal = ({ description = "", handler, isOpen }) => {
+  const { t } = useTranslation();
+
+  return (
+    <div>
+      <Modal
+        centered
+        isOpen={isOpen}
+        style={{ minWidth: "45vw" }}
+        toggle={handler}
+        className="modal-outline-primary"
+        backdrop="static"
+      >
+        <ModalHeader>
+          <i className="bi bi-shield-lock" /> {t("dashboard.access_denied")}
+        </ModalHeader>
+        <ModalBody className="text-center">
+          <p className="text-muted">
+            🚫 <strong>{t("dashboard.access_denied_message")}</strong>
+          </p>
+          <p>{t("dashboard.access_contact_admin")}</p>
+        </ModalBody>
+        <ModalFooter>
+          <Button
+            className="d-flex align-items-center"
+            onClick={handler}
+          >
+            {t("menus.signout")}
+          </Button>
+        </ModalFooter>
+      </Modal>
+
+      {/* Scoped CSS inside the component */}
+      <style>
+        {`
+          .modal {
+            background: #000 !important;
+          }
+        `}
+      </style>
+    </div>
+  );
+};
+
+export default GluuPermissionModal;

admin-ui/app/routes/Dashboards/DashboardPage.js

@@ -26,6 +26,8 @@ import UsersIcon from "Components/SVG/menu/Users";
 import Administrator from "Components/SVG/menu/Administrator";
 import OAuthIcon from "Components/SVG/menu/OAuth";
 import { getHealthServerStatus } from "../../redux/features/healthSlice";
+import GluuPermissionModal from "Routes/Apps/Gluu/GluuPermissionModal";
+import { auditLogoutLogs } from "../../../plugins/user-management/redux/features/userSlice";
 
 function DashboardPage() {
   const { t } = useTranslation();
@@ -80,20 +82,22 @@ function DashboardPage() {
   }, [statData]);
 
   useEffect(() => {
-    if (Object.keys(license).length === 0 && access_token) {
+    if (Object.keys(license).length === 0 && access_token && hasBoth(permissions, STAT_READ, STAT_JANS_READ)) {
       getLicense();
     }
   }, [access_token, license]);
 
   useEffect(() => {
-    if (clients.length === 0 && access_token) {
+    if (clients.length === 0 && access_token && hasBoth(permissions, STAT_READ, STAT_JANS_READ)) {
       buildPayload(userAction, "Fetch openid connect clients", {});
       dispatch(getClients({ action: userAction }));
     }
   }, [access_token, clients]);
 
   useEffect(() => {
-    if (access_token) {
+
+    if (access_token && hasBoth(permissions, STAT_READ, STAT_JANS_READ)) {
+      console.log("access_token", access_token,hasBoth(permissions, STAT_READ, STAT_JANS_READ));
       getServerStatus();
       buildPayload(userAction, "GET Health Status", { service: "all" });
       dispatch(getHealthServerStatus({ action: userAction }));
@@ -289,14 +293,23 @@ function DashboardPage() {
     );
   }, [serverStatus, serverHealth, dbStatus, t, statusDetails, classes]);
 
+  const handleLogout = () => {
+    dispatch(auditLogoutLogs({ message: "Logging out due to insufficient permissions for Admin UI access." }));
+  };
+
   return (
     <GluuLoader blocking={loading}>
+      <GluuPermissionModal
+        handler={() => {
+          handleLogout();
+        }}
+        isOpen={!hasBoth(permissions, STAT_READ, STAT_JANS_READ)}
+      />
       <GluuViewWrapper
         canShow={hasBoth(permissions, STAT_READ, STAT_JANS_READ)}
       >
         <div className={classes.root}>
           <Grid container className="px-40 h-100" spacing={2}>
-
             <Grid item lg={3} md={12} xs={12} height="auto">
               <div
                 className={classes.userInfoTitle}
@@ -336,13 +349,7 @@ function DashboardPage() {
               {StatusCard}
             </Grid>
 
-            <Grid
-              item
-              lg={4}
-              md={12}
-              xs={12}
-
-            >
+            <Grid item lg={4} md={12} xs={12}>
               <Paper
                 className={`${classes.dashboardCard} top-minus-40 d-flex justify-content-center`}
                 elevation={0}
@@ -396,7 +403,6 @@ function DashboardPage() {
                 </Grid>
               </Paper>
             </Grid>
-
           </Grid>
 
           <Grid container className={`px-40`}>