5 files changed, 23 insertions, 16 deletions
diff --git a/src/view/com/util/forms/SelectableBtn.tsx b/src/view/com/util/forms/SelectableBtn.tsx
index 503c49b2f..4b494264e 100644
--- a/src/view/com/util/forms/SelectableBtn.tsx
+++ b/src/view/com/util/forms/SelectableBtn.tsx
@@ -5,6 +5,7 @@ import {usePalette} from 'lib/hooks/usePalette'
 import {isDesktopWeb} from 'platform/detection'
 
 interface SelectableBtnProps {
+  testID?: string
   selected: boolean
   label: string
   left?: boolean
@@ -15,6 +16,7 @@ interface SelectableBtnProps {
 }
 
 export function SelectableBtn({
+  testID,
   selected,
   label,
   left,
@@ -25,12 +27,15 @@ export function SelectableBtn({
 }: SelectableBtnProps) {
   const pal = usePalette('default')
   const palPrimary = usePalette('inverted')
+  const needsWidthStyles = !style || !('width' in style || 'flex' in style)
   return (
     <Pressable
+      testID={testID}
       style={[
-        styles.selectableBtn,
-        left && styles.selectableBtnLeft,
-        right && styles.selectableBtnRight,
+        styles.btn,
+        needsWidthStyles && styles.btnWidth,
+        left && styles.btnLeft,
+        right && styles.btnRight,
         pal.border,
         selected ? palPrimary.view : pal.view,
         style,
@@ -45,9 +50,7 @@ export function SelectableBtn({
 }
 
 const styles = StyleSheet.create({
-  selectableBtn: {
-    flex: isDesktopWeb ? undefined : 1,
-    width: isDesktopWeb ? 100 : undefined,
+  btn: {
     flexDirection: 'row',
     justifyContent: 'center',
     borderWidth: 1,
@@ -55,12 +58,16 @@ const styles = StyleSheet.create({
     paddingHorizontal: 10,
     paddingVertical: 10,
   },
-  selectableBtnLeft: {
+  btnWidth: {
+    flex: isDesktopWeb ? undefined : 1,
+    width: isDesktopWeb ? 100 : undefined,
+  },
+  btnLeft: {
     borderTopLeftRadius: 8,
     borderBottomLeftRadius: 8,
     borderLeftWidth: 1,
   },
-  selectableBtnRight: {
+  btnRight: {
     borderTopRightRadius: 8,
     borderBottomRightRadius: 8,
   },
diff --git a/src/view/com/util/moderation/ContentHider.tsx b/src/view/com/util/moderation/ContentHider.tsx
index 6be2f8be0..9286d1c8b 100644
--- a/src/view/com/util/moderation/ContentHider.tsx
+++ b/src/view/com/util/moderation/ContentHider.tsx
@@ -3,7 +3,7 @@ import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native'
 import {usePalette} from 'lib/hooks/usePalette'
 import {ModerationUI} from '@atproto/api'
 import {Text} from '../text/Text'
-import {InfoCircleIcon} from 'lib/icons'
+import {ShieldExclamation} from 'lib/icons'
 import {describeModerationCause} from 'lib/moderation'
 import {useStores} from 'state/index'
 import {isDesktopWeb} from 'platform/detection'
@@ -58,7 +58,7 @@ export function ContentHider({
           accessibilityRole="button"
           accessibilityLabel="Learn more about this warning"
           accessibilityHint="">
-          <InfoCircleIcon size={18} style={pal.text} />
+          <ShieldExclamation size={18} style={pal.text} />
         </Pressable>
         <Text type="lg" style={pal.text}>
           {desc.name}
diff --git a/src/view/com/util/moderation/PostAlerts.tsx b/src/view/com/util/moderation/PostAlerts.tsx
index 45937c2d8..8a6cbbb85 100644
--- a/src/view/com/util/moderation/PostAlerts.tsx
+++ b/src/view/com/util/moderation/PostAlerts.tsx
@@ -3,7 +3,7 @@ import {Pressable, StyleProp, StyleSheet, ViewStyle} from 'react-native'
 import {ModerationUI} from '@atproto/api'
 import {Text} from '../text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
-import {InfoCircleIcon} from 'lib/icons'
+import {ShieldExclamation} from 'lib/icons'
 import {describeModerationCause} from 'lib/moderation'
 import {useStores} from 'state/index'
 
@@ -41,7 +41,7 @@ export function PostAlerts({
       accessibilityLabel="Learn more about this warning"
       accessibilityHint=""
       style={[styles.container, pal.viewLight, style]}>
-      <InfoCircleIcon style={pal.text} size={18} />
+      <ShieldExclamation style={pal.text} size={16} />
       <Text type="lg" style={pal.text}>
         {desc.name}
       </Text>
diff --git a/src/view/com/util/moderation/PostHider.tsx b/src/view/com/util/moderation/PostHider.tsx
index dc74d3e39..2a52561d4 100644
--- a/src/view/com/util/moderation/PostHider.tsx
+++ b/src/view/com/util/moderation/PostHider.tsx
@@ -6,7 +6,7 @@ import {Link} from '../Link'
 import {Text} from '../text/Text'
 import {addStyle} from 'lib/styles'
 import {describeModerationCause} from 'lib/moderation'
-import {InfoCircleIcon} from 'lib/icons'
+import {ShieldExclamation} from 'lib/icons'
 import {useStores} from 'state/index'
 import {isDesktopWeb} from 'platform/detection'
 
@@ -67,7 +67,7 @@ export function PostHider({
           accessibilityRole="button"
           accessibilityLabel="Learn more about this warning"
           accessibilityHint="">
-          <InfoCircleIcon size={18} style={pal.text} />
+          <ShieldExclamation size={18} style={pal.text} />
         </Pressable>
         <Text type="lg" style={pal.text}>
           {desc.name}
diff --git a/src/view/com/util/moderation/ProfileHeaderAlerts.tsx b/src/view/com/util/moderation/ProfileHeaderAlerts.tsx
index 3cc3b5b9e..b7781e06d 100644
--- a/src/view/com/util/moderation/ProfileHeaderAlerts.tsx
+++ b/src/view/com/util/moderation/ProfileHeaderAlerts.tsx
@@ -3,7 +3,7 @@ import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native'
 import {ProfileModeration} from '@atproto/api'
 import {Text} from '../text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
-import {InfoCircleIcon} from 'lib/icons'
+import {ShieldExclamation} from 'lib/icons'
 import {
   describeModerationCause,
   getProfileModerationCauses,
@@ -44,7 +44,7 @@ export function ProfileHeaderAlerts({
             accessibilityLabel="Learn more about this warning"
             accessibilityHint=""
             style={[styles.container, pal.viewLight, style]}>
-            <InfoCircleIcon style={pal.text} size={24} />
+            <ShieldExclamation style={pal.text} size={24} />
             <Text type="lg" style={pal.text}>
               {desc.name}
             </Text>