fix: improve media grouping and bot startup

web/src/api/library.ts

@@ -151,6 +151,9 @@ export const libraryAPI = {
 }
 
 export const mediaAPI = {
+  recent: (limit = 24) =>
+    api.get<SeriesCard[]>('/media/recent', { params: { limit } }).then((r) => r.data),
+
   search: (q: string, limit = 50) =>
     api.get<MediaSearchPage>('/media', { params: { q, limit } }).then((r) => r.data),
 

web/src/pages/HomePage.tsx

@@ -3,7 +3,7 @@ import { useEffect, useMemo, useState } from 'react'
 import { libraryAPI, mediaAPI } from '../api/library'
 import { playbackAPI, type HistoryItem } from '../api/playback'
 import type { Library, Media } from '../types'
-import { groupSeries } from '../utils/groupSeries'
+import { groupSeries, type SeriesCard } from '../utils/groupSeries'
 import {
   ContinueWatchingSection,
   HomeEmptyState,
@@ -17,7 +17,7 @@ const asArray = <T,>(value: unknown): T[] => (Array.isArray(value) ? value as T[
 
 export function HomePage() {
   const [libraries, setLibraries] = useState<Library[]>([])
-  const [recent, setRecent] = useState<Media[]>([])
+  const [recentCards, setRecentCards] = useState<SeriesCard[]>([])
   const [history, setHistory] = useState<HistoryItem[]>([])
   const [loading, setLoading] = useState(true)
 
@@ -28,12 +28,15 @@ export function HomePage() {
       try {
         const [libs, recentItems, hist] = await Promise.all([
           libraryAPI.list().then((rows) => asArray<Library>(rows)).catch(() => [] as Library[]),
-          mediaAPI.search('', 120).then((d) => asArray<Media>(d?.items)).catch(() => [] as Media[]),
+          mediaAPI.recent(24).then((rows) => asArray<SeriesCard>(rows)).catch(async () => {
+            const fallback = await mediaAPI.search('', 120).then((d) => asArray<Media>(d?.items)).catch(() => [] as Media[])
+            return groupSeries(fallback).slice(0, 24)
+          }),
           playbackAPI.recentHistory().then((rows) => asArray<HistoryItem>(rows)).catch(() => [] as HistoryItem[]),
         ])
         if (cancelled) return
         setLibraries(libs)
-        setRecent(recentItems)
+        setRecentCards(recentItems)
         setHistory(hist.filter((h) => h && !h.completed && !!h.media))
       } finally {
         if (!cancelled) setLoading(false)
@@ -43,15 +46,13 @@ export function HomePage() {
     return () => { cancelled = true }
   }, [])
 
-  const recentCards = useMemo(() => groupSeries(recent).slice(0, 24), [recent])
   const featuredItem = useMemo(() => {
     const candidates = [
       ...(history.map((h) => h.media).filter(Boolean) as Media[]),
       ...recentCards.map((card) => card.rep),
-      ...recent,
     ]
     return candidates.find(hasArtwork) ?? candidates[0] ?? null
-  }, [history, recentCards, recent])
+  }, [history, recentCards])
   const featuredVisual = featuredItem?.backdrop_url || featuredItem?.poster_url || ''
   const featuredPoster = featuredItem?.poster_url || featuredItem?.backdrop_url || ''
   const featuredMark = (featuredItem?.title || 'MS').trim().slice(0, 4).toUpperCase()