mirror of
https://github.com/NodeBB/NodeBB.git
synced 2026-05-07 11:17:29 +02:00
feat: #14094, notification drawer UX improvements
This commit is contained in:
@@ -108,10 +108,10 @@
|
||||
"nodebb-plugin-spam-be-gone": "2.3.2",
|
||||
"nodebb-plugin-web-push": "0.7.7",
|
||||
"nodebb-rewards-essentials": "1.0.2",
|
||||
"nodebb-theme-harmony": "2.2.54",
|
||||
"nodebb-theme-harmony": "2.2.55",
|
||||
"nodebb-theme-lavender": "7.1.21",
|
||||
"nodebb-theme-peace": "2.2.57",
|
||||
"nodebb-theme-persona": "14.2.28",
|
||||
"nodebb-theme-persona": "14.2.29",
|
||||
"nodebb-widget-essentials": "7.0.43",
|
||||
"nodemailer": "8.0.2",
|
||||
"nprogress": "0.2.0",
|
||||
|
||||
@@ -5,6 +5,7 @@ define('forum/header/notifications', function () {
|
||||
|
||||
notifications.prepareDOM = function () {
|
||||
const notifTrigger = $('[component="notifications"] [data-bs-toggle="dropdown"]');
|
||||
const listEl = document.querySelector('[component="notifications/list"]');
|
||||
|
||||
notifTrigger.on('show.bs.dropdown', async (ev) => {
|
||||
const notifications = await app.require('notifications');
|
||||
@@ -15,11 +16,26 @@ define('forum/header/notifications', function () {
|
||||
notifTrigger.each((index, el) => {
|
||||
const triggerEl = $(el);
|
||||
const dropdownEl = triggerEl.parent().find('.dropdown-menu');
|
||||
const listEl = dropdownEl.find('[component="notifications/list"]');
|
||||
if (dropdownEl.hasClass('show')) {
|
||||
app.require('notifications').then((notifications) => {
|
||||
notifications.loadNotifications(triggerEl, dropdownEl.find('[component="notifications/list"]'));
|
||||
notifications.loadNotifications(triggerEl, listEl);
|
||||
});
|
||||
}
|
||||
|
||||
dropdownEl.on('click', '[data-filter]', (e) => {
|
||||
const filter = e.target.getAttribute('data-filter');
|
||||
|
||||
if (filter === 'unread') {
|
||||
listEl.get(0).querySelectorAll('[data-nid]:not(.unread)').forEach((e) => {
|
||||
e.classList.toggle('hidden', true);
|
||||
});
|
||||
} else {
|
||||
listEl.get(0).querySelectorAll('[data-nid]').forEach((e) => {
|
||||
e.classList.toggle('hidden', false);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
socket.removeListener('event:new_notification', onNewNotification);
|
||||
|
||||
@@ -42,7 +42,7 @@ define('notifications', [
|
||||
hooks.fire('filter:notifications.load', { notifications: notifs }).then(({ notifications }) => {
|
||||
app.parseAndTranslate('partials/notifications_list', { notifications }, function (html) {
|
||||
notifList.html(html);
|
||||
notifList.off('click').on('click', '[data-nid]', function (ev) {
|
||||
notifList.off('click').on('click', '[component="notifications/item/link"]', function (ev) {
|
||||
const notifEl = $(this);
|
||||
if (scrollToPostIndexIfOnPage(notifEl)) {
|
||||
ev.stopPropagation();
|
||||
@@ -62,6 +62,9 @@ define('notifications', [
|
||||
components.get('notifications').on('click', '.mark-all-read', () => {
|
||||
Notifications.markAllRead();
|
||||
});
|
||||
components.get('notifications').on('click', `[href="${config.relative_path}/notifications"]`, () => {
|
||||
triggerEl.dropdown('toggle');
|
||||
});
|
||||
|
||||
Notifications.handleUnreadButton(notifList);
|
||||
|
||||
@@ -86,7 +89,6 @@ define('notifications', [
|
||||
$this.find('.unread').toggleClass('hidden', unread);
|
||||
$this.find('.read').toggleClass('hidden', !unread);
|
||||
});
|
||||
return false;
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user