feat(admin-ui): revamp User Management module as per Figma

admin-ui/app/context/theme/config.ts

@@ -58,6 +58,14 @@ export interface ThemeConfig {
     removeButton: { bg: string; text: string }
     errorButtonText: string
   }
+  /** Available Claims panel (User Management) */
+  availableClaims: {
+    panelBackground: string
+    contentBackground: string
+    selectionBackground: string
+    selectionColor: string
+    focusOutline: string
+  }
 }
 
 const createLightTheme = (): ThemeConfig => {
@@ -147,6 +155,13 @@ const createLightTheme = (): ThemeConfig => {
       removeButton: { bg: customColors.statusInactive, text: customColors.white },
       errorButtonText: customColors.white,
     },
+    availableClaims: {
+      panelBackground: background,
+      contentBackground: customColors.white,
+      selectionBackground: customColors.claimsSelectionBg,
+      selectionColor: customColors.statusActive,
+      focusOutline: customColors.lightBlue,
+    },
   }
 }
 
@@ -237,6 +252,13 @@ const createDarkTheme = (): ThemeConfig => {
       removeButton: { bg: customColors.statusInactive, text: customColors.white },
       errorButtonText: customColors.white,
     },
+    availableClaims: {
+      panelBackground: customColors.darkInputBg,
+      contentBackground: customColors.darkCardBg,
+      selectionBackground: customColors.claimsSelectionBgDark,
+      selectionColor: customColors.statusActive,
+      focusOutline: customColors.lightBlue,
+    },
   }
 }
 

admin-ui/app/customColors.ts

@@ -11,6 +11,7 @@ export const customColors = {
   primaryDark: '#0a2540',
   darkBackground: '#0b2947',
   darkCardBg: '#091e34',
+  userFormPageBg: '#1A3150',
   darkDropdownBg: '#194169',
   lightInputBg: '#f9fafb',
   darkInputBg: '#15395d',
@@ -39,6 +40,11 @@ export const customColors = {
   statusInactive: '#f13f44',
   statusInactiveBg: '#ffe6e7',
 
+  // Claims selection (Available Claims panel hover/selection)
+  claimsSelectionBorder: '#8FE4BF',
+  claimsSelectionBg: '#B6F6DA',
+  claimsSelectionBgDark: '#1a4535',
+
   // Disabled Badge
   disabledBadgeLightBg: '#D9E1E8',
   disabledBadgeLightText: '#425466',

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

@@ -3,6 +3,14 @@
   "show_less": "Show Less",
   "set": "Set",
   "to": "to",
+  "Username": "Username",
+  "User Role": "User Role",
+  "User certificate": "User certificate",
+  "Email Verified": "Email Verified",
+  "Nickname": "Nickname",
+  "Gender, male or female": "Gender, male or female",
+  "Website URL": "Website URL",
+  "memberOf": "Member Of",
   "actions": {
     "accept": "Accept",
     "add_attribute_mapping": "Add Attribute Mapping",
@@ -48,6 +56,7 @@
     "change_password": "Change Password",
     "close": "Close",
     "clear": "Clear",
+    "clear_search": "Clear search",
     "try_again": "Try Again",
     "delete": "Delete",
     "revoke": "Revoke",
@@ -68,6 +77,10 @@
     "add_custom_attributes": "Add custom attributes",
     "refresh": "Refresh"
   },
+  "password": {
+    "show": "Show password",
+    "hide": "Hide password"
+  },
   "serviceDownFallback": "Gluu Flex Admin UI is not getting any response from the backend (Jans Config Api).",
   "roleNotFoundMessage": "Unauthorized User",
   "roleNotFoundDescription": "The logged-in user does not have a valid role. Logging out of Admin UI",
@@ -248,6 +261,8 @@
     "selected_idp": "Selected IDP",
     "sp_metadata_file": "IDP Metadata File",
     "displayName": "Display Name",
+    "firstName": "First Name",
+    "middleName": "Middle Name",
     "enable_tr": "Enable TR",
     "import_metadata_from_file": "Upload Metadata file",
     "idp_entity_id": "Entity Id",
@@ -357,6 +372,7 @@
     "introspection_scripts": "Introspection",
     "ropcScripts": "Password Grant",
     "inum": "inum",
+    "INUM": "INUM",
     "ip_address": "IP Address",
     "is_active": "Active",
     "is_expirable_client": "Is Expirable Client?",
@@ -572,6 +588,7 @@
     "deletable": "Deletable",
     "email": "Email",
     "userName": "User Name",
+    "userRole": "Jans Admin UI Role",
     "nickName": "Nick Name",
     "modality": "Modality",
     "dateAdded": "Date Added",
@@ -758,6 +775,7 @@
     "fido": "FIDO",
     "schema": "Schema",
     "user_claims": "User Claims",
+    "available_claims": "Available Claims",
     "scopes": "Scopes",
     "scripts": "Scripts",
     "services": "Services",
@@ -822,6 +840,7 @@
     "all_webhooks_triggered_successfully": "All webhooks triggered successfully.",
     "failed_to_trigger_webhook": "Something went wrong while triggering webhook.",
     "webhook_entity": "webhook",
+    "user_entity": "user",
     "no_shortcodes_found": "No shortcodes found!",
     "create_first_webhook": "Create your first webhook to get started",
     "permission_name_error": "Please ensure the permission name is at least 5 characters long.",
@@ -906,6 +925,7 @@
     "view_client_details": "View client details",
     "view_2FA_details": "View 2FA details",
     "2FA_details": "2FA details",
+    "details": "Details",
     "view_script_details": "View custom script details",
     "add_new_user": "Add User",
     "error_in_saving": "Error in saving.",
@@ -985,11 +1005,19 @@
     "user_created_successfully": "User created successfully",
     "user_updated_successfully": "User updated successfully",
     "user_deleted_successfully": "User deleted successfully",
+    "audit_logging_failed": "The action completed, but audit logging failed.",
+    "webhook_trigger_failed": "The action completed, but the webhook trigger failed.",
+    "query_invalidation_failed": "The action completed, but query cache invalidation failed.",
+    "post_delete_callback_failed": "The action completed, but a post-delete callback failed.",
     "password_changed_successfully": "Password changed successfully",
+    "session_revoke_failed": "Password was changed but session could not be revoked. The user may still be signed in.",
+    "session_revoke_failed_changes_saved": "Session revocation failed; changes saved.",
     "persistence_config_load_failed": "Failed to load persistence configuration",
     "persistence_config_load_failed_detail": "Could not load persistence configuration. LDAP-specific settings may not be applied correctly.",
     "revokeUserSession": "The user's session will be revoked as one or more of the following fields have been modified: Password, Status, Admin Role.",
     "device_deleted_successfully": "Device deleted successfully",
+    "loading_roles": "Loading roles...",
+    "failed_load_roles": "Failed to load roles",
     "service_status_up": "Service is running normally.",
     "service_status_down": "Service is currently unavailable.",
     "service_status_degraded": "Service is experiencing issues.",
@@ -1064,6 +1092,8 @@
   },
   "placeholders": {
     "id": "Enter id",
+    "search": "Search",
+    "search_here": "Search Here",
     "action_commit_message": "Provide the reason of this change",
     "activate_ldap_configuration": "Activate ldap configuration",
     "client_description": "Enter the client description",
@@ -1096,6 +1126,7 @@
     "redirect_uri": "Enter a redirect URI",
     "redirect_uris": "Enter a redirect URI in format (e.g. https:// or schema://",
     "search_pattern": "Search pattern",
+    "search_claims_here": "Search claims here",
     "asset_upload": "Drag 'n' drop .jar/.css/.xhtml/.js/.png/.jpeg/.jpg/.gif/.properties file here, or click to select file",
     "select_file_to_upload": "Select a file to upload",
     "enter_here": "Enter Here",

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

@@ -3,9 +3,17 @@
   "show_less": "Mostrar menos",
   "set": "Establecer",
   "to": "a",
+  "Username": "Nombre de usuario",
+  "User Role": "Rol de usuario",
+  "User certificate": "Certificado de usuario",
+  "Email Verified": "Correo verificado",
+  "Nickname": "Apodo",
+  "Gender, male or female": "Género, masculino o femenino",
+  "Website URL": "URL del sitio web",
+  "memberOf": "Miembro de",
   "actions": {
     "accept": "Aceptar",
-    "add_attribute_mapping": "AceptarAgregar mapeo de atributos",
+    "add_attribute_mapping": "Agregar mapeo de atributos",
     "finish": "Finalizar",
     "add": "Añadir",
     "add_ldap_configuration": "Agregar configuración LDAP",
@@ -48,6 +56,7 @@
     "change_password": "Cambiar contraseña",
     "close": "Cerrar",
     "clear": "Limpiar",
+    "clear_search": "Limpiar búsqueda",
     "try_again": "Intentar de nuevo",
     "delete": "Eliminar",
     "revoke": "Revocar",
@@ -68,6 +77,10 @@
     "add_custom_attributes": "Agregar atributos personalizados",
     "refresh": "Actualizar"
   },
+  "password": {
+    "show": "Mostrar contraseña",
+    "hide": "Ocultar contraseña"
+  },
   "serviceDownFallback": "Gluu Flex Admin UI no recibe respuesta del backend (Jans Config Api).",
   "roleNotFoundMessage": "Usuario no autorizado",
   "roleNotFoundDescription": "El usuario conectado no tiene un rol válido. Cerrando sesión de Admin UI",
@@ -248,6 +261,8 @@
     "selected_idp": "IDP Seleccionado",
     "sp_metadata_file": "Archivo de Metadatos del IDP",
     "displayName": "Nombre para Mostrar",
+    "firstName": "Nombre",
+    "middleName": "Segundo nombre",
     "enable_tr": "Habilitar TR",
     "import_metadata_from_file": "Subir Archivo de Metadatos",
     "idp_entity_id": "ID de Entidad",
@@ -357,6 +372,7 @@
     "introspection_scripts": "Scripts de Introspección",
     "ropcScripts": "Concesión por Contraseña",
     "inum": "inum",
+    "INUM": "INUM",
     "ip_address": "Dirección IP",
     "is_active": "Activo",
     "is_expirable_client": "¿Cliente Expirable?",
@@ -560,7 +576,6 @@
     "customerEmail": "Correo del Cliente",
     "customerName": "Nombre del Cliente",
     "licenseDetails": "Detalles de la Licencia",
-    "username": "Usuario",
     "connectionUris": "URIs de Conexión",
     "schemaName": "Nombre del Esquema",
     "passwordEncryptionMethod": "Método de Cifrado de Contraseña",
@@ -574,6 +589,8 @@
     "deletable": "Eliminable",
     "email": "Correo",
     "userName": "Nombre de Usuario",
+    "username": "Nombre de usuario",
+    "userRole": "Rol de Jans Admin UI",
     "nickName": "Apodo",
     "modality": "Modalidad",
     "dateAdded": "Fecha de Alta",
@@ -758,6 +775,7 @@
     "fido": "FIDO",
     "schema": "Esquema",
     "user_claims": "Atributos de Usuario",
+    "available_claims": "Reclamaciones disponibles",
     "scopes": "Ámbitos",
     "scripts": "Scripts",
     "services": "Servicios",
@@ -820,6 +838,7 @@
     "all_webhooks_triggered_successfully": "Todos los webhooks se activaron correctamente.",
     "failed_to_trigger_webhook": "Algo salió mal al activar el webhook.",
     "webhook_entity": "webhook",
+    "user_entity": "usuario",
     "no_shortcodes_found": "¡No se encontraron shortcodes!",
     "create_first_webhook": "Cree su primer webhook para comenzar",
     "permission_name_error": "Asegúrese de que el nombre del permiso tenga al menos 5 caracteres.",
@@ -906,6 +925,7 @@
     "view_client_details": "Ver detalles del cliente",
     "view_2FA_details": "Ver detalles de 2FA",
     "2FA_details": "Detalles de 2FA",
+    "details": "Detalles",
     "view_script_details": "Ver detalles del script personalizado",
     "add_new_user": "Agregar Usuario",
     "error_in_saving": "Error al guardar.",
@@ -981,9 +1001,17 @@
     "user_created_successfully": "Usuario creado exitosamente",
     "user_updated_successfully": "Usuario actualizado exitosamente",
     "user_deleted_successfully": "Usuario eliminado exitosamente",
+    "audit_logging_failed": "La acción se completó, pero falló el registro de auditoría.",
+    "webhook_trigger_failed": "La acción se completó, pero falló el disparador del webhook.",
+    "query_invalidation_failed": "La acción se completó, pero falló la invalidación de la caché de consultas.",
+    "post_delete_callback_failed": "La acción se completó, pero falló una devolución de llamada posterior al borrado.",
     "password_changed_successfully": "Contraseña cambiada exitosamente",
+    "session_revoke_failed": "La contraseña se cambió pero no se pudo revocar la sesión. El usuario puede seguir conectado.",
+    "session_revoke_failed_changes_saved": "No se pudo revocar la sesión; los cambios se guardaron.",
     "revokeUserSession": "La sesión del usuario será revocada, ya que uno o más de los siguientes campos han sido modificados: contraseña, estado, rol de administrador.",
     "device_deleted_successfully": "Dispositivo eliminado exitosamente",
+    "loading_roles": "Cargando roles...",
+    "failed_load_roles": "Error al cargar roles",
     "service_status_up": "El servicio está funcionando normalmente.",
     "service_status_down": "El servicio no está disponible actualmente.",
     "service_status_degraded": "El servicio está experimentando problemas.",
@@ -1052,6 +1080,8 @@
   },
   "placeholders": {
     "id": "Introduce el id",
+    "search": "Buscar",
+    "search_here": "Buscar aquí",
     "action_commit_message": "Indica el motivo de este cambio",
     "activate_ldap_configuration": "Activar configuración LDAP",
     "client_description": "Introduce la descripción del cliente",
@@ -1084,6 +1114,7 @@
     "redirect_uri": "Introduce un URI de redirección",
     "redirect_uris": "Introduce un URI de redirección en formato (ej. https:// o schema://)",
     "search_pattern": "Patrón de búsqueda",
+    "search_claims_here": "Buscar reclamaciones aquí",
     "asset_upload": "Arrastre y suelte .jar/.css/.xhtml/.js/.png/.jpeg/.jpg/.gif/.properties aquí, o haga clic para seleccionar archivo",
     "select_file_to_upload": "Seleccione un archivo para subir",
     "enter_here": "Ingrese aquí",