add layout animation to contenthider

src/components/moderation/ContentHider.tsx

@@ -1,5 +1,10 @@
-import React from 'react'
-import {type StyleProp, View, type ViewStyle} from 'react-native'
+import {useMemo, useState} from 'react'
+import {
+  LayoutAnimation,
+  type StyleProp,
+  View,
+  type ViewStyle,
+} from 'react-native'
 import {type ModerationUI} from '@atproto/api'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
@@ -64,16 +69,17 @@ function ContentHiderActive({
   style,
   childContainerStyle,
   children,
-}: React.PropsWithChildren<{
+}: {
   testID?: string
   modui: ModerationUI
   style?: StyleProp<ViewStyle>
   childContainerStyle?: StyleProp<ViewStyle>
-}>) {
+  children?: React.ReactNode
+}) {
   const t = useTheme()
   const {_} = useLingui()
   const {gtMobile} = useBreakpoints()
-  const [override, setOverride] = React.useState(false)
+  const [override, setOverride] = useState(false)
   const control = useModerationDetailsDialogControl()
   const {labelDefs} = useLabelDefinitions()
   const globalLabelStrings = useGlobalLabelStrings()
@@ -81,7 +87,7 @@ function ContentHiderActive({
   const blur = modui?.blurs[0]
   const desc = useModerationCauseDescription(blur)
 
-  const labelName = React.useMemo(() => {
+  const labelName = useMemo(() => {
     if (!modui?.blurs || !blur) {
       return undefined
     }
@@ -150,6 +156,7 @@ function ContentHiderActive({
           e.preventDefault()
           e.stopPropagation()
           if (!modui.noOverride) {
+            LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)
             setOverride(v => !v)
           } else {
             control.open()