BudgetIzr/components/title_bar/title_bar_button.js

import React from 'react';
import { StyleSheet, Text, Pressable, View, TextInput, Button } from 'react-native';


export default function TitleBarButton(props){

    return(
        <Pressable 
        style={[styles.button, (props.currentDurationMode == props.durationMode ? styles.highlighted : null)]} 
        onPress={() => {
            props.onChangeDuration(props.durationMode)
            props.onDurationEdit(null);
            }}>
        <Text>{props.durationMode}</Text>
        </Pressable>
    )
}


const styles = StyleSheet.create({
    button: {
      padding: 1,
      margin:1,
      borderWidth: 1,
    },
    input: {
        borderWidth: 0.5
    },
    highlighted: {
        backgroundColor: "#ECECEC",
        borderWidth: 1.5,
    }
  });