alma/NeahFront7
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

calendar 43

Browse Source
This commit is contained in:
Alma 2025-04-13 18:16:58 +02:00
parent f02dc53330
commit 27ce371dea
2 changed files with 82 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
components/calendar/calendar-client.tsx
View File

@ -1209,33 +1209,63 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
</div>
</div>
<div className="grid gap-2">
<Label htmlFor="start" className="text-base font-semibold">Début</Label>
<DatePicker
selected={eventForm.start ? new Date(eventForm.start) : null}
onChange={(date) => setEventForm({ ...eventForm, start: date?.toISOString() || "" })}
showTimeSelect
timeFormat="HH:mm"
timeIntervals={15}
dateFormat="dd/MM/yyyy HH:mm"
placeholderText="Sélectionner une date et heure"
className="w-full"
/>
</div>
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label>Début</Label>
<div className="flex gap-2">
<div className="flex-1">
<DatePicker
selected={getDateFromString(eventForm.start)}
onChange={handleStartDateChange}
dateFormat="dd/MM/yyyy"
locale="fr"
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
placeholderText="Date"
customInput={<Input />}
/>
</div>
<DatePicker
selected={getDateFromString(eventForm.start)}
onChange={handleStartDateChange}
showTimeSelect
showTimeSelectOnly
timeIntervals={15}
timeCaption="Heure"
dateFormat="HH:mm"
className="w-32"
customInput={<Input />}
/>
</div>
</div>
<div className="grid gap-2">
<Label htmlFor="end" className="text-base font-semibold">Fin</Label>
<DatePicker
selected={eventForm.end ? new Date(eventForm.end) : null}
onChange={(date) => setEventForm({ ...eventForm, end: date?.toISOString() || "" })}
showTimeSelect
timeFormat="HH:mm"
timeIntervals={15}
dateFormat="dd/MM/yyyy HH:mm"
placeholderText="Sélectionner une date et heure"
className="w-full"
minDate={eventForm.start ? new Date(eventForm.start) : undefined}
/>
<div className="space-y-2">
<Label>Fin</Label>
<div className="flex gap-2">
<div className="flex-1">
<DatePicker
selected={getDateFromString(eventForm.end)}
onChange={handleEndDateChange}
dateFormat="dd/MM/yyyy"
locale="fr"
className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
placeholderText="Date"
customInput={<Input />}
minDate={getDateFromString(eventForm.start)}
/>
</div>
<DatePicker
selected={getDateFromString(eventForm.end)}
onChange={handleEndDateChange}
showTimeSelect
showTimeSelectOnly
timeIntervals={15}
timeCaption="Heure"
dateFormat="HH:mm"
className="w-32"
customInput={<Input />}
/>
</div>
</div>
</div>
</div>

45
components/calendar/calendar-widget.tsx
View File

@ -32,31 +32,38 @@ export function CalendarWidget() {
const fetchUpcomingEvents = async () => {
try {
setLoading(true);
const now = new Date();
const nextWeek = addDays(now, 7);
// Fetch events directly from the calendar API
const eventsRes = await fetch(
`/api/calendar?start=${now.toISOString()}&end=${nextWeek.toISOString()}`
);
if (!eventsRes.ok) {
// Fetch calendars with events from the correct endpoint
const response = await fetch('/api/calendars');
if (!response.ok) {
throw new Error("Impossible de charger les événements");
}
const eventsData = await eventsRes.json();
// Sort events by start date and limit to 5
const sortedEvents = eventsData
.sort((a: Event, b: Event) => new Date(a.start).getTime() - new Date(b.start).getTime())
.slice(0, 5)
.map((event: Event) => ({
const calendarsData = await response.json();
// Extract and process events from all calendars
const allEvents = calendarsData.flatMap((calendar: any) =>
(calendar.events || []).map((event: any) => ({
...event,
calendarColor: calendar.color,
calendarName: calendar.name,
start: new Date(event.start),
end: new Date(event.end),
}));
end: new Date(event.end)
}))
);
setEvents(sortedEvents);
// Filter events for the next 7 days
const now = new Date();
const nextWeek = addDays(now, 7);
const upcomingEvents = allEvents
.filter((event: Event) => {
const eventStart = new Date(event.start);
return eventStart >= now && eventStart <= nextWeek;
})
.sort((a: Event, b: Event) => a.start.getTime() - b.start.getTime())
.slice(0, 5);
setEvents(upcomingEvents);
} catch (err) {
console.error("Erreur lors du chargement des événements:", err);
setError("Impossible de charger les événements à venir");