aboutsummaryrefslogtreecommitdiff
path: root/src/screens/chat/ChatSearchBar.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/screens/chat/ChatSearchBar.tsx')
-rw-r--r--src/screens/chat/ChatSearchBar.tsx28
1 files changed, 5 insertions, 23 deletions
diff --git a/src/screens/chat/ChatSearchBar.tsx b/src/screens/chat/ChatSearchBar.tsx
index d8aff567..3531111b 100644
--- a/src/screens/chat/ChatSearchBar.tsx
+++ b/src/screens/chat/ChatSearchBar.tsx
@@ -9,14 +9,12 @@ import {
TextInputSubmitEditingEventData,
TouchableOpacity,
View,
- ViewStyle,
} from 'react-native';
import {normalize} from 'react-native-elements';
-import Animated, {useAnimatedStyle} from 'react-native-reanimated';
+import Animated from 'react-native-reanimated';
interface SearchBarProps extends TextInputProps {
onCancel: () => void;
- animationProgress: Animated.SharedValue<number>;
searching: boolean;
placeholder: string;
}
@@ -26,7 +24,6 @@ const ChatSearchBar: React.FC<SearchBarProps> = ({
onChangeText,
value,
onCancel,
- animationProgress,
onLayout,
placeholder,
}) => {
@@ -37,14 +34,6 @@ const ChatSearchBar: React.FC<SearchBarProps> = ({
Keyboard.dismiss();
};
- /*
- * On-search marginRight style ("cancel" button slides and fades in).
- */
- const animatedStyles = useAnimatedStyle<ViewStyle>(() => ({
- marginRight: animationProgress.value * 58,
- opacity: animationProgress.value,
- }));
-
return (
<View style={styles.container} onLayout={onLayout}>
<Animated.View style={styles.inputContainer}>
@@ -61,11 +50,9 @@ const ChatSearchBar: React.FC<SearchBarProps> = ({
{...{placeholder, value, onChangeText, onFocus, onBlur}}
/>
</Animated.View>
- <Animated.View style={animatedStyles}>
- <TouchableOpacity style={styles.cancelButton} onPress={onCancel}>
- <Text style={styles.cancelText}>Cancel</Text>
- </TouchableOpacity>
- </Animated.View>
+ <TouchableOpacity style={styles.cancelButton} onPress={onCancel}>
+ <Text style={styles.cancelText}>Cancel</Text>
+ </TouchableOpacity>
</View>
);
};
@@ -87,9 +74,6 @@ const styles = StyleSheet.create({
borderRadius: 20,
backgroundColor: '#F0F0F0',
},
- searchIcon: {
- marginRight: 8,
- },
input: {
flex: 1,
fontSize: 16,
@@ -97,10 +81,8 @@ const styles = StyleSheet.create({
letterSpacing: normalize(0.5),
},
cancelButton: {
- height: '100%',
- position: 'absolute',
justifyContent: 'center',
- paddingHorizontal: 8,
+ paddingLeft: 10,
},
cancelText: {
color: '#818181',