diff --git a/src/Navigation.tsx b/src/Navigation.tsx index c03e65af69..5e9da43c11 100644 --- a/src/Navigation.tsx +++ b/src/Navigation.tsx @@ -88,6 +88,7 @@ import {MessagesSettingsScreen} from '#/screens/Messages/Settings' import {ModerationScreen} from '#/screens/Moderation' import {Screen as ModerationVerificationSettings} from '#/screens/Moderation/VerificationSettings' import {ModerationInboxScreen} from '#/screens/ModerationInbox' +import {ModerationInboxSettingsScreen} from '#/screens/ModerationInbox/Settings' import {Screen as ModerationInteractionSettings} from '#/screens/ModerationInteractionSettings' import {NotificationsActivityListScreen} from '#/screens/Notifications/ActivityList' import {PostLikedByScreen} from '#/screens/Post/PostLikedBy' @@ -184,6 +185,11 @@ function commonScreens(Stack: typeof Flat, unreadCountLabel?: string) { getComponent={() => ModerationInboxScreen} options={{title: title(msg`Moderation inbox`), requireAuth: true}} /> + ModerationInboxSettingsScreen} + options={{title: title(msg`Mod inbox settings`), requireAuth: true}} + /> ModerationModlistsScreen} diff --git a/src/lib/routes/types.ts b/src/lib/routes/types.ts index da7c13295e..d5a56b4779 100644 --- a/src/lib/routes/types.ts +++ b/src/lib/routes/types.ts @@ -24,6 +24,7 @@ export type CommonNavigatorParams = { Lists: undefined Moderation: undefined ModerationInbox: undefined + ModerationInboxSettings: undefined ModerationModlists: undefined ModerationMutedAccounts: undefined ModerationBlockedAccounts: undefined diff --git a/src/routes.ts b/src/routes.ts index be0dd4cc82..c018bb9caa 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -18,6 +18,7 @@ export const router = new Router({ // moderation Moderation: '/moderation', ModerationInbox: '/moderation/inbox', + ModerationInboxSettings: '/moderation/inbox/settings', ModerationModlists: '/moderation/modlists', ModerationMutedAccounts: '/moderation/muted-accounts', ModerationBlockedAccounts: '/moderation/blocked-accounts', diff --git a/src/screens/ModerationInbox/Settings.tsx b/src/screens/ModerationInbox/Settings.tsx new file mode 100644 index 0000000000..a678ca00f6 --- /dev/null +++ b/src/screens/ModerationInbox/Settings.tsx @@ -0,0 +1,140 @@ +import {useState} from 'react' +import {View} from 'react-native' +import {Trans, useLingui} from '@lingui/react/macro' + +import {NotFoundScreen} from '#/view/screens/NotFound' +import * as SettingsList from '#/screens/Settings/components/SettingsList' +import {atoms as a, useTheme} from '#/alf' +import * as Toggle from '#/components/forms/Toggle' +import * as Layout from '#/components/Layout' +import {Text} from '#/components/Typography' +import {useAnalytics} from '#/analytics' + +export function ModerationInboxSettingsScreen() { + const {t: l} = useLingui() + const ax = useAnalytics() + + // TODO Local state is a placeholder. -dsb + const [reportNotifications, setReportNotifications] = useState(false) + const [accountNotifications, setAccountNotifications] = useState(false) + const [labelingNotifications, setLabelingNotifications] = useState(false) + + const isEnabled = ax.features.enabled(ax.features.ModerationInboxEnable) + + if (!isEnabled) { + return + } + + return ( + + + + + + + Mod inbox settings + + + + + + + + + + + + + + ) +} + +function NotificationToggle({ + name, + label, + description, + disabled = false, + value, + onChange, +}: { + name: string + label: string + description: React.ReactNode + disabled?: boolean + value: boolean + onChange: (value: boolean) => void +}) { + const t = useTheme() + + return ( + + + + + {label} + + + {description} + + + + + + ) +} diff --git a/src/screens/ModerationInbox/index.tsx b/src/screens/ModerationInbox/index.tsx index 2158f4234a..7bfb6671fd 100644 --- a/src/screens/ModerationInbox/index.tsx +++ b/src/screens/ModerationInbox/index.tsx @@ -7,8 +7,10 @@ import {Pager} from '#/view/com/pager/Pager' import {TabBar} from '#/view/com/pager/TabBar' import {NotFoundScreen} from '#/view/screens/NotFound' import {atoms as a, useTheme} from '#/alf' +import {ButtonIcon} from '#/components/Button' +import {SettingsGear2_Stroke2_Corner0_Rounded as SettingsIcon} from '#/components/icons/SettingsGear2' import * as Layout from '#/components/Layout' -import {createStaticClick, SimpleInlineLinkText} from '#/components/Link' +import {createStaticClick, Link, SimpleInlineLinkText} from '#/components/Link' import {useAnalytics} from '#/analytics' import {AccountStatus} from './components/AccountStatus' import {FilterMenu} from './components/FilterMenu' @@ -39,7 +41,19 @@ export function ModerationInboxScreen() { Moderation inbox - + + + + +