From b3791a2be03f49abb61a6f4eb590e0417802dad9 Mon Sep 17 00:00:00 2001 From: Mark VanLandingham Date: Mon, 8 Jan 2024 18:38:00 -0600 Subject: [PATCH] DEV: Add setUserMenuNotificationsLimit plugin-api method (#25119) --- .../user-menu/notifications-list.js | 18 +++++++++++++++++- .../discourse/app/lib/plugin-api.js | 14 +++++++++++++- docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md | 6 ++++++ .../page_objects/components/user_menu.rb | 4 ++++ spec/system/viewing_user_menu_spec.rb | 19 +++++++++++++++++++ 5 files changed, 59 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/discourse/app/components/user-menu/notifications-list.js b/app/assets/javascripts/discourse/app/components/user-menu/notifications-list.js index b2ca730c333..e62d28d7255 100644 --- a/app/assets/javascripts/discourse/app/components/user-menu/notifications-list.js +++ b/app/assets/javascripts/discourse/app/components/user-menu/notifications-list.js @@ -13,6 +13,22 @@ import Notification from "discourse/models/notification"; import UserMenuReviewable from "discourse/models/user-menu-reviewable"; import I18n from "discourse-i18n"; +const MAX_LIMIT = 60; +const DEFAULT_LIMIT = 30; +let limit = DEFAULT_LIMIT; + +export function setNotificationsLimit(newLimit) { + if (newLimit <= 0 || newLimit > MAX_LIMIT) { + // eslint-disable-next-line no-console + console.error( + `Error: Invalid limit of ${newLimit} passed to setNotificationsLimit. Must be greater than 0 and less than ${MAX_LIMIT}` + ); + return; + } + + limit = newLimit; +} + export default class UserMenuNotificationsList extends UserMenuItemsList { @service appEvents; @service currentUser; @@ -82,7 +98,7 @@ export default class UserMenuNotificationsList extends UserMenuItemsList { async fetchItems() { const params = { - limit: 30, + limit, recent: true, bump_last_seen_reviewable: true, }; diff --git a/app/assets/javascripts/discourse/app/lib/plugin-api.js b/app/assets/javascripts/discourse/app/lib/plugin-api.js index 622625d2256..72f991ef323 100644 --- a/app/assets/javascripts/discourse/app/lib/plugin-api.js +++ b/app/assets/javascripts/discourse/app/lib/plugin-api.js @@ -28,6 +28,7 @@ import { REFRESH_COUNTS_APP_EVENT_NAME as REFRESH_USER_SIDEBAR_CATEGORIES_SECTIO import { forceDropdownForMenuPanels } from "discourse/components/site-header"; import { setDesktopScrollAreaHeight } from "discourse/components/topic-timeline/container"; import { addTopicTitleDecorator } from "discourse/components/topic-title"; +import { setNotificationsLimit as setUserMenuNotificationsLimit } from "discourse/components/user-menu/notifications-list"; import { addUserMenuProfileTabItem } from "discourse/components/user-menu/profile-tab-content"; import { addDiscoveryQueryParam } from "discourse/controllers/discovery/list"; import { registerFullPageSearchType } from "discourse/controllers/full-page-search"; @@ -144,7 +145,7 @@ import { modifySelectKit } from "select-kit/mixins/plugin-api"; // docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md whenever you change the version // using the format described at https://keepachangelog.com/en/1.0.0/. -export const PLUGIN_API_VERSION = "1.22.0"; +export const PLUGIN_API_VERSION = "1.23.0"; // This helper prevents us from applying the same `modifyClass` over and over in test mode. function canModify(klass, type, resolverName, changes) { @@ -1684,6 +1685,17 @@ class PluginApi { addTopicTitleDecorator(callback); } + /** + * Allows a different limit to be set for fetching recent notifications for the user menu + * + * Example setting limit to 5: + * api.setUserMenuNotificationsLimit(5); + * + **/ + setUserMenuNotificationsLimit(limit) { + setUserMenuNotificationsLimit(limit); + } + /** * Allows adding icons to the category-link html * diff --git a/docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md b/docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md index 9e8f5d0c059..6b8dac4d752 100644 --- a/docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md +++ b/docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md @@ -7,6 +7,12 @@ in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [1.22.0] - 2024-01-03 + +### Added + +- Added `setUserMenuNotificationsLimit` function which is used to specify a new limit for the notifications query when the user menu is opened. + ## [1.21.0] - 2023-12-22 ### Added diff --git a/spec/system/page_objects/components/user_menu.rb b/spec/system/page_objects/components/user_menu.rb index 2b72dfc4069..6f63c2a9ed7 100644 --- a/spec/system/page_objects/components/user_menu.rb +++ b/spec/system/page_objects/components/user_menu.rb @@ -43,6 +43,10 @@ module PageObjects def has_right_replies_button_count?(count) expect(find("#user-menu-button-replies").text).to eq(count.to_s) end + + def has_notification_count_of?(count) + page.has_css?(".user-menu li.notification", count: count) + end end end end diff --git a/spec/system/viewing_user_menu_spec.rb b/spec/system/viewing_user_menu_spec.rb index 25473d5a842..0b6b63a85eb 100644 --- a/spec/system/viewing_user_menu_spec.rb +++ b/spec/system/viewing_user_menu_spec.rb @@ -5,6 +5,25 @@ RSpec.describe "Viewing User Menu", system: true do let(:user_menu) { PageObjects::Components::UserMenu.new } + describe "with notification limit set via plugin api" do + it "only displays as many notifications as the limit" do + sign_in(user) + + visit("/latest") + + 3.times { Fabricate(:notification, user: user) } + page.execute_script <<~JS + require("discourse/lib/plugin-api").withPluginApi("1.22.0", (api) => { + api.setUserMenuNotificationsLimit(2); + }) + JS + + user_menu.open + + expect(user_menu).to have_notification_count_of(2) + end + end + describe "when viewing replies notifications tab" do fab!(:topic)