Merge pull request #38498 from kaulith/fix/notification-badge-on-desktop

fix: show notification badge on desktop bell icon
This commit is contained in:
Ejaaz Khan 2026-04-15 11:24:53 +05:30 committed by GitHub
commit afe9d9fd8d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 32 additions and 4 deletions

View file

@ -26,7 +26,7 @@
<div class="flex" style="gap:16px; align-items: center;">
<div class="desktop-notifications">
<div class="dropdown dropdown-notifications">
<button class="btn-reset nav-link text-muted" data-toggle="dropdown" aria-label="{{ _("Notifications") }}" aria-haspopup="true">
<button class="btn-reset nav-link text-muted desktop-notification-icon" data-toggle="dropdown" aria-label="{{ _("Notifications") }}" aria-haspopup="true">
<svg
class="icon icon-md" aria-hidden="true"
>

View file

@ -222,6 +222,13 @@ class NotificationsView extends BaseNotificationsView {
.attr("title", __("Notifications"))
.tooltip({ delay: { show: 600, hide: 100 }, trigger: "hover" });
this.bell_indicator = this.parent.find(".desktop-notification-icon");
if (!this.bell_indicator.length) {
this.bell_indicator = this.parent
.closest(".body-sidebar")
?.find(".sidebar-notification .sidebar-item-icon");
}
this.setup_notification_listeners();
this.dropdown_items = [];
@ -380,8 +387,7 @@ class NotificationsView extends BaseNotificationsView {
}
toggle_notification_icon(seen) {
this.notifications_icon.find(".notifications-seen").toggle(seen);
this.notifications_icon.find(".notifications-unseen").toggle(!seen);
this.bell_indicator?.toggleClass("indicator blue", !seen);
}
toggle_seen(flag) {
@ -396,11 +402,13 @@ class NotificationsView extends BaseNotificationsView {
setup_notification_listeners() {
frappe.realtime.on("notification", () => {
this.settings.seen = 0;
this.toggle_notification_icon(false);
this.update_dropdown();
});
frappe.realtime.on("indicator_hide", () => {
this.settings.seen = 1;
this.toggle_notification_icon(true);
});
@ -424,7 +432,7 @@ class NotificationsView extends BaseNotificationsView {
}
this.toggle_seen(true);
if (this.notifications_icon.find(".notifications-unseen").is(":visible")) {
if (this.bell_indicator?.hasClass("indicator")) {
this.toggle_notification_icon(true);
frappe.call(
"frappe.desk.doctype.notification_log.notification_log.trigger_indicator_hide"

View file

@ -44,6 +44,26 @@
display: none;
}
.sidebar-notification .sidebar-item-icon.indicator,
.desktop-notification-icon.indicator {
position: relative;
&::before {
position: absolute;
top: 0;
right: 0;
left: auto;
height: 6px;
width: 6px;
margin: 0;
z-index: 1;
}
}
.sidebar-notification .item-anchor {
overflow: visible;
}
.mark-read {
display: none;
margin-left: 10px;