diff --git a/components/pages/calendar/EventCalendar.tsx b/components/pages/calendar/EventCalendar.tsx index e917742..e275586 100644 --- a/components/pages/calendar/EventCalendar.tsx +++ b/components/pages/calendar/EventCalendar.tsx @@ -102,7 +102,7 @@ export const EventCalendar: React.FC = React.memo( const memoizedEventCellStyle = useCallback( (event: CalendarEvent) => { let eventColor = event.eventColor; - if (!isFamilyView && event.attendees?.includes(user?.uid)) { + if (!isFamilyView && (event.attendees?.includes(user?.uid) || event.creatorId === user?.uid)) { eventColor = profileData?.eventColor ?? colorMap.teal; } @@ -268,6 +268,7 @@ export const EventCalendar: React.FC = React.memo( // enrichedEventsByDate={enrichedEvents} events={filteredEvents} eventCellStyle={memoizedEventCellStyle} + allDayEventCellStyle={memoizedEventCellStyle} onPressEvent={handlePressEvent} weekStartsOn={memoizedWeekStartsOn} height={calendarHeight} diff --git a/components/pages/calendar/ManuallyAddEventModal.tsx b/components/pages/calendar/ManuallyAddEventModal.tsx index efb3f48..3a92335 100644 --- a/components/pages/calendar/ManuallyAddEventModal.tsx +++ b/components/pages/calendar/ManuallyAddEventModal.tsx @@ -22,7 +22,7 @@ import { PickerMultiValue } from "react-native-ui-lib/src/components/picker/type import { useCreateEvent } from "@/hooks/firebase/useCreateEvent"; import { EventData } from "@/hooks/firebase/types/eventData"; import DropModalIcon from "@/assets/svgs/DropModalIcon"; -import { StyleSheet } from "react-native"; +import {Alert, StyleSheet} from "react-native"; import ClockIcon from "@/assets/svgs/ClockIcon"; import LockIcon from "@/assets/svgs/LockIcon"; import MenuIcon from "@/assets/svgs/MenuIcon"; @@ -38,6 +38,7 @@ import { useGetFamilyMembers } from "@/hooks/firebase/useGetFamilyMembers"; import BinIcon from "@/assets/svgs/BinIcon"; import DeleteEventDialog from "./DeleteEventDialog"; import { useDeleteEvent } from "@/hooks/firebase/useDeleteEvent"; +import AddPersonIcon from "@/assets/svgs/AddPersonIcon"; const daysOfWeek = [ { label: "Monday", value: "monday" }, @@ -66,12 +67,12 @@ export const ManuallyAddEventModal = () => { setDeleteModalVisible(false); setSelectedNewEndDate(undefined); setEditEvent(undefined); + setCreator(null) }, initialDate: selectedNewEventDate || editEvent?.start, }; const detailsRef = useRef(null); - const locationRef = useRef(null); const [title, setTitle] = useState(editEvent?.title || ""); const [details, setDetails] = useState(editEvent?.notes || ""); @@ -142,6 +143,15 @@ export const ManuallyAddEventModal = () => { const { data: members } = useGetFamilyMembers(true); const titleRef = useRef(null); + const [creator, setCreator] = useState(''); + useEffect(() => { + if (editEvent) { + let creatorMember = members?.find((member) => member?.uid === editEvent.creatorId); + const fullName = `${creatorMember?.firstName ?? ""}`; + setCreator(fullName); + } + }, [members]) + const isLoading = isDeleting || isAdding; useEffect(() => { @@ -257,12 +267,29 @@ export const ManuallyAddEventModal = () => { if (editEvent?.id) eventData.id = editEvent?.id; - await createEvent(eventData); - setEditEvent(undefined); + if (validateEvent()) { + await createEvent(eventData); + setEditEvent(undefined); - close(); + close(); + } else { + return; + } }; + const validateEvent = () => { + if (!title) { + Alert.alert('Alert', 'Title field cannot be empty'); + return false; + } + if (!selectedAttendees || selectedAttendees?.length === 0) { + Alert.alert('Alert', 'Cannot have an event without any attendees'); + return false; + } + + return true; + } + const getRepeatLabel = () => { const selectedDays = repeatInterval; const allDays = [ @@ -647,34 +674,38 @@ export const ManuallyAddEventModal = () => { - - locationRef?.current?.focus()}> - - - - Location - - - - - setLocation(text)} - ref={locationRef} - maxLength={2000} - multiline - numberOfLines={2} - marginT-5 - marginL-10 - style={{ flex: 1 }} - /> + + + + { + setLocation(text); + }} + placeholderTextColor="#2d2d30" + style={{ fontFamily: "Manrope_500Medium", fontSize: 16, minWidth: "100%"}} + marginL-12 + paddingR-12 + /> + + {editEvent && <> + + + + + + + + } detailsRef?.current?.focus()}> diff --git a/components/pages/todos/ToDoItem.tsx b/components/pages/todos/ToDoItem.tsx index 4eff2c7..f837588 100644 --- a/components/pages/todos/ToDoItem.tsx +++ b/components/pages/todos/ToDoItem.tsx @@ -8,7 +8,7 @@ import { Checkbox, } from "react-native-ui-lib"; -import React, { useState } from "react"; +import React, {useEffect, useState} from "react"; import { useToDosContext } from "@/contexts/ToDosContext"; import { Ionicons } from "@expo/vector-icons"; import PointsSlider from "@/components/shared/PointsSlider"; @@ -33,6 +33,13 @@ const ToDoItem = (props: { const [visible, setVisible] = useState(false); const [points, setPoints] = useState(props.item.points); const [pointsModalVisible, setPointsModalVisible] = useState(false); + const [creator, setCreator] = useState(''); + + useEffect(() => { + let creatorMember = members?.find((member) => member?.uid === props.item.creatorId); + const fullName = `${creatorMember?.firstName ?? ""}`; + setCreator(fullName); + }, []) const handlePointsChange = (text: string) => { const numericValue = parseInt(text, 10); @@ -117,57 +124,66 @@ const ToDoItem = (props: { /> - - {props.item.points && props.item.points > 0 ? ( - { - if (props.isSettings) { - setPointsModalVisible(true); - } - }} - > - - - - {props.item.points} points - - - - ) : ( - - )} - - {!(props.item.repeatType == "None") && ( - - - + + {props.item.points && props.item.points > 0 ? ( + { + if (props.isSettings) { + setPointsModalVisible(true); + } }} > - {(() => { - switch (props.item.repeatType) { - case "Once a month": - return "Monthly"; - case "Every week": - return "Weekly"; - case "Once a year": - return "Yearly"; - default: - return props.item.repeatType; - } - })()} - {props.item.date && - props.is7Days && - " / " + format(props.item.date, "EEEE")} - - - )} + + + + {props.item.points} points + + + + ) : ( + + )} + + {!(props.item.repeatType == "None") && ( + + + + {(() => { + switch (props.item.repeatType) { + case "Once a month": + return "Monthly"; + case "Every week": + return "Weekly"; + case "Once a year": + return "Yearly"; + default: + return props.item.repeatType; + } + })()} + {props.item.date && + props.is7Days && + " / " + format(props.item.date, "EEEE")} + + + )} + + + + Created by: {creator} + + {selectedMembers?.map((member) => {