Opción para ocultar categorías de nivel 3 en la página principal de categorías sin perder el diseño

Utilizamos una estructura de categorías profunda de dos niveles (todas las bibliotecas públicas de nuestra ciudad con sus sucursales individuales, más una biblioteca central con sus propias categorías de primer nivel). Recientemente, necesitamos introducir un tercer nivel de anidación en algunas ramas de categorías.

En cuanto una categoría en cualquier parte del árbol tiene una categoría nieta, la página de inicio de las categorías cambia su modo de renderizado: en lugar de la cuadrícula compacta de cuadros (categoría principal con sus hijos directos listados dentro), todas las categorías se renderizan como una lista larga de una sola columna. Esto hace que la página de inicio sea extremadamente larga y difícil de escanear para nuestros ~1.200 usuarios del personal.

Parece que esto está gobernado por la propiedad isGrandParent descrita en este hilo relacionado: When you add an additional nesting level, all categories, including child categories, are displayed on the categories page

Lo que nos gustaría

Nuestra opción preferida: una forma de mantener el diseño estándar de “cuadros” de la página de inicio incluso cuando una categoría tiene un tercer nivel de anidación, por ejemplo, simplemente no mostrando las categorías nietas en la página de inicio (todavía serían accesibles a través de la página de la categoría principal).

Alternativamente, una vista nativa expandible/colapsable para categorías con nietas directamente en la página de inicio de las categorías, para que los usuarios puedan expandir solo las ramas que necesitan en lugar de que todo se liste de forma plana.

Por qué pedimos una solución nativa/oficial

Somos conscientes de que existen soluciones alternativas de componentes de tema/CSS o JS (por ejemplo, anular isGrandParent mediante modifyClass) discutidas en el hilo anterior vinculado. Preferiríamos no seguir esa ruta: no tenemos experiencia profunda en front-end en la empresa, y nos preocupa que haya efectos secundarios inesperados o roturas en futuras actualizaciones de Discourse si anulamos la lógica de renderizado principal nosotros mismos. Una configuración soportada o una opción oficial sería mucho más segura para mantener a largo plazo.

Somos conscientes de que Discourse no recomienda oficialmente la anidación profunda, pero para nuestra estructura organizativa (múltiples instituciones, cada una con varias ubicaciones físicas, cada una necesitando su propio espacio) no es opcional para nosotros.

Una forma soportada de controlar la visualización de la página de inicio para estos casos sería de gran ayuda y estamos seguros de que, desde 2021, podría haber necesidad de un tercer nivel oculto en otras organizaciones también.

Capturas de pantalla adjuntas: nuestro diseño actual de página de inicio de dos niveles

y cómo se rompe actualmente una vez que se introduce un tercer nivel.

5 Me gusta

No estoy seguro, pero este Customization > Theme component podría ser capaz de hacer lo que buscas, o tal vez con algunas modificaciones. Es posible que el DeV también esté abierto a añadir la función.

1 me gusta

Esta es una solicitud razonable; puede ser difícil equilibrar el diseño de la página /categories si solo hay unas pocas categorías con múltiples niveles de subcategorías.

Realmente no queremos que la gente siga usando modifyClass, porque, como mencionaste, mantener ese tipo de sobrescritura puede requerir cierto esfuerzo de desarrollo.

Ahora contamos con algunos métodos de personalización más nuevos con los que podemos trabajar y que son más fáciles de mantener estables. En este caso, un transformador de valores puede ayudar. Acabo de agregar uno aquí que estará disponible en las próximas actualizaciones: DEV: Add a category-list-subcategories value transformer - Pull Request #42804 - discourse/discourse - GitHub

La demostración simple es algo así:

api.registerValueTransformer(
  "category-list-subcategories",
  ({ value, context }) =>
  context.page === "categories" && context.category.level >= 1 ? [] : value
);

Esto solo mostrará un nivel de subcategorías. Hay otras opciones disponibles usando el transformador ahora, por lo que he creado un componente de tema que podemos mantener para apoyarlas.

Así que, una vez que Discourse esté actualizado, puedes instalar esto para controlar cuántas subcategorías se muestran en /categories y en algunas otras listas de categorías:

Configura Categories page depth en 2 para ocultar todas las categorías nietas.

2 Me gusta

¡Hola, muchas gracias!

¿Puedes predecir cómo se comportarán las categorías de nivel 2? Por ejemplo, si volverán a su orden original, una al lado de la otra?

1 me gusta

Sí, el orden se mantendrá igual… esta es esencialmente una forma admitida para sobrescribir isGrandParent

Aquí tienes un antes/después de mi sitio de pruebas

3 Me gusta