Implementation of fetching, adding and updating todos to db

This commit is contained in:
Dejan
2024-10-13 13:34:31 +02:00
parent f4be82587c
commit 515b5738bb
8 changed files with 205 additions and 120 deletions

View File

@ -1,5 +1,5 @@
import { View, Text, Button, Switch } from "react-native-ui-lib";
import React, { useEffect, useState } from "react";
import React, { useState } from "react";
import PointsSlider from "@/components/shared/PointsSlider";
import { repeatOptions, useToDosContext } from "@/contexts/ToDosContext";
import { Feather, AntDesign, Ionicons } from "@expo/vector-icons";
@ -27,7 +27,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
const [rotate, setRotate] = useState<boolean>(false);
const [repeatType, setRepeatType] = useState<string>("Every week");
const handleCLose = () => {
const handleClose = () => {
setNewTitle("");
setPoints(10);
setChoreDate(new Date());
@ -50,7 +50,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
bottom={true}
height={"90%"}
panDirection={PanningDirectionsEnum.DOWN}
onDismiss={() => handleCLose}
onDismiss={() => handleClose}
containerStyle={{
borderRadius: 10,
backgroundColor: "white",
@ -68,13 +68,13 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
style={styles.topBtn}
label="Cancel"
onPress={() => {
handleCLose();
handleClose();
}}
/>
<View marginT-12>
<DropModalIcon
onPress={() => {
handleCLose()
handleClose()
}}
/>
</View>
@ -85,7 +85,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
onPress={() => {
try {
addToDo({
id: 0,
id: "",
title: newTitle,
done: false,
date: choreDate,
@ -93,8 +93,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
rotate: rotate,
repeatType: repeatType,
});
handleCLose();
console.log(toDos);
handleClose();
} catch (error) {
console.error(error);
}

View File

@ -10,9 +10,10 @@ import {
ButtonSize,
} from "react-native-ui-lib";
import React, { useEffect, useState } from "react";
import { IToDo, useToDosContext } from "@/contexts/ToDosContext";
import { useToDosContext } from "@/contexts/ToDosContext";
import { Ionicons } from "@expo/vector-icons";
import PointsSlider from "@/components/shared/PointsSlider";
import {IToDo} from "@/hooks/firebase/types/todoData";
const ToDoItem = (props: { item: IToDo; isSettings?: boolean }) => {
const { updateToDo } = useToDosContext();
@ -61,7 +62,7 @@ const ToDoItem = (props: { item: IToDo; isSettings?: boolean }) => {
value={props.item.title}
text70R
onChangeText={(text) => {
updateToDo(props.item.id, { title: text });
updateToDo({id: props.item.id, title: text });
}}
onSubmitEditing={() => {
setEditing(false);
@ -74,7 +75,7 @@ const ToDoItem = (props: { item: IToDo; isSettings?: boolean }) => {
<Checkbox
value={props.item.done}
onValueChange={(value) => {
updateToDo(props.item.id, { done: !props.item.done });
updateToDo({id: props.item.id, done: !props.item.done });
}}
/>
</View>
@ -151,7 +152,7 @@ const ToDoItem = (props: { item: IToDo; isSettings?: boolean }) => {
backgroundColor="#fd1775"
style={{height: 60, width: 150}}
onPress={() => {
updateToDo(props.item.id, { points: points });
updateToDo({id: props.item.id, points: points });
setPointsModalVisible(false);
}}
/>

View File

@ -1,10 +1,10 @@
import { View, Text, TouchableOpacity, Icon } from "react-native-ui-lib";
import React, { useState } from "react";
import { IToDo, useToDosContext } from "@/contexts/ToDosContext";
import { useToDosContext } from "@/contexts/ToDosContext";
import ToDoItem from "./ToDoItem";
import { format, isToday, isTomorrow } from "date-fns";
import DropModalIcon from "@/assets/svgs/DropModalIcon";
import { AntDesign } from "@expo/vector-icons";
import {IToDo} from "@/hooks/firebase/types/todoData";
const groupToDosByDate = (toDos: IToDo[]) => {
return toDos.reduce((groups, toDo) => {