feat: integrate react-query for fetching unread feed items by view

- Added useQuery to fetch unread items based on the current view with a 10-minute refetch interval. - Updated imports to include necessary hooks and actions for managing unread feed state. Signed-off-by: Innei <tukon479@gmail.com>
RSSNext · Dec 13, 2024 · d4dd4fb · d4dd4fb
1 parent 351f342
commit d4dd4fb
Showing 1 changed file with 11 additions and 1 deletion.
diff --git a/apps/renderer/src/modules/feed-column/list.shared.tsx b/apps/renderer/src/modules/feed-column/list.shared.tsx
@@ -5,6 +5,7 @@ import { views } from "@follow/constants"
 import { stopPropagation } from "@follow/utils/dom"
 import { cn } from "@follow/utils/utils"
 import * as HoverCard from "@radix-ui/react-hover-card"
+import { useQuery } from "@tanstack/react-query"
 import { AnimatePresence, m } from "framer-motion"
 import { memo, useCallback, useMemo, useRef, useState } from "react"
 import { useTranslation } from "react-i18next"
@@ -23,7 +24,7 @@ import {
   useCategoryOpenStateByView,
   useSubscriptionByView,
 } from "~/store/subscription"
-import { useFeedUnreadStore } from "~/store/unread"
+import { feedUnreadActions, useFeedUnreadStore } from "~/store/unread"
 
 import { getFeedListSort, setFeedListSortBy, setFeedListSortOrder, useFeedListSort } from "./atom"
 import { feedColumnStyles } from "./styles"
@@ -111,6 +112,15 @@ export const ListHeader = ({ view }: { view: number }) => {
   const expansion = Object.values(categoryOpenStateData).every((value) => value === true)
   useUpdateUnreadCount()
 
+  useQuery({
+    queryKey: ["fetchUnreadByView", view],
+    queryFn: () => feedUnreadActions.fetchUnreadByView(view),
+    // 10 minute
+    refetchInterval: 1000 * 60 * 10,
+    refetchOnMount: "always",
+    refetchOnWindowFocus: true,
+  })
+
   const totalUnread = useFeedUnreadStore(
     useCallback(
       (state) => {