minor tweak
This commit is contained in:
parent
9cb719658c
commit
cad724f36a
|
@ -4,7 +4,7 @@ import React, { forwardRef, isValidElement, useEffect, useImperativeHandle, useR
|
|||
import { Keyboard } from 'react-native';
|
||||
import { Easing } from 'react-native-reanimated';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import BottomSheet, { BottomSheetBackdrop } from '@gorhom/bottom-sheet';
|
||||
import BottomSheet, { BottomSheetBackdrop, BottomSheetProps } from '@gorhom/bottom-sheet';
|
||||
|
||||
import { useDimensions, useOrientation } from '../../dimensions';
|
||||
import { useTheme } from '../../theme';
|
||||
|
@ -125,9 +125,11 @@ const ActionSheet = React.memo(
|
|||
// when is android tablet and the input text is focused
|
||||
const androidTablet: any = isTablet && isLandscape && !isIOS ? { android_keyboardInputMode: 'adjustResize' } : {};
|
||||
|
||||
const handleOnChange = (index: number) => {
|
||||
const handleOnChange: BottomSheetProps['onChange'] = index => {
|
||||
onChange(index);
|
||||
index === -1 && onClose();
|
||||
if (index === -1) {
|
||||
return onClose();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
|
@ -27,13 +27,13 @@ export type TActionSheetOptions = {
|
|||
export interface IActionSheetProvider {
|
||||
showActionSheet: (item: TActionSheetOptions) => void;
|
||||
hideActionSheet: () => void;
|
||||
indexPosition: number;
|
||||
actionSheetSnapIndex: number;
|
||||
}
|
||||
|
||||
const context = React.createContext<IActionSheetProvider>({
|
||||
showActionSheet: () => {},
|
||||
hideActionSheet: () => {},
|
||||
indexPosition: -1
|
||||
actionSheetSnapIndex: -1
|
||||
});
|
||||
|
||||
export const useActionSheet = () => useContext(context);
|
||||
|
@ -50,10 +50,10 @@ export const withActionSheet = (Component: React.ComponentType<any>): typeof Com
|
|||
};
|
||||
|
||||
export const ActionSheetProvider = React.memo(({ children }: { children: React.ReactElement | React.ReactElement[] }) => {
|
||||
const [indexPosition, setIndexPosition] = useState(-1);
|
||||
const [actionSheetSnapIndex, setActionSheetSnapIndex] = useState(-1);
|
||||
const ref: ForwardedRef<IActionSheetProvider> = useRef(null);
|
||||
|
||||
const onChange = (index: number) => setIndexPosition(index);
|
||||
const onChange = (index: number) => setActionSheetSnapIndex(index);
|
||||
|
||||
const getContext = () => ({
|
||||
showActionSheet: (options: TActionSheetOptions) => {
|
||||
|
@ -62,7 +62,7 @@ export const ActionSheetProvider = React.memo(({ children }: { children: React.R
|
|||
hideActionSheet: () => {
|
||||
ref.current?.hideActionSheet();
|
||||
},
|
||||
indexPosition
|
||||
actionSheetSnapIndex
|
||||
});
|
||||
|
||||
return (
|
||||
|
|
|
@ -66,13 +66,13 @@ const AllReactionsListItem = ({ item, getCustomEmoji }: IAllReactionsListItemPro
|
|||
const AllTab = ({ reactions, getCustomEmoji }: IAllTabProps): React.ReactElement => {
|
||||
const { height } = useWindowDimensions();
|
||||
const paddingBottom = calculatePadding(height);
|
||||
const { indexPosition } = useActionSheet();
|
||||
const { actionSheetSnapIndex } = useActionSheet();
|
||||
|
||||
return (
|
||||
<View style={styles.allTabContainer} testID='reactionsListAllTab'>
|
||||
<FlatList
|
||||
data={reactions}
|
||||
contentContainerStyle={[styles.listContainer, indexPosition === 0 && { paddingBottom }]}
|
||||
contentContainerStyle={[styles.listContainer, actionSheetSnapIndex === 0 && { paddingBottom }]}
|
||||
renderItem={({ item }) => <AllReactionsListItem item={item} getCustomEmoji={getCustomEmoji} />}
|
||||
keyExtractor={item => item.emoji}
|
||||
/>
|
||||
|
|
|
@ -12,7 +12,7 @@ import { calculatePadding } from './calculatePadding';
|
|||
const UsersList = ({ tabLabel }: { tabLabel: IReaction }): React.ReactElement => {
|
||||
const { colors } = useTheme();
|
||||
const useRealName = useSelector((state: IApplicationState) => state.settings.UI_Use_Real_Name);
|
||||
const { indexPosition } = useActionSheet();
|
||||
const { actionSheetSnapIndex } = useActionSheet();
|
||||
const { height } = useWindowDimensions();
|
||||
const paddingBottom = calculatePadding(height);
|
||||
|
||||
|
@ -25,7 +25,7 @@ const UsersList = ({ tabLabel }: { tabLabel: IReaction }): React.ReactElement =>
|
|||
return (
|
||||
<FlatList
|
||||
data={users}
|
||||
contentContainerStyle={[styles.listContainer, indexPosition === 0 && { paddingBottom }]}
|
||||
contentContainerStyle={[styles.listContainer, actionSheetSnapIndex === 0 && { paddingBottom }]}
|
||||
ListHeaderComponent={
|
||||
<View style={styles.emojiNameContainer}>
|
||||
<Text style={[styles.emojiName, { color: colors.auxiliaryText }]} testID='usersListEmojiName'>
|
||||
|
|
Loading…
Reference in New Issue