Notre forum utilise beaucoup la fonctionnalité de statut utilisateur personnalisé, et l’idée a émergé de trouver un moyen de rendre cette information encore plus proéminente et visible — en la faisant apparaître toujours sous le nom d’un utilisateur dans un message plutôt que de n’apparaître que lorsque vous survolez l’icône associée.
J’ai cherché et cherché pour voir s’il existait un moyen raisonnablement facile d’y parvenir, et jusqu’à présent, je n’ai trouvé aucune réponse.
Hmm… Je regarde comment le statut de l’utilisateur est affiché et je ne vois pas de point de sortie de plugin que vous pouvez utiliser pour afficher la description du statut.
Mais je pense que vous pouvez obtenir le statut d’un utilisateur via this.user.status, donc je ne suis pas sûr que vous ayez vraiment besoin de ce point de sortie ou si vous pouvez en trouver un autre à proximité.
J’ai fait une variante de ceci, mais pour afficher des champs utilisateur personnalisés sous le nom de l’afficheur. J’ai créé un composant de thème et utilisé ceci pour le JS :
import Component from "@glimmer/component";
import { withPluginApi } from "discourse/lib/plugin-api";
import { get } from "@ember/object"; // Nous en avons toujours besoin
// ici, ajoutez l'ID du champ personnalisé, préfixé par "user_field_"
// pour obtenir l'ID du champ utilisateur :
// 1. allez dans admin/config/user-fields
// 2. cliquez sur le nom du champ utilisateur
// 3. l'ID du champ utilisateur est affiché dans l'URL après admin/config/user-fields/
const FIELDS_TO_SHOW = [
{ fieldKey: "user_field_2", display: "inline" },
{ fieldKey: "user_field_1", display: "block" }
];
// ----------------------------------------
function addCustomFields(api) {
FIELDS_TO_SHOW.forEach(config => {
api.renderAfterWrapperOutlet(
"post-meta-data-poster-name",
class extends Component {
// getter pour passer la clé au template
get currentFieldKey() {
return config.fieldKey;
}
// getter pour passer le type d'affichage au template
get currentDisplayType() {
return config.display;
}
static shouldRender(args) {
// utilisez config.fieldKey pour trouver les données
const value = get(args.post.user.custom_fields, config.fieldKey);
return !!value;
}
<template>
<div class="
poster-custom-field
poster-custom-field-{{this.currentDisplayType}}
field-{{this.currentFieldKey}}
">
{{get @post.user.custom_fields this.currentFieldKey}}
</div>
</template>
}
);
});
}
export default {
name: "show-poster-custom-fields",
initialize() {
withPluginApi("1.0.0", (api) => {
addCustomFields(api);
});
}
};
et ensuite utilisé ceci pour le css :
.topic-meta-data .names {
flex-wrap: wrap;
align-items: baseline;
}
// styles de base pour tout affichage de champ personnalisé
.poster-custom-field {
font-size: 0.9em;
color: var(--primary-high-or-secondary-low);
flex-shrink: 0;
}
// style pour l'affichage en ligne
.poster-custom-field-inline {
display: inline-block;
margin-left: 8px;
order: 5;
}
.topic-meta-data .names .user-title {
order: 10;
flex-basis: 100%;
width: 100%;
display: block;
margin-left: 0;
margin-top: 2px;
font-size: 0.9em;
color: var(--primary-high-or-secondary-low);
}
// style pour sous l'affichage du nom
.poster-custom-field-block {
flex-basis: 100%;
margin-top: 4px;
order: 20;
}
Voici à quoi cela ressemble en pratique - “more stuff” et “some information” est le contenu des deux champs personnalisés.
Comme @NateDhaliwal l’a dit, je pense que vous pourriez utiliser this.user.status pour afficher le statut de l’utilisateur à la place des champs personnalisés que j’ai.
Une chose avec cela est que vous devriez également le remplacer dans d’autres occurrences, comme la page de profil, la carte utilisateur et les messages de chat.
