feat: add wellbeing preference hide news (#2026)

components/common/CommonRouteTabs.vue

@@ -7,6 +7,7 @@ export interface CommonRouteTabOption {
   disabled?: boolean
   name?: string
   icon?: string
+  hide?: boolean
 }
 const { options, command, replace, preventScrollTop = false } = $defineProps<{
   options: CommonRouteTabOption[]
@@ -31,7 +32,7 @@ useCommands(() => command
 <template>
   <div flex w-full items-center lg:text-lg of-x-auto scrollbar-hide border="b base">
     <template
-      v-for="(option, index) in options"
+      v-for="(option, index) in options.filter(item => !item.hide)"
       :key="option?.name || index"
     >
       <NuxtLink

composables/settings/definition.ts

@@ -16,6 +16,7 @@ export interface PreferencesSettings {
   hideTranslation: boolean
   hideUsernameEmojis: boolean
   hideAccountHoverCard: boolean
+  hideNews: boolean
   grayscaleMode: boolean
   enableAutoplay: boolean
   enableDataSaving: boolean
@@ -66,6 +67,7 @@ export const DEFAULT__PREFERENCES_SETTINGS: PreferencesSettings = {
   hideTranslation: false,
   hideUsernameEmojis: false,
   hideAccountHoverCard: false,
+  hideNews: false,
   grayscaleMode: false,
   enableAutoplay: true,
   enableDataSaving: false,

locales/en.json

@@ -444,6 +444,7 @@
       "hide_boost_count": "Hide boost count",
       "hide_favorite_count": "Hide favorite count",
       "hide_follower_count": "Hide following/follower count",
+      "hide_news": "Hide news",
       "hide_reply_count": "Hide reply count",
       "hide_translation": "Hide translation",
       "hide_username_emojis": "Hide username emojis",

locales/zh-CN.json

@@ -442,6 +442,7 @@
       "hide_boost_count": "隐藏转发数",
       "hide_favorite_count": "隐藏收藏数",
       "hide_follower_count": "隐藏关注者数",
+      "hide_news": "隐藏新闻页",
       "hide_reply_count": "隐藏回复数",
       "hide_translation": "隐藏翻译",
       "hide_username_emojis": "隐藏用户昵称的表情符号",

pages/[[server]]/explore.vue

@@ -14,6 +14,8 @@ onActivated(() =>
 )
 onDeactivated(() => search?.input?.blur())
 
+const userSettings = useUserSettings()
+
 const tabs = $computed<CommonRouteTabOption[]>(() => [
   {
     to: isHydrated.value ? `/${currentServer.value}/explore` : '/explore',
@@ -26,6 +28,7 @@ const tabs = $computed<CommonRouteTabOption[]>(() => [
   {
     to: isHydrated.value ? `/${currentServer.value}/explore/links` : '/explore/links',
     display: isHydrated.value ? t('tab.news') : '',
+    hide: userSettings.value.preferences.hideNews,
   },
   // This section can only be accessed after logging in
   {

pages/settings/preferences/index.vue

@@ -92,6 +92,12 @@ const userSettings = useUserSettings()
         {{ $t('settings.preferences.hide_username_emojis_description') }}
       </template>
     </SettingsToggleItem>
+    <SettingsToggleItem
+      :checked="getPreferences(userSettings, 'hideNews')"
+      @click="togglePreferences('hideNews')"
+    >
+      {{ $t("settings.preferences.hide_news") }}
+    </SettingsToggleItem>
     <SettingsToggleItem
       :checked="getPreferences(userSettings, 'zenMode')"
       @click="togglePreferences('zenMode')"