calendar 3.0

backend/db/migrations/1.user.sql

@@ -29,5 +29,8 @@ VALUES
   ('8Sy7xBkGiGQv4ZKphcQfY8PxAqw1', 'Narayan', 'Sharma', '[email protected]', '', ''),
   ('iL7PnjS4axQffmlPceobjUUZ9DF2', 'Caitlin', 'Flynn', '[email protected]', '', ''),
   ('5JgN2PQxCRM9VoCiiFPlQPNqkL32', 'Linwood', 'Blaisdell', '[email protected]', '', '')
+  ('9rIMSUo6qNf8ToTABkCfNqnByRv1', 'Haley', 'Martin', '[email protected]', '', '')
+
+
   -- End Care-Wallet Team
 ;

backend/db/migrations/2.group.sql

@@ -49,6 +49,7 @@ VALUES
   (5, 'mPeo3d3MiXfnpPJADWgFD9ZcB2M2', 'SECONDARY'),
   (5, 'onrQs8HVGBVMPNz4Fk1uE94bSxg1', 'SECONDARY'),
   (5, '8Sy7xBkGiGQv4ZKphcQfY8PxAqw1', 'SECONDARY'),
-  (5, 'iL7PnjS4axQffmlPceobjUUZ9DF2', 'SECONDARY')
+  (5, 'iL7PnjS4axQffmlPceobjUUZ9DF2', 'SECONDARY'),
+  (5, '9rIMSUo6qNf8ToTABkCfNqnByRv1', 'SECONDARY')
   -- End Care-Wallet Team
 ;

backend/schema/tasks/routes.go

@@ -23,6 +23,7 @@ func TaskGroup(v1 *gin.RouterGroup, c *PgModel) *gin.RouterGroup {
 		tasks.GET("/filtered", c.GetFilteredTasks)
 		tasks.GET("/assigned", c.GetTasksByAssignedUsers)
 		tasks.POST("", c.CreateTask)
+<<<<<<< Updated upstream
 
 		byId := tasks.Group("/:tid")
 		{
@@ -33,6 +34,11 @@ func TaskGroup(v1 *gin.RouterGroup, c *PgModel) *gin.RouterGroup {
 			byId.POST("/assign", c.AssignUsersToTask)
 			byId.DELETE("/remove", c.RemoveUsersFromTask)
 		}
+=======
+		tasks.DELETE("/:tid", c.DeleteTask)
+		tasks.PUT("/:tid/info", c.UpdateTaskInfo)
+		tasks.GET("/:tid/assigned-users", c.GetUsersAssignedToTask)
+>>>>>>> Stashed changes
 	}
 	return tasks
 }

client/navigation/AppStackBottomTabNavigator.tsx

@@ -7,7 +7,7 @@ import Bell from '../assets/bottom-nav/bell.svg';
 import Calendar from '../assets/bottom-nav/calendar.svg';
 import Home from '../assets/bottom-nav/home.svg';
 import User from '../assets/bottom-nav/user.svg';
-import TimelineCalendarScreen from '../screens/Calendar2.0';
+import TimelineCalendarScreen from '../screens/Calendar3.0';
 import MedicationList from '../screens/MedicationList';
 import Profile from '../screens/Profile';
 

client/screens/Calendar2.0.tsx

@@ -19,7 +19,7 @@ import { getDate, timelineEvents } from './timelineEvents';
 
 const INITIAL_TIME = { hour: 9, minutes: 0 };
 const EVENTS: TimelineEventProps[] = timelineEvents;
-export default class TimelineCalendarScreen extends Component {
+export default function TimelineCalendarScreen {
   state = {
     currentDate: getDate(),
     events: EVENTS,
@@ -36,7 +36,9 @@ export default class TimelineCalendarScreen extends Component {
     [`${getDate(1)}`]: { marked: true },
     [`${getDate(2)}`]: { marked: true },
     [`${getDate(4)}`]: { marked: true }
-  };
+  }; // what dates have event under them and which ones do not
+    // could be a useeffect... extract date from a task and filter which ones have tasks...
+
 
   onDateChanged = (date: string, source: string) => {
     console.log('TimelineCalendarScreen onDateChanged: ', date, source);
@@ -146,7 +148,7 @@ export default class TimelineCalendarScreen extends Component {
     return (
       <CalendarProvider
         date={currentDate}
-        onDateChanged={this.onDateChanged}
+        onDateChanged={onDateChanged}
         onMonthChange={this.onMonthChange}
         showTodayButton
         disabledOpacity={0.6}

client/screens/Calendar3.0.tsx

@@ -0,0 +1,148 @@
+import React, { useState } from 'react';
+import { Alert } from 'react-native';
+import _ from 'lodash';
+import {
+  CalendarProvider,
+  CalendarUtils,
+  DateData,
+  ExpandableCalendar,
+  TimelineEventProps,
+  TimelineList,
+  TimelineProps,
+} from 'react-native-calendars';
+import { getDate, timelineEvents } from './timelineEvents';
+
+
+const INITIAL_TIME = { hour: 9, minutes: 0 };
+const EVENTS: TimelineEventProps[] = timelineEvents;
+
+const TimelineCalendarScreen: React.FC = () => {
+  const [currentDate, setCurrentDate] = useState(getDate());
+  const [eventsByDate, setEventsByDate] = useState(_.groupBy(EVENTS, (e) => CalendarUtils.getCalendarDateString(e.start)));
+
+  const marked = {
+    [`${getDate(-1)}`]: { marked: true },
+    [`${getDate()}`]: { marked: true },
+    [`${getDate(1)}`]: { marked: true },
+    [`${getDate(2)}`]: { marked: true },
+    [`${getDate(4)}`]: { marked: true },
+  };
+
+  const onDateChanged = (date: string, source: string) => {
+    console.log('TimelineCalendarScreen onDateChanged: ', date, source);
+    setCurrentDate(date);
+  };
+
+  const onMonthChange = (month: DateData, updateSource: any) => {
+  console.log('TimelineCalendarScreen onMonthChange: ', month, updateSource);
+  };
+
+  const createNewEvent: TimelineProps['onBackgroundLongPress'] = (
+    timeString,
+    timeObject
+  ) => {
+    const hourString = `${(timeObject.hour + 1).toString().padStart(2, '0')}`;
+    const minutesString = `${timeObject.minutes.toString().padStart(2, '0')}`;
+
+    const newEvent = {
+      id: 'draft',
+      start: `${timeString}`,
+      end: `${timeObject.date} ${hourString}:${minutesString}:00`,
+      title: 'New Event',
+      color: 'white',
+    };
+
+    if (timeObject.date) {
+      if (eventsByDate[timeObject.date]) {
+        setEventsByDate((prevEvents) => ({
+          ...prevEvents,
+          [timeObject.date as string]: [...prevEvents[timeObject.date as string], newEvent],
+        }));
+      } else {
+        setEventsByDate((prevEvents) => ({
+          ...prevEvents,
+          [timeObject.date as string]: [newEvent],
+        }));
+      }
+    }
+  };
+
+  const approveNewEvent: TimelineProps['onBackgroundLongPressOut'] = (
+    _timeString,
+    timeObject
+  ) => {
+    Alert.prompt('New Event', 'Enter event title', [
+      {
+        text: 'Cancel',
+        onPress: () => {
+          if (timeObject.date) {
+            setEventsByDate((prevEvents) => ({
+              ...prevEvents,
+              [timeObject.date as string]: _.filter(
+                prevEvents[timeObject.date as string],
+                (e) => e.id !== 'draft'
+              ),
+            }));
+          }
+        },
+      },
+      {
+        text: 'Create',
+        onPress: (eventTitle) => {
+          if (timeObject.date) {
+            const draftEvent = _.find(eventsByDate[timeObject.date], {
+              id: 'draft',
+            });
+            if (draftEvent) {
+              draftEvent.id = undefined;
+              draftEvent.title = eventTitle ?? 'New Event';
+              draftEvent.color = 'lightgreen';
+              setEventsByDate((prevEvents) => ({
+                ...prevEvents,
+                [timeObject.date as string]: [...prevEvents[timeObject.date as string]],
+              }));
+            }
+          }
+        },
+      },
+    ]);
+  };
+
+  const timelineProps: Partial<TimelineProps> = {
+    format24h: false,
+    onBackgroundLongPress: createNewEvent,
+    onBackgroundLongPressOut: approveNewEvent,
+    unavailableHours: [
+      { start: 0, end: 6 },
+      { start: 22, end: 24 },
+    ],
+    onEventPress: (e) => expandEvent(e),
+    overlapEventsSpacing: 8,
+    rightEdgeSpacing: 24,
+  };
+
+  return (
+    <CalendarProvider
+      date={currentDate}
+      onDateChanged={onDateChanged}
+      onMonthChange={onMonthChange}
+      showTodayButton
+      disabledOpacity={0.6}
+    >
+      <ExpandableCalendar firstDay={1} markedDates={marked} />
+      <TimelineList
+        events={eventsByDate}
+        timelineProps={timelineProps}
+        showNowIndicator
+        scrollToFirst
+        initialTime={INITIAL_TIME}
+      />
+    </CalendarProvider>
+  );
+};
+
+function expandEvent(e: TimelineEventProps): void {
+  console.log('expand event', e.title);
+}
+
+export default TimelineCalendarScreen;

package.json

@@ -0,0 +1,5 @@
+{
+  "devDependencies": {
+    "@types/node": "^20.11.25"
+  }
+}