Skip to content

Commit

Permalink
Render commits data
Browse files Browse the repository at this point in the history
  • Loading branch information
haruelrovix committed Dec 13, 2018
1 parent 334197c commit 27a7867
Showing 1 changed file with 59 additions and 8 deletions.
67 changes: 59 additions & 8 deletions src/Components/Commit/CommitList.js
Original file line number Diff line number Diff line change
@@ -1,18 +1,69 @@
import React from 'react';
import { Text, View } from 'react-native';
import { ActivityIndicator, Dimensions, FlatList, Platform, View } from 'react-native';
import { Avatar, ListItem } from 'react-native-elements';
import { compose } from 'redux';
import fetch from 'fetch-hoc';

import styles from '../Shared.style';
import withHeader from '../../HOCs/withHeader';

const CommitList = () => (
<View style={styles.container}>
<Text>Placeholder for second screen</Text>
</View>
);
const containerStyle = {
alignItems: 'flex-start',
borderBottomWidth: 1,
flex: 1,
width: Dimensions.get('window').width
};

const subtitleStyle = { color: 'rgba(0, 0, 0, 0.54)' };

const leftElementStyle = {
height: '100%',
marginRight: Platform.OS === 'web' ? 10 : 0
};

class CommitList extends React.PureComponent {
keyExtractor = (item) => item.sha

renderLeftElement = (item) => (
<View style={leftElementStyle}>
<Avatar
source={{ uri: item.author.avatar_url }}
size='medium'
rounded
/>
</View>
)

renderItem = ({ item }) => (
<ListItem
title={item.commit.author.name}
subtitle={item.commit.message}
leftElement={this.renderLeftElement(item)}
containerStyle={containerStyle}
subtitleStyle={subtitleStyle}
/>
)

renderContent = () => (
this.props.loading ?
<ActivityIndicator color='#87ceeb' /> :
<FlatList
keyExtractor={this.keyExtractor}
data={this.props.data}
renderItem={this.renderItem}
/>
)

render() {
return (
<View style={styles.container}>
{this.renderContent()}
</View>
);
}
}

export default compose(
fetch('https://api.github.com/repos/react-native-training/react-native-elements/commits'),
withHeader({ title: 'Commits' })
withHeader({ title: 'Commits' }),
fetch('https://api.github.com/repos/react-native-training/react-native-elements/commits')
)(CommitList);

0 comments on commit 27a7867

Please sign in to comment.