feat(ssr): open feed in app

DIYgod · DIYgod · commit ec3401872550 · 2025-05-07T13:48:51.000+08:00
diff --git a/apps/desktop/layer/main/src/lib/router.ts b/apps/desktop/layer/main/src/lib/router.ts
@@ -46,6 +46,20 @@ export const handleUrlRouting = (url: string) => {
         })
         return
       }
+      case "/feed": {
+        callMainWindow(url, (mainWindow) => {
+          const caller = callWindowExpose(mainWindow)
+
+          const id = searchParams.get("id") ?? undefined
+          const view = searchParams.get("view") ?? "0"
+          if (!id) return
+          caller.goToFeed({
+            id,
+            view: Number.parseInt(view, 10),
+          })
+        })
+        return
+      }
       case "/": {
         callMainWindow(url, (mainWindow) => {
           mainWindow.restore()
diff --git a/apps/desktop/layer/renderer/src/hooks/biz/useNavigateEntry.ts b/apps/desktop/layer/renderer/src/hooks/biz/useNavigateEntry.ts
@@ -7,6 +7,7 @@ import { useCallback } from "react"
 
 import { disableShowAISummaryOnce } from "~/atoms/ai-summary"
 import { disableShowAITranslationOnce } from "~/atoms/ai-translation"
+import { setPreviewBackPath } from "~/atoms/preview"
 import { resetShowSourceContent } from "~/atoms/source-content"
 import {
   ROUTE_ENTRY_PENDING,
@@ -16,6 +17,7 @@ import {
   ROUTE_FEED_PENDING,
   ROUTE_TIMELINE_OF_VIEW,
 } from "~/constants"
+import { getSubscriptionByFeedId } from "~/store/subscription"
 
 export type NavigateEntryOptions = Partial<{
   timelineId: string
@@ -25,6 +27,7 @@ export type NavigateEntryOptions = Partial<{
   folderName: string
   inboxId: string
   listId: string
+  backPath: string
 }>
 /**
  * @description a hook to navigate to `feedId`, `entryId`, add search for `view`, `level`
@@ -50,11 +53,17 @@ export const useNavigateEntry = () => {
  * entryId: xxx
  */
 export const navigateEntry = (options: NavigateEntryOptions) => {
-  const { entryId, feedId, view, folderName, inboxId, listId, timelineId } = options || {}
+  const { entryId, feedId, view, folderName, inboxId, listId, timelineId, backPath } = options || {}
   const { params } = getReadonlyRoute()
   let finalFeedId = feedId || params.feedId || ROUTE_FEED_PENDING
   let finalTimelineId = timelineId || params.timelineId || ROUTE_FEED_PENDING
   const finalEntryId = entryId || ROUTE_ENTRY_PENDING
+  const subsctiption = getSubscriptionByFeedId(finalFeedId)
+  const finalView = subsctiption?.view || view
+
+  if (backPath) {
+    setPreviewBackPath(backPath)
+  }
 
   if ("feedId" in options && feedId === null) {
     finalFeedId = ROUTE_FEED_PENDING
@@ -74,8 +83,8 @@ export const navigateEntry = (options: NavigateEntryOptions) => {
 
   finalFeedId = encodeURIComponent(finalFeedId)
 
-  if (view !== undefined) {
-    finalTimelineId = `${ROUTE_TIMELINE_OF_VIEW}${view}`
+  if (finalView !== undefined) {
+    finalTimelineId = `${ROUTE_TIMELINE_OF_VIEW}${finalView}`
   }
 
   resetShowSourceContent()
diff --git a/apps/desktop/layer/renderer/src/modules/discover/feed-card.tsx b/apps/desktop/layer/renderer/src/modules/discover/feed-card.tsx
@@ -8,7 +8,6 @@ import { memo } from "react"
 import { useTranslation } from "react-i18next"
 import { useLocation } from "react-router"
 
-import { setPreviewBackPath } from "~/atoms/preview"
 import { Media } from "~/components/ui/media"
 import { useFollow } from "~/hooks/biz/useFollow"
 import { navigateEntry } from "~/hooks/biz/useNavigateEntry"
@@ -118,10 +117,10 @@ export const FeedCard: FC<{
                         buttonClassName="rounded-lg px-3 font-medium text-zinc-500 transition-colors hover:bg-zinc-100 hover:text-zinc-900 dark:text-zinc-400 dark:hover:bg-zinc-800/80 dark:hover:text-white"
                         onClick={() => {
                           if (!item.feed?.id) return
-                          setPreviewBackPath(location.pathname)
                           navigateEntry({
                             feedId: item.feed.id,
                             view: item.analytics?.view ?? 0,
+                            backPath: location.pathname,
                           })
                         }}
                       >
diff --git a/apps/desktop/layer/renderer/src/modules/timeline-column/index.tsx b/apps/desktop/layer/renderer/src/modules/timeline-column/index.tsx
@@ -11,13 +11,14 @@ import { AnimatePresence, m } from "motion/react"
 import type { FC, PropsWithChildren } from "react"
 import { memo, useCallback, useEffect, useLayoutEffect, useRef, useState } from "react"
 import { isHotkeyPressed, useHotkeys } from "react-hotkeys-hook"
+import { useLocation } from "react-router"
 
 import { useRootContainerElement } from "~/atoms/dom"
 import { useUISettingKey } from "~/atoms/settings/ui"
 import { setTimelineColumnShow, useTimelineColumnShow } from "~/atoms/sidebar"
 import { HotKeyScopeMap } from "~/constants"
 import { shortcuts } from "~/constants/shortcuts"
-import { useNavigateEntry } from "~/hooks/biz/useNavigateEntry"
+import { navigateEntry, useNavigateEntry } from "~/hooks/biz/useNavigateEntry"
 import { useReduceMotion } from "~/hooks/biz/useReduceMotion"
 import { useRouteParamsSelector } from "~/hooks/biz/useRouteParams"
 import { useTimelineList } from "~/hooks/biz/useTimelineList"
@@ -125,6 +126,15 @@ export function FeedColumn({ children, className }: PropsWithChildren<{ classNam
     window.router.navigate(Routes.Discover)
   })
 
+  const location = useLocation()
+  useRegisterGlobalContext("goToFeed", ({ id, view }: { id: string; view?: number }) => {
+    navigateEntry({
+      feedId: id,
+      view: view ?? 0,
+      backPath: location.pathname,
+    })
+  })
+
   const shouldFreeUpSpace = useShouldFreeUpSpace()
   const feedColumnShow = useTimelineColumnShow()
   const rootContainerElement = useRootContainerElement()
diff --git a/apps/ssr/client/pages/(main)/share/feeds/[id]/index.tsx b/apps/ssr/client/pages/(main)/share/feeds/[id]/index.tsx
@@ -50,7 +50,9 @@ export function Component() {
           </div>
           <div className="text-center text-sm text-zinc-500">{feedData.url}</div>
         </div>
-        <div className="line-clamp-2 text-center text-zinc-600">{feedData.description}</div>
+        <div className="line-clamp-2 text-balance text-center text-zinc-600">
+          {feedData.description}
+        </div>
 
         <div className="flex justify-between gap-4">
           <div className="flex items-center gap-4 text-base text-zinc-500 dark:text-zinc-400">
@@ -86,8 +88,8 @@ export function Component() {
             variant={isSubscribed ? "outline" : undefined}
             onClick={() => {
               openInFollowApp({
-                deeplink: `add?id=${id}`,
-                fallbackUrl: `/timeline/view-${view}/all/pending?follow=${id}&follow_type=feed`,
+                deeplink: `feed?id=${id}&view=${view}`,
+                fallbackUrl: `/timeline/view-${view}/${id}/pending`,
               })
             }}
           >
diff --git a/packages/internal/shared/src/bridge.ts b/packages/internal/shared/src/bridge.ts
@@ -45,6 +45,7 @@ interface RenderGlobalContext {
   rsshubRoute: (route: string) => void
   // Navigate
   goToDiscover: () => void
+  goToFeed: ({ id, view }: { id: string; view?: number }) => void
 
   // user data
   clearIfLoginOtherAccount: (newUserId: string) => void
