From c17309943dbce769954a2b4008745aab7b375fa0 Mon Sep 17 00:00:00 2001
From: Oleksii Bulenok <63914185+abulenok@users.noreply.github.com>
Date: Mon, 7 Sep 2026 09:20:24 +0200
Subject: [PATCH] Fix hidden adult content takes time to appear (#11469)

---
 src/components/moderation/ContentHider.tsx | 24 ++++++++++++----------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/components/moderation/ContentHider.tsx b/src/components/moderation/ContentHider.tsx
index 2bc50a8598..bac0e51f3d 100644
--- a/src/components/moderation/ContentHider.tsx
+++ b/src/components/moderation/ContentHider.tsx
@@ -1,10 +1,6 @@
 import {useMemo, useState} from 'react'
-import {
-  LayoutAnimation,
-  type StyleProp,
-  View,
-  type ViewStyle,
-} from 'react-native'
+import {type StyleProp, View, type ViewStyle} from 'react-native'
+import Animated, {FadeIn, LinearTransition} from 'react-native-reanimated'
 import {type ModerationUI} from '@bsky/sdk/moderation'
 import {Trans, useLingui} from '@lingui/react/macro'
 
@@ -18,7 +14,7 @@ import {getDefinition, getLabelStrings} from '#/lib/moderation/useLabelInfo'
 import {useModerationCauseDescription} from '#/lib/moderation/useModerationCauseDescription'
 import {sanitizeDisplayName} from '#/lib/strings/display-names'
 import {useLabelDefinitions} from '#/state/preferences'
-import {atoms as a, useBreakpoints, useTheme, web} from '#/alf'
+import {atoms as a, native, useBreakpoints, useTheme, web} from '#/alf'
 import {Button} from '#/components/Button'
 import {
   ModerationDetailsDialog,
@@ -140,14 +136,16 @@ function ContentHiderActive({
   ])
 
   return (
-    <View testID={testID} style={[a.overflow_hidden, style]}>
+    <Animated.View
+      testID={testID}
+      layout={native(LinearTransition)}
+      style={[a.overflow_hidden, style]}>
       <ModerationDetailsDialog control={control} modcause={blur} />
       <Button
         onPress={e => {
           e.preventDefault()
           e.stopPropagation()
           if (!modui.noOverride) {
-            LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)
             setOverride(v => !v)
           } else {
             control.open()
@@ -249,7 +247,11 @@ function ContentHiderActive({
           )}
         </Button>
       )}
-      {override && <View style={childContainerStyle}>{children}</View>}
-    </View>
+      {override && (
+        <Animated.View entering={native(FadeIn)} style={childContainerStyle}>
+          {children}
+        </Animated.View>
+      )}
+    </Animated.View>
   )
 }