Fix focus when switching to new pages

src/app.jsx

@@ -138,11 +138,24 @@ function App() {
   };
   const focusDeck = () => {
     let timer = setTimeout(() => {
-      const page = document.getElementById(locationDeckMap[location.pathname]);
+      const columns = document.getElementById('columns');
-      console.debug('FOCUS', location.pathname, page);
+      if (columns) {
-      if (page) {
+        // Focus first column
-        page.focus();
+        columns.querySelector('.deck-container')?.focus?.();
+      } else {
+        // Focus last deck
+        const pages = document.querySelectorAll('.deck-container');
+        const page = pages[pages.length - 1]; // last one
+        if (page && page.tabIndex === -1) {
+          console.log('FOCUS', page);
+          page.focus();
+        }
       }
+      // const page = document.getElementById(locationDeckMap[location.pathname]);
+      // console.debug('FOCUS', location.pathname, page);
+      // if (page) {
+      //   page.focus();
+      // }
     }, 100);
     return () => clearTimeout(timer);
   };

src/pages/followed-hashtags.jsx

@@ -39,7 +39,7 @@ function FollowedHashtags() {
   }, []);
 
   return (
-    <div id="followed-hashtags-page" class="deck-container">
+    <div id="followed-hashtags-page" class="deck-container" tabIndex="-1">
       <div class="timeline-deck deck">
         <header>
           <div class="header-grid">

src/pages/lists.jsx

@@ -29,7 +29,7 @@ function Lists() {
   }, []);
 
   return (
-    <div id="lists-page" class="deck-container">
+    <div id="lists-page" class="deck-container" tabIndex="-1">
       <div class="timeline-deck deck">
         <header>
           <div class="header-grid">