Tema clickable

:discourse2: Resumen Tema Clickeable hace que toda el área de un topic-list-item sea clicable, en lugar de solo el título del tema.
:eyeglasses: Vista previa Vista previa en Discourse Theme Creator
:hammer_and_wrench: Enlace al repositorio https://github.com/discourse/discourse-clickable-topic
:open_book: ¿Nuevo en Temas de Discourse? Guía para principiantes para usar Temas de Discourse

Instalar este componente de tema

Características

preview

:discourse2: ¿Alojado por nosotros? Los componentes de tema están disponibles para usar en nuestros planes Estándar, Empresarial y Corporativo.

46 Me gusta

¡Muchas gracias, algo muy necesario! :heart:

4 Me gusta

¡Ese es un componente muy útil! Desde el punto de vista de la experiencia del usuario, debería estar integrado en Discourse, pero esa es solo mi opinión.

De todos modos, estoy atascado intentando hacer que la misma lógica funcione para las Categorías. Quería hacerlo con api.modifyClass, pero parece que me falta la parte crucial. ¿Podrías ayudarme, por favor?

Tengo esta configuración para mi página de escritorio:
image

Básicamente, el cuadro rojo de la izquierda debería ser clicable:

O, para tener una imagen perfecta de lo que quiero lograr: recrear el diseño del foro de Blizzard, ya que me gusta mucho:

Agradezco cualquier ayuda aquí.

Mientras esperaba una respuesta, también encontré la página de componentes aquí:
https://github.com/discourse/discourse/tree/master/app/assets/javascripts/discourse/app/components
Y probé diferentes ideas, pero parece que mi hook ni siquiera está disponible. ¿O me estoy perdiendo algo? :slight_smile:

¡Nos alegra que te guste el componente!

Gracias por las sugerencias :grinning_face_with_smiling_eyes:

Por ahora, este componente está diseñado únicamente para funcionar con Topics en una lista de temas.

1 me gusta

Si deseas experimentar y hacer un fork de este componente, ¡te invitamos a hacerlo :+1:

Como punto de partida para lograr que una categoría sea clickeable, te sugiero revisar el código de este componente que lo logra modificando el componente topic-list-item dentro del núcleo de Discourse.

Podrías intentar crear un nuevo archivo dentro de esta misma carpeta que apunte a uno de los muchos tipos de diseños de categorías incluidos en nuestros componentes, asegurándote de apuntar al mismo estilo de página de categorías que has seleccionado en tu foro.

Algunos de ellos se listan en sus ubicaciones a continuación…

app/assets/javascripts/discourse/app/components/categories-and-latest-topics.js
app/assets/javascripts/discourse/app/components/categories-and-top-topics.js
app/assets/javascripts/discourse/app/components/categories-boxes-topic.js
app/assets/javascripts/discourse/app/components/categories-boxes-with-topics.js
app/assets/javascripts/discourse/app/components/categories-boxes.js
app/assets/javascripts/discourse/app/components/categories-only.js
app/assets/javascripts/discourse/app/components/category-list-item.js

3 Me gusta

La vista previa ya no funciona

2 Me gusta

Creo que ahora debería estar bien. :slightly_smiling_face::+1:

2 Me gusta

Ahora roto.

Confiábamos en este componente para hacer que las tarjetas de temas de la vista Categorías + Últimos (predeterminada en nuestro caso) fueran clickables. Desde la actualización de hoy a la última versión 3.1.0beta8 (ahora aparece como 3.2.0.beta1-dev), el componente dejó de funcionar correctamente.

Ahora el estado activo del cursor permanece como clickeable, pero el área del tema no lo es. Con la consola del navegador abierta, hay un error que puede ayudar a los desarrolladores a identificar el problema:

Uncaught TypeError: this.router is undefined

function navigateToTopic(topic, href) {
    if (this.siteSettings.page_loading_indicator !== "slider") {
      // Con el slider, se siente mejor que el encabezado se actualice una vez que el resto del contenido del tema se carga,
      // así que omite establecerlo temprano.
      this.appEvents.trigger("header:update-topic", topic);
    }
    this.session.set("lastTopicIdViewed", {
      topicId: topic.id,
      historyUuid: this.router.location.getState?.().uuid
    });
    _url.default.routeTo(href || topic.get("url"));
    return false;
  }

El error lanzado para la línea:

historyUuid: this.router.location.getState?.().uuid

¿Podría estar relacionado con las actualizaciones de Ember planeadas/en curso en el núcleo?

Hola @kinetiksoft - No he podido reproducir el problema por mi parte. El componente de tema parece funcionar bien con la última versión de Discourse. Usar el enlace ‘vista previa en el creador de temas’ en el OP aquí también parece funcionar.

¿Podrías compartir un enlace a un sitio con el problema? Quizás haya un conflicto con otro tema/plugin.

2 Me gusta

¡Gracias! Te he enviado un mensaje privado con un enlace a la comunidad en cuestión. No es apropiado compartirlo en público.

1 me gusta

¡Gracias @kinetiksoft! Parece que el problema ocurre cuando el componente del tema se usa junto con la vista ‘categorías + últimas’ (que tienes configurada como tu página de inicio).

He creado una PR que debería resolver el problema.

Publicaré aquí una vez que se fusione, y entonces necesitarás actualizar tu foro a la última versión del núcleo de Discourse.

3 Me gusta

¡Gracias David! Nos alegra haber podido ayudar a identificar el problema en un componente que funciona perfectamente.

2 Me gusta

Todo listo, así que debería tener efecto la próxima vez que actualices a la última versión de Discourse.

1 me gusta

Haremos un intento de actualización esta semana y ciertamente volveré a este tema para informar cómo va todo. ¡Gracias de nuevo!

1 me gusta

Podemos confirmar que el problema se ha solucionado. ¡Gracias de nuevo! :heart:

1 me gusta

Hola, ¿cómo puedo modificar este componente para que admita el plugin de Docs?

Estoy ejecutando la última versión de Discourse 3.4.0.beta2-dev.


No estoy seguro si tengo algo mal configurado en este componente temático, pero todo el texto del cuerpo en el tema de la tarjeta no es clicable. Si haces clic justo después de que termina el texto en cualquiera de las líneas, puedes activar la tarjeta y abrir el tema.

¿Alguna idea sobre qué podría estar causando esto?

Gracias de antemano por toda su ayuda y aportes. :slight_smile:

4 Me gusta

Hola, gracias por ese TC, pero ¿parece que una región sigue sin ser clicable?

Estoy viendo este error de forma inconsistente en un sitio que administro:

Ejecutando Discourse 52ab90911 y Clickable Topic 37f0aa135fe

1 me gusta