diff --git a/app/components/GradientScrollView.tsx b/app/components/GradientScrollView.tsx index 4d46bc5..ad04afa 100644 --- a/app/components/GradientScrollView.tsx +++ b/app/components/GradientScrollView.tsx @@ -1,21 +1,24 @@ import GradientBackground from '@app/components/GradientBackground' import colors from '@app/styles/colors' import dimensions from '@app/styles/dimensions' -import React from 'react' -import { ScrollViewProps, useWindowDimensions } from 'react-native' +import React, { ForwardedRef, PropsWithChildren } from 'react' +import { ScrollView, ScrollViewProps, useWindowDimensions } from 'react-native' import Animated from 'react-native-reanimated' -const GradientScrollView: React.FC< +export type GradientScrollViewProps = PropsWithChildren< Animated.AnimateProps & { offset?: number } -> = props => { +> + +const GradientScrollView = React.forwardRef((props, ref) => { const layout = useWindowDimensions() const minHeight = layout.height - (dimensions.top() + dimensions.bottom()) return ( } overScrollMode="never" {...props} style={[props.style, { backgroundColor: colors.gradient.low }]} @@ -24,6 +27,6 @@ const GradientScrollView: React.FC< {props.children} ) -} +}) export default GradientScrollView diff --git a/app/screens/Search.tsx b/app/screens/Search.tsx index d0605e3..ab07b0e 100644 --- a/app/screens/Search.tsx +++ b/app/screens/Search.tsx @@ -17,6 +17,7 @@ import React, { useCallback, useMemo, useRef, useState } from 'react' import { ActivityIndicator, InteractionManager, + ScrollView, StatusBar, StyleSheet, TextInput as ReactTextInput, @@ -90,17 +91,20 @@ const Search = () => { const [refreshing, setRefreshing] = useState(false) const [text, setText] = useState('') const searchBarRef = useRef(null) + const scrollRef = useRef(null) useFocusEffect( useCallback(() => { const task = InteractionManager.runAfterInteractions(() => { setTimeout(() => { setText('') + setResults({ artists: [], albums: [], songs: [] }) searchBarRef.current?.focus() + scrollRef.current?.scrollTo({ y: 0, animated: true }) }, 50) }) return () => task.cancel() - }, [searchBarRef]), + }, [searchBarRef, scrollRef]), ) useActiveServerRefresh( @@ -131,7 +135,7 @@ const Search = () => { const resultsCount = results.albums.length + results.artists.length + results.songs.length return ( - +