Refactor moderation to apply to accounts, profiles, and posts correctly (#548)

* Add ScreenHider component

* Add blur attribute to UserAvatar and UserBanner

* Remove dead suggested posts component and model

* Bump @atproto/api@0.2.10

* Rework moderation tooling to give a more precise DSL

* Add label mocks

* Apply finer grained moderation controls

* Refactor ProfileCard to just take the profile object

* Apply moderation to user listings and banner

* Apply moderation to notifications

* Fix lint

* Tune avatar & banner blur settings per platform

* 1.24

1 files changed, 44 insertions, 0 deletions

diff --git a/src/view/com/util/moderation/ProfileHeaderWarnings.tsx b/src/view/com/util/moderation/ProfileHeaderWarnings.tsx
new file mode 100644
index 000000000..7a1a8e295
--- /dev/null
+++ b/src/view/com/util/moderation/ProfileHeaderWarnings.tsx
@@ -0,0 +1,44 @@
+import React from 'react'
+import {StyleSheet, View} from 'react-native'
+import {
+  FontAwesomeIcon,
+  FontAwesomeIconStyle,
+} from '@fortawesome/react-native-fontawesome'
+import {Text} from '../text/Text'
+import {usePalette} from 'lib/hooks/usePalette'
+import {ModerationBehavior, ModerationBehaviorCode} from 'lib/labeling/types'
+
+export function ProfileHeaderWarnings({
+  moderation,
+}: {
+  moderation: ModerationBehavior
+}) {
+  const palErr = usePalette('error')
+  if (moderation.behavior === ModerationBehaviorCode.Show) {
+    return null
+  }
+  return (
+    <View style={[styles.container, palErr.border, palErr.view]}>
+      <FontAwesomeIcon
+        icon="circle-exclamation"
+        style={palErr.text as FontAwesomeIconStyle}
+        size={20}
+      />
+      <Text style={palErr.text}>
+        This account has been flagged: {moderation.reason}
+      </Text>
+    </View>
+  )
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 10,
+    borderWidth: 1,
+    borderRadius: 6,
+    paddingHorizontal: 10,
+    paddingVertical: 8,
+  },
+})