Now, whenever we click on the topic-timeline bookmark button it displays the modal box to set the bookmark and when we save the bookmark it updates the Bookmark buttons under the first-post-menu buttons and topic-footer-button but does not update itself until the topic-timeline widget is not refreshed (i.e. until we scrolling) and vice versa.
first-post-menu
topic-footer-button
I found that whenever Bookmark is set/unset post-stream widget is refreshed so the post-menu and topic-footer-button Bookmark buttons work in sync.
So now how can I refreshed my “topic-timeline-bookmark” widget whenever Bookmark is set/unset or whenever post-stream widget is refreshed? below is my 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;
//Icon
if (bookmarkedPosts.some((bookmark) => bookmark.reminder_at))
icon = "discourse-bookmark-clock";
else
icon = "bookmark";
//Label
if (bookmarkCount === 0)
label = "bookmarked.title";
else if (bookmarkCount === 1)
label = "bookmarked.edit_bookmark";
else
label = "bookmarked.clear_bookmarks";
//Tooltip
if (bookmarkedPosts.length === 1)
tooltip = 'bookmarked.help.edit_bookmark';
else if (bookmarkedPosts.find((x) => x.reminder_at))
tooltip = 'bookmarked.help.unbookmark_with_reminder';
//Append CSS class if bookmark is set
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>
api.createWidget("topic-timeline-bookmark", {
// code omitted
// might be able to name it schedule-rerender
// directly in the api call instead of force-refresh
// and avoid having this function
forceRefresh() {
this.scheduleRerender();
}
});
I think this should work, if it doesn’t let me know, I will try to build a working example locally.
We have tried the code suggested by you, but it’s not working.
Added the below api call api.dispatchWidgetAppEvent('topic-timeline-bookmark', 'force-refresh', 'post-stream:refresh');
And then add the forceRefresh() method in “topic-timeline-bookmark” widget.
But it is not working.
I also try to rename the second parament of the dispatchWidgetAppEvent method to “schedule-rerender” and removed the forceRefresh function from the widget. This also not works.
I look for the implementation of the api.dispatchWidgetAppEvent method it takes 3 arguments where the second is widgetKey, I think it should be the value returned by the buildKey() function of the widget.
And the third argument is the appEvent which is converted to camelCase and used as the method name for us
@saurabhmasc I made it work locally, however I had to fix a bug in core and also add a new feature in core. I will update the topic when this is all merged.
Now we observed that before when we bookmark from the topic-footer-buttons then the first post was also marked as booked, but now the first post is not getting booked, is it correct now?
We have tested your component all the cases working fine, only Clear bookmark functionality is not working in sync.
To make it work, we have added the below lines of code, and now Clear bookmark functionality also works fine.
Will look at the first point. Concerning the second yes it’s possible I forgot a case, the main author of bookmarks is away atm and I would like to change few things but I need him to be back, your fix should be ok.
