diff --git a/src/pages/parts/home/BookmarksPart.tsx b/src/pages/parts/home/BookmarksPart.tsx index 4f9f13bc..94cccae1 100644 --- a/src/pages/parts/home/BookmarksPart.tsx +++ b/src/pages/parts/home/BookmarksPart.tsx @@ -17,39 +17,48 @@ export function BookmarksPart({ onItemsChange: (hasItems: boolean) => void; }) { const { t } = useTranslation(); - const progressItems = useProgressStore((s) => s.items); - const bookmarks = useBookmarkStore((s) => s.bookmarks); - const removeBookmark = useBookmarkStore((s) => s.removeBookmark); + const progressItems = useProgressStore((state) => state.items); + const bookmarks = useBookmarkStore((state) => state.bookmarks); + const removeBookmark = useBookmarkStore((state) => state.removeBookmark); const [editing, setEditing] = useState(false); const [gridRef] = useAutoAnimate(); const items = useMemo(() => { - let output: MediaItem[] = []; - Object.entries(bookmarks).forEach((entry) => { - output.push({ - id: entry[0], - ...entry[1], - }); + // Transform bookmarks object into an array of MediaItem + const transformedItems: MediaItem[] = Object.keys(bookmarks).map((id) => { + const { title, year, poster, type, updatedAt } = bookmarks[id]; + return { + id, + title, + year, + poster, + type, + updatedAt, + seasons: type === "show" ? [] : undefined, // Ensure seasons is defined for 'show' type + }; }); - output = output.sort((a, b) => { - const bookmarkA = bookmarks[a.id]; - const bookmarkB = bookmarks[b.id]; - const progressA = progressItems[a.id]; - const progressB = progressItems[b.id]; - const dateA = Math.max(bookmarkA.updatedAt, progressA?.updatedAt ?? 0); - const dateB = Math.max(bookmarkB.updatedAt, progressB?.updatedAt ?? 0); - - return dateB - dateA; + // Sort items based on the latest update time + transformedItems.sort((a, b) => { + const aUpdatedAt = Math.max( + bookmarks[a.id].updatedAt, + progressItems[a.id]?.updatedAt ?? 0, + ); + const bUpdatedAt = Math.max( + bookmarks[b.id].updatedAt, + progressItems[b.id]?.updatedAt ?? 0, + ); + return bUpdatedAt - aUpdatedAt; }); - return output; + + return transformedItems; }, [bookmarks, progressItems]); useEffect(() => { - onItemsChange(items.length > 0); + onItemsChange(items.length > 0); // Notify parent component if there are items }, [items, onItemsChange]); - if (items.length === 0) return null; + if (items.length === 0) return null; // If there are no items, return null return (
@@ -60,12 +69,12 @@ export function BookmarksPart({ - {items.map((v) => ( + {items.map((item) => ( removeBookmark(v.id)} + onClose={() => removeBookmark(item.id)} /> ))}