aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/components/search/RecentSearches.tsx10
-rw-r--r--src/components/search/SearchResultList.tsx28
-rw-r--r--src/components/search/SearchResultsBackground.tsx8
-rw-r--r--src/screens/search/SearchScreen.tsx45
4 files changed, 42 insertions, 49 deletions
diff --git a/src/components/search/RecentSearches.tsx b/src/components/search/RecentSearches.tsx
index 3925d084..6fb9fca9 100644
--- a/src/components/search/RecentSearches.tsx
+++ b/src/components/search/RecentSearches.tsx
@@ -5,10 +5,12 @@ import {
TouchableOpacity,
StyleSheet,
TouchableOpacityProps,
+ ScrollView,
} from 'react-native';
import {PreviewType, ProfilePreviewType, ScreenType} from '../../types';
import {TAGG_LIGHT_BLUE} from '../../constants';
import SearchResults from './SearchResults';
+import {SCREEN_HEIGHT} from '../../utils';
interface RecentSearchesProps extends TouchableOpacityProps {
sectionTitle: PreviewType;
@@ -21,7 +23,9 @@ interface RecentSearchesProps extends TouchableOpacityProps {
*/
const RecentSearches: React.FC<RecentSearchesProps> = (props) => {
return (
- <View style={styles.mainContainer}>
+ <ScrollView
+ style={styles.mainContainer}
+ contentContainerStyle={{paddingBottom: SCREEN_HEIGHT * 0.1}}>
<View style={styles.container}>
<Text style={styles.title}>{props.sectionTitle}</Text>
{props.sectionButtonTitle && (
@@ -35,14 +39,14 @@ const RecentSearches: React.FC<RecentSearchesProps> = (props) => {
previewType={props.sectionTitle}
screenType={props.screenType}
/>
- </View>
+ </ScrollView>
);
};
const styles = StyleSheet.create({
mainContainer: {
marginLeft: '3%',
- padding : 20,
+ padding: 20,
},
container: {
flexDirection: 'row',
diff --git a/src/components/search/SearchResultList.tsx b/src/components/search/SearchResultList.tsx
index 7f8073c4..a3d9c8c5 100644
--- a/src/components/search/SearchResultList.tsx
+++ b/src/components/search/SearchResultList.tsx
@@ -1,20 +1,15 @@
import React, {useEffect, useState} from 'react';
-import {
- Keyboard,
- KeyboardAvoidingView,
- SectionList,
- StyleSheet,
- Text,
- View,
-} from 'react-native';
+import {SectionList, StyleSheet, Text, View} from 'react-native';
import {useSelector} from 'react-redux';
import {RootState} from 'src/store/rootreducer';
+import {NO_RESULTS_FOUND} from '../../constants/strings';
import {PreviewType, ScreenType} from '../../types';
import {normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
import SearchResultsCell from './SearchResultCell';
-import {NO_RESULTS_FOUND} from '../../constants/strings';
+
interface SearchResultsProps {
results: Array<any> | undefined;
+ keyboardVisible: boolean;
previewType: PreviewType;
screenType: ScreenType;
}
@@ -26,7 +21,10 @@ const sectionHeader: React.FC<Boolean> = (showBorder: Boolean) => {
return null;
};
-const SearchResultList: React.FC<SearchResultsProps> = ({results}) => {
+const SearchResultList: React.FC<SearchResultsProps> = ({
+ results,
+ keyboardVisible,
+}) => {
const [showSection, setShowSection] = useState(true);
const [showEmptyView, setshowEmptyView] = useState(false);
const {user: loggedInUser} = useSelector((state: RootState) => state.user);
@@ -48,8 +46,11 @@ const SearchResultList: React.FC<SearchResultsProps> = ({results}) => {
)}
{!showEmptyView && (
<SectionList
- style={{height: SCREEN_HEIGHT, width: SCREEN_WIDTH}}
- showsVerticalScrollIndicator={false}
+ style={[
+ {width: SCREEN_WIDTH},
+ keyboardVisible ? styles.keyboardOpen : {},
+ ]}
+ contentContainerStyle={{paddingBottom: SCREEN_HEIGHT * 0.1}}
sections={results}
keyExtractor={(item, index) => item.id + index}
renderItem={({item}) => (
@@ -69,7 +70,7 @@ const SearchResultList: React.FC<SearchResultsProps> = ({results}) => {
const styles = StyleSheet.create({
container: {
- marginTop: SCREEN_HEIGHT * 0.04,
+ marginTop: SCREEN_HEIGHT * 0.02,
},
sectionHeaderStyle: {
width: '100%',
@@ -78,7 +79,6 @@ const styles = StyleSheet.create({
backgroundColor: '#C4C4C4',
},
keyboardOpen: {marginBottom: SCREEN_HEIGHT * 0.3},
- keyboardClose: {marginBottom: 20},
noResultsTextContainer: {
justifyContent: 'center',
flexDirection: 'row',
diff --git a/src/components/search/SearchResultsBackground.tsx b/src/components/search/SearchResultsBackground.tsx
index fa4e18ca..c5fcc6fb 100644
--- a/src/components/search/SearchResultsBackground.tsx
+++ b/src/components/search/SearchResultsBackground.tsx
@@ -1,6 +1,6 @@
import React from 'react';
-import Animated, {interpolate} from 'react-native-reanimated';
import {StyleSheet} from 'react-native';
+import Animated, {interpolate} from 'react-native-reanimated';
import {SCREEN_HEIGHT, SCREEN_WIDTH, StatusBarHeight} from '../../utils';
interface SearchResultsBackgroundProps {
@@ -21,11 +21,9 @@ const SearchResultsBackground: React.FC<SearchResultsBackgroundProps> = ({
return (
<Animated.View
style={[styles.container, {opacity: opacityBackground, top}]}>
- <Animated.ScrollView
- contentContainerStyle={styles.contentContainer}
- style={[styles.results, {opacity: opacityContent}]}>
+ <Animated.View style={[styles.results, {opacity: opacityContent}]}>
{children}
- </Animated.ScrollView>
+ </Animated.View>
</Animated.View>
);
};
diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx
index b6841480..70733d7e 100644
--- a/src/screens/search/SearchScreen.tsx
+++ b/src/screens/search/SearchScreen.tsx
@@ -3,12 +3,10 @@ import {useFocusEffect} from '@react-navigation/native';
import React, {useCallback, useEffect, useState} from 'react';
import {
Keyboard,
- KeyboardAvoidingView,
RefreshControl,
ScrollView,
StatusBar,
StyleSheet,
- SafeAreaView,
} from 'react-native';
import Animated, {Easing, timing} from 'react-native-reanimated';
import {useDispatch, useSelector} from 'react-redux';
@@ -23,15 +21,11 @@ import {
TabsGradient,
} from '../../components';
import {SEARCH_ENDPOINT, TAGG_LIGHT_BLUE} from '../../constants';
+import {loadSearchResults} from '../../services';
import {loadRecentlySearched, resetScreenType} from '../../store/actions';
import {RootState} from '../../store/rootReducer';
-import {ProfilePreviewType, ScreenType, UserType} from '../../types';
+import {ProfilePreviewType, ScreenType} from '../../types';
import {SCREEN_HEIGHT, SCREEN_WIDTH, StatusBarHeight} from '../../utils';
-import {loadSearchResults} from '../../services';
-const NO_USER: UserType = {
- userId: '',
- username: '',
-};
/**
* Search Screen for user recommendations and a search
@@ -178,25 +172,22 @@ const SearchScreen: React.FC = () => {
<Explore />
<SearchResultsBackground {...{top}}>
- <KeyboardAvoidingView
- behavior={'padding'}
- keyboardVerticalOffset={SCREEN_HEIGHT * 0.1}>
- {results === undefined && recents.length !== 0 ? (
- <RecentSearches
- sectionTitle="Recent"
- sectionButtonTitle="Clear all"
- onPress={clearRecentlySearched}
- recents={recents}
- screenType={ScreenType.Search}
- />
- ) : (
- <SearchResultList
- {...{results}}
- previewType={'Search'}
- screenType={ScreenType.Search}
- />
- )}
- </KeyboardAvoidingView>
+ {results === undefined && recents.length !== 0 ? (
+ <RecentSearches
+ sectionTitle="Recent"
+ sectionButtonTitle="Clear all"
+ onPress={clearRecentlySearched}
+ recents={recents}
+ screenType={ScreenType.Search}
+ />
+ ) : (
+ <SearchResultList
+ {...{results}}
+ keyboardVisible={keyboardVisible === 'keyboardVisibleTrue'}
+ previewType={'Search'}
+ screenType={ScreenType.Search}
+ />
+ )}
</SearchResultsBackground>
</ScrollView>
<TabsGradient />
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 14:11:28 +0000