From b733b3c59fb120fb7978247034bd683b326d65e4 Mon Sep 17 00:00:00 2001
From: unknown <ajbura@gmail.com>
Date: Thu, 26 Aug 2021 14:43:14 +0530
Subject: [PATCH] fixed #56: tab (after last cmd suggestion) and esc will focus
 back to input

---
 .../organisms/channel/ChannelViewCmdBar.jsx   | 19 +++++++++++++++++++
 .../organisms/channel/ChannelViewInput.jsx    |  7 +++++++
 2 files changed, 26 insertions(+)

diff --git a/src/app/organisms/channel/ChannelViewCmdBar.jsx b/src/app/organisms/channel/ChannelViewCmdBar.jsx
index 3943576..17fc03d 100644
--- a/src/app/organisms/channel/ChannelViewCmdBar.jsx
+++ b/src/app/organisms/channel/ChannelViewCmdBar.jsx
@@ -385,6 +385,22 @@ function ChannelViewCmdBar({ roomId, roomTimeline, viewEvent }) {
     });
   }
 
+  function listenKeyboard(event) {
+    const { activeElement } = document;
+    const lastCmdItem = document.activeElement.parentNode.lastElementChild;
+    if (event.keyCode === 27) {
+      if (activeElement.className !== 'cmd-item') return;
+      viewEvent.emit('focus_msg_input');
+    }
+    if (event.keyCode === 9) {
+      if (lastCmdItem.className !== 'cmd-item') return;
+      if (lastCmdItem !== activeElement) return;
+      if (event.shiftKey) return;
+      viewEvent.emit('focus_msg_input');
+      event.preventDefault();
+    }
+  }
+
   useEffect(() => {
     viewEvent.on('cmd_activate', activateCmd);
     viewEvent.on('cmd_deactivate', deactivateCmd);
@@ -396,10 +412,13 @@ function ChannelViewCmdBar({ roomId, roomTimeline, viewEvent }) {
   }, [roomId]);
 
   useEffect(() => {
+    if (cmd !== null) document.body.addEventListener('keydown', listenKeyboard);
     viewEvent.on('cmd_process', processCmd);
     viewEvent.on('cmd_exe', executeCmd);
     asyncSearch.on(asyncSearch.RESULT_SENT, displaySuggestions);
     return () => {
+      if (cmd !== null) document.body.removeEventListener('keydown', listenKeyboard);
+
       viewEvent.removeListener('cmd_process', processCmd);
       viewEvent.removeListener('cmd_exe', executeCmd);
       asyncSearch.removeListener(asyncSearch.RESULT_SENT, displaySuggestions);
diff --git a/src/app/organisms/channel/ChannelViewInput.jsx b/src/app/organisms/channel/ChannelViewInput.jsx
index 773b47d..08b32c0 100644
--- a/src/app/organisms/channel/ChannelViewInput.jsx
+++ b/src/app/organisms/channel/ChannelViewInput.jsx
@@ -50,10 +50,17 @@ function ChannelViewInput({
   const mx = initMatrix.matrixClient;
   const { roomsInput } = initMatrix;
 
+  function requestFocusInput() {
+    if (textAreaRef === null) return;
+    textAreaRef.current.focus();
+  }
+
   useEffect(() => {
     settings.on(cons.events.settings.MARKDOWN_TOGGLED, setIsMarkdown);
+    viewEvent.on('focus_msg_input', requestFocusInput);
     return () => {
       settings.removeListener(cons.events.settings.MARKDOWN_TOGGLED, setIsMarkdown);
+      viewEvent.removeListener('focus_msg_input', requestFocusInput);
     };
   }, []);