From 5b3420d8542c4d318d8ad89e5abf6510c7e1db6d Mon Sep 17 00:00:00 2001
From: Martin Brennan <martin@discourse.org>
Date: Wed, 19 Apr 2023 09:07:52 +1000
Subject: [PATCH] FIX: Chat composer shortcuts should respect context (#21130)

This commit fixes an issue where if you pressed a format
shortcut (e.g. bold, italic, code) for the composer and
you had the thread panel open as well, the shortcut would
trigger in both composers, not just the one that was focused.
---
 .../discourse/components/chat-composer.hbs    |  1 +
 .../discourse/components/chat-composer.js     |  5 +-
 .../initializers/chat-keyboard-shortcuts.js   |  5 +-
 .../system/shortcuts/chat_composer_spec.rb    | 61 ++++++++++++++-----
 4 files changed, 56 insertions(+), 16 deletions(-)

diff --git a/plugins/chat/assets/javascripts/discourse/components/chat-composer.hbs b/plugins/chat/assets/javascripts/discourse/components/chat-composer.hbs
index 1c3cf07e0d8..fe10dcbcec8 100644
--- a/plugins/chat/assets/javascripts/discourse/components/chat-composer.hbs
+++ b/plugins/chat/assets/javascripts/discourse/components/chat-composer.hbs
@@ -45,6 +45,7 @@
     @placeholder={{this.placeholder}}
     @focus-in={{action "onTextareaFocusIn" value="target"}}
     @rows={{1}}
+    data-chat-composer-context={{@context}}
   />
 
   {{#if this.isNetworkUnreliable}}
diff --git a/plugins/chat/assets/javascripts/discourse/components/chat-composer.js b/plugins/chat/assets/javascripts/discourse/components/chat-composer.js
index a1172d47129..a3236f394c6 100644
--- a/plugins/chat/assets/javascripts/discourse/components/chat-composer.js
+++ b/plugins/chat/assets/javascripts/discourse/components/chat-composer.js
@@ -108,7 +108,10 @@ export default Component.extend(TextareaTextManipulation, {
     this.set("ready", true);
   },
 
-  _modifySelection(opts = { type: null }) {
+  _modifySelection(opts = { type: null, context: null }) {
+    if (opts.context !== this.context) {
+      return;
+    }
     const sel = this.getSelected("", { lineVal: true });
     if (opts.type === "bold") {
       this.applySurround(sel, "**", "**", "bold_text");
diff --git a/plugins/chat/assets/javascripts/discourse/initializers/chat-keyboard-shortcuts.js b/plugins/chat/assets/javascripts/discourse/initializers/chat-keyboard-shortcuts.js
index f9d564fcf97..8439c53d8eb 100644
--- a/plugins/chat/assets/javascripts/discourse/initializers/chat-keyboard-shortcuts.js
+++ b/plugins/chat/assets/javascripts/discourse/initializers/chat-keyboard-shortcuts.js
@@ -58,7 +58,10 @@ export default {
       }
       event.preventDefault();
       event.stopPropagation();
-      appEvents.trigger("chat:modify-selection", { type });
+      appEvents.trigger("chat:modify-selection", {
+        type,
+        context: event.target.dataset.chatComposerContext,
+      });
     };
 
     const openInsertLinkModal = (event) => {
diff --git a/plugins/chat/spec/system/shortcuts/chat_composer_spec.rb b/plugins/chat/spec/system/shortcuts/chat_composer_spec.rb
index 54a4f8ac83b..07084cdddf4 100644
--- a/plugins/chat/spec/system/shortcuts/chat_composer_spec.rb
+++ b/plugins/chat/spec/system/shortcuts/chat_composer_spec.rb
@@ -20,26 +20,24 @@ RSpec.describe "Shortcuts | chat composer", type: :system, js: true do
   end
 
   context "when using meta + b" do
-    xit "adds bold text" do
+    it "adds bold text" do
       chat.visit_channel(channel_1)
 
-      within(".chat-composer-input") do |composer|
-        composer.send_keys([key_modifier, "b"])
+      composer = find(".chat-composer-input")
+      composer.send_keys([key_modifier, "b"])
 
-        expect(composer.value).to eq("**strong text**")
-      end
+      expect(composer.value).to eq("**strong text**")
     end
   end
 
   context "when using meta + i" do
-    xit "adds italic text" do
+    it "adds italic text" do
       chat.visit_channel(channel_1)
 
-      within(".chat-composer-input") do |composer|
-        composer.send_keys([key_modifier, "i"])
+      composer = find(".chat-composer-input")
+      composer.send_keys([key_modifier, "i"])
 
-        expect(composer.value).to eq("_emphasized text_")
-      end
+      expect(composer.value).to eq("_emphasized text_")
     end
   end
 
@@ -47,11 +45,46 @@ RSpec.describe "Shortcuts | chat composer", type: :system, js: true do
     it "adds preformatted text" do
       chat.visit_channel(channel_1)
 
-      within(".chat-composer-input") do |composer|
-        composer.send_keys([key_modifier, "e"])
+      composer = find(".chat-composer-input")
+      composer.send_keys([key_modifier, "e"])
 
-        expect(composer.value).to eq("`indent preformatted text by 4 spaces`")
-      end
+      expect(composer.value).to eq("`indent preformatted text by 4 spaces`")
+    end
+  end
+
+  context "when the thread panel is also open" do
+    fab!(:user_2) { Fabricate(:user) }
+    fab!(:thread) do
+      chat_thread_chain_bootstrap(
+        channel: channel_1,
+        users: [current_user, user_2],
+        messages_count: 2,
+      )
+    end
+
+    before do
+      SiteSetting.enable_experimental_chat_threaded_discussions = true
+      channel_1.update!(threading_enabled: true)
+    end
+
+    it "directs the shortcut to the focused composer" do
+      chat.visit_channel(channel_1)
+      channel_page.message_thread_indicator(thread.original_message).click
+
+      composer = find(".chat-composer-input--channel")
+      thread_composer = find(".chat-composer-input--thread")
+      composer.send_keys([key_modifier, "i"])
+
+      expect(composer.value).to eq("_emphasized text_")
+      expect(thread_composer.value).to eq("")
+
+      composer.fill_in(with: "")
+      thread_composer.fill_in(with: "")
+
+      thread_composer.send_keys([key_modifier, "i"])
+
+      expect(composer.value).to eq("")
+      expect(thread_composer.value).to eq("_emphasized text_")
     end
   end