Cleanup: delete old code

src/screens/Profile/ErrorState.tsx

@@ -0,0 +1,72 @@
+import React from 'react'
+import {View} from 'react-native'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useNavigation} from '@react-navigation/native'
+
+import {useTheme, atoms as a} from '#/alf'
+import {Text} from '#/components/Typography'
+import {Button, ButtonText} from '#/components/Button'
+import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
+import {NavigationProp} from '#/lib/routes/types'
+
+export function ErrorState({error}: {error: string}) {
+  const t = useTheme()
+  const {_} = useLingui()
+  const navigation = useNavigation<NavigationProp>()
+
+  const onPressBack = React.useCallback(() => {
+    if (navigation.canGoBack()) {
+      navigation.goBack()
+    } else {
+      navigation.navigate('Home')
+    }
+  }, [navigation])
+
+  return (
+    <View style={[a.px_xl]}>
+      <CircleInfo width={48} style={[t.atoms.text_contrast_low]} />
+
+      <Text style={[a.text_xl, a.font_bold, a.pb_md, a.pt_xl]}>
+        <Trans>Hmmmm, we couldn't load that moderation service.</Trans>
+      </Text>
+      <Text
+        style={[
+          a.text_md,
+          a.leading_normal,
+          a.pb_md,
+          t.atoms.text_contrast_medium,
+        ]}>
+        <Trans>
+          This moderation service is unavailable. See below for more details. If
+          this issue persists, contact us.
+        </Trans>
+      </Text>
+      <View
+        style={[
+          a.relative,
+          a.py_md,
+          a.px_lg,
+          a.rounded_md,
+          a.mb_2xl,
+          t.atoms.bg_contrast_25,
+        ]}>
+        <Text style={[a.text_md, a.leading_normal]}>{error}</Text>
+      </View>
+
+      <View style={{flexDirection: 'row'}}>
+        <Button
+          size="small"
+          color="secondary"
+          variant="solid"
+          label={_(msg`Go Back`)}
+          accessibilityHint="Return to previous page"
+          onPress={onPressBack}>
+          <ButtonText>
+            <Trans>Go Back</Trans>
+          </ButtonText>
+        </Button>
+      </View>
+    </View>
+  )
+}

src/screens/Profile/Sections/ContentFilters.tsx

@@ -5,26 +5,16 @@ import {Trans, msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useSafeAreaFrame} from 'react-native-safe-area-context'
 
-import * as Toast from '#/view/com/util/Toast'
 import {useSetTitle} from '#/lib/hooks/useSetTitle'
-import {Haptics} from '#/lib/haptics'
-import {useAnalytics} from '#/lib/analytics/analytics'
-import {CenteredView, ScrollView} from '#/view/com/util/Views'
-import {logger} from '#/logger'
-import {useModServiceEnableMutation} from '#/state/queries/modservice'
-import {useSession} from '#/state/session'
-import {useLikeMutation, useUnlikeMutation} from '#/state/queries/like'
-
 import {getLabelGroupsFromLabels} from '#/lib/moderation'
 
 import {useTheme, atoms as a} from '#/alf'
 import {Text} from '#/components/Typography'
 import {Loader} from '#/components/Loader'
 import {Divider} from '#/components/Divider'
-import * as Toggle from '#/components/forms/Toggle'
-
-import {ErrorState} from '#/screens/ProfileModerationService/ErrorState'
-import {PreferenceRow} from '#/screens/ProfileModerationService/PreferenceRow'
+import {CenteredView, ScrollView} from '#/view/com/util/Views'
+import {ErrorState} from '../ErrorState'
+import {ModerationLabelPref} from '#/components/ModerationLabelPref'
 
 export function ProfileContentFiltersSection({
   modServiceQuery,
@@ -83,77 +73,19 @@ export function ProfileContentFiltersSectionInner({
   modservice: AppBskyModerationDefs.ModServiceViewDetailed
 }) {
   const t = useTheme()
-  const {_} = useLingui()
-  const {hasSession} = useSession()
-  const {track} = useAnalytics()
-  const {mutateAsync: likeMod, isPending: isLikePending} = useLikeMutation()
-  const {mutateAsync: unlikeMod, isPending: isUnlikePending} =
-    useUnlikeMutation()
-  const {mutateAsync: toggleEnabled, variables: enabledVariables} =
-    useModServiceEnableMutation()
-
-  const [likeUri, setLikeUri] = React.useState<string>(
-    modservice.viewer?.like || '',
-  )
-  // TODO error state
-  const [_enablementError, setEnablementError] = React.useState<string>('')
-
-  const isLiked = !!likeUri
   const groups = React.useMemo(() => {
     return getLabelGroupsFromLabels(modservice.policies.labelValues).filter(
       def => def.configurable,
     )
   }, [modservice.policies.labelValues])
-  const modservicePreferences = React.useMemo(() => {
-    return moderationOpts.mods.find(p => p.did === modservice.creator.did)
-  }, [modservice.creator.did, moderationOpts.mods])
-  const isSubscribed = moderationOpts.mods.find(
-    mod => mod.did === modservice.creator.did,
-  )
   const isEnabled = Boolean(
-    enabledVariables?.enabled ??
-      moderationOpts.mods.find(
-        mod => mod.did === modservice.creator.did && mod.enabled,
-      ),
+    moderationOpts.mods.find(
+      mod => mod.did === modservice.creator.did && mod.enabled,
+    ),
   )
 
   useSetTitle(modservice.creator.displayName || modservice.creator.handle)
 
-  const onToggleLiked = React.useCallback(async () => {
-    try {
-      Haptics.default()
-
-      if (isLiked && likeUri) {
-        await unlikeMod({uri: likeUri})
-        track('CustomFeed:Unlike')
-        setLikeUri('')
-      } else {
-        const res = await likeMod({uri: modservice.uri, cid: modservice.cid})
-        track('CustomFeed:Like')
-        setLikeUri(res.uri)
-      }
-    } catch (e: any) {
-      Toast.show(
-        _(
-          msg`There was an an issue contacting the server, please check your internet connection and try again.`,
-        ),
-      )
-      logger.error(`Failed to toggle labeler like`, {message: e.message})
-    }
-  }, [likeUri, isLiked, modservice, likeMod, unlikeMod, track, _])
-
-  const onToggleLabelerEnabled = React.useCallback(async () => {
-    try {
-      await toggleEnabled({
-        did: modservice.creator.did,
-        enabled: !isEnabled,
-      })
-    } catch (e: any) {
-      setEnablementError(e.message)
-      logger.error(`Failed to toggle labeler enabled`, {message: e.message})
-    }
-  }, [toggleEnabled, isEnabled, modservice.creator.did])
-
   return (
     <ScrollView
       scrollEventThrottle={1}
@@ -161,56 +93,31 @@ export function ProfileContentFiltersSectionInner({
         borderWidth: 0,
         paddingHorizontal: a.px_xl.paddingLeft,
       }}>
-      {false /* TODO wanted? isSubscribed*/ ? (
-        <View style={[a.flex_row, a.pr_lg, a.pt_xl]}>
-          <View style={[a.gap_sm, a.flex_1]}>
-            <Text style={[t.atoms.text_contrast_high, a.leading_snug]}>
-              Enable or disable labels from this service.
-            </Text>
-          </View>
-
-          <Toggle.Item
-            name="enable"
-            value={isEnabled}
-            onChange={onToggleLabelerEnabled}
-            label={
-              isEnabled
-                ? _(msg`Disable this moderation service`)
-                : _(msg`Enable this moderation service`)
-            }>
-            <Toggle.Label>{isEnabled ? 'Enabled' : 'Disabled'}</Toggle.Label>
-            <Toggle.Switch />
-          </Toggle.Item>
-        </View>
-      ) : (
-        <View style={[a.gap_sm, a.pt_xl]}>
-          <Text style={[t.atoms.text_contrast_high, a.leading_snug]}>
-            This service labels the following types of content.
-          </Text>
-        </View>
-      )}
-
+      <Text
+        style={[
+          a.pt_xl,
+          t.atoms.text_contrast_high,
+          a.leading_snug,
+          a.text_md,
+        ]}>
+        <Trans>This service labels the following types of content.</Trans>
+      </Text>
       <View
         style={[
-          a.gap_md,
           a.mt_xl,
           t.atoms.bg_contrast_25,
           a.rounded_md,
           a.border,
-          a.py_md,
           t.atoms.border_contrast_low,
         ]}>
         {groups.map((def, i) => {
           return (
             <React.Fragment key={def.id}>
               {i !== 0 && <Divider />}
-              <View style={[a.px_lg]}>
-                <PreferenceRow
-                  disabled={isEnabled ? undefined : true}
-                  labelGroup={def.id}
-                  modservicePreferences={modservicePreferences}
-                />
-              </View>
+              <ModerationLabelPref
+                disabled={isEnabled ? undefined : true}
+                labelGroup={def.id}
+              />
             </React.Fragment>
           )
         })}