66 líneas
1,6 KiB
JavaScript
66 líneas
1,6 KiB
JavaScript
// @flow
|
|
|
|
import * as React from 'react';
|
|
import {IconButton, List, withTheme} from 'react-native-paper';
|
|
|
|
type Props = {
|
|
theme: Object,
|
|
onPress: Function,
|
|
onStartPress: Function,
|
|
item: Object,
|
|
height: number,
|
|
}
|
|
|
|
type State = {
|
|
isFav: boolean,
|
|
}
|
|
|
|
class GroupListItem extends React.Component<Props, State> {
|
|
|
|
colors: Object;
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
this.colors = props.theme.colors;
|
|
this.state = {
|
|
isFav: (props.item.isFav !== undefined && props.item.isFav),
|
|
}
|
|
}
|
|
|
|
shouldComponentUpdate(prevProps: Props, prevState: State) {
|
|
return (prevState.isFav !== this.state.isFav);
|
|
}
|
|
|
|
onStarPress = () => {
|
|
this.setState({isFav: !this.state.isFav});
|
|
this.props.onStartPress();
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<List.Item
|
|
title={this.props.item.name}
|
|
onPress={this.props.onPress}
|
|
left={props =>
|
|
<List.Icon
|
|
{...props}
|
|
icon={"chevron-right"}/>}
|
|
right={props =>
|
|
<IconButton
|
|
{...props}
|
|
icon={"star"}
|
|
onPress={this.onStarPress}
|
|
color={this.state.isFav
|
|
? this.props.theme.colors.tetrisScore
|
|
: props.color}
|
|
/>}
|
|
style={{
|
|
height: this.props.height,
|
|
justifyContent: 'center',
|
|
}}
|
|
/>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default withTheme(GroupListItem);
|