Labeling & moderation updates [DRAFT] (#1057)

* First pass moving to the new labeling sdk (it compiles)

* Correct behaviors around interpreting label moderation

* Improve moderation state rendering

* Improve hiders and alerts

* Improve handling of mutes

* Improve profile warnings

* Add profile blurring to profile header

* Add blocks to test cases

* Render labels on profile cards, do not filter

* Filter profiles from suggestions using moderation

* Apply profile blurring to ProfileCard

* Handle blocked and deleted quote posts

* Temporarily translate content filtering settings to new labels

* Fix types

* Tune ContentHider & PostHider click targets

* Put a warning on profilecard label pills

* Fix screenhider learnmore link on mobile

* Enforce no-override on user avatar

* Dont enumerate profile blur-media labels in alerts

* Fixes to muted posts (esp quotes of muted users)

* Fixes to account/profile warnings

* Bump @atproto/api@0.5.0

* Bump @atproto/api@0.5.1

* Fix tests

* 1.43

* Remove log

* Bump @atproto/api@0.5.2

1 files changed, 19 insertions, 12 deletions

diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx
index ac5e7d20b..4b03d4667 100644
--- a/src/view/com/post/Post.tsx
+++ b/src/view/com/post/Post.tsx
@@ -19,9 +19,8 @@ import {UserInfoText} from '../util/UserInfoText'
 import {PostMeta} from '../util/PostMeta'
 import {PostEmbeds} from '../util/post-embeds'
 import {PostCtrls} from '../util/post-ctrls/PostCtrls'
-import {PostHider} from '../util/moderation/PostHider'
 import {ContentHider} from '../util/moderation/ContentHider'
-import {ImageHider} from '../util/moderation/ImageHider'
+import {PostAlerts} from '../util/moderation/PostAlerts'
 import {Text} from '../util/text/Text'
 import {RichText} from '../util/text/RichText'
 import * as Toast from '../util/Toast'
@@ -206,10 +205,7 @@ const PostLoaded = observer(
     }, [item, setDeleted, store])
 
     return (
-      <PostHider
-        href={itemHref}
-        style={[styles.outer, pal.view, pal.border, style]}
-        moderation={item.moderation.list}>
+      <Link href={itemHref} style={[styles.outer, pal.view, pal.border, style]}>
         {showReplyLine && <View style={styles.replyLine} />}
         <View style={styles.layout}>
           <View style={styles.layoutAvi}>
@@ -251,8 +247,13 @@ const PostLoaded = observer(
               </View>
             )}
             <ContentHider
-              moderation={item.moderation.list}
-              containerStyle={styles.contentHider}>
+              moderation={item.moderation.content}
+              style={styles.contentHider}
+              childContainerStyle={styles.contentHiderChild}>
+              <PostAlerts
+                moderation={item.moderation.content}
+                style={styles.alert}
+              />
               {item.richText?.text ? (
                 <View style={styles.postTextContainer}>
                   <RichText
@@ -264,9 +265,9 @@ const PostLoaded = observer(
                   />
                 </View>
               ) : undefined}
-              <ImageHider moderation={item.moderation.list} style={s.mb10}>
+              <ContentHider moderation={item.moderation.embed} style={s.mb10}>
                 <PostEmbeds embed={item.post.embed} style={s.mb10} />
-              </ImageHider>
+              </ContentHider>
               {needsTranslation && (
                 <View style={[pal.borderDark, styles.translateLink]}>
                   <Link href={translatorUrl} title="Translate">
@@ -302,7 +303,7 @@ const PostLoaded = observer(
             />
           </View>
         </View>
-      </PostHider>
+      </Link>
     )
   },
 )
@@ -323,6 +324,9 @@ const styles = StyleSheet.create({
   layoutContent: {
     flex: 1,
   },
+  alert: {
+    marginBottom: 6,
+  },
   postTextContainer: {
     flexDirection: 'row',
     alignItems: 'center',
@@ -341,6 +345,9 @@ const styles = StyleSheet.create({
     borderLeftColor: colors.gray2,
   },
   contentHider: {
-    marginTop: 4,
+    marginBottom: 6,
+  },
+  contentHiderChild: {
+    marginTop: 6,
   },
 })