Commit 96d528eb authored by Wietse Kuipers's avatar Wietse Kuipers
Browse files

Merge branch 'welcome-saga-refactor' into 'master'

Refactor welcome actions to use saga

See merge request !65
parents 03b68717 cede2b16
import { apiUrl } from '../url';
import * as types from './actionTypes';
export const REFRESH = 'WELCOME_REFRESH';
export const SUCCESS = 'WELCOME_SUCCESS';
export const FAILURE = 'WELCOME_FAILURE';
export function welcome(eventList) {
export function refresh() {
return {
type: types.WELCOME,
eventList,
type: REFRESH,
};
}
export function retrieveShortlist(token, amount) {
return (dispatch) => {
const data = {
method: 'GET',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
Authorization: `Token ${token}`,
},
};
return fetch(`${apiUrl}/events/?limit=${amount}&ordering=start`, data)
.then(
response => response.json(),
)
.then(
responseJson => dispatch(welcome(responseJson.results)),
)
.catch(
() => dispatch(welcome([])),
);
export function success(eventList) {
return {
type: SUCCESS,
payload: { eventList },
};
}
export function failure() {
return { type: FAILURE };
}
......@@ -5,9 +5,8 @@ import { connect } from 'react-redux';
import Moment from 'moment';
import 'moment/locale/nl';
import EventDetailCard from './EventDetailCard';
import LoadingScreen from './LoadingScreen';
import { retrieveShortlist } from '../actions/welcome';
import * as welcomeActions from '../actions/welcome';
import { navigate } from '../actions/navigation';
import styles from './style/welcome';
......@@ -63,24 +62,12 @@ const mapDispatchToPropsFooter = dispatch => ({
const FooterComponent = connect(() => ({}), mapDispatchToPropsFooter)(Footer);
class Welcome extends Component {
constructor(props) {
super(props);
this.state = {
refreshing: false,
};
}
handleRefresh = () => {
this.setState({ refreshing: true });
this.props.retrieveShortlist(this.props.token, 5)
.then(() => this.setState({ refreshing: false }));
this.props.refresh();
};
render() {
if (!this.props.hasLoaded) {
this.props.retrieveShortlist(this.props.token, 5);
return <LoadingScreen />;
} else if (this.props.eventList.length === 0) {
if (this.props.eventList.length === 0) {
return (
<View>
<Text>
......@@ -101,7 +88,7 @@ class Welcome extends Component {
keyExtractor={event => event.pk}
stickySectionHeadersEnabled
onRefresh={this.handleRefresh}
refreshing={this.state.refreshing}
refreshing={this.props.loading}
ListFooterComponent={FooterComponent}
/>
</View>
......@@ -121,19 +108,17 @@ Welcome.propTypes = {
registered: PropTypes.bool,
pizza: PropTypes.bool,
})).isRequired,
token: PropTypes.string.isRequired,
hasLoaded: PropTypes.bool.isRequired,
retrieveShortlist: PropTypes.func.isRequired,
refresh: PropTypes.func.isRequired,
loading: PropTypes.bool.isRequired,
};
const mapStateToProps = state => ({
eventList: state.welcome.eventList,
token: state.session.token,
hasLoaded: state.welcome.hasLoaded,
loading: state.welcome.loading,
});
const mapDispatchToProps = dispatch => ({
retrieveShortlist: (token, amount) => dispatch(retrieveShortlist(token, amount)),
refresh: () => dispatch(welcomeActions.refresh()),
});
export default connect(mapStateToProps, mapDispatchToProps)(Welcome);
import * as types from '../actions/actionTypes';
import * as welcomeActions from '../actions/welcome';
const initialState = {
eventList: [],
hasLoaded: false,
loading: true,
};
export default function welcome(state = initialState, action = {}) {
switch (action.type) {
case types.WELCOME:
case welcomeActions.SUCCESS:
return {
eventList: action.eventList,
hasLoaded: true,
eventList: action.payload.eventList,
loading: false,
};
case welcomeActions.FAILURE:
return { ...state, loading: false };
case welcomeActions.REFRESH:
return { ...state, loading: true };
default:
return state;
}
......
......@@ -3,12 +3,14 @@ import { all, fork } from 'redux-saga/effects';
import loginSaga from './login';
import eventSaga from './event';
import profileSaga from './profile';
import welcomeSaga from './welcome';
const sagas = function* sagas() {
yield all([
fork(loginSaga),
fork(eventSaga),
fork(profileSaga),
fork(welcomeSaga),
]);
};
......
import { call, put, select, takeEvery } from 'redux-saga/effects';
import { apiRequest, tokenSelector } from '../url';
import * as welcomeActions from '../actions/welcome';
import * as loginActions from '../actions/login';
const welcome = function* welcome() {
const token = yield select(tokenSelector);
const data = {
method: 'GET',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
Authorization: `Token ${token}`,
},
};
const params = {
limit: 5,
ordering: 'start',
};
try {
const response = yield call(apiRequest, 'events', data, params);
yield put(welcomeActions.success(response));
} catch (error) {
yield put(welcomeActions.failure());
}
};
const welcomeSaga = function* eventSaga() {
yield takeEvery([loginActions.SUCCESS, welcomeActions.REFRESH], welcome);
};
export default welcomeSaga;
......@@ -6,6 +6,7 @@ if (__DEV__) { // eslint-disable-line no-undef
export const url = server;
export const apiUrl = `${server}/api/v1`;
export const pizzaUrl = 'https://pizza.thalia.nu';
export const tokenSelector = state => state.session.token;
export const apiRequest = (route, fetchOpts, params) => {
let query = '';
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment