Mostrar HTML personalizado en el encabezado para miembros de un grupo específico

Desarrollador
1

¡Hola, familia Discourse! Espero que haya una solución sencilla para esto. Creo que la respuesta es que necesito usar algo de JavaScript.

Tenemos 4 botones en la sección “después del encabezado” de nuestra configuración de CSS/HTML de administración.

image
image1189×397 98 KB

Nos gustaría que algunos botones solo sean visibles para miembros de grupos específicos, mientras que el resto de los botones sean visibles para todos los usuarios.

Por ejemplo: Digamos que queremos que esos 4 botones principales estén disponibles para todos, pero que haya otro botón que solo sea visible para los miembros de un GRUPO particular.

No sé JavaScript, así que si es muy sencillo y alguien pudiera ayudar proporcionando un fragmento de código o algo similar, sería de gran ayuda :folded_hands:

2

Encontré este artículo que parece muy similar para la plataforma Zendesk, pero creo que es el tipo de funcionalidad que estamos buscando.

3 
<div id="after-header">Contenido</div>

<script type="text/discourse-plugin" version="0.8">
    api.onPageChange(() => {
        let currentUser = api.getCurrentUser();
        var groups = currentUser.groups;
        const isInGroup1 = groups.some(g => g.name === 'group1');
        const isInGroup2 = groups.some(g => g.name === 'group2');
        const isInGroup3 = groups.some(g => g.name === 'group3');
        if (isInGroup1) { 
            $("#after-header").addClass("group1");
         }
        if (isInGroup2) { 
            $("#after-header").addClass("group2");
         }
        if (isInGroup3) { 
            $("#after-header").addClass("group3");
         }         
    });
</script>

.button-a,
.button-b {
    display: none;
}
#after-header.group1 .button-a {
    display: block
}
#after-header.group2 .button-b {
    display: block
}

También parece funcionar si reemplazas
api.onPageChange(() => {
por
$( document ).ready(function() {
y entonces el script no se cargará en cada página, pero nunca estoy seguro de cuándo necesito usar api.onPageChange(() => {.

4

Si instalas este componente, todos los grupos del usuario actual se agregarán como clases en el cuerpo de la página, lo que facilita realizar cambios adicionales solo con CSS.

5

jaja, eso iba a ser lo siguiente que intentaría averiguar

7

Hola,

He estado buscando algo similar, pero excluyendo algunos grupos, así que lo intenté con ChatGPT, y la respuesta fue:

Para crear un tema HTML en Discourse que active un script excluyendo grupos específicos, necesitarás usar las opciones de personalización de temas de Discourse junto con JavaScript para manejar las exclusiones de grupos. Discourse proporciona api.getCurrentUser() para recuperar los detalles del usuario, incluidos sus grupos, lo que puede ser útil para activar condicionalmente tu script.

Aquí tienes un ejemplo de cómo podrías implementar esto en la sección </head> de tu tema o componente:

<script type="text/discourse-plugin" version="0.8">
    api.onPageChange(() => {
        // Recuperar los detalles del usuario actual
        const currentUser = api.getCurrentUser();

        if (currentUser) {
            // Lista de nombres de grupos que deseas excluir de la ejecución del script
            const excludedGroups = ['group1', 'group2'];

            // Obtener los grupos del usuario
            const userGroups = currentUser.groups.map(group => group.name);

            // Comprobar si el usuario pertenece a algún grupo excluido
            const isExcluded = excludedGroups.some(group => userGroups.includes(group));

            if (!isExcluded) {
                // Tu lógica de script personalizada aquí
                console.log('El script se ejecuta para este usuario.');
                // Ejemplo: activar cualquier lógica personalizada para usuarios no excluidos
                // customScriptFunction();
            } else {
                console.log('El usuario está en un grupo excluido, el script no se ejecuta.');
            }
        }
    });
</script>

Explicación:

  1. api.onPageChange(): Ejecuta el script cada vez que cambia la página.
  2. api.getCurrentUser(): Obtiene los detalles del usuario actualmente conectado.
  3. excludedGroups: Enumera los grupos que deseas excluir.
  4. userGroups.includes(group): Comprueba si el usuario pertenece a algún grupo excluido.
  5. Ejecución condicional del script: El script solo se ejecutará si el usuario no forma parte de ningún grupo excluido.

Puedes reemplazar customScriptFunction(); con el script que necesites ejecutar. ¡Avísame si necesitas algún ajuste adicional!

Quiero decir, mi mente está completamente alucinada con esto :exploding_head:. Aún no lo he probado, pero ¿es correcto el código de ChatGPT?