38 lines
No EOL
1.3 KiB
TypeScript
38 lines
No EOL
1.3 KiB
TypeScript
import { View, Text, StyleSheet, TouchableOpacity, TouchableOpacityProps } from 'react-native'
|
|
import React, { useState } from 'react'
|
|
import { useTheme } from '../../../app/contexts/ThemeContext';
|
|
import { SIZES } from '../../../constants/theme';
|
|
import { SimpleDate } from '../../../util/SimpleDate';
|
|
import { ViewProps } from 'react-native/Libraries/Components/View/ViewPropTypes';
|
|
|
|
interface DateSelectorProps extends ViewProps {
|
|
onPress?: ()=>void | undefined;
|
|
selectedDate: Date
|
|
}
|
|
|
|
const DateSelectorButton:React.FC<DateSelectorProps> = (props: DateSelectorProps) => {
|
|
const {onPress, selectedDate, ...restProps} = props;
|
|
const {colors} = useTheme();
|
|
|
|
return (
|
|
<TouchableOpacity onPress={onPress} {...restProps} style={[styles.inputContainer, {backgroundColor: colors.elementDefaultColor}]}>
|
|
<Text style={[styles.text, {color: colors.primaryText}]}>Date:</Text>
|
|
<Text style={[styles.text, {color: colors.primaryText}]}>{new SimpleDate(selectedDate).format("DD.MM.YYYY")}</Text>
|
|
</TouchableOpacity>
|
|
)
|
|
}
|
|
const styles = StyleSheet.create({
|
|
inputContainer: {
|
|
minHeight: 50,
|
|
borderRadius: 20,
|
|
flexDirection: "row",
|
|
justifyContent: 'space-between',
|
|
alignItems: "center"
|
|
},
|
|
text:{
|
|
fontSize: SIZES.large,
|
|
marginHorizontal: 15,
|
|
},
|
|
})
|
|
|
|
export default DateSelectorButton |