From 7734f8aeefcbbc2d9186f6efa88a537d6040c253 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=A0imon=20Brandner?= <simon.bra.ag@gmail.com>
Date: Thu, 8 Jul 2021 17:33:49 +0200
Subject: [PATCH] Handle focusing multiple composers
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
---
 src/components/structures/RoomView.tsx           | 16 ++++++++++++++++
 .../views/emojipicker/ReactionPicker.tsx         |  4 ++--
 .../views/rooms/EditMessageComposer.tsx          |  2 ++
 src/dispatcher/actions.ts                        | 14 +++++++++++++-
 4 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx
index 0e77c301fd..0b345de49f 100644
--- a/src/components/structures/RoomView.tsx
+++ b/src/components/structures/RoomView.tsx
@@ -832,6 +832,22 @@ export default class RoomView extends React.Component<IProps, IState> {
                 break;
             }
 
+            case Action.FocusAComposer: {
+                // re-dispatch to the correct composer
+                if (this.state.editState) {
+                    dis.dispatch({
+                        ...payload,
+                        action: Action.FocusEditMessageComposer,
+                    });
+                } else {
+                    dis.dispatch({
+                        ...payload,
+                        action: Action.FocusComposer,
+                    });
+                }
+                break;
+            }
+
             case "scroll_to_bottom":
                 this.messagePanel?.jumpToLiveTimeline();
                 break;
diff --git a/src/components/views/emojipicker/ReactionPicker.tsx b/src/components/views/emojipicker/ReactionPicker.tsx
index d5a2277ab2..e129b45c9a 100644
--- a/src/components/views/emojipicker/ReactionPicker.tsx
+++ b/src/components/views/emojipicker/ReactionPicker.tsx
@@ -94,7 +94,7 @@ class ReactionPicker extends React.Component<IProps, IState> {
                 this.props.mxEvent.getRoomId(),
                 myReactions[reaction],
             );
-            dis.dispatch({ action: Action.FocusComposer });
+            dis.dispatch({ action: Action.FocusAComposer });
             // Tell the emoji picker not to bump this in the more frequently used list.
             return false;
         } else {
@@ -106,7 +106,7 @@ class ReactionPicker extends React.Component<IProps, IState> {
                 },
             });
             dis.dispatch({ action: "message_sent" });
-            dis.dispatch({ action: Action.FocusComposer });
+            dis.dispatch({ action: Action.FocusAComposer });
             return true;
         }
     };
diff --git a/src/components/views/rooms/EditMessageComposer.tsx b/src/components/views/rooms/EditMessageComposer.tsx
index fea6499dd8..3bfa121799 100644
--- a/src/components/views/rooms/EditMessageComposer.tsx
+++ b/src/components/views/rooms/EditMessageComposer.tsx
@@ -452,6 +452,8 @@ export default class EditMessageComposer extends React.Component<IProps, IState>
             } else if (payload.text) {
                 this.editorRef.current?.insertPlaintext(payload.text);
             }
+        } else if (payload.action === Action.FocusEditMessageComposer && this.editorRef.current) {
+            this.editorRef.current.focus();
         }
     };
 
diff --git a/src/dispatcher/actions.ts b/src/dispatcher/actions.ts
index 6438ecc0f2..d376560ace 100644
--- a/src/dispatcher/actions.ts
+++ b/src/dispatcher/actions.ts
@@ -56,10 +56,22 @@ export enum Action {
     CheckUpdates = "check_updates",
 
     /**
-     * Focuses the user's cursor to the composer. No additional payload information required.
+     * Focuses the user's cursor to the send message composer. No additional payload information required.
      */
     FocusComposer = "focus_composer",
 
+    /**
+     * Focuses the user's cursor to the edit message composer. No additional payload information required.
+     */
+    FocusEditMessageComposer = "focus_edit_message_composer",
+
+    /**
+     * Focuses the user's cursor to the edit message composer or send message
+     * composer based on the current edit state. No additional payload
+     * information required.
+     */
+    FocusAComposer = "focus_a_composer",
+
     /**
      * Opens the user menu (previously known as the top left menu). No additional payload information required.
      */