diff --git a/app/assets/javascripts/discourse/app/components/user-menu/other-notifications-list.js b/app/assets/javascripts/discourse/app/components/user-menu/other-notifications-list.js
index 6b064e7f3cd..7cb132b5836 100644
--- a/app/assets/javascripts/discourse/app/components/user-menu/other-notifications-list.js
+++ b/app/assets/javascripts/discourse/app/components/user-menu/other-notifications-list.js
@@ -1,15 +1,14 @@
import UserMenuNotificationsList from "discourse/components/user-menu/notifications-list";
-import { inject as service } from "@ember/service";
export default class UserMenuOtherNotificationsList extends UserMenuNotificationsList {
- @service currentUser;
- @service siteSettings;
- @service site;
-
get dismissTypes() {
return this.filterByTypes;
}
+ get emptyStateComponent() {
+ return "user-menu/other-notifications-list-empty-state";
+ }
+
dismissWarningModal() {
return null;
}
diff --git a/app/assets/javascripts/discourse/app/components/user-menu/replies-notifications-list.js b/app/assets/javascripts/discourse/app/components/user-menu/replies-notifications-list.js
index 8d4134c8703..1773d5651a9 100644
--- a/app/assets/javascripts/discourse/app/components/user-menu/replies-notifications-list.js
+++ b/app/assets/javascripts/discourse/app/components/user-menu/replies-notifications-list.js
@@ -8,4 +8,8 @@ export default class UserMenuRepliesNotificationsList extends UserMenuNotificati
dismissWarningModal() {
return null;
}
+
+ get emptyStateComponent() {
+ return "user-menu/notifications-list-empty-state";
+ }
}
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-menu/other-notifications-list-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-menu/other-notifications-list-test.js
new file mode 100644
index 00000000000..0798714513a
--- /dev/null
+++ b/app/assets/javascripts/discourse/tests/integration/components/user-menu/other-notifications-list-test.js
@@ -0,0 +1,31 @@
+import { module, test } from "qunit";
+import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import { exists, query } from "discourse/tests/helpers/qunit-helpers";
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import pretender, { response } from "discourse/tests/helpers/create-pretender";
+import I18n from "I18n";
+
+module(
+ "Integration | Component | user-menu | other-notifications-list",
+ function (hooks) {
+ setupRenderingTest(hooks);
+
+ hooks.beforeEach(() => {
+ pretender.get("/notifications", () => {
+ return response({ notifications: [] });
+ });
+ });
+
+ const template = hbs``;
+
+ test("empty state when there are no notifications", async function (assert) {
+ await render(template);
+ assert.ok(exists(".empty-state .empty-state-body"));
+ assert.strictEqual(
+ query(".empty-state .empty-state-title").textContent.trim(),
+ I18n.t("user.no_other_notifications_title")
+ );
+ });
+ }
+);
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-menu/replies-notifications-list-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-menu/replies-notifications-list-test.js
new file mode 100644
index 00000000000..5763702fe9b
--- /dev/null
+++ b/app/assets/javascripts/discourse/tests/integration/components/user-menu/replies-notifications-list-test.js
@@ -0,0 +1,31 @@
+import { module, test } from "qunit";
+import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import { exists, query } from "discourse/tests/helpers/qunit-helpers";
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import pretender, { response } from "discourse/tests/helpers/create-pretender";
+import I18n from "I18n";
+
+module(
+ "Integration | Component | user-menu | replies-notifications-list",
+ function (hooks) {
+ setupRenderingTest(hooks);
+
+ hooks.beforeEach(() => {
+ pretender.get("/notifications", () => {
+ return response({ notifications: [] });
+ });
+ });
+
+ const template = hbs``;
+
+ test("empty state when there are no notifications", async function (assert) {
+ await render(template);
+ assert.ok(exists(".empty-state .empty-state-body"));
+ assert.strictEqual(
+ query(".empty-state .empty-state-title").textContent.trim(),
+ I18n.t("user.no_notifications_title")
+ );
+ });
+ }
+);
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index f9459f5d469..3d391db95d7 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -1141,6 +1141,9 @@ en:
You will be notified in this panel about activity directly relevant to you, including replies to your topics and posts, when someone @mentions you or quotes you, and replies to topics you are watching. Notifications will also be sent to your email when you haven’t logged in for a while.
Look for the %{icon} to decide which specific topics, categories and tags you want to be notified about. For more, see your notification preferences.
+ no_other_notifications_title: "You don’t have any other notifications yet"
+ no_other_notifications_body: >
+ You will be notified in this panel about other kinds of activity that may be relevant to you - for example, when someone links to or edits one of your posts.
no_notifications_page_title: "You don’t have any notifications yet"
no_notifications_page_body: >
You will be notified about activity directly relevant to you, including replies to your topics and posts, when someone @mentions you or quotes you, and replies to topics you are watching. Notifications will also be sent to your email when you haven’t logged in for a while.