From 0b0290cddbb09c2bd00698eb5cebf07652258fb6 Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Fri, 21 Feb 2020 21:32:58 +0100
Subject: [PATCH] FIX: muted was not working in topic timeline (#9021)

---
 .../discourse/widgets/topic-timeline.js.es6   | 18 +++++--------
 .../topic-notifications-button.js.es6         |  1 +
 .../components/topic-notifications-button.hbs |  1 +
 .../topic-notifications-button-test.js.es6    | 25 +++++++++++++++++++
 4 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6 b/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
index 7342e8f9557..f6ba07b7421 100644
--- a/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
+++ b/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
@@ -382,21 +382,15 @@ createWidget("timeline-footer-controls", {
       controls.push(
         new ComponentConnector(
           this,
-          "topic-notifications-options",
+          "topic-notifications-button",
           {
-            value: notificationLevel,
+            notificationLevel,
             topic,
-            options: {
-              showFullTitle: false,
-              placement: "bottom-end"
-            },
-            onChange: newNotificationLevel => {
-              if (newNotificationLevel !== notificationLevel) {
-                topic.details.updateNotifications(newNotificationLevel);
-              }
-            }
+            showFullTitle: false,
+            appendReason: false,
+            placement: "bottom-end"
           },
-          ["value"]
+          ["notificationLevel"]
         )
       );
     }
diff --git a/app/assets/javascripts/select-kit/components/topic-notifications-button.js.es6 b/app/assets/javascripts/select-kit/components/topic-notifications-button.js.es6
index 3ed6530b917..4ff6b5d151b 100644
--- a/app/assets/javascripts/select-kit/components/topic-notifications-button.js.es6
+++ b/app/assets/javascripts/select-kit/components/topic-notifications-button.js.es6
@@ -5,6 +5,7 @@ export default Component.extend({
   classNames: ["topic-notifications-button"],
   appendReason: true,
   showFullTitle: true,
+  placement: "bottom-start",
 
   didInsertElement() {
     this._super(...arguments);
diff --git a/app/assets/javascripts/select-kit/templates/components/topic-notifications-button.hbs b/app/assets/javascripts/select-kit/templates/components/topic-notifications-button.hbs
index 2f3a689c8c5..2bf3a9a1220 100644
--- a/app/assets/javascripts/select-kit/templates/components/topic-notifications-button.hbs
+++ b/app/assets/javascripts/select-kit/templates/components/topic-notifications-button.hbs
@@ -4,6 +4,7 @@
   onChange=(action "changeTopicNotificationLevel")
   options=(hash
     showFullTitle=showFullTitle
+    placement=placement
   )
 }}
 
diff --git a/test/javascripts/acceptance/topic-notifications-button-test.js.es6 b/test/javascripts/acceptance/topic-notifications-button-test.js.es6
index ad2b5e26122..fdb7fa367d3 100644
--- a/test/javascripts/acceptance/topic-notifications-button-test.js.es6
+++ b/test/javascripts/acceptance/topic-notifications-button-test.js.es6
@@ -30,4 +30,29 @@ QUnit.test("Updating topic notification level", async assert => {
     "Watching",
     "it should display the right notification level"
   );
+
+  const timelineNotificationOptions = selectKit(
+    ".topic-timeline .widget-component-connector .topic-notifications-options"
+  );
+
+  assert.equal(
+    timelineNotificationOptions.header().value(),
+    "3",
+    "it should display the right notification level"
+  );
+
+  await timelineNotificationOptions.expand();
+  await timelineNotificationOptions.selectRowByValue("0");
+
+  assert.equal(
+    timelineNotificationOptions.header().value(),
+    "0",
+    "it should display the right notification level"
+  );
+
+  assert.equal(
+    notificationOptions.header().label(),
+    "Muted",
+    "it should display the right notification level"
+  );
 });