diff --git a/src/screens/Moderation/index.tsx b/src/screens/Moderation/index.tsx
index ffb9ac251c..28e2fb112d 100644
--- a/src/screens/Moderation/index.tsx
+++ b/src/screens/Moderation/index.tsx
@@ -26,6 +26,7 @@ import {
} from '#/state/queries/preferences'
import {useLabelersDetailedInfoQuery} from '#/state/queries/labeler'
+import {logger} from '#/logger'
import {useTheme, atoms as a, useBreakpoints} from '#/alf'
import {Divider} from '#/components/Divider'
import {CircleBanSign_Stroke2_Corner0_Rounded as CircleBanSign} from '#/components/icons/CircleBanSign'
@@ -36,12 +37,13 @@ import {Filter_Stroke2_Corner0_Rounded as Filter} from '#/components/icons/Filte
import {Text} from '#/components/Typography'
import * as Toggle from '#/components/forms/Toggle'
import {InlineLink, Link} from '#/components/Link'
-import {Button} from '#/components/Button'
+import {Button, ButtonText} from '#/components/Button'
import {Loader} from '#/components/Loader'
import {getModerationServiceTitle} from '#/lib/moderation'
import * as ModerationServiceCard from '#/components/ModerationServiceCard'
import {GlobalModerationLabelPref} from '#/components/moderation/GlobalModerationLabelPref'
import {useGlobalDialogsControlContext} from '#/components/dialogs/Context'
+import {useModalControls} from '#/state/modals'
function ErrorState({error}: {error: string}) {
const t = useTheme()
@@ -142,6 +144,7 @@ export function ModerationScreenInner({
const {screen} = useAnalytics()
const {gtMobile} = useBreakpoints()
const {mutedWordsDialogControl} = useGlobalDialogsControlContext()
+ const {openModal} = useModalControls()
useFocusEffect(
React.useCallback(() => {
@@ -156,6 +159,8 @@ export function ModerationScreenInner({
(optimisticAdultContent && optimisticAdultContent.enabled) ||
(!optimisticAdultContent && preferences.moderationPrefs.adultContentEnabled)
)
+ const ageNotSet = !preferences.userAge
+ const isUnderage = (preferences.userAge || 0) < 18
const onToggleAdultContentEnabled = React.useCallback(
async (selected: boolean) => {
@@ -163,9 +168,10 @@ export function ModerationScreenInner({
await setAdultContentPref({
enabled: selected,
})
- } catch (e) {
- // TODO
- console.error(e)
+ } catch (e: any) {
+ logger.error(`Failed to set adult content pref`, {
+ message: e.message,
+ })
}
},
[setAdultContentPref],
@@ -282,65 +288,121 @@ export function ModerationScreenInner({
-
- Content filters
-
-
-
+ {ageNotSet || !isUnderage ? (
+ <>
- Enable adult content
+ style={[
+ a.pt_2xl,
+ a.pb_md,
+ a.text_md,
+ a.font_bold,
+ t.atoms.text_contrast_high,
+ ]}>
+ Content filters
-
-
-
- {adultContentEnabled ? (
- Enabled
- ) : (
- Disabled
- )}
-
-
-
-
-
- {adultContentEnabled && (
- <>
-
-
-
-
-
-
-
-
- >
- )}
-
+
+
+ {ageNotSet ? (
+ <>
+
+
+ Confirm your age:
+
+
+
+ >
+ ) : (
+ <>
+
+
+
+ Enable adult content
+
+
+
+
+ {adultContentEnabled ? (
+ Enabled
+ ) : (
+ Disabled
+ )}
+
+
+
+
+
+ {adultContentEnabled && (
+ <>
+
+
+
+
+
+
+
+
+ >
+ )}
+
+ >
+ )}
+
+ >
+ ) : null}