Tópico clicável

:discourse2: Summary Clickable Topic makes the entire area of a topic-list-item clickable, as opposed to just the topic title.
:eyeglasses: Preview Preview on Discourse Theme Creator
:hammer_and_wrench: Repository Link https://github.com/discourse/discourse-clickable-topic
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

Features

preview

:discourse2: Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-11T12:48:31Z

Check documentPerform check on document:
46 curtidas

Thank you so much, very needed thing! :heart:

4 curtidas

That is a very helpful component! Should be from user experience point of view built into Discourse, but that is my opinion.

Anyways, I’m stuck in trying to make the same logic work for Categories. I wanted to do it with api.modifyClass but seem to miss the crucial part. Can you please help me?

I have this setting for my desktop page:
image

Basically the red box on the left should be clickable:

Or to have a perfect picture what I want to achieve: recreating the Blizzard Forum design, cause I like it a lot:

Appreciate any help here.

While waiting for a response I also found the components page here:

And tried different ideas but it seems my hook is not even available? Or I’m missing something!? :slight_smile:

Glad you like the component!

Thanks for the suggestions :grinning_face_with_smiling_eyes:

At the moment this component is only designed to work for Topics in a topic list.

1 curtida

If you want to experiment and fork this component, you are welcome to do so :+1:

As a starting point to get a category to be clickable, I would suggest looking through the code in this component that does so by modifying the topic-list-item component inside Discourse core.

You could try creating a new file within this same folder which targets one of the many types of category layouts included in our components, making sure to target the same category page style you have selected on your forum.

Some of these are listed in their locations below…

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 curtidas

A pré-visualização não funciona mais

2 curtidas

Acho que agora deve estar tudo bem. :slightly_smiling_face::+1:

2 curtidas

Quebrado agora.

Nós dependíamos deste componente para tornar os cards de tópico da visualização Categorias + Mais Recentes (padrão em nosso caso) clicáveis. Desde a atualização de hoje para a versão mais recente 3.1.0beta8 (agora aparece como 3.2.0.beta1-dev), o componente parou de funcionar corretamente.

Agora o estado ativo do cursor permanece clicável, mas a área do tópico não é clicável. Com o console do navegador aberto, há um erro, que pode ajudar os desenvolvedores a identificar o problema:

Uncaught TypeError: this.router is undefined

function navigateToTopic(topic, href) {
    if (this.siteSettings.page_loading_indicator !== "slider") {
      // Com o slider, parece mais agradável que o cabeçalho seja atualizado assim que o restante do conteúdo do tópico carregar,
      // então pule a configuração antecipada.
      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;
  }

O erro lançado para a linha:

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

Pode estar relacionado às atualizações do Ember planejadas/em andamento no core?

Olá @kinetiksoft - Não consegui reproduzir o problema aqui. O componente de tema parece funcionar bem com a versão mais recente do Discourse. Usar o link ‘preview on theme creator’ no OP aqui também parece funcionar.

Você poderia compartilhar um link para um site com o problema? Talvez haja um conflito com outro tema/plugin.

2 curtidas

Obrigado! Enviei uma mensagem privada com um link para a comunidade em questão. Não é apropriado compartilhá-la em público.

1 curtida

Obrigado @kinetiksoft! Parece que o problema ocorre quando o componente de tema é usado em conjunto com a visualização ‘categorias + mais recentes’ (que você configurou como sua página inicial).

Fiz um PR que deve resolver o problema.

Postarei aqui assim que for mesclado, e então você precisará atualizar seu fórum para a versão mais recente do Discourse core.

3 curtidas

Obrigado, David! Que bom que pudemos ajudar a identificar o problema em um componente que funcionava perfeitamente.

2 curtidas

Tudo feito - então deve ter efeito na próxima vez que você atualizar para a versão mais recente do Discourse

1 curtida

Faremos uma tentativa de atualização esta semana e certamente voltarei a este tópico para relatar como tudo está correndo. Obrigado novamente!

1 curtida

Podemos confirmar que o problema foi corrigido. Obrigado novamente! :heart:

1 curtida

Olá, como posso modificar este componente para suportar o plugin Docs?

Estou executando a versão mais recente do Discourse 3.4.0.beta2-dev.


Não tenho certeza se há algo errado na configuração deste componente de tema, mas todo o texto do corpo no tópico no cartão não é clicável. Se você clicar logo após o final do texto em qualquer linha, poderá ativar o cartão e abrir o tópico.

Alguma ideia sobre o que pode estar causando isso?

Agradeço antecipadamente por toda a ajuda e contribuições. :slight_smile:

4 curtidas

Olá, obrigado por esse TC, mas parece que uma região continua não clicável?