feat: basic structure for calendar

This commit is contained in:
Jakob Stornig 2023-12-20 22:55:19 +01:00
parent 37b38d33fc
commit 65c32a9298
5 changed files with 94 additions and 12 deletions

View file

@ -1,5 +1,6 @@
import React, { useRef, useState } from 'react';
import { NativeScrollEvent, NativeSyntheticEvent, StyleSheet, View } from 'react-native';
import { Calendar } from 'react-native-calendars';
import { FlatList } from 'react-native-gesture-handler';
import { SafeAreaView } from 'react-native-safe-area-context';
import { ExpenseItem, LoadingSymbol, Plus, SearchBar, Welcome } from '../../../components';
@ -8,14 +9,17 @@ import { useThemeColor } from "../../../hooks/useThemeColor";
import { addExpense } from "../../../services/database";
import { useAuth } from '../../contexts/AuthContext';
import { useRouter } from "expo-router";
import { SimpleDate } from '../../../util/SimpleDate';
import { useTheme } from '../../contexts/ThemeContext';
export default function Page() {
const { colors, theme } = useTheme()
//Styles
const styles = StyleSheet.create({
safeAreaViewStyle: {
flex: 1,
backgroundColor: useThemeColor("containerColor"),
flex: 1,
backgroundColor: colors.backgroundColor
},
container: {
flex: 1,
@ -23,7 +27,7 @@ export default function Page() {
justifyContent: "center",
},
text: {
color: useThemeColor("primaryText"),
color: colors.primaryText,
fontSize: 70,
fontWeight: "bold"
},
@ -33,7 +37,6 @@ export default function Page() {
});
const router = useRouter();
const {onLogout} = useAuth();
const [plusShow, setPlusShow] = useState(true);
const prevOffset = useRef(0);
@ -75,7 +78,17 @@ export default function Page() {
data={data}
ListHeaderComponent={
<>
<Welcome name="My Dude" image={profile} onPress={() => {router.push("/home/userSettings")}}></Welcome>
<Welcome name="My Dude" image={profile} onPress={() => {router.push("/home/userSettings")}}/>
<Calendar key={theme} maxDate={SimpleDate.now().format("YYYY-MM-DD")} style={{margin: 10, borderRadius: 20, padding:10}} theme={{
dayTextColor: colors.primaryText,
textDisabledColor: colors.secondaryText,
todayTextColor: colors.accentColor,
calendarBackground: colors.containerColor,
arrowColor: colors.accentColor,
monthTextColor: colors.accentColor
}}>
</Calendar>
<SearchBar placeholder='Type to Search...'></SearchBar>
</>
}

View file

@ -5,7 +5,7 @@ import { SIZES } from '../../../constants/theme'
import { SafeAreaView } from 'react-native-safe-area-context'
import { ButtonSetting, ToggleSetting } from '../../../components'
import { useTheme } from '../../contexts/ThemeContext'
import { deleteExpenses } from '../../../services/database'
import { deleteExpenses, DEV_populateDatabase } from '../../../services/database'
import { useAuth } from '../../contexts/AuthContext'
import { TouchableOpacity } from 'react-native-gesture-handler'
@ -61,6 +61,12 @@ export default function userSettings() {
console.log("Expenses Deleted!");
})}}
/>
<ButtonSetting settingsTitle='Populate Database' onPress={() => {
const del = async () => {
await DEV_populateDatabase()
}
del()
}}/>
</View>
</View>