verdnatura-chat/app/views/ShareListView/Header/Header.ios.js

84 lines
1.8 KiB
JavaScript
Raw Normal View History

2019-07-29 16:33:28 +00:00
import React, { useState } from 'react';
import PropTypes from 'prop-types';
import { Keyboard, View, StyleSheet } from 'react-native';
2019-07-29 16:33:28 +00:00
import ShareExtension from 'rn-extensions-share';
import SearchBox from '../../../containers/SearchBox';
import * as HeaderButton from '../../../containers/HeaderButton';
2019-12-04 16:39:53 +00:00
import { themes } from '../../../constants/colors';
2019-07-29 16:33:28 +00:00
import sharedStyles from '../../Styles';
import { animateNextTransition } from '../../../utils/layoutAnimation';
2019-07-29 16:33:28 +00:00
const styles = StyleSheet.create({
container: {
flexDirection: 'row',
...sharedStyles.separatorBottom
}
});
const Header = React.memo(({
2019-12-04 16:39:53 +00:00
searching, onChangeSearchText, initSearch, cancelSearch, theme
2019-07-29 16:33:28 +00:00
}) => {
const [text, setText] = useState('');
const onChangeText = (searchText) => {
onChangeSearchText(searchText);
setText(searchText);
};
const onCancelPress = () => {
Keyboard.dismiss();
onChangeText('');
cancelSearch();
animateNextTransition();
2019-07-29 16:33:28 +00:00
};
const onFocus = () => {
initSearch();
animateNextTransition();
2019-07-29 16:33:28 +00:00
};
return (
2019-12-04 16:39:53 +00:00
<View
style={[
styles.container,
{
borderColor: themes[theme].separatorColor,
backgroundColor: themes[theme].headerBackground
}
]}
>
2019-07-29 16:33:28 +00:00
{
!searching
? (
<HeaderButton.CancelModal
2019-07-29 16:33:28 +00:00
onPress={ShareExtension.close}
testID='share-extension-close'
/>
)
: null
}
<SearchBox
value={text}
hasCancel={searching}
onFocus={onFocus}
onCancelPress={onCancelPress}
onChangeText={onChangeText}
testID='rooms-list-view-search'
key='rooms-list-view-search'
/>
</View>
);
});
Header.propTypes = {
searching: PropTypes.bool,
onChangeSearchText: PropTypes.func,
initSearch: PropTypes.func,
2019-12-04 16:39:53 +00:00
cancelSearch: PropTypes.func,
theme: PropTypes.string
2019-07-29 16:33:28 +00:00
};
export default Header;