forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
feat: move feed-related Usability Runes Settings to own screen
+146
-113
+1
src/lib/routes/types.ts
+1
src/lib/routes/types.ts
+1
src/routes.ts
+1
src/routes.ts
···
53
53
RunesBadgesSettings: '/settings/runes/badges',
54
54
RunesImpressionsSettings: '/settings/runes/impressions',
55
55
RunesUsabilitySettings: '/settings/runes/usability',
56
+
RunesUsabilityFeedSettings: '/settings/runes/usability/feeds',
56
57
RunesDisplaySettings: '/settings/runes/display',
57
58
RunesDisplayAlsoLikedSettings: '/settings/runes/display/also-liked',
58
59
RunesInfrastructureSettings: '/settings/runes/infrastructure',
+129
src/screens/Settings/RunesSettings/FeedSettings.tsx
+129
src/screens/Settings/RunesSettings/FeedSettings.tsx
···
1
+
import {Trans, useLingui} from '@lingui/react/macro'
2
+
3
+
import {
4
+
useDisableComposerPrompt,
5
+
useSetDisableComposerPrompt,
6
+
} from '#/state/preferences/disable-composer-prompt'
7
+
import {
8
+
useDisableTopOfFeedButton,
9
+
useSetDisableTopOfFeedButton,
10
+
} from '#/state/preferences/disable-top-of-feed-button'
11
+
import {
12
+
useHideFeedsPromoTab,
13
+
useSetHideFeedsPromoTab,
14
+
} from '#/state/preferences/hide-feeds-promo-tab'
15
+
import {
16
+
useHideUnreplyablePosts,
17
+
useSetHideUnreplyablePosts,
18
+
} from '#/state/preferences/hide-unreplyable-posts'
19
+
import {
20
+
useNoDiscoverFallback,
21
+
useSetNoDiscoverFallback,
22
+
} from '#/state/preferences/no-discover-fallback'
23
+
import * as SettingsList from '#/screens/Settings/components/SettingsList'
24
+
import {atoms as a} from '#/alf'
25
+
import {Admonition} from '#/components/Admonition'
26
+
import * as Toggle from '#/components/forms/Toggle'
27
+
import {ArrowTopCircle_Stroke2_Corner0_Rounded as ArrowTopIcon} from '#/components/icons/ArrowTopCircle'
28
+
import {Eye_Stroke2_Corner2_Rounded as EyeIcon} from '#/components/icons/Eye'
29
+
import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlashIcon} from '#/components/icons/EyeSlash'
30
+
import {PencilLine_Stroke2_Corner2_Rounded as PencilIcon} from '#/components/icons/Pencil'
31
+
import {Reply as ReplyIcon} from '#/components/icons/Reply'
32
+
import {RunesScreenLayout} from './components/RunesScreenLayout'
33
+
34
+
export function RunesUsabilityFeedSettingsScreen() {
35
+
const {t: l} = useLingui()
36
+
37
+
const noDiscoverFallback = useNoDiscoverFallback()
38
+
const setNoDiscoverFallback = useSetNoDiscoverFallback()
39
+
40
+
const hideFeedsPromoTab = useHideFeedsPromoTab()
41
+
const setHideFeedsPromoTab = useSetHideFeedsPromoTab()
42
+
43
+
const disableComposerPrompt = useDisableComposerPrompt()
44
+
const setDisableComposerPrompt = useSetDisableComposerPrompt()
45
+
46
+
const disableTopOfFeedButton = useDisableTopOfFeedButton()
47
+
const setDisableTopOfFeedButton = useSetDisableTopOfFeedButton()
48
+
49
+
const hideUnreplyablePosts = useHideUnreplyablePosts()
50
+
const setHideUnreplyablePosts = useSetHideUnreplyablePosts()
51
+
52
+
return (
53
+
<RunesScreenLayout titleText={l`Feeds`}>
54
+
<Toggle.Item
55
+
name="no_discover_fallback"
56
+
label={l`Do not fall back to discover feed`}
57
+
value={noDiscoverFallback}
58
+
onChange={value => setNoDiscoverFallback(value)}>
59
+
<SettingsList.Item>
60
+
<SettingsList.ItemIcon icon={EyeSlashIcon} />
61
+
<SettingsList.ItemText>
62
+
<Trans>Do not fall back to discover feed</Trans>
63
+
</SettingsList.ItemText>
64
+
<Toggle.Platform />
65
+
</SettingsList.Item>
66
+
</Toggle.Item>
67
+
<Toggle.Item
68
+
name="hide_feeds_promo_tab"
69
+
label={l`Hide "Feeds ✨" tab when only one feed is selected`}
70
+
value={hideFeedsPromoTab}
71
+
onChange={value => setHideFeedsPromoTab(value)}>
72
+
<SettingsList.Item>
73
+
<SettingsList.ItemIcon icon={EyeIcon} />
74
+
<SettingsList.ItemText>
75
+
<Trans>Hide "Feeds ✨" tab when only one feed is selected</Trans>
76
+
</SettingsList.ItemText>
77
+
<Toggle.Platform />
78
+
</SettingsList.Item>
79
+
</Toggle.Item>
80
+
<Toggle.Item
81
+
name="disable_composer_prompt"
82
+
label={l`Disable composer prompt`}
83
+
value={disableComposerPrompt}
84
+
onChange={value => setDisableComposerPrompt(value)}>
85
+
<SettingsList.Item>
86
+
<SettingsList.ItemIcon icon={PencilIcon} />
87
+
<SettingsList.ItemText>
88
+
<Trans>Disable composer prompt</Trans>
89
+
</SettingsList.ItemText>
90
+
<Toggle.Platform />
91
+
</SettingsList.Item>
92
+
</Toggle.Item>
93
+
<Toggle.Item
94
+
name="disable_top_of_feed_button"
95
+
label={l`Disable top-of-feed button`}
96
+
value={disableTopOfFeedButton ?? false}
97
+
onChange={value => setDisableTopOfFeedButton(value)}>
98
+
<SettingsList.Item>
99
+
<SettingsList.ItemIcon icon={ArrowTopIcon} />
100
+
<SettingsList.ItemText>
101
+
<Trans>Disable top-of-feed button</Trans>
102
+
</SettingsList.ItemText>
103
+
<Toggle.Platform />
104
+
</SettingsList.Item>
105
+
</Toggle.Item>
106
+
<Toggle.Item
107
+
name="hide_unreplyable_posts"
108
+
label={l`Hide posts that cannot be replied to from feeds`}
109
+
value={hideUnreplyablePosts}
110
+
onChange={value => setHideUnreplyablePosts(value)}>
111
+
<SettingsList.Item>
112
+
<SettingsList.ItemIcon icon={ReplyIcon} />
113
+
<SettingsList.ItemText>
114
+
<Trans>Hide posts that cannot be replied to from feeds</Trans>
115
+
</SettingsList.ItemText>
116
+
<Toggle.Platform />
117
+
</SettingsList.Item>
118
+
</Toggle.Item>
119
+
<SettingsList.Item>
120
+
<Admonition type="info" style={[a.flex_1]}>
121
+
<Trans>
122
+
Hides posts from feeds where replies are disabled (e.g. due to
123
+
postgates or other restrictions). Does not affect thread views.
124
+
</Trans>
125
+
</Admonition>
126
+
</SettingsList.Item>
127
+
</RunesScreenLayout>
128
+
)
129
+
}
+9
-113
src/screens/Settings/RunesSettings/UsabilitySettings.tsx
+9
-113
src/screens/Settings/RunesSettings/UsabilitySettings.tsx
···
2
2
3
3
import {useGoLinksEnabled, useSetGoLinksEnabled} from '#/state/preferences'
4
4
import {
5
-
useDisableComposerPrompt,
6
-
useSetDisableComposerPrompt,
7
-
} from '#/state/preferences/disable-composer-prompt'
8
-
import {
9
-
useDisableTopOfFeedButton,
10
-
useSetDisableTopOfFeedButton,
11
-
} from '#/state/preferences/disable-top-of-feed-button'
12
-
import {
13
5
useDisableVerifyEmailReminder,
14
6
useSetDisableVerifyEmailReminder,
15
7
} from '#/state/preferences/disable-verify-email-reminder'
16
8
import {
17
-
useHideFeedsPromoTab,
18
-
useSetHideFeedsPromoTab,
19
-
} from '#/state/preferences/hide-feeds-promo-tab'
20
-
import {
21
9
useHideScaryFollowButtons,
22
10
useSetHideScaryFollowButtons,
23
11
} from '#/state/preferences/hide-scary-follow-buttons'
···
25
13
useHideSimilarAccountsRecomm,
26
14
useSetHideSimilarAccountsRecomm,
27
15
} from '#/state/preferences/hide-similar-accounts-recommendations'
28
-
import {
29
-
useHideUnreplyablePosts,
30
-
useSetHideUnreplyablePosts,
31
-
} from '#/state/preferences/hide-unreplyable-posts'
32
-
import {
33
-
useNoDiscoverFallback,
34
-
useSetNoDiscoverFallback,
35
-
} from '#/state/preferences/no-discover-fallback'
36
16
import * as SettingsList from '#/screens/Settings/components/SettingsList'
37
17
import {atoms as a} from '#/alf'
38
18
import {Admonition} from '#/components/Admonition'
39
19
import * as Toggle from '#/components/forms/Toggle'
40
20
import {ArrowShareRight_Stroke2_Corner2_Rounded as ArrowShareRightIcon} from '#/components/icons/ArrowShareRight'
41
-
import {ArrowTopCircle_Stroke2_Corner0_Rounded as ArrowTopIcon} from '#/components/icons/ArrowTopCircle'
42
21
import {Envelope_Stroke2_Corner2_Rounded as EnvelopeIcon} from '#/components/icons/Envelope'
43
-
import {Eye_Stroke2_Corner2_Rounded as EyeIcon} from '#/components/icons/Eye'
44
-
import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlashIcon} from '#/components/icons/EyeSlash'
45
-
import {PencilLine_Stroke2_Corner2_Rounded as PencilIcon} from '#/components/icons/Pencil'
22
+
import {Newspaper_Stroke2_Corner2_Rounded as NewspaperIcon} from '#/components/icons/Newspaper'
46
23
import {PersonGroup_Stroke2_Corner2_Rounded as PersonGroupIcon} from '#/components/icons/Person'
47
24
import {PlusLarge_Stroke2_Corner0_Rounded as PlusIcon} from '#/components/icons/Plus'
48
-
import {Reply as ReplyIcon} from '#/components/icons/Reply'
49
25
import {RunesScreenLayout} from './components/RunesScreenLayout'
50
26
51
27
export function RunesUsabilitySettingsScreen() {
···
54
30
const goLinksEnabled = useGoLinksEnabled()
55
31
const setGoLinksEnabled = useSetGoLinksEnabled()
56
32
57
-
const noDiscoverFallback = useNoDiscoverFallback()
58
-
const setNoDiscoverFallback = useSetNoDiscoverFallback()
59
-
60
-
const hideFeedsPromoTab = useHideFeedsPromoTab()
61
-
const setHideFeedsPromoTab = useSetHideFeedsPromoTab()
62
-
63
33
const hideSimilarAccountsRecomm = useHideSimilarAccountsRecomm()
64
34
const setHideSimilarAccountsRecomm = useSetHideSimilarAccountsRecomm()
65
-
66
-
const hideUnreplyablePosts = useHideUnreplyablePosts()
67
-
const setHideUnreplyablePosts = useSetHideUnreplyablePosts()
68
35
69
36
const hideScaryFollowButtons = useHideScaryFollowButtons()
70
37
const setHideScaryFollowButtons = useSetHideScaryFollowButtons()
71
38
72
-
const disableComposerPrompt = useDisableComposerPrompt()
73
-
const setDisableComposerPrompt = useSetDisableComposerPrompt()
74
-
75
-
const disableTopOfFeedButton = useDisableTopOfFeedButton()
76
-
const setDisableTopOfFeedButton = useSetDisableTopOfFeedButton()
77
-
78
39
const disableVerifyEmailReminder = useDisableVerifyEmailReminder()
79
40
const setDisableVerifyEmailReminder = useSetDisableVerifyEmailReminder()
80
41
81
42
return (
82
43
<RunesScreenLayout titleText={l`Usability`}>
44
+
<SettingsList.LinkItem
45
+
to="/settings/runes/usability/feeds"
46
+
label={l`Feeds`}>
47
+
<SettingsList.ItemIcon icon={NewspaperIcon} />
48
+
<SettingsList.ItemText>
49
+
<Trans>Feeds</Trans>
50
+
</SettingsList.ItemText>
51
+
</SettingsList.LinkItem>
83
52
<Toggle.Item
84
53
name="use_go_links"
85
54
label={l`Redirect through go.bsky.app`}
···
94
63
</SettingsList.Item>
95
64
</Toggle.Item>
96
65
<Toggle.Item
97
-
name="no_discover_fallback"
98
-
label={l`Do not fall back to discover feed`}
99
-
value={noDiscoverFallback}
100
-
onChange={value => setNoDiscoverFallback(value)}>
101
-
<SettingsList.Item>
102
-
<SettingsList.ItemIcon icon={EyeSlashIcon} />
103
-
<SettingsList.ItemText>
104
-
<Trans>Do not fall back to discover feed</Trans>
105
-
</SettingsList.ItemText>
106
-
<Toggle.Platform />
107
-
</SettingsList.Item>
108
-
</Toggle.Item>
109
-
<Toggle.Item
110
-
name="hide_feeds_promo_tab"
111
-
label={l`Hide "Feeds ✨" tab when only one feed is selected`}
112
-
value={hideFeedsPromoTab}
113
-
onChange={value => setHideFeedsPromoTab(value)}>
114
-
<SettingsList.Item>
115
-
<SettingsList.ItemIcon icon={EyeIcon} />
116
-
<SettingsList.ItemText>
117
-
<Trans>Hide "Feeds ✨" tab when only one feed is selected</Trans>
118
-
</SettingsList.ItemText>
119
-
<Toggle.Platform />
120
-
</SettingsList.Item>
121
-
</Toggle.Item>
122
-
<Toggle.Item
123
66
name="disable_similar_accounts_recommendations"
124
67
label={l`Disable similar accounts recommendations`}
125
68
value={hideSimilarAccountsRecomm}
···
133
76
</SettingsList.Item>
134
77
</Toggle.Item>
135
78
<Toggle.Item
136
-
name="disable_composer_prompt"
137
-
label={l`Disable composer prompt`}
138
-
value={disableComposerPrompt}
139
-
onChange={value => setDisableComposerPrompt(value)}>
140
-
<SettingsList.Item>
141
-
<SettingsList.ItemIcon icon={PencilIcon} />
142
-
<SettingsList.ItemText>
143
-
<Trans>Disable composer prompt</Trans>
144
-
</SettingsList.ItemText>
145
-
<Toggle.Platform />
146
-
</SettingsList.Item>
147
-
</Toggle.Item>
148
-
<Toggle.Item
149
-
name="disable_top_of_feed_button"
150
-
label={l`Disable top-of-feed button`}
151
-
value={disableTopOfFeedButton ?? false}
152
-
onChange={value => setDisableTopOfFeedButton(value)}>
153
-
<SettingsList.Item>
154
-
<SettingsList.ItemIcon icon={ArrowTopIcon} />
155
-
<SettingsList.ItemText>
156
-
<Trans>Disable top-of-feed button</Trans>
157
-
</SettingsList.ItemText>
158
-
<Toggle.Platform />
159
-
</SettingsList.Item>
160
-
</Toggle.Item>
161
-
<Toggle.Item
162
79
name="hide_scary_follow_buttons"
163
80
label={l`Hide follow button on posts and scrolled profile header`}
164
81
value={hideScaryFollowButtons}
···
173
90
<Toggle.Platform />
174
91
</SettingsList.Item>
175
92
</Toggle.Item>
176
-
<Toggle.Item
177
-
name="hide_unreplyable_posts"
178
-
label={l`Hide posts that cannot be replied to from feeds`}
179
-
value={hideUnreplyablePosts}
180
-
onChange={value => setHideUnreplyablePosts(value)}>
181
-
<SettingsList.Item>
182
-
<SettingsList.ItemIcon icon={ReplyIcon} />
183
-
<SettingsList.ItemText>
184
-
<Trans>Hide posts that cannot be replied to from feeds</Trans>
185
-
</SettingsList.ItemText>
186
-
<Toggle.Platform />
187
-
</SettingsList.Item>
188
-
</Toggle.Item>
189
-
<SettingsList.Item>
190
-
<Admonition type="info" style={[a.flex_1]}>
191
-
<Trans>
192
-
Hides posts from feeds where replies are disabled (e.g. due to
193
-
postgates or other restrictions). Does not affect thread views.
194
-
</Trans>
195
-
</Admonition>
196
-
</SettingsList.Item>
197
93
<Toggle.Item
198
94
name="disable_verify_email_reminder"
199
95
label={l`Disable verify email reminder`}