diff --git a/src/components/Schedule/index.tsx b/src/components/Schedule/index.tsx index f4e54cd..f5bf301 100644 --- a/src/components/Schedule/index.tsx +++ b/src/components/Schedule/index.tsx @@ -9,16 +9,13 @@ import { Button, IconButton, } from '@mui/material'; -import { FileDownload, CalendarMonth } from '@mui/icons-material'; +import CalendarMonthIcon from '@mui/icons-material/CalendarMonth'; import type { Dayjs } from 'dayjs'; import dayjs from 'dayjs'; import EventsCalendar from './EventsCalendar'; -import { - generateICSFile, - generateCombinedICSFile, -} from '@/utils/generateICSFile'; +import generateICSFile from '@/utils/generateICSFile'; interface ScheduleBaseProps { events: DonationEvent[]; @@ -52,7 +49,6 @@ const ScheduleBase = ({ events, title, description }: ScheduleBaseProps) => { {title} @@ -72,26 +68,12 @@ const ScheduleBase = ({ events, title, description }: ScheduleBaseProps) => { /> - - - Events for {selectedDate?.format('MMMM D, YYYY')}: - - - - + Events for {selectedDate?.format('MMMM D, YYYY')}: + {eventsForSelectedDate.length > 0 ? ( eventsForSelectedDate.map((event_) => ( { onClick={() => generateICSFile(event_)} sx={{ fontSize: 12, display: 'flex', flexDirection: 'column' }} > - - Export to Calendar + + Add to Calendar )) diff --git a/src/utils/generateICSFile.ts b/src/utils/generateICSFile.ts index 9837298..17117a2 100644 --- a/src/utils/generateICSFile.ts +++ b/src/utils/generateICSFile.ts @@ -1,9 +1,10 @@ const formatDate = (dateString: string) => { const date = new Date(dateString); + // Replace colons, dashes, and milliseconds return date .toISOString() - .replace(/[:-]/g, '') - .replace(/\.\d{3}/, ''); + .replace(/[:-]/g, '') // Remove colons and dashes + .replace(/\.\d{3}/, ''); // Remove milliseconds }; const createICSContent = (event: DonationEvent) => { @@ -22,7 +23,7 @@ const createICSContent = (event: DonationEvent) => { `UID:${event.eventId}-${formatDate(event.date)}`, 'END:VEVENT', 'END:VCALENDAR', - ].join('\r\n'); + ].join('\r\n'); // use CRLF for better compatibility }; const generateICSFile = (event: DonationEvent) => { @@ -32,51 +33,11 @@ const generateICSFile = (event: DonationEvent) => { }); const link = document.createElement('a'); link.href = globalThis.URL.createObjectURL(blob); - link.setAttribute( - 'download', - `openhands-donation-event-${event.eventId}.ics` - ); - document.body.append(link); - link.click(); - link.remove(); - globalThis.URL.revokeObjectURL(link.href); -}; - -const createCombinedICSContent = (events: DonationEvent[]): string => { - return [ - 'BEGIN:VCALENDAR', - 'VERSION:2.0', - 'PRODID:-//OpenHands//Combined Donation Events//EN', - ...events.flatMap((event) => { - const endTime = new Date(new Date(event.date).getTime() + 60 * 60 * 1000); - return [ - 'BEGIN:VEVENT', - `DTSTART:${formatDate(event.date)}`, - `DTEND:${formatDate(endTime.toISOString())}`, - `SUMMARY:${event.title}`, - `DESCRIPTION:Items: ${event.supplies - .map((supply) => `${supply.itemName} (${supply.quantityProvided})`) - .join(', ')}`, - `UID:${event.eventId}-${formatDate(event.date)}`, - 'END:VEVENT', - ]; - }), - 'END:VCALENDAR', - ].join('\r\n'); -}; - -const generateCombinedICSFile = (events: DonationEvent[]) => { - const icsContent = createCombinedICSContent(events); - const blob = new Blob([icsContent], { - type: 'text/calendar;charset=utf-8', - }); - const link = document.createElement('a'); - link.href = globalThis.URL.createObjectURL(blob); - link.setAttribute('download', 'openhands-donation-events.ics'); + link.setAttribute('download', `donation-event-${event.eventId}.ics`); document.body.append(link); link.click(); link.remove(); globalThis.URL.revokeObjectURL(link.href); // Clean up }; -export { generateICSFile, generateCombinedICSFile }; +export default generateICSFile;