ammar/cally
1
0
Fork 0
mirror of https://github.com/urosran/cally.git synced 2025-11-26 16:34:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add event deletion

Browse Source
This commit is contained in:
Milan Paunovic
2024-10-31 12:01:01 +01:00
parent fff113de65
commit 1b6a241bbe
2 changed files with 670 additions and 615 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
components/pages/calendar/ManuallyAddEventModal.tsx
View File

@ -30,15 +30,11 @@ import MenuIcon from "@/assets/svgs/MenuIcon";
import CameraIcon from "@/assets/svgs/CameraIcon";
import AssigneesDisplay from "@/components/shared/AssigneesDisplay";
import {useAtom} from "jotai";
import {
eventForEditAtom,
selectedNewEventDateAtom,
} from "@/components/pages/calendar/atoms";
import {eventForEditAtom, selectedNewEventDateAtom,} from "@/components/pages/calendar/atoms";
import {useGetFamilyMembers} from "@/hooks/firebase/useGetFamilyMembers";
import BinIcon from "@/assets/svgs/BinIcon";
import CloseXIcon from "@/assets/svgs/CloseXIcon";
import PenIcon from "@/assets/svgs/PenIcon";
import DeleteEventDialog from "./DeleteEventDialog";
import {useDeleteEvent} from "@/hooks/firebase/useDeleteEvent";
const daysOfWeek = [
{label: "Monday", value: "monday"},
@ -58,20 +54,12 @@ export const ManuallyAddEventModal = () => {
);
const [editEvent, setEditEvent] = useAtom(eventForEditAtom);
const [deleteModalVisible, setDeleteModalVisible] = useState<boolean>(false);
const showDeleteEventModal = () => {
setDeleteModalVisible(true);
};
const handleDeleteEvent = () => {};
const hideDeleteEventModal = () => {
setDeleteModalVisible(false);
};
const {mutateAsync: deleteEvent, isLoading: isDeleting} = useDeleteEvent()
const {show, close, initialDate} = {
show: !!selectedNewEventDate || !!editEvent,
close: () => {
setDeleteModalVisible(false);
setSelectedNewEndDate(undefined);
setEditEvent(undefined);
},
@ -113,9 +101,11 @@ export const ManuallyAddEventModal = () => {
);
const [repeatInterval, setRepeatInterval] = useState<PickerMultiValue>([]);
const { mutateAsync: createEvent, isLoading, isError } = useCreateEvent();
const {mutateAsync: createEvent, isLoading: isAdding, isError} = useCreateEvent();
const {data: members} = useGetFamilyMembers(true);
const isLoading = isDeleting || isAdding
useEffect(() => {
setTitle(editEvent?.title || "");
setDetails(editEvent?.notes || "");
@ -156,6 +146,19 @@ export const ManuallyAddEventModal = () => {
});
};
const showDeleteEventModal = () => {
setDeleteModalVisible(true);
};
const handleDeleteEvent = async () => {
await deleteEvent({eventId: `${editEvent?.id}`})
close()
};
const hideDeleteEventModal = () => {
setDeleteModalVisible(false);
};
const combineDateAndTime = (date: Date, time: Date): Date => {
const combined = new Date(date);
combined.setHours(time.getHours());
@ -234,7 +237,7 @@ export const ManuallyAddEventModal = () => {
onRequestClose={close}
transparent={false}
>
<LoaderScreen message={"Saving event..."} color={Colors.grey40} />
<LoaderScreen message={isDeleting ? "Deleting event..." : "Saving event..."} color={Colors.grey40}/>
</Modal>
);
}
@ -256,39 +259,39 @@ export const ManuallyAddEventModal = () => {
paddingRight: insets.right, // Safe area inset for right
}}
>
{editEvent ? (
<>
<View center paddingT-8>
<TouchableOpacity onPress={close}>
<DropModalIcon />
</TouchableOpacity>
</View>
<View row spread paddingH-10 paddingB-15>
<Button
color="#05a8b6"
style={styles.topBtn}
iconSource={() => <CloseXIcon />}
onPress={close}
/>
<View row>
<Button
style={styles.topBtn}
marginR-10
iconSource={() => <PenIcon />}
onPress={handleSave}
/>
<Button
style={styles.topBtn}
marginL-5
iconSource={() => <BinIcon />}
onPress={() => {
showDeleteEventModal();
}}
/>
</View>
</View>
</>
) : (
{/*{editEvent ? (*/}
{/* <>*/}
{/* <View center paddingT-8>*/}
{/* <TouchableOpacity onPress={close}>*/}
{/* <DropModalIcon />*/}
{/* </TouchableOpacity>*/}
{/* </View>*/}
{/* <View row spread paddingH-10 paddingB-15>*/}
{/* <Button*/}
{/* color="#05a8b6"*/}
{/* style={styles.topBtn}*/}
{/* iconSource={() => <CloseXIcon />}*/}
{/* onPress={close}*/}
{/* />*/}
{/* <View row>*/}
{/* <Button*/}
{/* style={styles.topBtn}*/}
{/* marginR-10*/}
{/* iconSource={() => <PenIcon />}*/}
{/* onPress={handleSave}*/}
{/* />*/}
{/* <Button*/}
{/* style={styles.topBtn}*/}
{/* marginL-5*/}
{/* iconSource={() => <BinIcon />}*/}
{/* onPress={() => {*/}
{/* showDeleteEventModal();*/}
{/* }}*/}
{/* />*/}
{/* </View>*/}
{/* </View>*/}
{/* </>*/}
{/*) : (*/}
<View
style={{
flexDirection: "row",
@ -308,7 +311,10 @@ export const ManuallyAddEventModal = () => {
Cancel
</Text>
</TouchableOpacity>
<View row center>
<DropModalIcon onPress={close}/>
</View>
<View flexS row gap-10>
<TouchableOpacity onPress={handleSave}>
<Text
style={{
@ -321,8 +327,18 @@ export const ManuallyAddEventModal = () => {
Save
</Text>
</TouchableOpacity>
</View>
{editEvent && (
<Button
style={styles.topBtn}
marginL-5
iconSource={() => <BinIcon/>}
onPress={showDeleteEventModal}
/>
)}
</View>
</View>
{/*)}*/}
<ScrollView style={{minHeight: "85%"}}>
<TextField
placeholder="Add event title"

39
hooks/firebase/useDeleteEvent.ts Normal file
View File

@ -0,0 +1,39 @@
import {useMutation, useQueryClient} from "react-query";
import firestore from "@react-native-firebase/firestore";
export const useDeleteEvent = () => {
const queryClient = useQueryClient();
return useMutation({
mutationKey: ["deleteEvent"],
mutationFn: async ({eventId, docId}: { eventId?: string; docId?: string }) => {
try {
if (docId) {
await firestore()
.collection("Events")
.doc(docId)
.delete();
} else if (eventId) {
const snapshot = await firestore()
.collection("Events")
.where("id", "==", eventId)
.get();
const doc = snapshot.docs[0];
if (doc) {
await doc.ref.delete();
} else {
console.warn("Event not found");
}
} else {
console.warn("No identifier provided");
}
} catch (e) {
console.error(e);
}
},
onSuccess: () => {
queryClient.invalidateQueries("events");
}
});
};