feat: fetch stream entry content

Signed-off-by: Innei <tukon479@gmail.com>

Author: Innei

apps/renderer/src/modules/entry-column/hooks.ts

@@ -1,13 +1,15 @@
 import { views } from "@follow/constants"
+import { useMutation } from "@tanstack/react-query"
 import { useCallback, useEffect, useMemo, useRef, useState } from "react"
 import type { ListRange } from "react-virtuoso"
 import { useDebounceCallback } from "usehooks-ts"
 
 import { useGeneralSettingKey } from "~/atoms/settings/general"
 import { useRouteParams, useRouteParamsSelector } from "~/hooks/biz/useRouteParams"
 import { useAuthQuery } from "~/hooks/common"
+import { apiClient, apiFetch } from "~/lib/api-fetch"
 import { entries, useEntries } from "~/queries/entries"
-import { entryActions, useEntryIdsByFeedIdOrView } from "~/store/entry"
+import { entryActions, getEntry, useEntryIdsByFeedIdOrView } from "~/store/entry"
 import { useFolderFeedsByFeedId } from "~/store/subscription"
 import { feedUnreadActions } from "~/store/unread"
 
@@ -114,6 +116,8 @@ export const useEntriesByView = ({
     ] as string[]
   }, [query.data?.pages])
 
+  useFetchEntryContentByStream(remoteEntryIds)
+
   const currentEntries = useEntryIdsByFeedIdOrView(isAllFeeds ? view : folderIds || feedId!, {
     unread: unreadOnly,
     view,
@@ -273,3 +277,80 @@ function sortEntriesIdByEntryInsertedAt(entries: string[]) {
       entriesId2Map[b]?.entries.insertedAt.localeCompare(entriesId2Map[a]?.entries.insertedAt),
     )
 }
+
+const useFetchEntryContentByStream = (remoteEntryIds: string[]) => {
+  const { mutate: updateEntryContent } = useMutation({
+    mutationKey: ["stream-entry-content", remoteEntryIds],
+    mutationFn: async (remoteEntryIds: string[]) => {
+      const onlyNoStored = true
+
+      const nextIds = [] as string[]
+      if (onlyNoStored) {
+        for (const id of remoteEntryIds) {
+          const entry = getEntry(id)
+          if (entry.entries.content) {
+            continue
+          }
+
+          nextIds.push(id)
+        }
+      }
+
+      const readStream = async () => {
+        const response = await apiFetch(apiClient.entries.stream.$url().toString(), {
+          method: "post",
+          body: JSON.stringify({
+            ids: nextIds,
+          }),
+          responseType: "stream",
+        })
+
+        const reader = response.getReader()
+        if (!reader) return
+
+        const decoder = new TextDecoder()
+        let buffer = ""
+
+        try {
+          while (true) {
+            const { done, value } = await reader.read()
+            if (done) break
+
+            buffer += decoder.decode(value, { stream: true })
+            const lines = buffer.split("\n")
+
+            // Process all complete lines
+            for (let i = 0; i < lines.length - 1; i++) {
+              if (lines[i].trim()) {
+                const json = JSON.parse(lines[i])
+                // Handle each JSON line here
+                entryActions.updateEntryContent(json.id, json.content)
+              }
+            }
+
+            // Keep the last incomplete line in the buffer
+            buffer = lines.at(-1) || ""
+          }
+
+          // Process any remaining data
+          if (buffer.trim()) {
+            const json = JSON.parse(buffer)
+
+            entryActions.updateEntryContent(json.id, json.content)
+          }
+        } catch (error) {
+          console.error("Error reading stream:", error)
+        } finally {
+          reader.releaseLock()
+        }
+      }
+
+      readStream()
+    },
+  })
+
+  useEffect(() => {
+    if (!remoteEntryIds) return
+    updateEntryContent(remoteEntryIds)
+  }, [remoteEntryIds, updateEntryContent])
+}

apps/renderer/src/modules/entry-column/templates/list-item-template.tsx

@@ -1,6 +1,5 @@
 import { EllipsisHorizontalTextWithTooltip } from "@follow/components/ui/typography/index.js"
 import { cn, isSafari } from "@follow/utils/utils"
-import { useDebounceCallback } from "usehooks-ts"
 
 import { AudioPlayer, useAudioPlayerAtomSelector } from "~/atoms/player"
 import { useRealInWideMode, useUISettingKey } from "~/atoms/settings/ui"
@@ -12,7 +11,6 @@ import { useRouteParamsSelector } from "~/hooks/biz/useRouteParams"
 import { EntryTranslation } from "~/modules/entry-column/translation"
 import { FeedIcon } from "~/modules/feed/feed-icon"
 import { FeedTitle } from "~/modules/feed/feed-title"
-import { Queries } from "~/queries"
 import { useEntry } from "~/store/entry/hooks"
 import { getPreferredTitle, useFeedById } from "~/store/feed"
 import { useInboxById } from "~/store/inbox"
@@ -52,15 +50,15 @@ export function ListItem({
 
   const inbox = useInboxById(entry?.inboxId)
 
-  const handlePrefetchEntry = useDebounceCallback(
-    () => {
-      inbox
-        ? Queries.entries.byInboxId(entryId).prefetch()
-        : Queries.entries.byId(entryId).prefetch()
-    },
-    300,
-    { leading: false },
-  )
+  // const handlePrefetchEntry = useDebounceCallback(
+  //   () => {
+  //     inbox
+  //       ? Queries.entries.byInboxId(entryId).prefetch()
+  //       : Queries.entries.byId(entryId).prefetch()
+  //   },
+  //   300,
+  //   { leading: false },
+  // )
 
   const settingWideMode = useRealInWideMode()
   const thumbnailRatio = useUISettingKey("thumbnailRatio")
@@ -76,8 +74,8 @@ export function ListItem({
 
   return (
     <div
-      onMouseEnter={handlePrefetchEntry}
-      onMouseLeave={handlePrefetchEntry.cancel}
+      // onMouseEnter={handlePrefetchEntry}
+      // onMouseLeave={handlePrefetchEntry.cancel}
       className={cn(
         "group relative flex cursor-menu pl-3 pr-2",
         !asRead &&

apps/renderer/src/store/entry/store.ts

@@ -59,6 +59,15 @@ class EntryActions {
     runTransactionInScope(() => EntryService.deleteEntries(entryIds))
   }
 
+  updateEntryContent(entryId: string, content: string) {
+    set((state) =>
+      produce(state, (draft) => {
+        if (!draft.flatMapEntries[entryId]) return
+        draft.flatMapEntries[entryId].entries.content = content
+      }),
+    )
+  }
+
   async fetchEntryById(entryId: string) {
     const { data } = await apiClient.entries.$get({
       query: {

locales/errors/en.json

@@ -1,6 +1,7 @@
 {
   "1": "Previous operation is not completed",
   "2": "CSRF Token mismatch",
+  "3": "Unprocessable content",
   "1000": "Unauthorized",
   "1001": "create session failed",
   "1002": "Invalid parameter",
@@ -50,5 +51,6 @@
   "10001": "Inbox already exists",
   "10002": "Inbox limit exceeded",
   "10003": "Inbox permission denied",
-  "11000": "RSSHub route not found"
+  "11000": "RSSHub route not found",
+  "12000": "Action limit exceeded"
 }

packages/shared/src/hono.ts

@@ -6433,6 +6433,20 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
             status: 200;
         };
     };
+    "/feeds/reset": {
+        $get: {
+            input: {
+                query: {
+                    id: string | string[];
+                };
+            };
+            output: {
+                code: 0;
+            };
+            outputFormat: "json" | "text";
+            status: 200;
+        };
+    };
 } & {
     "/entries/inbox": {
         $post: {
@@ -6854,6 +6868,18 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
             status: 200;
         };
     };
+    "/entries/stream": {
+        $post: {
+            input: {
+                json: {
+                    ids: string[];
+                };
+            };
+            output: {};
+            outputFormat: string;
+            status: 200;
+        };
+    };
     "/entries/preview": {
         $get: {
             input: {
@@ -7043,7 +7069,9 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
             input: {
                 query: {
                     category?: string | string[] | undefined;
+                    categories?: string | string[] | undefined;
                     namespace?: string | string[] | undefined;
+                    lang?: string | string[] | undefined;
                 };
             };
             output: {
@@ -7052,6 +7080,7 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
                         description: string;
                         name: string;
                         url: string;
+                        lang: string;
                         routes: {
                             [x: string]: {
                                 description: string;