Verified Commit 2026fc9d authored by Sébastiaan Versteeg's avatar Sébastiaan Versteeg
Browse files

Move all navigation to navigation saga

parent 194500ef
export const OPEN = 'CALENDAR_OPEN';
export const REFRESH = 'CALENDAR_REFRESH';
export const SUCCESS = 'CALENDAR_SUCCESS';
export const FAILURE = 'CALENDAR_FAILURE';
export const FETCHING = 'CALENDAR_FETCHING';
export function open() {
return {
type: OPEN,
};
}
export function refresh() {
return {
type: REFRESH,
......
......@@ -5,7 +5,7 @@ export const FAILURE = 'MEMBERS_FAILURE';
export const MORE = 'MEMBERS_MORE';
export const MORE_SUCCESS = 'MEMBERS_MORE_SUCCESS';
export function members(keywords) {
export function members(keywords = null) {
return {
type: MEMBERS,
payload: { keywords },
......
export const NAVIGATE = 'NAVIGATE_NAVIGATE';
export const BACK = 'NAVIGATE_BACK';
export const OPENDRAWER = 'NAVIGATE_OPENDRAWER';
export const TOGGLE_DRAWER = 'NAVIGATE_TOGGLE_DRAWER';
export function navigate(scene, newSection = false) {
return {
type: NAVIGATE,
payload: { scene, newSection },
};
}
export function back() {
export function goBack() {
return {
type: BACK,
};
}
export function updateDrawer(drawerState) {
export function toggleDrawer() {
return {
type: OPENDRAWER, payload: { drawerOpen: drawerState },
type: TOGGLE_DRAWER,
};
}
// Actions are grouped based on the settings sections
export const settingsActions = {
OPEN: 'SETTINGS_OPEN',
INIT_START: 'SETTINGS_INIT_START',
INIT_COMPLETE: 'SETTINGS_INIT_COMPLETE',
open: () => ({
type: settingsActions.OPEN,
}),
initStart: () => ({
type: settingsActions.INIT_START,
}),
......
export const OPEN = 'WELCOME_OPEN';
export const REFRESH = 'WELCOME_REFRESH';
export const SUCCESS = 'WELCOME_SUCCESS';
export const FAILURE = 'WELCOME_FAILURE';
export function open() {
return {
type: OPEN,
};
}
export function refresh() {
return {
type: REFRESH,
......
......@@ -3,6 +3,7 @@ import {
createStackNavigator,
createSwitchNavigator,
NavigationActions,
DrawerActions,
} from 'react-navigation';
import Login from './ui/screens/user/Login';
......@@ -63,9 +64,16 @@ function goBack() {
);
}
function toggleDrawer() {
navigator.dispatch(
DrawerActions.toggleDrawer(),
);
}
export default {
AppNavigator,
navigate,
goBack,
toggleDrawer,
setTopLevelNavigator,
};
......@@ -7,7 +7,7 @@ const initialState = {
};
export default function navigate(state = initialState, action = {}) {
export default function reducer(state = initialState, action = {}) {
switch (action.type) {
case registrationActions.SHOW_FIELDS: {
return {
......
import { all, fork } from 'redux-saga/effects';
import sessionSaga from './session';
import routerSaga from './router';
import navigationSaga from './navigation';
import eventSaga from './event';
import profileSaga from './profile';
import welcomeSaga from './welcome';
......@@ -16,7 +16,7 @@ import settingsSaga from './settings';
const sagas = function* sagas() {
yield all([
fork(sessionSaga),
fork(routerSaga),
fork(navigationSaga),
fork(eventSaga),
fork(profileSaga),
fork(welcomeSaga),
......
import { takeEvery, call } from 'redux-saga/effects';
import * as navigationActions from '../actions/navigation';
import * as eventActions from '../actions/event';
import * as profileActions from '../actions/profile';
import * as pizzaActions from '../actions/pizza';
import * as registrationActions from '../actions/registration';
import * as sessionActions from '../actions/session';
import * as calendarActions from '../actions/calendar';
import * as membersActions from '../actions/members';
import * as welcomeActions from '../actions/welcome';
import { settingsActions } from '../actions/settings';
import NavigationService from '../navigation';
function* event() {
yield call(NavigationService.navigate, 'Event');
}
function* profile() {
yield call(NavigationService.navigate, 'Profile');
}
function* registration() {
yield call(NavigationService.navigate, 'Registration');
}
function* pizza() {
yield call(NavigationService.navigate, 'Pizza');
}
function* signedIn() {
yield call(NavigationService.navigate, 'SignedIn');
}
function* auth() {
yield call(NavigationService.navigate, 'Auth');
function* navigate(routeName) {
yield call(NavigationService.navigate, routeName);
}
function* back() {
yield call(NavigationService.goBack);
}
function* toggleDrawer() {
yield call(NavigationService.toggleDrawer);
}
const routerSaga = function* eventSaga() {
yield takeEvery(eventActions.EVENT, event);
yield takeEvery(profileActions.PROFILE, profile);
yield takeEvery(registrationActions.FIELDS, registration);
yield takeEvery(navigationActions.BACK, back);
yield takeEvery(navigationActions.TOGGLE_DRAWER, toggleDrawer);
yield takeEvery(welcomeActions.OPEN, navigate, 'Welcome');
yield takeEvery(settingsActions.OPEN, navigate, 'Settings');
yield takeEvery(calendarActions.OPEN, navigate, 'Calendar');
yield takeEvery(membersActions.MEMBERS, navigate, 'MemberList');
yield takeEvery(eventActions.EVENT, navigate, 'Event');
yield takeEvery(profileActions.PROFILE, navigate, 'Profile');
yield takeEvery(registrationActions.FIELDS, navigate, 'Registration');
yield takeEvery(registrationActions.SUCCESS, back);
yield takeEvery(pizzaActions.PIZZA, pizza);
yield takeEvery(sessionActions.SIGNED_IN, signedIn);
yield takeEvery([sessionActions.TOKEN_INVALID, sessionActions.SIGN_OUT], auth);
yield takeEvery(pizzaActions.PIZZA, navigate, 'Pizza');
yield takeEvery(sessionActions.SIGNED_IN, navigate, 'SignedIn');
yield takeEvery([sessionActions.TOKEN_INVALID, sessionActions.SIGN_OUT], navigate, 'Auth');
};
export default routerSaga;
......@@ -9,8 +9,12 @@ import { translate } from 'react-i18next';
import Icon from 'react-native-vector-icons/MaterialIcons';
import styles from './style/Sidebar';
import * as loginActions from '../../../actions/session';
import Colors from '../../style/Colors';
import * as profileActions from '../../../actions/profile';
import * as calendarActions from '../../../actions/calendar';
import * as membersActions from '../../../actions/members';
import * as welcomeActions from '../../../actions/welcome';
import { settingsActions } from '../../../actions/settings';
import Colors from '../../style/Colors';
const background = require('../../../assets/img/huygens.jpg');
......@@ -25,28 +29,28 @@ const logoutPrompt = props => () => Alert.alert(
const Sidebar = (props) => {
const buttons = [
{
onPress: () => props.navigation.navigate('Welcome'),
onPress: () => props.openWelcome(),
iconName: 'home',
text: props.t('Welcome'),
style: {},
routeName: 'Welcome',
},
{
onPress: () => props.navigation.navigate('Calendar'),
onPress: () => props.openCalendar(),
iconName: 'event',
text: props.t('Calendar'),
style: {},
routeName: 'Calendar',
},
{
onPress: () => props.navigation.navigate('MemberList'),
onPress: () => props.openMemberList(),
iconName: 'people',
text: props.t('Member List'),
style: {},
routeName: 'MemberList',
},
{
onPress: () => props.navigation.navigate('Settings'),
onPress: () => props.openSettings(),
iconName: 'settings',
text: props.t('Settings'),
style: {},
......@@ -116,7 +120,10 @@ Sidebar.propTypes = {
photo: PropTypes.string.isRequired,
loadProfile: PropTypes.func.isRequired,
t: PropTypes.func.isRequired,
navigation: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
openCalendar: PropTypes.func.isRequired,
openWelcome: PropTypes.func.isRequired,
openSettings: PropTypes.func.isRequired,
openMemberList: PropTypes.func.isRequired,
};
const mapStateToProps = state => ({
......@@ -126,6 +133,10 @@ const mapStateToProps = state => ({
const mapDispatchToProps = dispatch => ({
loadProfile: () => dispatch(profileActions.profile()),
openCalendar: () => dispatch(calendarActions.open()),
openMemberList: () => dispatch(membersActions.members()),
openWelcome: () => dispatch(welcomeActions.open()),
openSettings: () => dispatch(settingsActions.open()),
signOut: () => dispatch(loginActions.signOut()),
});
......
......@@ -11,12 +11,13 @@ import {
View,
} from 'react-native';
import PropTypes from 'prop-types';
import { withNavigation } from 'react-navigation';
import { connect } from 'react-redux';
import Icon from 'react-native-vector-icons/MaterialIcons';
import styles from './style/SearchHeader';
import Colors from '../../style/Colors';
import * as navigationActions from '../../../actions/navigation';
class SearchBar extends Component {
constructor(props) {
......@@ -40,11 +41,11 @@ class SearchBar extends Component {
}
getLeftIcon = () => {
const { navigation } = this.props;
const { toggleDrawer } = this.props;
const { isSearching } = this.state;
return (
<TouchableOpacity
onPress={() => (isSearching ? this.updateSearch(false) : navigation.openDrawer())}
onPress={() => (isSearching ? this.updateSearch(false) : toggleDrawer())}
>
<Icon
name={isSearching ? 'arrow-back' : 'menu'}
......@@ -178,7 +179,11 @@ SearchBar.propTypes = {
searchText: PropTypes.string.isRequired,
search: PropTypes.func.isRequired,
searchKey: PropTypes.string.isRequired,
navigation: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
toggleDrawer: PropTypes.func.isRequired,
};
export default withNavigation(SearchBar);
const mapDispatchToProps = dispatch => ({
toggleDrawer: () => dispatch(navigationActions.toggleDrawer()),
});
export default connect(() => ({}), mapDispatchToProps)(SearchBar);
......@@ -21,6 +21,8 @@ import StandardHeader from '../../components/standardHeader/StandardHeader';
import LoadingScreen from '../../components/loadingScreen/LoadingScreen';
import ErrorScreen from '../../components/errorScreen/ErrorScreen';
import * as navigationActions from '../../../actions/navigation';
import Colors from '../../style/Colors';
import { STATUSBAR_HEIGHT } from '../../components/standardHeader/style/StandardHeader';
......@@ -228,7 +230,7 @@ class Profile extends Component {
</Animated.View>
<Animated.View style={[styles.appBar, appBarBorderStyle]}>
<TouchableOpacity
onPress={this.props.navigation.goBack}
onPress={this.props.goBack}
>
<Icon
name="arrow-back"
......@@ -319,7 +321,7 @@ Profile.propTypes = {
success: PropTypes.bool.isRequired,
hasLoaded: PropTypes.bool.isRequired,
t: PropTypes.func.isRequired,
navigation: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
goBack: PropTypes.func.isRequired,
};
const mapStateToProps = state => ({
......@@ -328,4 +330,8 @@ const mapStateToProps = state => ({
hasLoaded: state.profile.hasLoaded,
});
export default connect(mapStateToProps, () => ({}))(translate('screens/user/Profile')(Profile));
const mapDispatchToProps = dispatch => ({
goBack: () => dispatch(navigationActions.goBack()),
});
export default connect(mapStateToProps, mapDispatchToProps)(translate('screens/user/Profile')(Profile));
......@@ -11,7 +11,6 @@ import {
import { connect } from 'react-redux';
import { translate } from 'react-i18next';
import Moment from 'moment';
import { withNavigation } from 'react-navigation';
import EventDetailCard from './EventDetailCard';
import LoadingScreen from '../../components/loadingScreen/LoadingScreen';
import ErrorScreen from '../../components/errorScreen/ErrorScreen';
......@@ -19,6 +18,7 @@ import ErrorScreen from '../../components/errorScreen/ErrorScreen';
import * as welcomeActions from '../../../actions/welcome';
import styles from './style/Welcome';
import { withStandardHeader } from '../../components/standardHeader/StandardHeader';
import * as calendarActions from '../../../actions/calendar';
const eventListToSections = (eventList, t) => {
const calendarFormat = {
......@@ -53,7 +53,7 @@ const eventListToSections = (eventList, t) => {
const Footer = props => (
<TouchableOpacity
onPress={() => props.navigation.navigate('Calendar')}
onPress={props.openCalendar}
style={styles.footer}
>
<Text style={styles.footerText}>
......@@ -63,11 +63,15 @@ const Footer = props => (
);
Footer.propTypes = {
navigation: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
openCalendar: PropTypes.func.isRequired,
t: PropTypes.func.isRequired,
};
const FooterComponent = withNavigation(translate('screens/welcome/Welcome')(Footer));
const mapDispatchToFooterProps = dispatch => ({
openCalendar: () => dispatch(calendarActions.open()),
});
const FooterComponent = connect(() => ({}), mapDispatchToFooterProps)(translate('screens/welcome/Welcome')(Footer));
class Welcome extends Component {
handleRefresh = () => {
......
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