diff --git a/commafeed-client/src/pages/app/FeedEntriesPage.tsx b/commafeed-client/src/pages/app/FeedEntriesPage.tsx index 3884f60a..277bda25 100644 --- a/commafeed-client/src/pages/app/FeedEntriesPage.tsx +++ b/commafeed-client/src/pages/app/FeedEntriesPage.tsx @@ -9,8 +9,9 @@ import type { EntrySourceType } from "@/app/entries/slice" import { loadEntries } from "@/app/entries/thunks" import { redirectToCategoryDetails, redirectToFeedDetails, redirectToTagDetails } from "@/app/redirect/thunks" import { useAppDispatch, useAppSelector } from "@/app/store" -import { flattenCategoryTree } from "@/app/utils" +import { categoryHasNewEntries, categoryUnreadCount, flattenCategoryTree } from "@/app/utils" import { FeedEntries } from "@/components/content/FeedEntries" +import { UnreadCount } from "@/components/sidebar/UnreadCount" import { tss } from "@/tss" function NoSubscriptionHelp() { @@ -48,6 +49,40 @@ export function FeedEntriesPage(props: Readonly) { const sourceLabel = useAppSelector(state => state.entries.sourceLabel) const sourceWebsiteUrl = useAppSelector(state => state.entries.sourceWebsiteUrl) const hasMore = useAppSelector(state => state.entries.hasMore) + const unreadCount = useAppSelector(state => { + const root = state.tree.rootCategory + if (!root) return 0 + if (props.sourceType === "category") { + if (id === Constants.categories.starred.id) return 0 + if (id === Constants.categories.all.id) return categoryUnreadCount(root) + const category = flattenCategoryTree(root).find(c => c.id === id) + return categoryUnreadCount(category) + } + if (props.sourceType === "feed") { + return ( + flattenCategoryTree(root) + .flatMap(c => c.feeds) + .find(f => String(f.id) === id)?.unread ?? 0 + ) + } + return 0 + }) + const hasNewEntries = useAppSelector(state => { + const root = state.tree.rootCategory + if (!root) return false + if (props.sourceType === "category") { + if (id === Constants.categories.starred.id) return false + if (id === Constants.categories.all.id) return categoryHasNewEntries(root) + const category = flattenCategoryTree(root).find(c => c.id === id) + return categoryHasNewEntries(category) + } + if (props.sourceType === "feed") { + return !!flattenCategoryTree(root) + .flatMap(c => c.feeds) + .find(f => String(f.id) === id)?.hasNewEntries + } + return false + }) const dispatch = useAppDispatch() let title: React.ReactNode = sourceLabel @@ -90,12 +125,15 @@ export function FeedEntriesPage(props: Readonly) { // add some room at the bottom of the page in order to be able to scroll the current entry at the top of the page when expanding - {sourceWebsiteUrl && ( - - {title} - - )} - {!sourceWebsiteUrl && {title}} + + {sourceWebsiteUrl && ( + + {title} + + )} + {!sourceWebsiteUrl && {title}} + +