Bluesky app fork with some witchin' additions 💫
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Remove layout animation from search (#3751)

authored by

dan and committed by
GitHub
3c2d7390 388c4f79

+19 -40
+19 -40
src/view/screens/Search/Search.tsx
··· 7 7 TextInput, 8 8 View, 9 9 } from 'react-native' 10 - import Animated, { 11 - FadeIn, 12 - FadeOut, 13 - LinearTransition, 14 - useAnimatedStyle, 15 - withSpring, 16 - } from 'react-native-reanimated' 17 10 import {AppBskyActorDefs, AppBskyFeedDefs, moderateProfile} from '@atproto/api' 18 11 import { 19 12 FontAwesomeIcon, ··· 63 56 } from '#/view/shell/desktop/Search' 64 57 import {ProfileCardFeedLoadingPlaceholder} from 'view/com/util/LoadingPlaceholder' 65 58 import {atoms as a} from '#/alf' 66 - const AnimatedPressable = Animated.createAnimatedComponent(Pressable) 67 59 68 60 function Loader() { 69 61 const pal = usePalette('default') ··· 624 616 ) 625 617 } 626 618 627 - const showClearButton = showAutocomplete && searchText.length > 0 628 - const clearButtonStyle = useAnimatedStyle(() => ({ 629 - opacity: withSpring(showClearButton ? 1 : 0, { 630 - overshootClamping: true, 631 - duration: 50, 632 - }), 633 - })) 634 - 635 619 return ( 636 620 <View style={isWeb ? null : {flex: 1}}> 637 621 <CenteredView ··· 659 643 </Pressable> 660 644 )} 661 645 662 - <AnimatedPressable 646 + <Pressable 663 647 // This only exists only for extra hitslop so don't expose it to the a11y tree. 664 648 accessible={false} 665 649 focusable={false} 666 650 // @ts-ignore web-only 667 651 tabIndex={-1} 668 - layout={isNative ? LinearTransition.duration(200) : undefined} 669 652 style={[ 670 653 {backgroundColor: pal.colors.backgroundLight}, 671 654 styles.headerSearchContainer, ··· 718 701 autoComplete="off" 719 702 autoCapitalize="none" 720 703 /> 721 - <AnimatedPressable 722 - layout={isNative ? LinearTransition.duration(200) : undefined} 723 - disabled={!showClearButton} 724 - style={clearButtonStyle} 725 - testID="searchTextInputClearBtn" 726 - onPress={onPressClearQuery} 727 - accessibilityRole="button" 728 - accessibilityLabel={_(msg`Clear search query`)} 729 - accessibilityHint="" 730 - hitSlop={HITSLOP_10}> 731 - <FontAwesomeIcon 732 - icon="xmark" 733 - size={16} 734 - style={pal.textLight as FontAwesomeIconStyle} 735 - /> 736 - </AnimatedPressable> 737 - </AnimatedPressable> 704 + {showAutocomplete && searchText.length > 0 && ( 705 + <Pressable 706 + testID="searchTextInputClearBtn" 707 + onPress={onPressClearQuery} 708 + accessibilityRole="button" 709 + accessibilityLabel={_(msg`Clear search query`)} 710 + accessibilityHint="" 711 + hitSlop={HITSLOP_10}> 712 + <FontAwesomeIcon 713 + icon="xmark" 714 + size={16} 715 + style={pal.textLight as FontAwesomeIconStyle} 716 + /> 717 + </Pressable> 718 + )} 719 + </Pressable> 738 720 {showAutocomplete && ( 739 721 <View style={[styles.headerCancelBtn]}> 740 - <AnimatedPressable 741 - entering={isNative ? FadeIn.duration(300) : undefined} 742 - exiting={isNative ? FadeOut.duration(50) : undefined} 743 - key="cancel" 722 + <Pressable 744 723 onPress={onPressCancelSearch} 745 724 accessibilityRole="button" 746 725 hitSlop={HITSLOP_10}> 747 726 <Text style={pal.text}> 748 727 <Trans>Cancel</Trans> 749 728 </Text> 750 - </AnimatedPressable> 729 + </Pressable> 751 730 </View> 752 731 )} 753 732 </CenteredView>