import React from 'react';
import {
    Text,
    Button,
    Navigator,
} from 'react-native';

const { NavigationBar } = Navigator;

const createLeftButton = ({ goToLink }) => (route, navigator, index, navState) => {
    return (
        <Button
            title="vše"
            onPress={() => goToLink('list')}
        />
    );
};

const createRightButton = ({ goToLink }) => (route, navigator, index, navState) => {
    return (
        <Button
            title="nový"
            onPress={() => goToLink('new')}
        />
    );
};

const createTitle = () => (route, navigator, index, navState) => {
    return (
        <Text>{route.props.title}</Text>
    );
};

export default function NavBar({ navigator, navState, link }) {
    const goToLink = link(navigator);

    return (
        <NavigationBar
            navigator={navigator}
            navState={navState}
            routeMapper={{
                LeftButton: createLeftButton({ goToLink }),
                RightButton: createRightButton({ goToLink }),
                Title: createTitle(),
            }}
        />
    );
}