feat: support pressing escape (#38)

This should be an ongoing effort, since new pages will require this
support to be implemented, but this PR implements for the existing
pages.

src/components/card.ts

@@ -106,6 +106,9 @@ function setupCardKeydown(
     } else if (keyPressed === "ArrowDown") {
       e.preventDefault();
       onVerticalMovement(allCards, card, keyPressed);
+    } else if (keyPressed === "Escape") {
+      hideChannelActions(card);
+      card.focus();
     }
   }
 
@@ -122,6 +125,13 @@ function getChannelActionsWrapper(card: HTMLElement) {
   );
 }
 
+function hideChannelActions(card: HTMLElement) {
+  const channelActionsWrapper = getChannelActionsWrapper(card);
+  channelActionsWrapper.forEach((el) => {
+    el.style.opacity = "0";
+  });
+}
+
 export function handleFocusOut(card: HTMLElement): Teardown {
   function onFocusOut(e: FocusEvent) {
     const target = e.relatedTarget as HTMLElement | null;
@@ -130,10 +140,7 @@ export function handleFocusOut(card: HTMLElement): Teardown {
     }
 
     if (!card.contains(target)) {
-      const channelActionsWrapper = getChannelActionsWrapper(card);
-      channelActionsWrapper.forEach((el) => {
-        el.style.opacity = "0";
-      });
+      hideChannelActions(card);
     }
   }
 

src/sections/sidebar.ts

@@ -454,6 +454,11 @@ function setupUserMenuKeydown(): Teardown {
         } else {
           n.value.focus();
         }
+      } else if (keyPressed === "Escape") {
+        if (userButton) {
+          findClickableUserButtonEl(userButton)?.click();
+          focusBackWhenTransitionEnds(userButton);
+        }
       }
     }