feat: Add expense screen
This commit is contained in:
parent
e1efed5b21
commit
36679279c1
18 changed files with 459 additions and 57 deletions
38
components/home/addItem/DateSelectorButton.tsx
Normal file
38
components/home/addItem/DateSelectorButton.tsx
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
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
|
||||
Reference in a new issue