2019-03-12 16:23:06 +00:00
|
|
|
import React from 'react';
|
|
|
|
import { View, Text } from 'react-native';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
|
|
|
|
import styles from './styles';
|
2019-12-04 16:39:53 +00:00
|
|
|
import Touch from '../../utils/touch';
|
|
|
|
import { themes } from '../../constants/colors';
|
|
|
|
import { withTheme } from '../../theme';
|
2019-03-12 16:23:06 +00:00
|
|
|
|
|
|
|
const Item = React.memo(({
|
2020-03-30 20:19:01 +00:00
|
|
|
left, right, text, onPress, testID, current, theme
|
2019-03-12 16:23:06 +00:00
|
|
|
}) => (
|
2019-12-04 16:39:53 +00:00
|
|
|
<Touch
|
2019-03-12 16:23:06 +00:00
|
|
|
key={testID}
|
|
|
|
testID={testID}
|
|
|
|
onPress={onPress}
|
2019-12-04 16:39:53 +00:00
|
|
|
theme={theme}
|
|
|
|
style={[styles.item, current && { backgroundColor: themes[theme].borderColor }]}
|
2019-03-12 16:23:06 +00:00
|
|
|
>
|
2020-03-30 20:19:01 +00:00
|
|
|
<View style={styles.itemHorizontal}>
|
2019-03-12 16:23:06 +00:00
|
|
|
{left}
|
|
|
|
</View>
|
|
|
|
<View style={styles.itemCenter}>
|
2019-12-04 16:39:53 +00:00
|
|
|
<Text style={[styles.itemText, { color: themes[theme].titleText }]}>
|
2019-03-12 16:23:06 +00:00
|
|
|
{text}
|
|
|
|
</Text>
|
|
|
|
</View>
|
2020-03-30 20:19:01 +00:00
|
|
|
<View style={styles.itemHorizontal}>
|
|
|
|
{right}
|
|
|
|
</View>
|
2019-12-04 16:39:53 +00:00
|
|
|
</Touch>
|
2019-03-12 16:23:06 +00:00
|
|
|
));
|
|
|
|
|
|
|
|
Item.propTypes = {
|
|
|
|
left: PropTypes.element,
|
2020-03-30 20:19:01 +00:00
|
|
|
right: PropTypes.element,
|
2019-03-12 16:23:06 +00:00
|
|
|
text: PropTypes.string,
|
|
|
|
current: PropTypes.bool,
|
|
|
|
onPress: PropTypes.func,
|
2019-12-04 16:39:53 +00:00
|
|
|
testID: PropTypes.string,
|
|
|
|
theme: PropTypes.string
|
2019-03-12 16:23:06 +00:00
|
|
|
};
|
|
|
|
|
2019-12-04 16:39:53 +00:00
|
|
|
export default withTheme(Item);
|