diff --git a/src/screens/Settings/ContentAndMediaSettings.tsx b/src/screens/Settings/ContentAndMediaSettings.tsx
index 17f8fa5067..cec56911d1 100644
--- a/src/screens/Settings/ContentAndMediaSettings.tsx
+++ b/src/screens/Settings/ContentAndMediaSettings.tsx
@@ -9,6 +9,7 @@ import {
useInAppBrowser,
useSetInAppBrowser,
} from '#/state/preferences/in-app-browser'
+import {useTrendingTopicsSidebarSetting} from '#/state/trending'
import * as SettingsList from '#/screens/Settings/components/SettingsList'
import * as Toggle from '#/components/forms/Toggle'
import {Bubbles_Stroke2_Corner2_Rounded as BubblesIcon} from '#/components/icons/Bubble'
@@ -16,6 +17,7 @@ import {Hashtag_Stroke2_Corner0_Rounded as HashtagIcon} from '#/components/icons
import {Home_Stroke2_Corner2_Rounded as HomeIcon} from '#/components/icons/Home'
import {Macintosh_Stroke2_Corner2_Rounded as MacintoshIcon} from '#/components/icons/Macintosh'
import {Play_Stroke2_Corner2_Rounded as PlayIcon} from '#/components/icons/Play'
+import {Trending2_Stroke2_Corner2_Rounded as Graph} from '#/components/icons/Trending2'
import {Window_Stroke2_Corner2_Rounded as WindowIcon} from '#/components/icons/Window'
import * as Layout from '#/components/Layout'
@@ -29,6 +31,7 @@ export function ContentAndMediaSettingsScreen({}: Props) {
const setAutoplayDisabledPref = useSetAutoplayDisabled()
const inAppBrowserPref = useInAppBrowser()
const setUseInAppBrowser = useSetInAppBrowser()
+ const [showTrending, setShowTrending] = useTrendingTopicsSidebarSetting()
return (
@@ -104,6 +107,24 @@ export function ContentAndMediaSettingsScreen({}: Props) {
+ {!isNative && (
+ <>
+
+ setShowTrending(value)}>
+
+
+
+ Show trending topics in your sidebar
+
+
+
+
+ >
+ )}
diff --git a/src/state/trending.ts b/src/state/trending.ts
new file mode 100644
index 0000000000..412a684975
--- /dev/null
+++ b/src/state/trending.ts
@@ -0,0 +1,28 @@
+import React from 'react'
+
+import * as persisted from '#/state/persisted'
+
+// TODO only updates in other tabs, not current one
+export function useTrendingTopicsSidebarSetting() {
+ const [_show, setShow] = React.useState(
+ () => !persisted.get('hideSidebarTrendingTopics'),
+ )
+
+ const set = React.useCallback(
+ (show: boolean) => {
+ setShow(show)
+ persisted.write('hideSidebarTrendingTopics', !show)
+ },
+ [setShow],
+ )
+
+ // persisted.write('hideSidebarTrendingTopics', undefined)
+
+ React.useEffect(() => {
+ return persisted.onUpdate('hideSidebarTrendingTopics', value => {
+ setShow(!value)
+ })
+ }, [setShow])
+
+ return [_show, set] as const
+}
diff --git a/src/view/shell/desktop/RightNav.tsx b/src/view/shell/desktop/RightNav.tsx
index 8f8d5052c3..f777905f85 100644
--- a/src/view/shell/desktop/RightNav.tsx
+++ b/src/view/shell/desktop/RightNav.tsx
@@ -1,13 +1,12 @@
-import React from 'react'
import {View} from 'react-native'
import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {FEEDBACK_FORM_URL, HELP_DESK_URL} from '#/lib/constants'
import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
-import * as persisted from '#/state/persisted'
import {useKawaiiMode} from '#/state/preferences/kawaii'
import {useSession} from '#/state/session'
+import {useTrendingTopicsSidebarSetting} from '#/state/trending'
import {DesktopFeeds} from '#/view/shell/desktop/Feeds'
import {DesktopSearch} from '#/view/shell/desktop/Search'
import {atoms as a, useGutters, useTheme, web} from '#/alf'
@@ -117,22 +116,7 @@ function TrendingTopics() {
const {_} = useLingui()
const trendingPrompt = Prompt.usePromptControl()
- const [showTrending, setShowTrending] = React.useState(
- () => !persisted.get('hideSidebarTrendingTopics'),
- )
-
- const onConfirmHideTrending = React.useCallback(() => {
- setShowTrending(false)
- persisted.write('hideSidebarTrendingTopics', true)
- }, [setShowTrending])
-
- // persisted.write('hideSidebarTrendingTopics', undefined)
-
- React.useEffect(() => {
- return persisted.onUpdate('hideSidebarTrendingTopics', value => {
- setShowTrending(!value)
- })
- }, [setShowTrending])
+ const [showTrending, setShowTrending] = useTrendingTopicsSidebarSetting()
return showTrending ? (
<>
@@ -184,7 +168,7 @@ function TrendingTopics() {
msg`This is a device setting, and will apply to all accounts on this device. You can update this later from your settings.`,
)}
confirmButtonCta={_(msg`Hide`)}
- onConfirm={onConfirmHideTrending}
+ onConfirm={() => setShowTrending(false)}
/>
>