Files
Eventment/app/components/Events/EventListItem.js

80 lines
2.1 KiB
JavaScript

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { StyleSheet, TouchableOpacity, Text, Image, View } from 'react-native';
export default class EventListItem extends Component {
static get propTypes() {
return {
end: PropTypes.string.isRequired,
id: PropTypes.string.isRequired,
images: PropTypes.arrayOf(
PropTypes.shape({
url: PropTypes.string,
}),
),
setActiveEvent: PropTypes.func.isRequired,
showFrom: PropTypes.string.isRequired,
showUntil: PropTypes.string.isRequired,
start: PropTypes.string.isRequired,
tagline: PropTypes.string,
name: PropTypes.string.isRequired,
};
}
static get defaultProps() {
return {
images: null,
isTicketed: false,
postCount: 0,
tagline: null,
};
}
constructor(props) {
super(props);
}
_viewEventDetail = () => {
this.props.setActiveEvent(this.props.id);
this.props.navigation.navigate('Event');
};
render() {
const { date, description, end, name, start } = this.props;
return (
<TouchableOpacity onPress={this._viewEventDetail}>
<View style={styles.rowContainer}>
<Text>{name}</Text>
<Text>{date}</Text>
<Text>
{start} - {end}
</Text>
<Text>{description}</Text>
</View>
</TouchableOpacity>
);
}
}
const styles = StyleSheet.create({
rowContainer: {
backgroundColor: '#FFF',
borderRadius: 4,
flex: 1,
flexDirection: 'column',
marginRight: 10,
marginLeft: 10,
marginTop: 10,
padding: 10,
shadowColor: '#CCC',
shadowOffset: {
width: 1,
height: 1,
},
shadowOpacity: 1.0,
shadowRadius: 1,
},
});