Merge branch 'feature/new-api-urls' into 'master'

Change event API urls

See merge request !15

app/actions/calendar.js

@@ -16,10 +16,6 @@ export function calendarNotRetrieved() {
 
 export function retrieveCalendar(token) {
   return (dispatch) => {
-    const start = new Date().toISOString().substring(0, 10);
-    let end = new Date();
-    end.setMonth(end.getMonth() + 6);
-    end = end.toISOString().substring(0, 10);
     const data = {
       method: 'GET',
       headers: {
@@ -28,13 +24,11 @@ export function retrieveCalendar(token) {
         Authorization: `Token ${token}`,
       },
     };
-    return fetch(`${url}/api/events/eventlist/?start=${start}&end=${end}`, data)
+    return fetch(`${url}/api/events/`, data)
       .then(
         response => response.json())
       .then(
         responseJson => dispatch(calendarRetrieved(responseJson)))
-      .catch(() => {
-        dispatch(calendarNotRetrieved());
-      });
+      .catch(() => dispatch(calendarNotRetrieved()));
   };
 }

app/actions/events.js

@@ -25,7 +25,7 @@ export function loadEvent(id, token) {
         Authorization: `Token ${token}`,
       },
     };
-    return fetch(`${url}/api/events/data/?event_id=${id}`, data)
+    return fetch(`${url}/api/events/${id}/`, data)
       .then(
         response => response.json(),
       )

app/actions/login.js

@@ -45,7 +45,7 @@ function getUserInfo(token) {
     },
   };
 
-  return fetch(`${url}/api/members/info/`, data)
+  return fetch(`${url}/api/members/me/`, data)
     .then(
       response => response.json())
     .then(

app/components/Calendar.js

@@ -16,16 +16,12 @@ const Calendar = (props) => {
     );
   }
   const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
-  const events = [];
-  for (let i = 0; i < props.eventList.length; i += 1) {
-    events.push(<EventCard event={props.eventList[i]} />);
-  }
-  const dataSource = ds.cloneWithRows(events);
+  const dataSource = ds.cloneWithRows(props.eventList);
   return (
     <View>
       <ListView
         dataSource={dataSource}
-        renderRow={rowData => rowData}
+        renderRow={rowData => <EventCard event={rowData} />}
         enableEmptySections
       />
     </View>
@@ -34,12 +30,12 @@ const Calendar = (props) => {
 
 Calendar.propTypes = {
   eventList: React.PropTypes.arrayOf(React.PropTypes.shape({
+    pk: React.PropTypes.number,
     title: React.PropTypes.string,
     description: React.PropTypes.string,
     start: React.PropTypes.string,
     location: React.PropTypes.string,
     price: React.PropTypes.string,
-    id: React.PropTypes.number,
   })).isRequired,
   calendarFetched: React.PropTypes.bool.isRequired,
   retrieveCalendar: React.PropTypes.func.isRequired,

app/components/Event.js

@@ -2,11 +2,13 @@ import React from 'react';
 import { View, Text } from 'react-native';
 import { connect } from 'react-redux';
 
+import styles from './style/event';
+
 const Event = (props) => {
   if (props.success) {
     return (
       <View>
-        <Text><h1>{props.data.title}</h1></Text>
+        <Text style={styles.titleText}>{props.data.title}</Text>
         <Text>{props.data.description}</Text>
         <Text>Locatie: {props.data.location}</Text>
         <Text>Prijs: {props.data.price}</Text>

app/components/EventCard.js

@@ -3,15 +3,20 @@ import { View, Text, Button } from 'react-native';
 import { connect } from 'react-redux';
 import * as actions from '../actions/events';
 
-const EventCard = props =>
-  <View>
-    <Text> <b>{props.event.title}</b> </Text>
-    <Text> {new Date(props.event.start).toISOString().substring(0, 10)}</Text>
-    <i>{props.event.description}</i>
-    <Text>-----------------------------------------</Text>
-    <Button title="Openen" onPress={() => props.loadEvent(props.event.id, props.token)} />
-  </View>
-;
+import styles from './style/eventCard';
+
+const EventCard = (props) => {
+  const date = new Date(props.event.start).toISOString().substring(0, 10);
+  return (
+    <View>
+      <Text style={styles.boldText}>{props.event.title}</Text>
+      <Text>{date}</Text>
+      <Text style={styles.italicText}>{props.event.description}</Text>
+      <Text>-----------------------------------------</Text>
+      <Button title="Openen" onPress={() => props.loadEvent(props.event.pk, props.token)} />
+    </View>
+  );
+};
 
 EventCard.propTypes = {
   event: React.PropTypes.shape({
@@ -20,7 +25,7 @@ EventCard.propTypes = {
     start: React.PropTypes.string,
     location: React.PropTypes.string,
     price: React.PropTypes.string,
-    id: React.PropTypes.number,
+    pk: React.PropTypes.number,
   }).isRequired,
   loadEvent: React.PropTypes.func.isRequired,
   token: React.PropTypes.string.isRequired,
@@ -31,7 +36,7 @@ const mapStateToProps = state => ({
 });
 
 const mapDispatchToProps = dispatch => ({
-  loadEvent: (id, token) => dispatch(actions.loadEvent(id, token)),
+  loadEvent: (pk, token) => dispatch(actions.loadEvent(pk, token)),
 });
 
 export default connect(mapStateToProps, mapDispatchToProps)(EventCard);

app/components/style/event.js

+import { StyleSheet } from 'react-native';
+
+import { colors } from '../../style';
+
+const styles = StyleSheet.create({
+  titleText: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    color: colors.darkMagenta,
+  },
+});
+
+export default styles;

app/components/style/eventCard.js

+import { StyleSheet } from 'react-native';
+
+const styles = StyleSheet.create({
+  italicText: {
+    fontStyle: 'italic',
+  },
+  boldText: {
+    fontWeight: 'bold',
+  },
+});
+
+export default styles;