aretherecookies-mobile/js/pages/DrawerMenu.js

// @flow
import React, { Component } from 'react';
import { Drawer, Avatar } from 'react-native-material-ui';
import routes from '../routes';

type Props = {
    navigator: Object,
    route: Object,
};

export default class DrawerMenu extends Component {
    static displayName = 'DrawerMenu';

    props: Props;

    chooseItem = routeKey => () => {
        if (routeKey === 'logout') {
            navigator.immediatelyResetRouteStack();
        }

        const { navigator } = this.props;
        const newRoute = routes[routeKey];
        navigator.replace(newRoute);
    };

    render() {
        return (
            <Drawer>
                <Drawer.Header>
                    <Drawer.Header.Account
                        avatar={<Avatar icon="person" />}
                        footer={{
                            dense: true,
                            centerElement: { primaryText: 'User Name' },
                        }}
                    />
                </Drawer.Header>
                <Drawer.Section
                    divider
                    items={[
                        { icon: routes.food.icon, value: routes.food.title, onPress: this.chooseItem('food') },
                        { icon: routes.places.icon, value: routes.places.title, onPress: this.chooseItem('places') },
                        { icon: routes.faves.icon, value: routes.faves.title, onPress: this.chooseItem('faves') },
                        { icon: 'exit-to-app', value: 'Logout', onPress: this.chooseItem('logout') },
                    ]}
                />
            </Drawer>
        );
    }
}