import React from 'react';
import PropTypes from 'prop-types';

import { StyleSheet, Text, View } from 'react-native';

const STRINGS = {
    FILTER: 'Filter',
    VIEW: 'View',
};

const FilterBar = ({ changeFilterer, changeViewMode, filterMode, viewMode }) => (
    <View style={styles.filterBar}>
        <Text style={styles.filter}>{STRINGS.FILTER}</Text>
        <Text style={styles.view}>{STRINGS.VIEW}</Text>
    </View>
);

FilterBar.propTypes = {
    changeFilterer: PropTypes.func.isRequired,
    changeViewMode: PropTypes.func.isRequired,
    filterMode: PropTypes.string,
    viewMode: PropTypes.string,
};

FilterBar.defaultProps = {
    filterMode: null,
    viewMode: null,
};

const styles = StyleSheet.create({
    filterBar: {
        backgroundColor: '#0F0',
        flexDirection: 'row',
    },
    filter: {
        flex: 2,
    },
    view: {
        flex: 2,
    },
});

export default FilterBar;
