ID de sujet comme variable ?

tknospdr · Septembre 26, 2025, 3:34

Un mot commun est le contraire de ce que je veux. Je ne veux pas que mes résultats de recherche contiennent TOUS les tickets, je veux un moyen de rechercher un ticket spécifique. C’est pourquoi l’ID de sujet serait idéal. Ils sont générés automatiquement et uniques.

Non, je pense que le code que j’utilise était aussi à l’origine d’awesomerobot, mais je ne trouve plus sa source.
Je préfère le placement de ce que j’utilise actuellement à ce bloc sous le texte.

Eh bien, je ne peux pas faire ça. Peut-être que vous le pouvez.
« J'ai un certain ensemble de compétences. Le codage n'en fait pas partie. »

pfaffman · Septembre 26, 2025, 3:46

Alors peut-être devriez-vous déplacer ce sujet vers Marketplace ou Feature.

NateDhaliwal · Septembre 27, 2025, 3:01

Tu me comprends mal. Je voulais dire avoir un mot courant incluant le paramètre topic:id, de sorte que seuls les résultats de ce sujet s’affichent. Le mot courant élimine le besoin de changer des mots comme ‘salut’ et ‘bonjour’.

NateDhaliwal · Septembre 27, 2025, 11:41

@tknospdr @pfaffman J’ai bricolé un composant rapide qui vous permet d’entrer l’ID du sujet et d’y accéder.

Créez un nouveau composant et ajoutez ceci à l’onglet JS sous le bouton Modifier CSS/HTML^[1] :

import { apiInitializer } from "discourse/lib/api";
import Component from '@glimmer/component';
import { action } from "@ember/object";
import Form from "discourse/components/form";
import DiscourseURL from "discourse/lib/url";

export default apiInitializer((api) => {
    api.renderBeforeWrapperOutlet("full-page-search-filters",
        class GoToTopic extends Component {
            @action
            handleSubmit(data) {
                DiscourseURL.routeTo(`/t/${data.id}`);
            }

            <template>
                <div class="topic-id-go-to" style="margin-top: 1em;">
                    <Form @onSubmit={{this.handleSubmit}} as |form|>

                      <form.Field @name="id" @title="Topic id" as |field|>
                        <field.Input @type="number" @validation="required" />
                      </form.Field>

                      <form.Submit />
                    </Form>
                </div>
            </template>
        }
    );
});

Cela ajoute une entrée à la page de recherche :

Le bouton Submit sert à aller au sujet^[2]; il n’affecte pas les résultats de recherche.

J’espère que cela vous aidera !

C’est la première fois que j’utilise FormKit, c’est vraiment cool ! ↩︎
Je n’ai pas pu changer le texte du bouton, car cela nécessiterait des locales… ce qui nécessiterait un dépôt TC complet, ce qui serait peut-être excessif . ↩︎

tknospdr · Septembre 29, 2025, 2:35

Merci @NateDhaliwal, j’apprécie l’effort.
J’ai créé le composant, collé le code sous l’onglet JS. Je me suis assuré qu’il était actif sur mon thème, mais sans succès.
Voici à quoi ressemble ma page de recherche :

tknospdr · Septembre 29, 2025, 2:50

J’ai configuré cela sur mon site pour expérimenter et cela semble fonctionner, cependant, j’obtiens cet avertissement qui me fait hésiter :

NateDhaliwal · Septembre 29, 2025, 2:51

Des erreurs dans la console du navigateur ?

tknospdr · Septembre 29, 2025, 2:54

C’est la seule erreur :

Et je pense que c’est pour que le JS affiche l’ID du sujet, pas la recherche. Il n’apparaît pas sauf sur les pages que j’ai réservées pour cet élément.

tknospdr · Septembre 29, 2025, 3:33

J’ai désactivé, puis réactivé le composant Advanced Search Banner, et maintenant il fonctionne.

tknospdr · Septembre 29, 2025, 5:50

Bien, voici un résumé de la situation telle qu’elle se présente actuellement :

Nous avons une solution fonctionnelle. Bien qu’elle soit légèrement peu élégante, elle conviendra à mes besoins jusqu’à ce que nous puissions rechercher l’ID du sujet directement dans la boîte de recherche standard.
~~Le code actuel suggéré par @awesomerobot semble fonctionner, mais déclenche l’avertissement que j’ai posté ci-dessus.~~
2a. Lorsque j’ai supprimé le code original que j’utilisais pour afficher l’ID du sujet, cet avertissement a disparu…
Lorsque vous choisissez une solution, le code pour afficher l’ID du sujet apparaît à la fois dans le message original et dans la solution. Y a-t-il un moyen d’en tenir compte et de l’empêcher de s’y afficher ?

double-vision1462×728 161 KB
J’ai un peu plus peaufiné le CSS, maintenant j’ai une pilule sur chaque réponse dans chaque fil de discussion dans les catégories spécifiées où je l’utilise. Je suppose que la réponse sera de la dé-peaufiner, mais si quelqu’un connaît une autre façon, je préférerais la conserver, je pense qu’elle est jolie telle quelle.

pill588×1308 130 KB

tknospdr · Septembre 30, 2025, 3:09

@awesomerobot
Votre code fonctionne à merveille, mais il semble que toutes les décorations CSS autres que le texte apparaissent sur chaque publication après la première comme un espace vide formaté comme le dit le CSS.

Désactivez le bloc inline et vous obtenez une barre de couleur pleine largeur.
Changez la couleur d’arrière-plan et la pilule change de couleur
etc…

D’après ce que vous avez écrit, il semble que vous lui ayez dit de n’apparaître que dans la première publication, mais cela n’affecte que le texte. Y a-t-il autre chose que nous puissions faire pour supprimer l’élément de toutes les publications supplémentaires ?

tknospdr · Octobre 1, 2025, 2:11

D’accord, comme je l’ai dit, je ne suis pas un codeur, mais je suis très doué pour poser des questions à Grok. Voici un code qui résout les deux problèmes.

Fini les bulles CSS vides dans les réponses 2 à X.
Fini la duplication de l’ID de sujet dans les solutions citées.

Peut-être que personne d’autre sur la planète ne s’en soucie, mais cela semble être un bon moyen de suivre les sujets pour ceux d’entre nous qui utilisent Discourse comme système de billetterie.

import { apiInitializer } from "discourse/lib/api";
import Component from "@glimmer/component";

class TopicIdentifier extends Component {
  get topicId() {
    return this.args.post?.topic?.id;
  }

  get shouldShow() {
    const firstPost = this.args.post?.post_number === 1; // premier message du sujet
    const desiredCategories = [9, 23]; // une liste d'ID de catégories séparés par des virgules où vous voulez que cela apparaisse
    const isInCategory = desiredCategories.includes(
      this.args.post?.topic.category.id
    );

    return firstPost && isInCategory;
  }

  <template>
    {{#if this.shouldShow}}
      <!-- vous pouvez modifier le contenu ci-dessous, {{this.topicId}} est là où l'ID du sujet sera rempli -->
      Issue Tracking # is
      {{this.topicId}}
      <!-- vous pouvez modifier le contenu ci-dessus -->
    {{/if}}
  </template>
}

export default apiInitializer("0.8.40", (api) => {
  api.decorateCookedElement((element, helper) => {
```gjs
import { apiInitializer } from "discourse/lib/api";
import Component from "@glimmer/component";

class TopicIdentifier extends Component {
  get topicId() {
    return this.args.post?.topic?.id;
  }

  get shouldShow() {
    const firstPost = this.args.post?.post_number === 1; // premier message du sujet
    const desiredCategories = [9, 23]; // une liste d'ID de catégories séparés par des virgules où vous voulez que cela apparaisse
    const isInCategory = desiredCategories.includes(
      this.args.post?.topic.category.id
    );

    return firstPost && isInCategory;
  }

  <template>
    {{#if this.shouldShow}}
      <!-- vous pouvez modifier le contenu ci-dessous, {{this.topicId}} est là où l'ID du sujet sera rempli -->
      Issue Tracking # is
      {{this.topicId}}
      <!-- vous pouvez modifier le contenu ci-dessus -->
    {{/if}}
  </template>
}

export default apiInitializer("0.8.40", (api) => {
  api.decorateCookedElement((element, helper) => {
    // Continuer uniquement si c'est le premier message et non à l'intérieur d'une citation de solution
    // Continuer uniquement si c'est le premier message, pas dans une citation, et dans la catégorie souhaitée
    const post = helper?.model;
    const desiredCategories = [9, 23]; // Correspond aux catégories de TopicIdentifier
    if (
    if (
      helper?.model?.post_number !== 1 ||
      !post ||
      post.post_number !== 1 ||
      !desiredCategories.includes(post.topic?.category?.id) || // Vérifier la catégorie
      element.classList.contains("post__contents-cooked-quote") || // Vérifier si l'élément lui-même est le contenu de la citation
      element.closest("aside.accepted-answer") || // Vérifier le wrapper de solution/citation
      element.closest(".quote") // Vérification supplémentaire pour les citations génériques
    ) {
      return;
    }

    const wrapper = document.createElement("div");
    wrapper.className = "tracking-id";

    helper?.renderGlimmer(
      wrapper,
      <template><TopicIdentifier @post={{helper.model}} /></template>
    );

    element.appendChild(wrapper);
  });
});

awesomerobot · Octobre 1, 2025, 2:22

Je n’ai pas pu y arriver plus tôt, mais je suis content que vous ayez trouvé une solution ! Cela semble être une solution raisonnable.

tknospdr · Octobre 1, 2025, 2:35

Je sais que je peux facilement le tester, mais savez-vous d’emblée si cela fonctionnerait si je mettais ce JS et ce CSS dans leur propre composant, ou si cela devait être dans le thème lui-même ?

tknospdr · Octobre 6, 2025, 5:11

J’ai trouvé une autre petite anomalie. Je voyais les bulles de classe vides dans le premier message des sujets en dehors des 2 dans lesquels je les voulais, j’ai donc dû mettre à jour le code un peu. Voici le produit final.

import { apiInitializer } from "discourse/lib/api";
import Component from "@glimmer/component";

class TopicIdentifier extends Component {
  get topicId() {
    return this.args.post?.topic?.id;
  }

  get shouldShow() {
    const firstPost = this.args.post?.post_number === 1; // premier message du sujet
    const desiredCategories = [9, 23]; // une liste d'ID de catégories séparés par des virgules où vous voulez que cela apparaisse 
    const isInCategory = desiredCategories.includes(
      this.args.post?.topic.category.id
    );

    return firstPost && isInCategory;
  }

  <template>
    {{#if this.shouldShow}}
      <!-- vous pouvez modifier le contenu ci-dessous, {{this.topicId}} est l'endroit où l'ID du sujet sera rempli -->
      Le numéro de suivi du problème est
      {{this.topicId}} 
      <!-- vous pouvez modifier le contenu ci-dessus -->
    {{/if}}
  </template>
}

export default apiInitializer("0.8.40", (api) => {
  api.decorateCookedElement((element, helper) => {
    // Only proceed if this is the first post and not inside a solution quote
    // Only proceed if this is the first post, not in a quote, and in the desired category
    const post = helper?.model;
    const desiredCategories = [9, 23]; // Match the categories from TopicIdentifier
    if (
    if (
      helper?.model?.post_number !== 1 ||
      !post ||
      post.post_number !== 1 ||
      !desiredCategories.includes(post.topic?.category?.id) || // Check category
      element.classList.contains("post__contents-cooked-quote") || // Check if the element itself is the quote content
      element.closest("aside.accepted-answer") || // Check for solution/quote wrapper
      element.closest(".quote") // Additional check for generic quotes
    ) {
      return;
    }

    const wrapper = document.createElement("div");
    wrapper.className = "tracking-id";

    helper?.renderGlimmer(
      wrapper,
      <template><TopicIdentifier @post={{helper.model}} /></template>
    );

    element.appendChild(wrapper);
  });
});
      element.classList.contains("post__contents-cooked-quote") || // Check if the element itself is the quote content
      element.closest("aside.accepted-answer") || // Check for solution/quote wrapper
      element.closest(".quote") // Additional check for generic quotes
    ) {
      return;
    }

    const wrapper = document.createElement("div");
    wrapper.className = "tracking-id";

    helper?.renderGlimmer(
      wrapper,
      <template><TopicIdentifier @post={{helper.model}} /></template>
    );

    element.appendChild(wrapper);
  });
});

Et pour répondre à ma propre question, j’ai déplacé tout le code vers un nouveau composant de thème et tout fonctionne toujours bien.

Sujet		Réponses	Vues
Searching for the topic/post by ID? Feature	42	7943	Août 9, 2025
Get topic id when the topic show page loads Dev	21	2449	Juin 24, 2020
Search API parameters Dev	15	3374	Juillet 13, 2017
Howto show the topic id in Metadata of initial Post Dev	13	2952	Mars 17, 2021
In-line topic search-and-linking, e.g. Roam-like bracket links Feature	18	1847	Août 9, 2022

ID de sujet comme variable ?

Sujets connexes