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> </div>
<div className="grid gap-2"> <div className="grid grid-cols-2 gap-4">
<Label htmlFor="start" className="text-base font-semibold">Début</Label> <div className="space-y-2">
<DatePicker <Label>Début</Label>
selected={eventForm.start ? new Date(eventForm.start) : null} <div className="flex gap-2">
onChange={(date) => setEventForm({ ...eventForm, start: date?.toISOString() || "" })} <div className="flex-1">
showTimeSelect <DatePicker
timeFormat="HH:mm" selected={getDateFromString(eventForm.start)}
timeIntervals={15} onChange={handleStartDateChange}
dateFormat="dd/MM/yyyy HH:mm" dateFormat="dd/MM/yyyy"
placeholderText="Sélectionner une date et heure" locale="fr"
className="w-full" 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"
</div> 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"> <div className="space-y-2">
<Label htmlFor="end" className="text-base font-semibold">Fin</Label> <Label>Fin</Label>
<DatePicker <div className="flex gap-2">
selected={eventForm.end ? new Date(eventForm.end) : null} <div className="flex-1">
onChange={(date) => setEventForm({ ...eventForm, end: date?.toISOString() || "" })} <DatePicker
showTimeSelect selected={getDateFromString(eventForm.end)}
timeFormat="HH:mm" onChange={handleEndDateChange}
timeIntervals={15} dateFormat="dd/MM/yyyy"
dateFormat="dd/MM/yyyy HH:mm" locale="fr"
placeholderText="Sélectionner une date et heure" className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
className="w-full" placeholderText="Date"
minDate={eventForm.start ? new Date(eventForm.start) : undefined} 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>
</div> </div>

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

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