-More!

app/screens/Events.js

@@ -20,15 +20,27 @@ export default class Events extends Component {
   }
 
   componentDidMount() {
-
+    this.props.fetchEvents();
   }
 
+  _keyExtractor = (event, index) => `${event._id}_${index}`;
+
+  _renderEventListItem = ({ event }) => <EventListItem event={event} />;
+
   render() {
+    const { events } = this.props;
+
     return (
       <View style={styles.container}>
-        <Text style={styles.title}>
-          Events
-        </Text>
+        {events.size > 0 && (
+          <FlatList
+            data={events}
+            keyExtractor={this._keyExtractor}
+            renderItem={this._renderEventListItem}
+            contentContainerStyle={styles.eventListContentContainer}
+            style={styles.eventList}
+          />
+        )}
       </View>
     );
   }
@@ -41,9 +53,6 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     backgroundColor: '#F5FCFF',
   },
-  title: {
-    fontSize: 20,
-    textAlign: 'center',
-    margin: 10,
-  }
+  eventListContentContainer: {
+  },
 });