feat(mobile): useHideAllReadSubscriptions option

hyoban · hyoban · commit e24ef1999641 · 2025-05-15T20:20:15.000+08:00
diff --git a/apps/mobile/src/atoms/settings/general.ts b/apps/mobile/src/atoms/settings/general.ts
@@ -45,3 +45,9 @@ export function getActionLanguage() {
   const { actionLanguage, language } = getGeneralSettings()
   return (actionLanguage === "default" ? language : actionLanguage) as SupportedLanguages
 }
+
+export function useHideAllReadSubscriptions() {
+  const hideAllReadSubscriptions = useGeneralSettingKey("hideAllReadSubscriptions")
+  const unreadOnly = useGeneralSettingKey("unreadOnly")
+  return hideAllReadSubscriptions && unreadOnly
+}
diff --git a/apps/mobile/src/modules/screen/TimelineSelectorProvider.tsx b/apps/mobile/src/modules/screen/TimelineSelectorProvider.tsx
@@ -37,27 +37,16 @@ export function TimelineHeader({ feedId }: { feedId?: string }) {
         [isTimeline, isSubscriptions],
       )}
       headerRight={useMemo(() => {
-        const Component = (() => {
-          if (isTimeline || isFeed)
-            return () => (
-              <ActionGroup>
-                <UnreadOnlyActionButton />
-                <MarkAllAsReadActionButton />
-                <FeedShareActionButton feedId={feedId} />
-              </ActionGroup>
-            )
-          if (isSubscriptions)
-            return () => (
-              <ActionGroup>
-                <MarkAllAsReadActionButton />
-              </ActionGroup>
-            )
-        })()
-
-        if (Component)
-          return () => <View className="flex-row items-center justify-end">{Component()}</View>
-        return
-      }, [isFeed, isTimeline, isSubscriptions, feedId])}
+        return () => (
+          <View className="flex-row items-center justify-end">
+            <ActionGroup>
+              <UnreadOnlyActionButton />
+              <MarkAllAsReadActionButton />
+              <FeedShareActionButton feedId={feedId} />
+            </ActionGroup>
+          </View>
+        )
+      }, [feedId])}
       headerHideableBottom={isTimeline || isSubscriptions ? TimelineViewSelector : undefined}
       headerHideableBottomHeight={TIMELINE_VIEW_SELECTOR_HEIGHT}
     />
diff --git a/apps/mobile/src/modules/settings/routes/General.tsx b/apps/mobile/src/modules/settings/routes/General.tsx
@@ -110,6 +110,7 @@ export const GeneralScreen: NavigationControllerView = () => {
   const translation = useGeneralSettingKey("translation")
   const summary = useGeneralSettingKey("summary")
   const autoGroup = useGeneralSettingKey("autoGroup")
+  const hideAllReadSubscriptions = useGeneralSettingKey("hideAllReadSubscriptions")
   const showUnreadOnLaunch = useGeneralSettingKey("unreadOnly")
   // const groupByDate = useGeneralSettingKey("groupByDate")
   const expandLongSocialMedia = useGeneralSettingKey("autoExpandLongSocialMedia")
@@ -170,6 +171,19 @@ export const GeneralScreen: NavigationControllerView = () => {
             }}
           />
         </GroupedInsetListCell>
+
+        <GroupedInsetListCell
+          label={t("general.hide_all_read_subscriptions.label")}
+          description={t("general.hide_all_read_subscriptions.description")}
+        >
+          <Switch
+            size="sm"
+            value={hideAllReadSubscriptions}
+            onValueChange={(value) => {
+              setGeneralSetting("hideAllReadSubscriptions", value)
+            }}
+          />
+        </GroupedInsetListCell>
       </GroupedInsetListCard>
 
       {/* Timeline */}
diff --git a/apps/mobile/src/store/subscription/hooks.ts b/apps/mobile/src/store/subscription/hooks.ts
@@ -3,7 +3,7 @@ import { sortByAlphabet } from "@follow/utils"
 import { useQuery } from "@tanstack/react-query"
 import { useCallback } from "react"
 
-import { getGeneralSettings } from "@/src/atoms/settings/general"
+import { getGeneralSettings, useHideAllReadSubscriptions } from "@/src/atoms/settings/general"
 import { views } from "@/src/constants/views"
 
 import { getFeed } from "../feed/getter"
@@ -142,6 +142,7 @@ export const useSortedGroupedSubscription = (
   sortBy: "alphabet" | "count",
   sortOrder: "asc" | "desc",
 ) => {
+  const hideAllReadSubscriptions = useHideAllReadSubscriptions()
   return useSubscriptionStore(
     useCallback(() => {
       const categories = Object.keys(grouped)
@@ -152,10 +153,12 @@ export const useSortedGroupedSubscription = (
       })
       const sortedList = [] as { category: string; subscriptionIds: string[] }[]
       for (const category of sortedCategories) {
-        sortedList.push({ category, subscriptionIds: grouped[category]! })
+        if (!hideAllReadSubscriptions || grouped[category]?.some((id) => getUnreadCount(id) > 0)) {
+          sortedList.push({ category, subscriptionIds: grouped[category]! })
+        }
       }
       return sortedList
-    }, [grouped, sortBy, sortOrder, view]),
+    }, [grouped, sortBy, sortOrder, view, hideAllReadSubscriptions]),
   )
 }
 
@@ -164,15 +167,21 @@ export const useSortedUngroupedSubscription = (
   sortBy: "alphabet" | "count",
   sortOrder: "asc" | "desc",
 ) => {
+  const hideAllReadSubscriptions = useHideAllReadSubscriptions()
+
   return useSubscriptionStore(
     useCallback(() => {
-      return ids.sort((a, b) => {
-        const sortMethod =
-          sortBy === "alphabet" ? sortUngroupedSubscriptionByAlphabet : sortByUnread
-        const result = sortMethod(a, b)
-        return sortOrder === "asc" ? result : -result
-      })
-    }, [ids.toString(), sortBy, sortOrder]),
+      return ids
+        .filter((id) => {
+          return !hideAllReadSubscriptions || getUnreadCount(id) > 0
+        })
+        .sort((a, b) => {
+          const sortMethod =
+            sortBy === "alphabet" ? sortUngroupedSubscriptionByAlphabet : sortByUnread
+          const result = sortMethod(a, b)
+          return sortOrder === "asc" ? result : -result
+        })
+    }, [ids.toString(), sortBy, sortOrder, hideAllReadSubscriptions]),
   )
 }
 
@@ -215,17 +224,23 @@ export const useListSubscription = (view: FeedViewType) => {
 }
 
 export const useSortedListSubscription = (ids: string[], sortBy: "alphabet" | "unread") => {
-  return useSubscriptionStore(() => {
-    return ids.concat().sort((a, b) => {
-      const leftList = getList(a)
-      const rightList = getList(b)
-      if (!leftList || !rightList) return 0
-      if (sortBy === "alphabet") {
-        return sortByAlphabet(leftList.title, rightList.title)
-      }
-      return sortByUnread(a, b)
-    })
-  })
+  const hideAllReadSubscriptions = useHideAllReadSubscriptions()
+  return useSubscriptionStore(
+    useCallback(() => {
+      return ids
+        .concat()
+        .filter((id) => !hideAllReadSubscriptions || getUnreadCount(id) > 0)
+        .sort((a, b) => {
+          const leftList = getList(a)
+          const rightList = getList(b)
+          if (!leftList || !rightList) return 0
+          if (sortBy === "alphabet") {
+            return sortByAlphabet(leftList.title, rightList.title)
+          }
+          return sortByUnread(a, b)
+        })
+    }, [ids.toString(), sortBy, hideAllReadSubscriptions]),
+  )
 }
 
 export const useInboxSubscription = (view: FeedViewType) => {
