Refactored to remove local state/react warning

app/actions/welcome.js

-export const WELCOME = 'WELCOME_WELCOME';
+export const REFRESH = 'WELCOME_REFRESH';
 export const SUCCESS = 'WELCOME_SUCCESS';
 export const FAILURE = 'WELCOME_FAILURE';
 
-export function welcome(amount, token) {
+export function refresh() {
   return {
-    type: WELCOME,
-    payload: { amount, token },
+    type: REFRESH,
   };
 }
 

app/components/Welcome.js

@@ -5,7 +5,6 @@ import { connect } from 'react-redux';
 import Moment from 'moment';
 import 'moment/locale/nl';
 import EventDetailCard from './EventDetailCard';
-import LoadingScreen from './LoadingScreen';
 
 import * as welcomeActions from '../actions/welcome';
 import { navigate } from '../actions/navigation';
@@ -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(welcomeActions.welcome(amount, token)),
+  refresh: () => dispatch(welcomeActions.refresh()),
 });
 
 export default connect(mapStateToProps, mapDispatchToProps)(Welcome);

app/reducers/welcome.js

@@ -2,7 +2,7 @@ import * as welcomeActions from '../actions/welcome';
 
 const initialState = {
   eventList: [],
-  hasLoaded: false,
+  loading: true,
 };
 
 export default function welcome(state = initialState, action = {}) {
@@ -10,8 +10,12 @@ export default function welcome(state = initialState, action = {}) {
     case welcomeActions.SUCCESS:
       return {
         eventList: action.payload.eventList,
-        hasLoaded: true,
+        loading: false,
       };
+    case welcomeActions.FAILURE:
+      return { ...state, loading: false };
+    case welcomeActions.REFRESH:
+      return { ...state, loading: true };
     default:
       return state;
   }

app/sagas/welcome.js

-import { call, put, takeEvery } from 'redux-saga/effects';
+import { call, put, select, takeEvery } from 'redux-saga/effects';
 
-import { apiRequest } from '../url';
+import { apiRequest, tokenSelector } from '../url';
 import * as welcomeActions from '../actions/welcome';
+import * as loginActions from '../actions/login';
 
-const welcome = function* welcome(action) {
-  const { token, amount } = action.payload;
-
+const welcome = function* welcome() {
+  const token = yield select(tokenSelector);
   const data = {
     method: 'GET',
     headers: {
@@ -16,7 +16,7 @@ const welcome = function* welcome(action) {
   };
 
   const params = {
-    limit: amount,
+    limit: 5,
     ordering: 'start',
   };
 
@@ -29,7 +29,7 @@ const welcome = function* welcome(action) {
 };
 
 const welcomeSaga = function* eventSaga() {
-  yield takeEvery(welcomeActions.WELCOME, welcome);
+  yield takeEvery([loginActions.SUCCESS, welcomeActions.REFRESH], welcome);
 };
 
 export default welcomeSaga;

app/url.js

@@ -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 = '';