toki/mattermost-mobile
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix keyboard overlap with recent search items in the search tab (#7465) (#7474)

Browse source 
* Fix keyboard overlap recent search item in search tab

* Set the behavior of KeyboardAvoidingView on Android to 'undefined' to avoid losing some content at the bottom

(cherry picked from commit 79994bf159)

Co-authored-by: namanh-asher <namanhmhn@gmail.com>
This commit is contained in:
Mattermost Build 2023-07-27 15:10:22 +03:00 committed by GitHub
parent 4e3cf72b4d
commit 885ae2c29f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
app/screens/home/search/search.tsx
View file

@ -4,7 +4,7 @@
import {useIsFocused, useNavigation} from '@react-navigation/native';
import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {useIntl} from 'react-intl';
import {FlatList, type LayoutChangeEvent, Platform, StyleSheet, type ViewStyle} from 'react-native';
import {FlatList, type LayoutChangeEvent, Platform, StyleSheet, type ViewStyle, KeyboardAvoidingView} from 'react-native';
import HWKeyboardEvent from 'react-native-hw-keyboard-event';
import Animated, {useAnimatedStyle, useDerivedValue, withTiming} from 'react-native-reanimated';
import {type Edge, SafeAreaView, useSafeAreaInsets} from 'react-native-safe-area-context';
@ -363,10 +363,14 @@ const SearchScreen = ({teamId, teams}: Props) => {
onLayout={onLayout}
testID='search_messages.screen'
>
<Animated.View style={animated}>
<Animated.View style={headerTopStyle}>
<RoundedHeaderContext/>
{lastSearchedValue && !loading &&
<KeyboardAvoidingView
style={styles.flex}
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
>
<Animated.View style={animated}>
<Animated.View style={headerTopStyle}>
<RoundedHeaderContext/>
{lastSearchedValue && !loading &&
<Header
teamId={searchTeamId}
setTeamId={handleResultsTeamChange}
@ -376,9 +380,9 @@ const SearchScreen = ({teamId, teams}: Props) => {
selectedFilter={filter}
teams={teams}
/>
}
</Animated.View>
{!showResults &&
}
</Animated.View>
{!showResults &&
<AnimatedFlatList
onLayout={onFlatLayout}
data={dummyData}
@ -395,8 +399,8 @@ const SearchScreen = ({teamId, teams}: Props) => {
ref={scrollRef}
renderItem={renderInitialOrLoadingItem}
/>
}
{showResults && !loading &&
}
{showResults && !loading &&
<Results
loading={resultsLoading}
selectedTab={selectedTab}
@ -407,8 +411,9 @@ const SearchScreen = ({teamId, teams}: Props) => {
scrollPaddingTop={lockValue.value}
fileChannelIds={fileChannelIds}
/>
}
</Animated.View>
}
</Animated.View>
</KeyboardAvoidingView>
</SafeAreaView>
{searchIsFocused &&
<Autocomplete