get rid of reanimated stuff, not necessary

This commit is contained in:
Samuel Newman
2026-02-25 14:12:42 +02:00
parent 43aee8c014
commit 3a4c267106
+5 -10
View File
@@ -1,6 +1,5 @@
import {useLayoutEffect, useMemo, useState} from 'react' import {useLayoutEffect, useMemo, useState} from 'react'
import {useWindowDimensions} from 'react-native' import {useWindowDimensions, View} from 'react-native'
import Animated, {useAnimatedStyle, withTiming} from 'react-native-reanimated'
import {useIsFocused, useNavigation} from '@react-navigation/native' import {useIsFocused, useNavigation} from '@react-navigation/native'
import {type NavigationProp} from '#/lib/routes/types' import {type NavigationProp} from '#/lib/routes/types'
@@ -33,13 +32,9 @@ function TransparentOuter({children, headerRef}: OuterProps) {
// bit of a hack - react-native-screens initially renders the header too wide // bit of a hack - react-native-screens initially renders the header too wide
// so let's delay showing it until the padding has been applied -sfn // so let's delay showing it until the padding has been applied -sfn
const isInitialRender = headerWidth === 0 || headerWidth === screenWidth const isInitialRender = headerWidth === 0 || headerWidth === screenWidth
const animatedOpacity = useAnimatedStyle(() => ({
opacity: withTiming(isInitialRender ? 0 : 1, {duration: 100}),
}))
const headerElement = useMemo(() => { const headerElement = useMemo(() => {
return ( return (
<Animated.View <View
ref={headerRef} ref={headerRef}
onLayout={evt => setHeaderWidth(evt.nativeEvent.layout.width)} onLayout={evt => setHeaderWidth(evt.nativeEvent.layout.width)}
style={[ style={[
@@ -48,12 +43,12 @@ function TransparentOuter({children, headerRef}: OuterProps) {
a.align_center, a.align_center,
a.gap_sm, a.gap_sm,
a.px_xs, a.px_xs,
animatedOpacity, isInitialRender && {opacity: 0},
]}> ]}>
{children} {children}
</Animated.View> </View>
) )
}, [children, headerRef, animatedOpacity]) }, [children, headerRef, isInitialRender])
// this is how expo-router handles it // this is how expo-router handles it
// https://github.com/expo/expo/blob/main/packages/expo-router/src/views/Screen.tsx#L34 // https://github.com/expo/expo/blob/main/packages/expo-router/src/views/Screen.tsx#L34