Désormais, chaque fois que nous cliquons sur le bouton de signalement topic-timeline, une boîte modale s’ouvre pour définir le signalement. Une fois le signalement enregistré, les boutons de signalement sous les boutons first-post-menu et topic-footer-button sont mis à jour, mais le bouton du widget topic-timeline lui-même ne se met pas à jour tant que le widget topic-timeline n’est pas rafraîchi (c’est-à-dire tant que nous ne faisons pas défiler la page), et vice versa.
first-post-menu
topic-footer-button
J’ai constaté que chaque fois qu’un signalement est défini ou supprimé, le widget post-stream est rafraîchi, ce qui permet aux boutons de signalement du post-menu et du topic-footer-button de fonctionner en synchronisation.
Comment puis-je donc rafraîchir mon widget « topic-timeline-bookmark » chaque fois qu’un signalement est défini ou supprimé, ou chaque fois que le widget post-stream est rafraîchi ? Voici mon code :
<script type="text/discourse-plugin" version="0.8">
const { h } = require('virtual-dom');
const { getOwner } = require("discourse-common/lib/get-owner");
const topicController = getOwner(this).lookup("controller:topic");
api.createWidget("topic-timeline-bookmark", {
tagName: 'div.discourse-bookmark-button-wrapper',
buildKey: () => `topic-timeline-bookmark`,
toggleBookmark() {
topicController.send('toggleBookmark');
},
html(attrs, state) {
let contents = [];
const user = api.getCurrentUser();
if (user) {
let tooltip = 'bookmarked.help.bookmark';
let label = 'bookmarked.title';
let buttonClass = 'btn btn-default bookmark';
let icon = "bookmark";
let bookmarkedPosts = topicController.model.bookmarked_posts;
let bookmarkCount = 0;
if(bookmarkedPosts && bookmarkedPosts.length > 0){
bookmarkCount = bookmarkedPosts.length;
//Icône
if (bookmarkedPosts.some((bookmark) => bookmark.reminder_at))
icon = "discourse-bookmark-clock";
else
icon = "bookmark";
//Libellé
if (bookmarkCount === 0)
label = "bookmarked.title";
else if (bookmarkCount === 1)
label = "bookmarked.edit_bookmark";
else
label = "bookmarked.clear_bookmarks";
//Info-bulle
if (bookmarkedPosts.length === 1)
tooltip = 'bookmarked.help.edit_bookmark';
else if (bookmarkedPosts.find((x) => x.reminder_at))
tooltip = 'bookmarked.help.unbookmark_with_reminder';
//Ajout de la classe CSS si un signalement est défini
if (bookmarkCount > 0) { buttonClass += ' bookmarked' }
}
contents.push(
this.attach('button', {
action: 'toggleBookmark',
title: tooltip,
label: label,
icon: icon,
className: buttonClass
})
);
}
return contents;
},
});
api.decorateWidget('topic-timeline:after', function(helper) {
return helper.attach('topic-timeline-bookmark');
});
</script>
Dans le code de votre widget, déclarez cette fonction :
api.createWidget("topic-timeline-bookmark", {
// code omis
// il serait peut-être possible de le nommer schedule-rerender
// directement dans l'appel API au lieu de force-refresh
// et ainsi éviter d'avoir cette fonction
forceRefresh() {
this.scheduleRerender();
}
});
Je pense que cela devrait fonctionner. Si ce n’est pas le cas, faites-le-moi savoir ; je tenterai de créer un exemple fonctionnel localement.
Nous avons essayé le code que vous avez suggéré, mais cela ne fonctionne pas.
Nous avons ajouté l’appel API suivant : api.dispatchWidgetAppEvent('topic-timeline-bookmark', 'force-refresh', 'post-stream:refresh');
Puis nous avons ajouté la méthode forceRefresh() dans le widget « topic-timeline-bookmark ».
Mais cela ne fonctionne pas.
J’ai également essayé de renommer le deuxième paramètre de la méthode dispatchWidgetAppEvent en « schedule-rerender » et de supprimer la fonction forceRefresh du widget. Cela ne fonctionne pas non plus.
En examinant l’implémentation de la méthode api.dispatchWidgetAppEvent, elle prend trois arguments : le deuxième est la clé du widget (widgetKey), qui devrait selon moi correspondre à la valeur renvoyée par la fonction buildKey() du widget.
Le troisième argument est l’événement d’application (appEvent), qui est converti en camelCase et utilisé comme nom de méthode pour nous.
@saurabhmasc J’ai réussi à faire fonctionner cela en local, mais j’ai dû corriger un bug dans le cœur du système et ajouter une nouvelle fonctionnalité dans le cœur. Je mettrai à jour le sujet une fois que tout cela sera fusionné.
Nous avons remarqué qu’auparavant, lorsque nous ajoutions un signet depuis les boutons du pied de page du sujet, le premier message était également marqué comme signé. Maintenant, le premier message n’est plus marqué comme tel. Est-ce le comportement attendu ?
Nous avons testé votre composant : tous les cas fonctionnent correctement, à l’exception de la fonctionnalité « Effacer les signets », qui ne se synchronise pas.
Pour la faire fonctionner, nous avons ajouté les lignes de code ci-dessous, et la fonctionnalité « Effacer les signets » fonctionne désormais correctement.
Je vais examiner le premier point. Concernant le second, oui, c’est possible que j’aie oublié un cas. Le principal auteur des favoris est absent pour le moment et j’aimerais modifier quelques éléments, mais j’ai besoin de son retour. Ta correction devrait convenir.
Nous allons créer un nouveau ticket pour demander le déploiement de ces modifications principales dans nos environnements de staging et de production. Cela nous permettra de les tester sur le staging.
