import React, { Component, PureComponent } from 'react';
import PropTypes from 'prop-types';
import { StyleSheet, Text, View, FlatList } from 'react-native';
import { responsiveFontSize, responsiveWidth, responsiveHeight } from 'react-native-responsive-dimensions';
export class DrawerItem extends React.PureComponent {
render() {
return (
{this.props.title}
{this.props.description}
{this.props.time}
)
}
}
export class DrawerListItem extends PureComponent {
state = { selected: (new Map(): Map) };
_keyExtractor = (item, index) => item.id;
_onPressItem = (id: string) => {
this.setState((state) => {
const selected = new Map(state.selected);
selected.set(id, !selected.get(id)); // toggle
return { selected };
});
};
_renderItem = ({ item }) => (
);
render() {
return (
);
}
}
const style = StyleSheet.create({
content: {
width: responsiveWidth(100),
height: responsiveHeight(12),
borderBottomColor: '#FFFFFF',
flex: 1,
flexDirection: 'column',
paddingLeft: 10,
paddingTop: 10,
},
bottomSeparator: {
width: responsiveWidth(80),
height: 1,
justifyContent: 'center',
alignSelf: 'center',
backgroundColor: '#4f5b62',
},
title: {
color: '#000',
fontSize: responsiveFontSize(2.2)
},
description: {
fontSize: responsiveFontSize(1.8),
color: '#4f5b62',
},
timeContent: {
justifyContent: 'flex-end',
flex: 1,
alignItems: 'flex-end',
},
time: {
fontWeight: 'bold',
marginRight: 20,
marginBottom: 10,
color: '#263238',
},
});