Delegated Administration: Settings Query Hook

El Settings Query Hook le permite personalizar el aspecto y la experiencia de uso de la extensión Delegated Administration.

Contrato del Hook

ctx: Objeto de contexto.
- request.user: Usuario con la sesión iniciada actualmente.
- locale: Configuración regional (inferida de la URL) — https://{yourTenant}.us.webtask.io/auth0-delegated-admin/en/users establecerá locale en en.
callback(error, settings): Callback en el que puede devolver un error y un objeto de configuración.

Ejemplo de uso

function(ctx, callback) {
  var department = ctx.request.user.app_metadata && ctx.request.user.app_metadata.department;

  return callback(null, {
    // Solo estas conexiones deben ser visibles en el selector de conexiones. Si solo hay una conexión disponible, el selector de conexiones no se mostrará en la interfaz de usuario.
    connections: [ 'Username-Password-Authentication', 'My-Custom-DB' ],
    // El diccionario permite sobrescribir el título del dashboard y la etiqueta "Memberships" en el diálogo Crear usuario.
    dict: {
      title: department ? department + ' User Management' : 'User Management Dashboard',
      memberships: 'Departments',
      menuName: ctx.request.user.name
    },
    // La opción CSS permite inyectar un archivo CSS personalizado según el contexto del usuario actual (p. ej.: un CSS diferente para cada cliente)
    css: (department && department !== 'IT') && 'https://cdn.jsdelivr.net/gh/auth0-extensions/auth0-delegated-administration-extension/docs/theme/fabrikam.css',
    // Esta opción permite restringir la creación de nuevos usuarios
    canCreateUser: (department === 'IT')
  });
}

Propiedades

connections: Lista de conexiones en las que este administrador puede crear y editar usuarios.
dict: Diccionario que le permite reemplazar el título del Dashboard y la etiqueta Membresías en el cuadro de diálogo Crear usuario.
- dict.title: Título que se mostrará en la parte superior de la interfaz de usuario.
- dict.memberships: Etiqueta que se establecerá para los campos de membresías.
- dict.menuName: Nombre que se establecerá para el menú desplegable de la esquina superior derecha.
- dict.logoutUrl: URL alternativa para la opción de menú de cierre de sesión.
userFields: Array de campos de usuario (consulte “Campos personalizados” más abajo).
css: URL de tipo cadena para importar CSS.
altcss: URL de tipo cadena para importar un segundo conjunto de CSS. Puede usarla para especificar elementos como CSS de accesibilidad para fuentes más grandes. Al usuario se le mostrará una opción de menú que le permitirá activar o desactivar este conjunto de CSS.
languageDictionary: URL de tipo cadena u objeto de diccionario (consulte “Localización” más abajo).
suppressRawData: Establézcalo en true para omitir las páginas que muestran JSON sin procesar
errorTranslator: Función que traduce mensajes de error según la localización. Ejemplo: (function (error, languageDictionary) { return languageDictionary.customErrors[error] || error; }).toString()
canCreateUser: Indicador booleano. Si se establece en false, elimina el botón Create User y prohíbe crear nuevos usuarios; true de forma predeterminada.

Campos personalizados

A partir de la versión 3.0 de la extensión de administración delegada, puede definir campos personalizados y especificar sus valores. Los campos personalizados se pueden almacenar en los campos de metadatos del usuario y metadatos de la aplicación, a los que se puede acceder durante los procesos de creación o actualización del usuario. También puede personalizar campos existentes definidos por Auth0, como correo electrónico, username, nombre y conexión. Para usar campos personalizados, debe:

Agregar su lista de userFields a Settings Query Hook
Implementar un Write Hook. Los campos personalizados requieren el uso de Write Hook para actualizar correctamente user_metadata y app_metadata. Debe actualizar el objeto de usuario que se pasa a la función callback con user_metadata y app_metadata del contexto (objeto ctx) proporcionado al Hook.

Para obtener más información sobre los Write Hooks, consulte Delegated Administration: Write Hook. Esquema de ejemplo para userFields:

userFields: [
    {
        "property": string, // obligatorio
        "label": string,
        "sortProperty": string,
        "display": true || function.toString(),
        "search": false || {
            "display": true || function.toString()
            "listOrder": 1,
            "listSize": string(###%), // p. ej. 15%
            "filter": boolean,
            "sort": boolean
        },
        "edit": false || {
            "display": true || function.toString()
            "type": "text || select || password || hidden",
            "component": "InputText || Input Combo || InputMultiCombo || InputSelectCombo",
            "options": Array(string) || Array ({ "value": string, "label": string }),
            "disabled": true || false,
            "validationFunction": function.toString()
        },
        "create": false || {
            "display": true || function.toString()
            "type": "text || select || password || hidden",
            "component": "InputText || Input Combo || InputMultiCombo || InputSelectCombo",
            "options": Array(string) || Array ({ "value": string, "label": string }),
            "disabled": true || false,
            "validationFunction": function.toString()
        }
    },
    ...
]

property (obligatorio): Nombre de la propiedad del objeto ctx.payload para el Write Hook. En el Write Hook, "property": "app_metadata.dbId" establece el valor de ctx.payload.app_metadata.dbId.
label: Etiqueta que se usará al añadir una etiqueta al campo en la página de información del usuario, la página de creación, la página de edición del perfil o la página de búsqueda.
sortProperty: Si para la tabla de búsqueda se ordena por un campo distinto de este, use este campo. Se admite la notación de puntos.
display: true || false || stringified => Este es el valor de visualización predeterminado. Si no se anula en search, edit o create, se usará este valor.
- si es true, simplemente devolverá user.<property>.
- Predeterminado: si es false, este valor no se mostrará en ninguna página (a menos que se anule en search, edit o create).
- si es una función convertida en cadena, ejecuta la función para obtener el valor que se mostrará. Ejemplo: (function display(user, value, languageDictionary) { return moment(value).fromNow(); }).toString()
search: false || object => Indica cómo se comportará este campo en la página de búsqueda.
- Predeterminado: si es false, no se mostrará en la tabla de búsqueda.
- search.display: Sobrescribe el valor de visualización predeterminado.
- search.listOrder: Especifica el orden de las columnas en la tabla de resultados de búsqueda.
- search.listSize: Especifica el ancho predeterminado de la columna.
- search.filter: Especifica si se permite buscar este campo en el menú desplegable de búsqueda. El valor predeterminado es false.
- search.sort: Especifica si esta columna se puede ordenar. Use sortProperty si desea ordenar por un campo distinto de property. El valor predeterminado es false.
edit: false || object => Indica si el campo aparece en los cuadros de diálogo de edición. Si no es un campo predeterminado y se configura como un objeto, aparecerá en la página Change Profile, en el menú desplegable User Actions de la página del usuario.
- Predeterminado: si es false, no aparecerá en ninguna página de edición/actualización.
- edit.display: Sobrescribe el valor de visualización predeterminado.
- edit.required: Establézcalo en true para que falle si no tiene ningún valor. El valor predeterminado es false.
- edit.type required: text || select || password
- edit.component: InputText || Input Combo || InputMultiCombo || InputSelectCombo
  - InputText (predeterminado): Cuadro de texto simple.
  - InputCombo: Lista desplegable con búsqueda, con un solo valor.
  - InputMultiCombo: Lista desplegable con búsqueda que permite varios valores.
  - InputSelectCombo: Lista desplegable de opciones.
- edit.options: Si el componente es InputCombo, InputMultiCombo o InputSelectCombo, se deben especificar los valores de las opciones.
  - Array(string): Matriz de valores (los campos label y value se establecerán con el mismo valor).
  - Array({ “value”: string, “label”: string }): Permite establecer valores distintos para value y label. Como resultado, el valor en el Write Hook tendrá ese mismo valor, pero puede simplificarse para dejar solo el valor en el Write Hook.
  - La validación del lado del servidor garantizará que cualquier valor especificado para este campo aparezca en la matriz options.
- edit.disabled: true si el componente debe ser de solo lectura; el valor predeterminado es false.
- edit.validateFunction: Función convertida en cadena para la validación. Tenga en cuenta que esta función de validación se ejecutará tanto del lado del servidor como del cliente. Ejemplo: (function validate(value, values, context, languageDictionary) { if (value...) return 'something went wrong'; return false; }).toString().
create: false || object => Indica si el campo se muestra en el cuadro de diálogo de creación.
- Predeterminado: si es false, no aparecerá en la página de creación.
- create.placeholder: Proporcione un texto de marcador de posición que se mostrará cuando el campo de entrada esté vacío.
- create.required: Establézcalo en true para que se produzca un error si no tiene un valor. El valor predeterminado es false.
- create.type required: text || select || password
- create.component: InputText || Input Combo || InputMultiCombo || InputSelectCombo
  - InputText (predeterminado): Cuadro de texto. Es el valor predeterminado para los tipos text y password.
  - InputCombo: Lista desplegable con búsqueda, de un solo valor.
  - InputMultiCombo: Lista desplegable con búsqueda que permite varios valores.
  - InputSelectCombo: Lista desplegable de selección de opciones.
- create.options: Si el componente es InputCombo, InputMultiCombo o InputSelectCombo, se deben especificar los valores de las opciones.
  - Array(string): Matriz simple de valores; la etiqueta y el valor tendrán el mismo valor.
  - Array({ “value”: string, “label”: string }): Le permite establecer valores independientes para el valor y la etiqueta. Esto hará que el valor en el Write Hook sea el mismo, pero puede reducirse para dejar solo el valor en el Write Hook.
  - La validación del lado del servidor garantizará que cualquier valor especificado para este campo esté en la matriz de opciones.
- create.disabled: true si el componente debe ser de solo lectura; el valor predeterminado es false.
- create.validateFunction: Función convertida en cadena para comprobar la validación.
  - Ejemplo: (function validate(value, values, context, languageDictionary) { if (value...) return 'something went wrong'; return false; }).toString()
  - Esta función de validación se ejecutará tanto del lado del servidor como del cliente.

Campos predefinidos

Hay un conjunto de campos predefinidos en los que se puede buscar para el comportamiento predeterminado. Puede sobrescribir el comportamiento predeterminado agregando el campo como un userField y, luego, sobrescribiendo el comportamiento que quiera cambiar. Esto suele hacerse para ocultar un campo estableciendo display en false.

Campos de búsqueda

name: Campo generado a partir de otros campos: función de visualización predeterminada: (function(user, value) { return (value || user.nickname || user.email || user.user_id); }).toString()
email: Dirección de correo electrónico o N/D
last_login_relative: Hora del último inicio de sesión
logins_count: Número de inicios de sesión
connection: Conexión de base de datos

Campos de información del usuario

user_id: ID del usuario
name: Nombre del usuario
username: Nombre de usuario del usuario
email: Correo electrónico del usuario
identity.connection: Valor de la conexión
isBlocked: Si el usuario está bloqueado o no
blocked_for: Si el usuario tiene bloqueos por
last_ip: Última IP que el usuario utilizó para iniciar sesión
logins_count: Número de veces que el usuario ha iniciado sesión
currentMemberships: Lista de membresías de este usuario
created_at: Fecha y hora en que se creó el usuario
updated_at: Fecha y hora en que se actualizó el usuario
last_login: Fecha y hora en que el usuario inició sesión por última vez

Crear y editar campos del usuario

connection: Base de datos del usuario
password: Nueva contraseña
repeatPassword: Confirmación de la contraseña del usuario
email: Correo electrónico del usuario
username: Username del usuario

Ejemplo de uso

function(ctx, callback) {
  var department = ctx.request.user.app_metadata && ctx.request.user.app_metadata.department;

  return callback(null, {
    // Solo estas conexiones deben ser visibles en el selector de conexiones.
    // Si solo hay una conexión disponible, el selector de conexiones no se mostrará en la interfaz.
    connections: [ 'Username-Password-Authentication', 'My-Custom-DB' ],
    // El diccionario permite sobrescribir el título del dashboard y la etiqueta "Memberships" en el diálogo Crear usuario.
    dict: {
      title: department ? department + ' User Management' : 'User Management Dashboard',
      memberships: 'Departments'
    },
    // User Fields son los campos personalizados que pueden mostrarse en la creación y edición, usarse para búsquedas y personalizar la página de visualización del usuario
    userFields: [
        {
            "label": "Conexión",
            "property": "connection",
        },
        {
            "label": "Correo Electrónico",
            "property": "email",
        },
        ...
    ],
    // La opción CSS permite inyectar un archivo CSS personalizado según el contexto del usuario actual (p. ej.: un CSS diferente para cada cliente)
    css: (department && department !== 'IT') && 'https://cdn.jsdelivr.net/gh/auth0-extensions/auth0-delegated-administration-extension/docs/theme/fabrikam.css',
    languageDictionary: 'https://your-cdn.com/locale/es.json'
  });
}

Localización

A partir de la versión 3.0 de la extensión de administración delegada, puede proporcionar un diccionario de idioma para usarlo con la localización. El diccionario de idioma se usa solo para el contenido estático de la página; para el contenido a nivel de campo, debe usar las etiquetas de userFields.

La localización está pensada para quienes trabajan con funciones no administrativas al gestionar usuarios. Actualmente, Auth0 no admite la localización en ninguna de las páginas de Configuration.

Para especificar la configuración regional, puede usar la ruta. Por ejemplo, https://{yourTenant}.us.webtask.io/auth0-delegated-admin/en/users establecerá context.locale en en en la consulta de configuración. El languageDictionary se configura como parte de la consulta de configuración, lo que le permite:

Definir explícitamente un languageDictionary
Proporcionar una URL para obtener el contenido del parámetro languageDictionary

Para obtener más información, puede consultar el archivo del diccionario de idioma de la extensión Delegated Administration.

Ejemplo: Proporcionar un enlace al archivo del diccionario de idioma

function(ctx, callback) {
  var department = ctx.request.user.app_metadata && ctx.request.user.app_metadata.department;

  return callback(null, {
    // Solo estas conexiones deben ser visibles en el selector de conexiones.
    // Si solo hay una conexión disponible, el selector de conexiones no se mostrará en la interfaz.
    connections: [ 'Username-Password-Authentication', 'My-Custom-DB' ],
    // El diccionario permite sobrescribir el título del dashboard y la etiqueta "Memberships" en el diálogo Crear usuario.
    dict: {
      title: department ? department + ' User Management' : 'User Management Dashboard',
      memberships: 'Departments'
    },
    // User Fields son los campos personalizados que pueden mostrarse en la creación y edición, usarse para búsquedas y personalizar la página de visualización del usuario
    userFields: [
        {
            "label": "Conexión",
            "property": "connection",
        },
        {
            "label": "Correo Electrónico",
            "property": "email",
        },
        ...
    ],
    // La opción CSS permite inyectar un archivo CSS personalizado según el contexto del usuario actual (p. ej.: un CSS diferente para cada cliente)
    css: (department && department !== 'IT') && 'https://cdn.jsdelivr.net/gh/auth0-extensions/auth0-delegated-administration-extension/docs/theme/fabrikam.css',
    languageDictionary: 'https://your-cdn.com/locale/es.json'
  });
}

Ejemplo: proporcionar un objeto de diccionario de idioma

function(ctx, callback) {
  var department = ctx.request.user.app_metadata && ctx.request.user.app_metadata.department;

  return callback(null, {
    // Solo estas conexiones deben ser visibles en el selector de conexiones.
    // Si solo hay una conexión disponible, el selector de conexiones no se mostrará en la interfaz.
    connections: [ 'Username-Password-Authentication', 'My-Custom-DB' ],
    // El diccionario permite sobrescribir el título del dashboard y la etiqueta "Memberships" en el diálogo Crear usuario.
    dict: {
      title: department ? department + ' User Management' : 'User Management Dashboard',
      memberships: 'Departments'
    },
    // User Fields son los campos personalizados que pueden mostrarse en la creación y edición, también pueden usarse para búsquedas y para personalizar la página de vista de usuario
    userFields: [
        {
            "label": "Conexión",
            "property": "connection",
        },
        {
            "label": "Correo Electrónico",
            "property": "email",
        },
        ...
    ],
    // La opción CSS permite inyectar un archivo CSS personalizado según el contexto del usuario actual (p. ej.: un CSS diferente para cada cliente)
    css: (department && department !== 'IT') && 'https://cdn.jsdelivr.net/gh/auth0-extensions/auth0-delegated-administration-extension/docs/theme/fabrikam.css',
    languageDictionary: {
        loginsCountLabel: 'Cantidad de Logins:',
        searchBarPlaceholder: 'Busqueda de usuarios usando la sintaxis de Lucene',
        deviceNameColumnHeader: 'Dispositivo',
        ...
    }
  });
}

​Contrato del Hook

​Ejemplo de uso

​Propiedades

​Campos personalizados

​Campos predefinidos

​Campos de búsqueda

​Campos de información del usuario

​Crear y editar campos del usuario

​Ejemplo de uso

​Localización

​Ejemplo: Proporcionar un enlace al archivo del diccionario de idioma

​Ejemplo: proporcionar un objeto de diccionario de idioma

​Más información

Contrato del Hook

Ejemplo de uso

Propiedades

Campos personalizados

Campos predefinidos

Campos de búsqueda

Campos de información del usuario

Crear y editar campos del usuario

Ejemplo de uso

Localización

Ejemplo: Proporcionar un enlace al archivo del diccionario de idioma

Ejemplo: proporcionar un objeto de diccionario de idioma

Más información