forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1import {msg, Trans} from '@lingui/macro'
2import {useLingui} from '@lingui/react'
3import {type NativeStackScreenProps} from '@react-navigation/native-stack'
4
5import {type CommonNavigatorParams} from '#/lib/routes/types'
6import {useAutoplayDisabled, useSetAutoplayDisabled} from '#/state/preferences'
7import {
8 useInAppBrowser,
9 useSetInAppBrowser,
10} from '#/state/preferences/in-app-browser'
11import {
12 useTrendingSettings,
13 useTrendingSettingsApi,
14} from '#/state/preferences/trending'
15import {useTrendingConfig} from '#/state/service-config'
16import * as SettingsList from '#/screens/Settings/components/SettingsList'
17import * as Toggle from '#/components/forms/Toggle'
18import {Bubbles_Stroke2_Corner2_Rounded as BubblesIcon} from '#/components/icons/Bubble'
19import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
20import {Hashtag_Stroke2_Corner0_Rounded as HashtagIcon} from '#/components/icons/Hashtag'
21import {Home_Stroke2_Corner2_Rounded as HomeIcon} from '#/components/icons/Home'
22import {Macintosh_Stroke2_Corner2_Rounded as MacintoshIcon} from '#/components/icons/Macintosh'
23import {Play_Stroke2_Corner2_Rounded as PlayIcon} from '#/components/icons/Play'
24import {Trending2_Stroke2_Corner2_Rounded as Graph} from '#/components/icons/Trending'
25import {Window_Stroke2_Corner2_Rounded as WindowIcon} from '#/components/icons/Window'
26import * as Layout from '#/components/Layout'
27import {useAnalytics} from '#/analytics'
28import {IS_NATIVE} from '#/env'
29
30type Props = NativeStackScreenProps<
31 CommonNavigatorParams,
32 'ContentAndMediaSettings'
33>
34export function ContentAndMediaSettingsScreen({}: Props) {
35 const {_} = useLingui()
36 const ax = useAnalytics()
37 const autoplayDisabledPref = useAutoplayDisabled()
38 const setAutoplayDisabledPref = useSetAutoplayDisabled()
39 const inAppBrowserPref = useInAppBrowser()
40 const setUseInAppBrowser = useSetInAppBrowser()
41 const {enabled: trendingEnabled} = useTrendingConfig()
42 const {trendingDisabled, trendingVideoDisabled} = useTrendingSettings()
43 const {setTrendingDisabled, setTrendingVideoDisabled} =
44 useTrendingSettingsApi()
45
46 return (
47 <Layout.Screen>
48 <Layout.Header.Outer>
49 <Layout.Header.BackButton />
50 <Layout.Header.Content>
51 <Layout.Header.TitleText>
52 <Trans>Content & Media</Trans>
53 </Layout.Header.TitleText>
54 </Layout.Header.Content>
55 <Layout.Header.Slot />
56 </Layout.Header.Outer>
57 <Layout.Content>
58 <SettingsList.Container>
59 <SettingsList.LinkItem
60 to="/settings/saved-feeds"
61 label={_(msg`Manage saved feeds`)}>
62 <SettingsList.ItemIcon icon={HashtagIcon} />
63 <SettingsList.ItemText>
64 <Trans>Manage saved feeds</Trans>
65 </SettingsList.ItemText>
66 </SettingsList.LinkItem>
67 <SettingsList.LinkItem
68 to="/settings/threads"
69 label={_(msg`Thread preferences`)}>
70 <SettingsList.ItemIcon icon={BubblesIcon} />
71 <SettingsList.ItemText>
72 <Trans>Thread preferences</Trans>
73 </SettingsList.ItemText>
74 </SettingsList.LinkItem>
75 <SettingsList.LinkItem
76 to="/settings/following-feed"
77 label={_(msg`Following feed preferences`)}>
78 <SettingsList.ItemIcon icon={HomeIcon} />
79 <SettingsList.ItemText>
80 <Trans>Following feed preferences</Trans>
81 </SettingsList.ItemText>
82 </SettingsList.LinkItem>
83 <SettingsList.LinkItem
84 to="/settings/external-embeds"
85 label={_(msg`External media`)}>
86 <SettingsList.ItemIcon icon={MacintoshIcon} />
87 <SettingsList.ItemText>
88 <Trans>External media</Trans>
89 </SettingsList.ItemText>
90 </SettingsList.LinkItem>
91 <SettingsList.LinkItem
92 to="/settings/interests"
93 label={_(msg`Your interests`)}>
94 <SettingsList.ItemIcon icon={CircleInfo} />
95 <SettingsList.ItemText>
96 <Trans>Your interests</Trans>
97 </SettingsList.ItemText>
98 </SettingsList.LinkItem>
99 <SettingsList.Divider />
100 {IS_NATIVE && (
101 <Toggle.Item
102 name="use_in_app_browser"
103 label={_(msg`Use in-app browser to open links`)}
104 value={inAppBrowserPref ?? false}
105 onChange={value => setUseInAppBrowser(value)}>
106 <SettingsList.Item>
107 <SettingsList.ItemIcon icon={WindowIcon} />
108 <SettingsList.ItemText>
109 <Trans>Use in-app browser to open links</Trans>
110 </SettingsList.ItemText>
111 <Toggle.Platform />
112 </SettingsList.Item>
113 </Toggle.Item>
114 )}
115 <Toggle.Item
116 name="disable_autoplay"
117 label={_(msg`Autoplay videos and GIFs`)}
118 value={!autoplayDisabledPref}
119 onChange={value => setAutoplayDisabledPref(!value)}>
120 <SettingsList.Item>
121 <SettingsList.ItemIcon icon={PlayIcon} />
122 <SettingsList.ItemText>
123 <Trans>Autoplay videos and GIFs</Trans>
124 </SettingsList.ItemText>
125 <Toggle.Platform />
126 </SettingsList.Item>
127 </Toggle.Item>
128 {trendingEnabled ? (
129 <>
130 <SettingsList.Divider />
131 <Toggle.Item
132 name="show_trending_topics"
133 label={_(msg`Enable trending topics`)}
134 value={!trendingDisabled}
135 onChange={value => {
136 const hide = Boolean(!value)
137 if (hide) {
138 ax.metric('trendingTopics:hide', {context: 'settings'})
139 } else {
140 ax.metric('trendingTopics:show', {context: 'settings'})
141 }
142 setTrendingDisabled(hide)
143 }}>
144 <SettingsList.Item>
145 <SettingsList.ItemIcon icon={Graph} />
146 <SettingsList.ItemText>
147 <Trans>Enable trending topics</Trans>
148 </SettingsList.ItemText>
149 <Toggle.Platform />
150 </SettingsList.Item>
151 </Toggle.Item>
152 <Toggle.Item
153 name="show_trending_videos"
154 label={_(msg`Enable trending videos in your Discover feed`)}
155 value={!trendingVideoDisabled}
156 onChange={value => {
157 const hide = Boolean(!value)
158 if (hide) {
159 ax.metric('trendingVideos:hide', {context: 'settings'})
160 } else {
161 ax.metric('trendingVideos:show', {context: 'settings'})
162 }
163 setTrendingVideoDisabled(hide)
164 }}>
165 <SettingsList.Item>
166 <SettingsList.ItemIcon icon={Graph} />
167 <SettingsList.ItemText>
168 <Trans>Enable trending videos in your Discover feed</Trans>
169 </SettingsList.ItemText>
170 <Toggle.Platform />
171 </SettingsList.Item>
172 </Toggle.Item>
173 </>
174 ) : null}
175 </SettingsList.Container>
176 </Layout.Content>
177 </Layout.Screen>
178 )
179}