nonworking keybinds

src/pages/Feed/FeedPage.tsx

@@ -24,7 +24,6 @@ const ITEMS_PER_BATCH = 50;
 
 export function FeedPage(props: PageProps) {
   const feedStore = useFeedStore();
-  const [selectedIndex, setSelectedIndex] = createSignal(0);
   const [isRefreshing, setIsRefreshing] = createSignal(false);
   const [loadedEpisodesCount, setLoadedEpisodesCount] = createSignal(ITEMS_PER_BATCH);
 
@@ -64,11 +63,6 @@ export function FeedPage(props: PageProps) {
     setIsRefreshing(false);
   };
 
-  const handleScrollDown = async () => {
-    if (feedStore.isLoadingMore() || !feedStore.hasMoreEpisodes()) return;
-    await feedStore.loadMoreEpisodes();
-  };
-
   const { theme } = useTheme();
   return (
     <box
@@ -99,7 +93,8 @@ export function FeedPage(props: PageProps) {
             )}
           >
             {([date, episode], groupIndex) => {
-              const selected = () => groupIndex() === selectedIndex();
+              const index = typeof props.focusedIndex === 'function' ? props.focusedIndex() : props.focusedIndex;
+              const selected = () => groupIndex() === index;
               return (
                 <>
                   <box
@@ -122,7 +117,9 @@ export function FeedPage(props: PageProps) {
                     paddingRight={1}
                     paddingTop={0}
                     paddingBottom={0}
-                    onMouseDown={() => setSelectedIndex(groupIndex())}
+                    onMouseDown={() => {
+                      // Selection is handled by App's keyboard navigation
+                    }}
                   >
                     <SelectableText selected={selected} primary>
                       {selected() ? ">" : " "}

src/pages/MyShows/MyShowsPage.tsx

@@ -11,6 +11,7 @@ import { DownloadStatus } from "@/types/episode";
 import { format } from "date-fns";
 import { PageProps } from "@/App";
 import { useTheme } from "@/context/ThemeContext";
+import { useAudioNavStore, AudioSource } from "@/stores/audio-nav";
 
 enum MyShowsPaneType {
   SHOWS = 1,
@@ -22,8 +23,7 @@ export const MyShowsPaneCount = 2;
 export function MyShowsPage(props: PageProps) {
   const feedStore = useFeedStore();
   const downloadStore = useDownloadStore();
-  const [showIndex, setShowIndex] = createSignal(0);
-  const [episodeIndex, setEpisodeIndex] = createSignal(0);
+  const audioNav = useAudioNavStore();
   const [isRefreshing, setIsRefreshing] = createSignal(false);
   const { theme } = useTheme();
   const mutedColor = () => theme.muted || theme.text;
@@ -35,8 +35,8 @@ export function MyShowsPage(props: PageProps) {
 
   const selectedShow = createMemo(() => {
     const s = shows();
-    const idx = showIndex();
-    return idx < s.length ? s[idx] : undefined;
+    const index = typeof props.focusedIndex === 'function' ? props.focusedIndex() : props.focusedIndex;
+    return index < s.length ? s[index] : undefined;
   });
 
   const episodes = createMemo(() => {
@@ -47,23 +47,6 @@ export function MyShowsPage(props: PageProps) {
     );
   });
 
-  // Detect when user navigates near the bottom and load more episodes
-  createEffect(() => {
-    const idx = episodeIndex();
-    const eps = episodes();
-    const show = selectedShow();
-    if (!show || eps.length === 0) return;
-
-    const nearBottom = idx >= eps.length - LOAD_MORE_THRESHOLD;
-    if (
-      nearBottom &&
-      feedStore.hasMoreEpisodes(show.id) &&
-      !feedStore.isLoadingMore()
-    ) {
-      feedStore.loadMoreEpisodes(show.id);
-    }
-  });
-
   const formatDate = (date: Date): string => {
     return format(date, "MMM d, yyyy");
   };
@@ -160,6 +143,7 @@ export function MyShowsPage(props: PageProps) {
                   onMouseDown={() => {
                     setShowIndex(index());
                     setEpisodeIndex(0);
+                    audioNav.setSource(AudioSource.MY_SHOWS, selectedShow()?.podcast.id);
                   }}
                 >
                   <text