¿Cómo puedo ver categorías y "últimas" en móvil?

¿Cómo puedo ver las categorías y lo “más reciente” en el móvil?

¿Así?

Miré, y usaron algo de código JS personalizado para forzar la vista de “categorías y temas más recientes”.

No comprobé si había una mejor manera; esto es lo que hacen (modernicé el código y añadí algunos comentarios):

import { apiInitializer } from "discourse/lib/api";
import CategoriesAndLatestTopics from "discourse/components/categories-and-latest-topics";
import CategoryList from "discourse/models/category-list";
import { MAX_UNOPTIMIZED_CATEGORIES } from "discourse/lib/constants";

export default apiInitializer((api) => {
  // Fuerza la vista de categorías y temas más recientes.
  api.modifyClass(
    "component:discovery/categories-display",
    (Superclass) =>
      class extends Superclass {
        get categoriesComponent() {
          if (this.args.parentCategory) {
            return super.categoriesComponent;
          } else {
            return CategoriesAndLatestTopics;
          }
        }
      }
  );

  // Igual que el original, con la diferencia de la comprobación "this.site.desktopView",
  // para que también encuentre los temas más recientes para móviles.
  api.modifyClass(
    "route:discovery-categories",
    (Superclass) =>
      class extends Superclass {
        async findCategories(parentCategory) {
          let model;

          let style = this.siteSettings.desktop_category_page_style;
          if (this.site.categories.length > MAX_UNOPTIMIZED_CATEGORIES) {
            style = "categories_only";
          }

          if (
            style === "categories_and_latest_topics" ||
            style === "categories_and_latest_topics_created_date"
          ) {
            model = await this._findCategoriesAndTopics(
              "latest",
              parentCategory
            );
          } else if (style === "categories_and_top_topics") {
            model = await this._findCategoriesAndTopics(
              "top",
              parentCategory
            );
          } else {
            PreloadStore.remove("topic_list");
            model = await CategoryList.list(this.store, parentCategory);
          }

          return model;
        }
      }
  );
})

Puedes intentar pegar el código en un nuevo componente → Editar código → pestaña JS.
Avísame si te ayuda.

Muchas gracias. Lo intenté, pero no cambió nada. :thinking:

Verificaré lo siguiente, asegúrate de que:

  • El código esté en la pestaña JS (y no en otros lugares)
  • Tu código esté habilitado (si creaste un TC, asegúrate de que esté adjunto al tema)
  • Tienes la configuración del sitio desktop_category_page_style en categories_and_latest_topics
  • Si tienes errores en la consola del navegador

Veamos si podemos averiguar por qué no sucede nada.

Creo que lo hice todo así. ¿Está copiado correctamente?

Puedes eliminar el duplicado. Esa es probablemente la razón por la que no funciona (estas 5 líneas):

¡Ahora viene algo! Pero no cuando uso el elemento “categoría y grupo modernos”.

:sweat_smile: