feat(desktop): display rsshub route heat

DIYgod · DIYgod · commit 5ce34edc98a1 · 2025-05-20T19:38:07.000+08:00
diff --git a/apps/desktop/layer/renderer/src/pages/(main)/(layer)/(subview)/discover/category/[category].tsx b/apps/desktop/layer/renderer/src/pages/(main)/(layer)/(subview)/discover/category/[category].tsx
@@ -18,9 +18,6 @@ import { RecommendationContent } from "~/modules/discover/RecommendationContent"
 import { FeedIcon } from "~/modules/feed/feed-icon"
 import { Queries } from "~/queries"
 
-type Language = "all" | "eng" | "cmn"
-type DiscoverCategories = (typeof RSSHubCategories)[number] | string
-
 const LanguageMap = {
   all: "all",
   eng: "en",
@@ -29,24 +26,23 @@ const LanguageMap = {
 
 type RouteData = Awaited<ReturnType<typeof apiClient.discover.rsshub.$get>>["data"]
 
-const fetchRsshubPopular = (category: DiscoverCategories, lang: Language) => {
-  return Queries.discover.rsshubCategory({
-    // category: "popular",
-    categories: category === "all" ? "popular" : `${category}`,
-    lang: LanguageMap[lang],
-  })
-}
 export const Component = () => {
   const { t } = useTranslation()
   const lang = useUISettingKey("discoverLanguage")
   const category = useParams().category as (typeof RSSHubCategories)[number]
   const title = t(`discover.category.${category}`, { ns: "common" })
   useSubViewTitle(title)
 
-  const rsshubPopular = useAuthQuery(fetchRsshubPopular(category, lang), {
-    staleTime: 1000 * 60 * 60 * 24, // 1 day
-    placeholderData: keepPreviousData,
-  })
+  const rsshubPopular = useAuthQuery(
+    Queries.discover.rsshubCategory({
+      categories: category === "all" ? "popular" : `${category}`,
+      lang: LanguageMap[lang],
+    }),
+    {
+      staleTime: 1000 * 60 * 60 * 24, // 1 day
+      placeholderData: keepPreviousData,
+    },
+  )
 
   const data: RouteData = rsshubPopular.data as any
   const { isLoading } = rsshubPopular
@@ -171,6 +167,11 @@ const RecommendationListItem = ({
     }
   }, [data])
 
+  const rsshubAnalytics = useAuthQuery(Queries.discover.rsshubAnalytics(), {
+    staleTime: 1000 * 60 * 60 * 24, // 1 day
+    placeholderData: keepPreviousData,
+  })
+
   return (
     <Card className="shadow-background border-border overflow-hidden rounded-lg border transition-shadow duration-200 hover:shadow-md">
       <div className="border-border flex items-center gap-3 border-b p-4">
@@ -194,7 +195,7 @@ const RecommendationListItem = ({
               <Link
                 to={`/discover/category/${c}`}
                 key={c}
-                className={`bg-accent/10 cursor-pointer rounded-full px-2 py-0.5 duration-200 ${
+                className={`bg-accent/10 flex cursor-pointer items-center rounded-full px-2 py-0.5 duration-200 ${
                   !RSSHubCategories.includes(c) ? "pointer-events-none opacity-50" : ""
                 }`}
               >
@@ -213,10 +214,12 @@ const RecommendationListItem = ({
             if (Array.isArray(routeData.path)) {
               routeData.path = routeData.path.find((p) => p === route) ?? routeData.path[0]
             }
+            const subscriptionCount =
+              rsshubAnalytics.data?.[`/${routePrefix}${routeData.path}`]?.subscriptionCount
             return (
               <li
                 key={route}
-                className="hover:bg-material-opaque -mx-4 flex items-center rounded p-2 px-5 transition-colors"
+                className="hover:bg-material-opaque -mx-4 flex items-center gap-8 rounded p-2 px-5 transition-colors"
                 role="button"
                 onClick={() => {
                   present({
@@ -232,15 +235,23 @@ const RecommendationListItem = ({
                   })
                 }}
               >
-                <div className="bg-accent mr-2 size-1.5 rounded-full" />
-                <div className="relative h-5 grow">
-                  <div className="absolute inset-0 flex items-center gap-2 text-sm">
-                    <EllipsisHorizontalTextWithTooltip>
-                      {routeData.name}
-                    </EllipsisHorizontalTextWithTooltip>
-                    <div className="text-text-secondary shrink-0 text-xs">{`rsshub://${routePrefix}${routeData.path}`}</div>
+                <div className="flex flex-1 items-center gap-2">
+                  <div className="bg-accent mr-2 size-1.5 rounded-full" />
+                  <div className="relative h-5 grow">
+                    <div className="absolute inset-0 flex items-center gap-3 text-sm">
+                      <EllipsisHorizontalTextWithTooltip>
+                        {routeData.name}
+                      </EllipsisHorizontalTextWithTooltip>
+                      <EllipsisHorizontalTextWithTooltip className="text-text-secondary text-xs">{`rsshub://${routePrefix}${routeData.path}`}</EllipsisHorizontalTextWithTooltip>
+                    </div>
                   </div>
                 </div>
+                {subscriptionCount && (
+                  <div className="flex items-center gap-0.5 text-xs">
+                    <i className="i-mgc-fire-cute-re" />
+                    {subscriptionCount}
+                  </div>
+                )}
               </li>
             )
           })}
diff --git a/apps/desktop/layer/renderer/src/queries/discover.ts b/apps/desktop/layer/renderer/src/queries/discover.ts
@@ -39,4 +39,9 @@ export const discover = {
       })
       return res.data
     }),
+  rsshubAnalytics: () =>
+    defineQuery(["discover", "rsshub", "analytics"], async () => {
+      const res = await apiClient.discover["rsshub-analytics"].$get()
+      return res.data
+    }),
 }
diff --git a/icons/mgc/fire_cute_re.svg b/icons/mgc/fire_cute_re.svg
@@ -0,0 +1 @@
+<svg xmlns="https://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M11 2.771c-.682.247-1.043.641-1.422 1.553-.66 1.59-1.744 3.07-3.247 4.436-1.351 1.227-2.122 2.184-2.711 3.37-.816 1.642-.988 3.211-.525 4.793.648 2.213 2.547 4.052 4.934 4.78.394.12.517.141.751.128a1.454 1.454 0 0 0 1.252-.862c.154-.331.151-.814-.006-1.289-.399-1.205-.264-2.124.449-3.068.246-.326.98-1.052 1.063-1.052.024 0 .124.129.223.286.098.158.392.576.652.93.489.666.7 1.045.792 1.424.076.318.067 1.133-.02 1.76-.072.511-.072.554-.009.799a1.48 1.48 0 0 0 1.224 1.124c.289.047.624-.004 1.46-.222 1.381-.36 2.464-.97 3.329-1.876 1.074-1.123 1.621-2.508 1.774-4.485.134-1.732-.214-3.256-1.182-5.181a17.995 17.995 0 0 0-1.106-1.888c-.327-.489-.937-1.291-1.124-1.479a1.779 1.779 0 0 0-2.071-.313 1.465 1.465 0 0 0-.251.153c-.09.079-.115.05-.226-.272-.144-.413-.533-1.187-.802-1.597a7.477 7.477 0 0 0-1.091-1.331c-.305-.303-.46-.422-.698-.54-.288-.142-.332-.152-.729-.163-.362-.01-.46.002-.683.082m.918 2.259c.619.675 1.012 1.375 1.342 2.391.241.743.35.951.659 1.262.259.26.569.423.908.478.527.085 1.091-.155 1.359-.579a.847.847 0 0 1 .134-.179c.028 0 .468.594.712.962.948 1.423 1.595 2.837 1.849 4.04.162.772.146 1.891-.04 2.775-.314 1.487-1.025 2.455-2.274 3.094-.316.161-1.195.486-1.316.486-.017 0-.02-.193-.006-.43.05-.844-.059-1.63-.313-2.25-.182-.444-.335-.695-.867-1.419a18.193 18.193 0 0 1-.656-.948c-.367-.597-.888-1.001-1.438-1.115a3.002 3.002 0 0 0-.594-.031c-.326.014-.402.033-.666.164-.373.184-1.066.772-1.497 1.27-.717.83-1.115 1.584-1.318 2.499-.082.372-.098 1.522-.025 1.819a.595.595 0 0 1 .03.194c-.028.027-.577-.28-.888-.496-.886-.617-1.58-1.47-1.893-2.327-.442-1.208-.36-2.349.26-3.63.401-.829.877-1.452 1.756-2.3 1.836-1.771 2.375-2.376 3.124-3.5.549-.824.957-1.598 1.239-2.35.04-.104.086-.19.103-.19s.16.139.316.31" fill="#10161F" fill-rule="evenodd"/></svg>
diff --git a/packages/internal/shared/src/hono.ts b/packages/internal/shared/src/hono.ts
@@ -14574,6 +14574,21 @@ declare const _routes: hono_hono_base.HonoBase<Env, ({
             status: 200;
         };
     };
+} & {
+    "/rsshub-analytics": {
+        $get: {
+            input: {};
+            output: {
+                data: {
+                    [x: string]: {
+                        subscriptionCount: number;
+                    };
+                };
+            };
+            outputFormat: "json";
+            status: 200;
+        };
+    };
 }, "/discover"> | hono_types.MergeSchemaPath<hono_types.MergeSchemaPath<{
     "/": {
         $post: {
