When showing thread, always auto-focus its composer (#8115)

src/components/views/messages/MessageActionBar.tsx

@@ -24,7 +24,6 @@ import { MsgType, RelationType } from 'matrix-js-sdk/src/@types/event';
 import type { Relations } from 'matrix-js-sdk/src/models/relations';
 import { _t } from '../../../languageHandler';
 import dis from '../../../dispatcher/dispatcher';
-import { Action } from '../../../dispatcher/actions';
 import ContextMenu, { aboveLeftOf, ContextMenuTooltipButton, useContextMenu } from '../../structures/ContextMenu';
 import { isContentActionable, canEditContent, editEvent } from '../../../utils/EventUtils';
 import RoomContext, { TimelineRenderingType } from "../../../contexts/RoomContext";
@@ -225,10 +224,6 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
 
     private onThreadClick = (isCard: boolean): void => {
         showThread({ rootEvent: this.props.mxEvent, push: isCard });
-        dis.dispatch({
-            action: Action.FocusSendMessageComposer,
-            context: TimelineRenderingType.Thread,
-        });
     };
 
     private onEditClick = (): void => {

src/components/views/rooms/EditMessageComposer.tsx

@@ -202,7 +202,16 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
                         timelineRenderingType: this.context.timelineRenderingType,
                     });
                 } else {
-                    this.clearStoredEditorState();
+                    this.cancelEdit();
+                }
+                event.preventDefault();
+                break;
+            }
+        }
+    };
+
+    private endEdit(): void {
+        // close the event editing and focus composer
         dis.dispatch({
             action: Action.EditEvent,
             event: null,
@@ -213,11 +222,6 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
             context: this.context.timelineRenderingType,
         });
     }
-                event.preventDefault();
-                break;
-            }
-        }
-    };
 
     private get editorRoomKey(): string {
         return `mx_edit_room_${this.getRoom().roomId}_${this.context.timelineRenderingType}`;
@@ -236,15 +240,7 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
 
     private cancelEdit = (): void => {
         this.clearStoredEditorState();
-        dis.dispatch({
-            action: Action.EditEvent,
-            event: null,
-            timelineRenderingType: this.context.timelineRenderingType,
-        });
-        dis.dispatch({
-            action: Action.FocusSendMessageComposer,
-            context: this.context.timelineRenderingType,
-        });
+        this.endEdit();
     };
 
     private get shouldSaveStoredEditorState(): boolean {
@@ -357,16 +353,7 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
             }
         }
 
-        // close the event editing and focus composer
-        dis.dispatch({
-            action: Action.EditEvent,
-            event: null,
-            timelineRenderingType: this.context.timelineRenderingType,
-        });
-        dis.dispatch({
-            action: Action.FocusSendMessageComposer,
-            context: this.context.timelineRenderingType,
-        });
+        this.endEdit();
     };
 
     private cancelPreviousPendingEdit(): void {

src/dispatcher/dispatch-actions/threads.ts

@@ -13,10 +13,14 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
 */
+
 import { MatrixEvent } from "matrix-js-sdk/src/models/event";
 
 import RightPanelStore from "../../stores/right-panel/RightPanelStore";
 import { RightPanelPhases } from "../../stores/right-panel/RightPanelStorePhases";
+import dis from "../dispatcher";
+import { Action } from "../actions";
+import { TimelineRenderingType } from "../../contexts/RoomContext";
 
 export const showThread = (props: {
     rootEvent: MatrixEvent;
@@ -41,6 +45,12 @@ export const showThread = (props: {
             threadViewCard,
         ]);
     }
+
+    // Focus the composer
+    dis.dispatch({
+        action: Action.FocusSendMessageComposer,
+        context: TimelineRenderingType.Thread,
+    });
 };
 
 export const showThreadPanel = () => {