- Fixed issue with events not being mapped correctly when fetched(missing attributes)

- Fixed issue with editing of events because of incorrect attribute name
- Color events created by other user, but assigned to current user in the current user's color

components/pages/calendar/EventCalendar.tsx

@@ -4,13 +4,13 @@ import { ActivityIndicator, ScrollView, StyleSheet, View, ViewStyle } from "reac
 import { useGetEvents } from "@/hooks/firebase/useGetEvents";
 import { useAtom, useAtomValue, useSetAtom } from "jotai";
 import {
-  editVisibleAtom,
+    editVisibleAtom,
-  eventForEditAtom,
+    eventForEditAtom,
-  isAllDayAtom,
+    isAllDayAtom, isFamilyViewAtom,
-  modeAtom,
+    modeAtom,
-  refreshTriggerAtom,
+    refreshTriggerAtom,
-  selectedDateAtom,
+    selectedDateAtom,
-  selectedNewEventDateAtom,
+    selectedNewEventDateAtom,
 } from "@/components/pages/calendar/atoms";
 import { useAuthContext } from "@/contexts/AuthContext";
 import { CalendarEvent } from "@/components/pages/calendar/interfaces";
@@ -18,6 +18,7 @@ import { Text } from "react-native-ui-lib";
 import { addDays, compareAsc, isWithinInterval, subDays } from "date-fns";
 import {useCalSync} from "@/hooks/useCalSync";
 import {useSyncEvents} from "@/hooks/useSyncOnScroll";
+import {colorMap} from "@/constants/colorMap";
 
 interface EventCalendarProps {
   calendarHeight: number;
@@ -33,9 +34,10 @@ const getTotalMinutes = () => {
 export const EventCalendar: React.FC<EventCalendarProps> = React.memo(
   ({ calendarHeight }) => {
     const { data: events, isLoading, refetch } = useGetEvents();
-    const { profileData } = useAuthContext();
+    const { profileData, user } = useAuthContext();
     const [selectedDate, setSelectedDate] = useAtom(selectedDateAtom);
     const [mode, setMode] = useAtom(modeAtom);
+    const [isFamilyView] = useAtom(isFamilyViewAtom);
 
     const setEditVisible = useSetAtom(editVisibleAtom);
     const [isAllDay, setIsAllDay] = useAtom(isAllDayAtom);
@@ -100,7 +102,14 @@ export const EventCalendar: React.FC<EventCalendarProps> = React.memo(
     );
 
     const memoizedEventCellStyle = useCallback(
-      (event: CalendarEvent) => ({ backgroundColor: event.eventColor , fontSize: 14}),
+      (event: CalendarEvent) => {
+          let eventColor = event.eventColor;
+          if (!isFamilyView && event.attendees?.includes(user?.uid)) {
+              eventColor = profileData?.eventColor ?? colorMap.teal;
+          }
+
+          return { backgroundColor: eventColor , fontSize: 14}
+      },
       []
     );
 

components/pages/calendar/ManuallyAddEventModal.tsx

@@ -130,7 +130,7 @@ export const ManuallyAddEventModal = () => {
     editEvent?.end ?? initialDate ?? new Date()
   );
   const [selectedAttendees, setSelectedAttendees] = useState<string[]>(
-    editEvent?.participants ?? []
+    editEvent?.attendees ?? []
   );
   const [repeatInterval, setRepeatInterval] = useState<PickerMultiValue>([]);
 
@@ -187,7 +187,8 @@ export const ManuallyAddEventModal = () => {
 
     setStartDate(initialDate ?? new Date());
     setEndDate(editEvent?.end ?? initialDate ?? new Date());
-    setSelectedAttendees(editEvent?.participants ?? []);
+    setSelectedAttendees(editEvent?.attendees ?? []);
+    setLocation(editEvent?.location ?? "");
     setRepeatInterval([]);
   }, [editEvent, selectedNewEventDate]);
 
@@ -664,7 +665,7 @@ export const ManuallyAddEventModal = () => {
 
             <TextField
                 value={location}
-                onChangeText={setLocation}
+                onChangeText={(text) => setLocation(text)}
                 ref={locationRef}
                 maxLength={2000}
                 multiline

components/pages/calendar/interfaces.ts

@@ -8,7 +8,7 @@ export interface CalendarEvent {
     location?: string; // Optional event location
     allDay?: boolean; // Specifies if the event lasts all day
     eventColor?: string; // Optional color to represent the event
-    participants?: string[]; // Optional list of participants or attendees
+    attendees?: string[]; // Optional list of participants or attendees
     private?: boolean;
     notes?: string,
     overlapPosition?: number

hooks/firebase/useGetEvents.ts

@@ -84,6 +84,7 @@ export const useGetEvents = () => {
                     const eventColor = profileData?.eventColor || colorMap.pink;
 
                     return {
+                        ...event,
                         id: event.id || Math.random().toString(36).slice(2, 9), // Generate temp ID if missing
                         title: event.title,
                         start: new Date(event.startDate.seconds * 1000),