Fix: Icons collapsing in flex.

Feature: Remember what channel was opened last.
Channels: ESC to focus message box / cancel editing.

src/pages/channels/actions/HeaderActions.tsx

@@ -35,7 +35,7 @@ export default function HeaderActions({ channel, toggleSidebar }: ChannelHeaderP
                 </>
             ) }
             <VoiceActions channel={channel} />
-            { channel.channel_type === "Group" && !isTouchscreenDevice && (
+            { (channel.channel_type === "Group" || channel.channel_type === "TextChannel") && !isTouchscreenDevice && (
                 <IconButton onClick={toggleSidebar}>
                     <SidebarIcon size={22} />
                 </IconButton>

src/pages/channels/messaging/MessageArea.tsx

@@ -12,6 +12,7 @@ import { IntermediateContext } from "../../../context/intermediate/Intermediate"
 import { ClientStatus, StatusContext } from "../../../context/revoltjs/RevoltClient";
 import { useContext, useEffect, useLayoutEffect, useRef, useState } from "preact/hooks";
 import { defer } from "../../../lib/defer";
+import { internalEmit } from "../../../lib/eventEmitter";
 
 const Area = styled.div`
     height: 100%;
@@ -246,6 +247,7 @@ export function MessageArea({ id }: Props) {
         function keyUp(e: KeyboardEvent) {
             if (e.key === "Escape" && !focusTaken) {
                 SingletonMessageRenderer.jumpToBottom(id, true);
+                internalEmit("TextArea", "focus", "message");
             }
         }
 

src/pages/channels/messaging/MessageEditor.tsx

@@ -1,9 +1,10 @@
 import styled from "styled-components";
-import { useContext, useState } from "preact/hooks";
+import { useContext, useEffect, useState } from "preact/hooks";
 import TextAreaAutoSize from "../../../lib/TextAreaAutoSize";
 import { MessageObject } from "../../../context/revoltjs/util";
 import { AppContext } from "../../../context/revoltjs/RevoltClient";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
+import { IntermediateContext } from "../../../context/intermediate/Intermediate";
 
 const EditorBase = styled.div`
     display: flex;
@@ -38,6 +39,7 @@ interface Props {
 
 export default function MessageEditor({ message, finish }: Props) {
     const [ content, setContent ] = useState(message.content as string ?? '');
+    const { focusTaken } = useContext(IntermediateContext);
     const client = useContext(AppContext);
 
     async function save() {
@@ -55,6 +57,18 @@ export default function MessageEditor({ message, finish }: Props) {
         }
     }
 
+    // ? Stop editing when pressing ESC.
+    useEffect(() => {
+        function keyUp(e: KeyboardEvent) {
+            if (e.key === "Escape" && !focusTaken) {
+                finish();
+            }
+        }
+
+        document.body.addEventListener("keyup", keyUp);
+        return () => document.body.removeEventListener("keyup", keyUp);
+    }, [focusTaken]);
+
     return (
         <EditorBase>
             <TextAreaAutoSize