Mostrar/ocultar "Crear DitaMAP" del menú contextual de carpeta en el editor web
En este artículo, aprenderemos a personalizar el Editor web de guías para ocultar o mostrar la opción "Crear DitaMap" en el menú contextual de la carpeta en función de los permisos de usuario/grupo.
En este caso de uso, ocultaremos esta opción para todos los usuarios que no sean autores.
Requisitos previos
Aprovecharemos el paquete de extensión de AEM Guides que le permite personalizar la interfaz de usuario de su aplicación según sus necesidades.
Consulte esta documentación para obtener más información sobre cómo funciona el marco de trabajo de extensión de guías.
Ahora vamos a empezar y aprender a personalizar el menú contextual de la carpeta para ocultar esta opción para todos los usuarios que no sean autores.
Como puede ver en el siguiente fragmento, la opción "create DitaMap" es visible para un usuario autor.
Ahora veamos cómo podemos ocultar esta opción mediante el marco de trabajo de extensión de Guides.
Pasos de implementación
La implementación se desglosa en las siguientes partes:
-
Cambios en el controlador Folder_options
Cada menú contextual tiene asociado un identificador de controlador. Este controlador administra la funcionalidad en el evento para las distintas opciones del menú contextual.
En este ejemplo, personalizaremos el menú contextual de la carpeta para ocultar la opción "Crear DitaMap" para los no autores. Para ello, realizaremos cambios en el archivo folder_options.ts presente en /src en el repositorio del marco de trabajo de la extensión de guías.
Se utiliza "viewState" como "REPLACE" para ocultar esta opción en el menú contextual.
Estamos llamando a un nuevo widget en esta folder_options a través de la clave "id".
const folderOptions = {
id: "folder_options",
contextMenuWidget: "repository_panel",
view: {
items: [
{
component: "widget",
id: "customditamap",
target: {
key: "displayName",
value: "DITA Map",
viewState: VIEW_STATE.REPLACE,
},
},
],
},
};
-
Creación de un widget nuevo para controlar la lógica
Se necesita una nueva creación de widget (customoptions.ts) para escribir la lógica que oculte esta opción solo para usuarios que no sean autores. Para lograrlo, hemos utilizado la clave "show" que actúa como alternativa en nuestra estructura JSON.
Puede escribir su propio servlet externo para comprobar los detalles del grupo. De este modo, también puede personalizar las opciones del menú de carpeta para su grupo personalizado.
AEM En este ejemplo, hemos aprovechado la llamada "rolesapi" de OOTB para recuperar los detalles del usuario y establecer la respuesta en "isAuthor" como se muestra en fragmentos anteriores.
const folderOptions = {
id: "customditamap",
view: {
component: "button",
quiet: true,
icon: "breakdownAdd",
label: "DITA Map",
"on-click": "createNewDitaMap",
show: "@extraProps.isAuthor",
},
};
A través de esto, podemos ocultar el botón con la etiqueta como "Mapa de datos" en función del valor de "mostrar".
Se ha agregado un controlador para establecer el atributo isAuthor en el modelo. Esto se puede hacer con la siguiente sintaxis en el controlador.
this.model.extraProps.set("key", value);
Aquí la clave es "isAuthor" y el valor es la respuesta de la llamada a rolesapi.
También se ha definido el evento "createNewDitaMap" para activar la opción "createDitaMap" (para usuarios autores).
controller: {
init: function () {
this.model.extraProps.set("isAuthor", false);
rolesApiResponse.then((result) => {
console.log(result);
this.model.extraProps.set(
"isAuthor",
result["/content/dam"].roles.authors
);
console.log("testresult" + result["/content/dam"].roles.authors);
});
},
createNewDitaMap() {
repositoryController && repositoryController.next("create_new.map");
},
},
-
Agregando el código personalizado
Importe folder_options.ts y customoptions.ts al archivo index.ts en /src.
Pruebas
- AEM Inicie sesión en el grupo de usuarios con un usuario que no forme parte del grupo de autores. La opción Crear DitaMap estaría oculta en cualquier menú contextual de carpeta, como se muestra a continuación.
Este caso de uso se ha añadido a GIT; consulte los recursos relacionados a continuación.
Recursos relacionados
-
Repositorio base de módulo de extensión - GIT
-
Documentación - en Experience League
-
Casos de uso común documentados - en el Experience League
-
Repositorio público con ejemplos - en GIT. Rama de referencia sc-expert-session